Дайджест продуктового дизайна
55.7K subscribers
96 photos
18 videos
524 links
Юрий @jvetrau Ветров собирает свежие статьи, инструменты, паттерны и тренды с 2009 года. 250 000 читателей на vc, VK и других каналах.

Все выпуски — https://jvetrau.com/category/digest/
ВК — https://vk.com/pdigest

РЕКЛАМЫ НЕТ.
Download Telegram
Не знаешь, какой мини-дайджест выпускать? Выпускай про интерфейсные паттерны и лучшие практики:
 
1. Виталий Фридман: Хорошая динамическая валидация форм. Она часто срабатывают неправильно, поэтому лучше использовать её аккуратно.
 
2. Polyplane: Популярные breakpoints для адаптивного дизайна. Они собрали несколько разных срезов на текущий момент.

3. Wix: Крутая инициатива — команда зарубилась на месяц и переписала тексты всех ошибок в продукте. Они предлагают отличную формулу для хорошего сообщения об ошибке.
 
4. Ashlee M Boyer: Когда корректно использовать настоящую кнопку и ссылку, стилизованную под кнопку.
 
5. Maggie Appleton: Не самые тривиальные интерфейсные паттерны для современных продуктов.
 
6. Information Architects: Советы по использованию эмоджи в интерфейсах. Они приводят много полезной статистики и исследований.
 
7. Onno Westra: Как и какие номера телефонов указывать на сайте, который работает с разными странами.
 
8. Wix: Несколько интерфейсных решений, где пришлось искать баланс между точностью описания элементов дизайна и широким кругом пользователей.
 
9. NN/g: Хорошие и неудачные решения в обучающем процессе для приложений с дополненной реальностью.

10. Jim Lewis и Jeff Sauro: Сравнительные исследования корпоративного ПО и сайтов с отзывами пользователей. Они сравнили их по метрикам SUS и NPS.
 
#patterns
Пора отпустить на волю накопления по лучшим интерфейсным паттернам и практикам:
 
1. Michael Kritsch: Фешенебельный анализ чеклистов и фреймворков для эвристической оценки интерфейсов. Он проанализировал популярные и толковые и разложил их по полочкам. Как и другие авторы, он рекомендует создавать свой чеклист под свои задачи, используя чужие списки как ориентир.
 
2. Ad Hoc: Методичка по поддержке accessibilty на всех уровнях. Это пошаговая инструкция, позволяющая внедрить хорошие практики в продуктах, командах и культуре.
 
3. Figma: Как проектировали новый интерфейс поиска и замены.
 
4. Charlotte Wittels: Подход к решению задач по дизайну интерфейсов: понять 5C (context, cases, concept, content, constraints).
 
5. Jim Nielsen: Разбирает концепцию Kyle Simpson «качества воспроизведения» сайтов. Самая простая вещь — текстовая версия для людей с плохим интернетом.
 
6. Maggie Appleton: Интерфейсная парадигма «порталов для программирования», которые объединяют лучшее из двух миров — командной строки и графических интерфейсов. Она приводит примеры нескольких исторических и современных продуктов, которые используют этот подход.
 
7. NN/g: Структурированная подборка своих статей о психологии пользователей.
 
8. Adam Argyle: Как реализовать хорошую всплывающую подсказку.
 
9. NN/g: Настройка приложений с дополненной реальностью.
 
10. Ceara Crawshaw: Памятка по проектированию хорошего интерфейса drag&drop.
 
11. Lukas Oppermann: Нюансы поддержки цветового контраста в стандарте accessibility WCAG 2.1.
 
12. Feifei Liu: Грамотное написание и отправка транзакционных уведомлений (как правило, в смс- и push-уведомлениях).
 
13. Jim Lewis и Jeff Sauro: Обновили своё сравнительное исследование сайтов покупки билетов на мероприятия. Они сравнили их по метрикам SUS и NPS.
 
14. NN/g: Как международные интернет-сервисы переводят пользовательский контент типа рецензий и отзывов на разные языки.
 
16. Wix: Опыт дизайна интерфейсов для разработчиков.
 
17. Maggie Appleton: Примеры удачных решений с быстрым поискам по командам, который всё чаще встраивают в интерфейсы (они обычно вызываются по CTRL/CMD+K).
 
#patterns
Давненько не было обзоров лучших интерфейсных практик и паттернов. Ща буит мясо:
 
1. Peter Ramsey: Освежил своё сравнительное исследование приложений британских банков. Печальный вывод — классические банки не особо догоняют современные, во многом из-за малой скорости обновлений.
 
2. Spotify: Редизайн главной страницы в вебе — теперь это плеер.
 
3. NN/g: Выбор часового пояса. Nielsen/Norman Group провели своё исследование разных подходов и дают рекомендации по проектированию.
 
4. Duolingo: Основные идеи редизайна приложения: хвалят и ругают.
 
4. NN/g: Типичные проблемы мобильных приложений с дополненной реальностью, а также удачные интерфейсные решения.
 
5. Knock: Проектирование процесса встречи нового пользователя. Они выделили самое важное действие на старте (отправка первого уведомления клиентам) и построили интерфейс вокруг него.
 
6. Gov.uk: Пользователи с дискалькулией. Это особенность восприятия информации, когда человек плохо воспринимает числа и цифры.
 
7. Creative Navy: Крупные международные сервисы для ведения электронных медицинских карт.
 
8. Adrian Bece: Вёрстка адаптивных таблиц с учётом требований accessibility (часть 2).
 
9. Jim Lewis и Jeff Sauro: Обновили своё сравнительное исследование сервисов бронирования ресторанов и видео-звонков. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.
 
10. Colin Eagan и Jeffrey MacIntyre: Фреймворк по персонализации продукта для пользователей. Они также описывают формат воркшопа для его заполнения.
 
11. Spotify: Локализация интерфейса и контента.
 
12. Alex Russell: Обзор текущего состояния оптимизации производительности веба.
 
13. Creative Navy: Интерфейсы программ для программирования мобильных роботов.
 
#patterns
Вкрации расскажу тута чучуть о лудший интерфейсный практики и паттерны. Кокраз туды ивойный и примените:
 
1. Ahmad Shadeed: Что значит «адаптивный дизайн» в 2023 году.
 
2. Виталий Фридман: Показ субтитров к видео.
 
3. Creative Navy: Интерфейсы программ для управления космическими полётами.
 
4. NN/g: Классические путеводители по интерфейсу после регистрации не работают. Примеры хороших контекстных подсказок.
 
5. Peter Ramsey: Сценарий перевыпуска карты в британских банках.
 
6. Chiara Aliotta: Использование сторителлинга в дизайне на примере подачи одного из курсов Smashing Magazine.
 
7. Wix: Разные грани локализации. От простого перевода текстов до региональных доменов и конкретных посылов.
 
8. Baymard Institute: Хорошая и плохая реализация покупки без регистрации в интернет-магазинах.
 
9. Sandrina Pereira: Памятка по валидации форм с учётом требований accessibility.
 
10. Creative Navy: Медицинские интерфейсы шприцевых помп.
 
11. Creative Navy: Интерфейсы программ для 3D-моделирования.
 
12. Jim Lewis и Jeff Sauro: Обновили своё сравнительное исследование интернет-магазинов одежды. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.
 
13. Creative Navy: Интерфейсы управления популярными тепловыми насосами.
 
14. Baymard Institute: Заметные проблы сайтов бронирования.
 
Вообщем, выпий за любовь к лутышые решения.
 
#patterns
Собралась большая пробка из свежих ссылок, так что темы типа свежих интерфейсных паттернов и лучших практик всплывают чаще обычного. Но по весне это нормально:
 
1. Microsoft: Расширили свои гайдлайны по инклюзивному дизайну — появился раздел про когнитивные ограничения и работу с ними. Tracy Jones сделала обзор основных тезисов и приводит примеры решений из продуктов компании.
 
2. Acronis: Опыт работы с текстами в интерфейсе. Как добиться согласованности по всему продукту.
 
3. Frank Rausch: Простая памятка по современным навигационным паттернам в iOS.
 
4. NN/g: Советуют ограничивать использование технического жаргона в интерфейсах. Он уместен только для узкоспециализированных сервисов, для остальных — стоит давать расшифровку или вообще избегать их.
 
5. Creative Navy: Большой обзор интерфейсных паттернов, которые используются в сервисах-дашбордах.
 
6. NN/g: Подходы к китайским «интернет-магазинам на диване». Как они ведут трансляции и связывают их с покупкой товара.
 
7. Gil Bouhnik: Примеры манипуляции с данными на графиках. Как искажают информацию с помощью тёмных паттернов.
 
8. Подборка иконок-переключаетелей тёмной темы оформления с кодом на CSS.
 
9. Creative Navy: Интерфейсы приложений для отслеживания симптомов хронических болезней.
 
10. Daley Wilhelm: Заметила популярность эмоджи и иконок искр в интерфейсах. Она копнула, откуда они появились и не советует увлекаться ими.
 
#patterns
Что там нового по лучшим интерфейсным паттернам и практикам?
 
1. Alex Hollender: Недавний редизайн Wikipedia. Какие проблемы решали, как шёл дизайн-процесс и насколько сложно было согласовать выкатку.
 
2. Slack: Поддержка accessibility. Как прорабатывали эти возможности и тестировали с пользователями.
 
3. Daley Wilhelm: Разбирает интерфейс игровой приставки Playdate.
 
4. Baymard: Подсказки точного адреса в интернет-магазинах.
 
5. Julien Martin: Все этапы работы над брендом и интерфейсом сервиса Zenly, который недавно закрылся.
 
6. NN/g: Лучшие практики проектирования «магазинов на диване» в мобильных приложениях.
 
7. Chamjo: Ещё одна коллекция интерфейсных паттернов.
 
8. Peter Ramsey: Лютый схематоз со скидками на сайте Domino's Pizza. Жёсткий тёмный паттерн ценообразования.
 
9. Rosie Hoggmascall: Анализ процесса встречи нового пользователя в приложении для знакомств Bumble.
 
10. Growth Design: Анализ процесса встречи нового пользователя в сервисе Loom. Как они ненапряжно вовлекают.
 
11. Swiggy: Виджет live activity и «динамический остров» в iOS для сервиса доставки.
 
12. NN/g: Типичные проблемы в информационной архитектуре.
 
13. Eva Katharina Wolf: Поддержке пользователей с дислексией в интерфейсах.
 
#patterns
Двойная Тройная порция свежих ссылок о лучших интерфейсных паттернах и практиках:
 
1. The Pudding: Крутой обзор тёмных паттернов прекращения подписки. Они потратили свои деньги на эксперимент с парой десятков сервисов. Спойлер: потеряли почти все.

2. Lyft: Виджет live activity и «динамический остров» в iOS.
 
3. Creative Navy: Подробная памятка по дизайну дашбордов на основе своего многолетнего опыта.
 
4. Alex Ivanovs: Памятка по поддержке accessibility на разных уровнях.
 
5. Baymard Institute: Актуализировали список лучших практик для интернет-магазинов. Edward Scott сделал обзор из их недавнего исследования.
 
6. NN/g: Ограничения и проблемы экранных дикторов на мобильных.
 
7. Marcus Herrmann: Как поддержать accessibility в запросах на сбор персональных данных на сайтах.
 
8. Christopher Butler: Правильный ритм в подаче информации на длинных страницах, чтобы пользователи докручивали их до конца. Он ссылается на исследования Nielsen/Norman Group и Chartbeat на эту тему. Он также показывает пример перестройки длинной промо-страницы в более читабельный формат. И выделяет ключевые правила такого переосмысления.
 
9. Luke Wroblewski: Сценарии использования дополненной реальности.
 
10. Uber: Редизайн навигации. Они делали много интерактивных прототипов разного уровня сложности и активно тестировали их.
 
11. NN/g: Памятка по показу сообщений об ошибках в интерфейсе.
 
12. Creative Navy: Изучили и сравнили медицинские интерфейсы.
 
13. Adam Silver: Проблемы «залипающей» навигации на сайте и заблокированных кнопок в формах (это древний спор, я на его стороне).
 
14. Camryn Manker: Чеклист по поддержке accessibility в игровых интерфейсах.
 
15. Коллекция идиотских вариантов интерфейса правил использования сайта и реализации старого эппловского жеста «проведите, чтобы разблокировать».
 
16. NN/g: Особенности использования «шторок» в мобильных интерфейсах. Статья полезная, но с оговоркой про спорную рекомендацию всегда использовать явную иконку «крестика» для закрытия — не нужно переизобретать системные элементы операционных систем.
 
17. Luke Wroblewski: Напоминает, что нудные длинные туры при встрече нового пользователя часто бесполезны. И приводит пару примеров продуктов, которые поменяли их на реальную ценность.
 
18. Asma Aldrees и Denis Gračanin: Большое исследование государственных цифровых сервисов. Что пользователи ожидают от них и как системно подступаться к работе такими проектами.
 
19. Peter Ramsey: Дикая механика покупки билетов в сервисе Ticketmaster. Он ограничивает время на оплату, что в условиях вереницы партнёров уполовинивает шансы на покупку.
 
20. Baymard: Удачные и плохие интерфейсные приёмы, чтобы показать состав витаминов в интернет-аптеках.
 
21. NN/g: Короткая шпаргалка по «скелетным» экранам загрузки.
 
22. Jim Lewis и Jeff Sauro: Сравнительные исследования сайтов интернет-магазинов офисных товаров и интернет-магазинов электроники. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.
 
#patterns
Свежая подборка свежего про свежие интерфейсные паттерны и лучшие практики:
 
1. Rauno Freiberg: Под микроскопом разбирает жесты и анимацию интерфейса в операционках Apple. Он делал интересный концепт MercuryOS, которая ощущается так же плавно и аккуратно, как и они.
 
2. Swiggy: Отличный рассказ о работе над конкретным компонентом кнопки в сценарии оформления заказа. Как они замеряли связанные метрики и доработали первую версию, уделяя внимание небольшим, но критичным деталям.
 
3. Wikipedia: Как делали редизайн.
 
4. Dan Brown: Рассуждает о сложностях описания информационной архитектуры продуктов, где интерфейс строится вокруг центрального объекта (например, календарь или документ). А ещё — о корпоративных продуктах и их отличии от продуктов для массового пользователя.
 
5. NN/g: Советы по дизайну интерфейса виртуальной очереди. Как показывать пользователю статус и сообщать о важных вещах.
 
6. Robert Goesch: Интересный концепт поиска авиабилетов. Их агентство DUMBO попробовало пересмотреть порядок действий пользователя, чтобы оптимизировать основной (по их мнению) сценарий использования.
 
7. Indeed: Роль прототипов в проверке продуктовых решений. В статье есть ещё одна классификация глубины их проработки и общие советы по применению.
 
8. IBM: Простой чеклист по свежему стандарту accessibility WCAG 2.2.
 
9. MeasuringU: Новое сравнительное исследование сайтов парков развлечений. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.
 
#patterns
Ещё чутка свежих интерфейсных паттернов и лучших практик:
 
1. Тарас Бакушевич: Удачные практики создания индикаторов загрузки для разных ситуаций.
 
2. GNOME: Новый способ организации окон программ в операционной системе. Это «мозаика» — смесь плитки и свободного расположения.

3. Пошаговые методички по методам проектирования, дизайна и исследования интерфейсов от Университета Аризоны.
 
4. Léonie Watson и Rakesh Paladugula: Основные тезисы из дискуссии о поддержке accessibility. Получился отличный чеклист.
 
5. NN/g: Тренды в интранетах 2023 года. Недавно они анонсировали победителей своих ежегодных наград.
 
6. Hajira Atheeque: Подробно разбирает принципы пространственного дизайна в Apple Vision.
 
7. NN/g: Памятка по дизайну аккордеонов в интерфейсах. Когда они работают и когда мешают.
 
8. Hannah Milan: Разные способы наложения текста на изображение в вебе, которые хорошо поддерживают accessibility. Часть 2.
 
#patterns
Новое про лучшие интерфейсные паттерны и практики:
 
1. Коллекция паттернов автомобильных интерфейсов. Разбито по сценариям использования и экранам, в бета-версии есть полтора десятка машин.
 
2. Creative Navy: Памятка по дизайну интерфейса мастеров настройки. Она грамотно структурирована и собирает хорошие примеры.
 
3. NN/g: Структурированная подборка своих статей о веб-интерфейсах.
 
4. Creative Navy: Обзор интерфейсов управления роботами.
 
5. Alyaa Al-Jasim и Pietro Murano: Юзабилити-тестирование разных вариантов тумблеров и переключателей состояний в интерфейсе. Они составили рекомендации по их проектированию.
 
6. NN/g: Упрощение интерфейсных текстов. Как убирать лишнее и упрощать подачу информации в целом.
 
7. Costa Alexoglou: Способы реализации «безопасного треугольника» для выпадающих меню. Это старый, но важный приём, который помогает пользователю легче попадать мышью в пункты таких меню.
 
8. Lawrence H. Williams: Неоднозначность оценки времени прохождения сценария использования. В примере его исследования видно, что где-то много проведённого времени говорит о проблеме, а где-то — наоборот, о качестве контента.
 
9. MeasuringU: Новое сравнительное исследование сайтов товаров для дома. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.
 
#patterns
Не успевал упаковать весь свежак про свежие интерфейсные паттерны и лучшие практики, да как вдруг успел:
 
1. Casper Kessels: Отличная памятка по прототипированию автомобильных интерфейсов подручными средствами. Инструменты и способы быстрого вывода на устройство.
 
2. Scott Jenson: Шикарный детальный анализ проблем в клавиатурах на мобильных от легенды нашей профессии. Он также предлагает своё решение, которое представил на симпозиуме UIST.
 
3. Коллекция примеров интересных «подвалов» сайтов.
 
4. Dongkyu Lee: Как сделать анимацию переходов между экранами и их состояниями более логичной и симпатичной.
 
5. Swiggy: Редизайн процесса встречи нового пользователя в приложении. Как упрощали его и вовлекали людей.

6. NN/g: Структурированная подборка своих статей об accessibility и инклюзивности.
 
7. Аида Пачева: Подход к адаптивности в вебе. Она ориентируется на современные подходы вроде component queries, а не жёсткие breakpoints для всего макета.
 
8. Creative Navy: Интерфейсы производственных линий по сборке автомобилей.
 
9. Slack: Рассказ о недавнем крупном редизайне интерфейса. Результат неоднозначный, но интересно посмотреть на ход процесса. Отдельные статьи про мобильную версию и боковую панель.
 
10. NN/g: Оглавления в вебе и на мобильных.
 
11. Growth Design: Эффект «фрейминга» в интерфейсах. Как правильно подавать варианты выбора и рекомендации.
 
12. Peter Ramsey: Процесс оформления подписки на сервис доставки готовой еды Hello Fresh.
 
13. Creative Navy: Интерфейсы медицинских приборов для диализа.
 
14. Jason Grigsby: Просит не использовать «ленивую загрузку» для абсолютно всей графики — это ломает саму идею и пользовательский опыт.
 
15. Ксения Толокнова: Разница между action sheets, диалогами и панелями для уведомлений в мобильных приложениях. Когда и для чего их использовать.
 
16. MeasuringU: Сравнительное исследование сайтов краски для дома. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.
 
#patterns
На редкость длинная пауза вышла с мини-выпусками про свежие интерфейсные паттерны и лучшие практики. Обнуляю её:
 
1. Baymard: Как выводы из их многочисленных пользовательских исследований сайтов и приложений электронной коммерции во многом пересекаются. Это в целом и так понятно, но он приводит конкретные доли таких пересечений.
 
2. NN/g: Годное дневниковое исследование паттернов использования умных часов. Они выделили 6 основных задач и приводят нюансы работы пользователей по ним. В 80% случаев используют только встроенные приложения от производителя и не ставят дополнительные.
 
3. Pushkeen: Коллекция примеров push-уведомлений.
 
4. Storefront: Коллекция примеров главных страниц интернет-магазинов одежды.
 
5. Emailspiration: Коллекция примеров писем рассылки.
 
6. Индия запретила использование «тёмных паттернов» в интерфейсах. Jakob Nielsen разбирает 12 таких манипулятивных приёмов, которые упомянуты в этом законе.

7. Creative Navy: Подробный обзор интерфейсов сервисов для нанимающих менеджеров.
 
8. Alaïs de Saint Louvent: Сайт-памятка по поддержке accessibility.
 
9. Baymard: Типичные проблемы интерфейса проверки адреса в интернет-магазинах.
  
10. Peter Ramsey: Разбирает парадоксальный сайт Zara. Это богатейшая компания с огромным оборотом, интернет-магазин которой — полнейшая катастрофа.
 
11. MeasuringU: Новое сравнительное исследование сайтов краски для дома. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.
 
#patterns
Первый в этом году выпуск мини-дайджеста о лучших интерфейсных паттернах и практиках:
 
Ahmad Shadeed: Кажется, появилась лучшая в истории статья про комфортный размер интерактивных элементов в сенсорных интерфейсах. Он разобрал со всех сторон дизайн и реализацию в коде — тему можно считать закрытой надолго.
 
2. Casper Kessels: Принципы проектирования автомобильных интерфейсов.
 
3. UXDA: Концепт банковского интерфейса для Apple Vision Pro.
 
4. Maggie Appleton: Хороший интерфейс истории перемещений в браузерах и других продуктах. Она предлагает свой концепт в духе веток Git.
 
5. Bjango: Проанализировали интерфейс управления объектом и размытия в популярных графических редакторах.
 
6. Amelia Wattenberger: Как грамотно проектировать поведение контента в вебе, который представлен в виде бесконечной канвы а-ля FigJam или Miro.
 
7. Growth Design: Проанализировали итоги года Spotify Wrapped 2024 на предмет механик вовлечения пользователей.
 
8. Peter Ramsey: Сравнил работу нескольких сервисов доставки в Великобритании. Он отправил 6 одинаковых посылок с каждым из них и сравнил интерфейс и пользовательский опыт в целом.
 
9. Maggie Appleton: Способы показать в интерфейсе, что несколько пользователей работают с ним прямо сейчас или взаимодействовали какое-то время назад.
 
10. Creative Navy: Изучили сайты нескольких юридических компаний. Что пользователи ждут от них и как они это отрабатывают.
 
11. Christina Gilbert: Советы по дизайну интерфейса импорта из CSV-файла.
 
#patterns
Счастливые часы для интерфейсных паттернов и лучших практик: количество ссылок удваивается:
 
1. Casper Kessels: Логика проектирования автомобильных интерфейсов. Он сделал небольшой концепт, где показал принципы принятия решений.
 
2. NN/g: Лучшие практики использования QR-кодов. Как показывать их, какие аннотации давать, куда вести.
 
3. Alexander Obenauer: Концепт OLLOS, который помогает представить заметки, письма, задачи и другие кусочки повседневной информации в связанной хронологии.
 
4. NN/g: Обновили свою топчанскую памятку по дизайну интерфейса сравнительных таблиц.
 
5. Google: Лучшие практики поддержки accessibility в интерфейсах с инфографикой и визуализацией данных.
 
6. NN/g: Три интерфейсных паттерна для отображения статуса системы: индикаторы, валидация и уведомления.
 
7. НЛМК: Особенности дизайна профессиональных интерфейсов для производств.
 
8. Baymard: Проблема валидации полей формы оформления заказа — по закону нельзя даже временно хранить данные карты, так что они пропадают после перезагрузки страницы. И предлагает несколько подходов к реорганизации интерфейса.
 
7. Paul Sonnentag, Alexander Obenauer и Geoffrey Litt: Концепт интерактивных составных документов Embark.
 
8. NN/g: Пробуют применить классические эвристики Нильсена к настолкам. Он показывает, какие принципы работают и где их можно нарушать.
 
9. Николай Тонский: Чекбоксы всё чаще делают круглыми, так что теряется их изначальная задумка — отличие от радиокнопок.
 
10. Creative Navy: Проанализировало сайты химических концернов. Они составили рекомендации по интерфейсу.
 
11. MeasuringU: Новое сравнительное исследование сайтов по продаже мебели. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.
 
#patterns
Непонятно, как за неделю собралось ещё столько свежего про интерфейсные паттерны и лучшие практики. Но времени объяснять нет, так что читайте:

1. Michael Molen: Примеры настольных игр, которые работают вместе с приложением-компаньоном. Или наоборот — цифровых игр, которые сделали настолки-дополнения. Как строится взаимодействие между ними.

2. Kate Kalcevich: Обзор способов работы пользователей с ограниченными возможностями с приложениями Android и iOS.

3. Jon Yablonski: Закон Теслера в дизайне. Он о минимальной сложности конкретного интерфейса, ниже которой его не упростить.
 
4. Ксения Толокнова и Марина Сапожникова: Поиск на мобильных.
 
5. Коллекция минималистичных сайтов.
 
6. Georgie Cooke: Как сделать заглушку аватара с инициалами пользователя, если у него нет своего изображения. По факту всё не так тривиально.

7. Creative Navy: Сайты производителей медицинских устройств. Они выделили лучшие практики.
 
#patterns
И снова прорва свежих ссылок об интерфейсных паттернах и лучших практиках:
 
1. Creative Navy: Браузерные расширения. Популярные подходы и их особенности.
 
2. Brad Woods: Концепция «сока» в играх, которую можно применить для внедрения эмоционального дизайна в интерфейсах.
 
3. Коллекция примеров страниц ошибки 404.
 
4. Коллекция примеров интересных интерфейсных решений, во многом на базе анимации.
 
5. Welcome to the Jungle: Проектирование и тестирование навигации.
 
6. NN/g: Главные страницы сайта. Правда, с поправкой на то, что у многих сайтов пользователи в основном попадают на конкретную страницу из поиска или соцсетей, минуя главную.
 
7. Luke Wroblewski: Проблемный интерфейсный паттерн «пинбол», когда глазу приходится сканировать последовательность элементов на экране в хаотичном порядке.
 
8. Brian Merrell: Переосмысление панели настроек анимации в After Effects. Визуализация с помощью метафоры автобусного маршрута помогла упростить работу.
 
9. Baymard Institute: Как спроектировать правильный фильтр по размерам одежды и обуви в интернет-магазинах.
 
10. Creative Navy: Проанализировали сайты производителей промышленного оборудования.
 
11. Arun Venkatesan: Толковая навигация по содержанию статьи в своём блоге.
 
#patterns
Что сегодня собралось в мини-подборке по лучшим интерфейсным паттернам и практикам:
 
1. NN/g: Принципы работы трёх видов калькуляторов: конвертеры, предположения и рекомендации.
И советы по их дизайну.
 
2. Karri Saarinen: Редизайн сервиса управления задачами Linear. В первой части говорит о том, как продавать такие изменения. Во второй — как шёл сам процесс.
 
3. Evil Martians: Интерфейсы для разработчиков должны быть оптимизированы под высокую продуктивность. В статье собраны самые частые паттерны.
 
4. Ксения Толокнова: Толковый анализ возможностей экранных клавиатур в Android и iOS. Что и когда можно использовать в ваших приложениях.

5. Baymard Institute: Режим примерки товара в дополненной реальности в интернет-магазинах на мобильных работает коряво и достаточно бесполезно выводы из свежего исследования).

6. Creative Navy: Профессиональные интерфейсы для производственных линий по упаковке и наполнению товаров.

7. Виталия Фридман: Краткий обзор паттернов сканирования информации на экране.

8. Creative Navy: Интерфейсы описания университетских курсов. Они прошлись по 280 вузам и провели 45 интервью.

9. Baymard Institute: Рекомендуют делать навигацию между фото пользователей в отзывах о товаре. Обычно они открываются поодиночке, что заставляет делать много лишних телодвижений.

10. Luke Wroblewski: Самая ценная вещь, которую дизайнеры могут дать продукту — лучше показать пользователю ценность этого продукта.

11. Matthew Ström: Разные виды информационной плотности в интерфейсе — насыщенность на единицу пространства, во времени и в плане ценности.

12. Baymard Institute: Сложные фильтры на B2B-сайтах по продаже электроники и советы по организации поиска в них.
 
13. Baymard Institute: Советуют использовать табличные списки на B2B-сайтах по продаже электроники на компьютере и обычные списки на телефоне.
 
14. MeasuringU: Новые сравнительные исследования сайтов американских банков и заказа цветов. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.
 
#patterns
Сегодня в программе мини-подборки — лучшие интерфейсные паттерны и практики:

1. NN/g: Памятка по дизайну интерфейса меню в вебе. Простой и наглядный чеклист, который начинается с одной из главных проблем — люди читают Рамса и Нормана, а потом прячут навигацию на больших мониторах под иконку.

2. Atlassian: Смогли стандартизировать интерфейс drag&drop и его реализацию в своих продуктах. Это позволило здорово поднять производительность и упростить его использование. Alex Reardon, Lewis Healey, Melissa Jaén и Maria Christley описывают процесс работы и детали паттерна, а также делятся кодом.

3. Luke Wroblewski: Текст и видео презентации о трёх разрывах в UX: организационном, сути продукта и его реализации, которые мешают получить ценность от продукта.
 
4. DOC: Хорошая памятка по созданию осмысленных дизайн-концептов. Они должны быть про основную концептуальную модель взаимодействия, а не просто пыль в глаза.

5. Handheld Design: Коллекция паттернов мобильных приложений.

6. NN/g: Памятка по использованию чекбоксов в интерфейсах. Одиночные, списки, вложенные и их нюансы.

7. Baymard: Советуют сразу предлагать пользователям интернет-магазинов фильтр по размеру. Они не будут тратить время на поиск одежды, которой по факту нет в наличии.

8. Will Boyd: Как грамотно реализовать ссылки-якори на странице сайта.

9. Alexander Obenauer: Новая серия статей о концептуальных моделях интерфейсах. Пока есть только первые материалы, но автор всегда выдаёт интереснейшие размышления о глубинной логике продуктов для персональной продуктивности.

10. IBM: Советы по планированию и созданию интерактивных прототипов в Figma.
 
#patterns
Попробую более компактные выпуски в ближайшие недели. Начнём со лучших интерфейсных паттернов и практик:

1. Ирина Сильянова: Хорошая памятка по написанию интерфейсных текстов. Здорово, что они находятся на стыке дизайна (как использовать текст в контексте экрана) и редактуры (как правильно писать).

2. NN/g: Советуют больше времени тратить на убирание барьеров и «засоров» в интерфейсе, чем на подталкивание пользователя к правильному решению. Оба направления работы важны, но отдача от первого быстрее и понятнее.

3. Baymard: В интернет-магазинах одежды большинство пользователей пользуется навигацией по категориям, а не поиском. Iva Olah рассказывает, почему это так и почему частые поисковые запросы здесь — симптом проблем.

4. Baymard: Советуют добавлять визуальное представление фильтров для сложных категорий товаров в интернет-магазинах.

5. Chiara Santella: Как менялась концепция будильника — от улучшения функциональности в самостоятельных устройствах до переосмысления самой концепции в эпоху мобильных приложений.
 
#patterns