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

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

РЕКЛАМЫ НЕТ.
Download Telegram
Судя по темпам выхода жирного контента про пользовательские исследования, они будут занимать значительную часть дайджеста в ближайшие годы:

1. Авито и группа энтузиастов изучили рынок UX- и других исследователей в России (участвовало 250 специалистов). Много деталей и задачах, форматах работы, проблемах, интересах и куче других аспектов. Схожий по целям опрос маркетинговых исследователей. И ещё материал, хотя и написанный крайне тяжёлым языком.

2. Контур: Памятка по методам качественных и количественных исследований.

3. Salesforce: Модель работы в agile. Очень крутой и свежий подход системной работы с потребителями исследований, который позволяет оптимизировать календарь.

4. Контур: Правильное проведение опросов и обработка их выводов.

5. athenahealth: Проверка идей на уровне концептов с помощью коротких видео. Часть 2 о том, как оценивают их.

6. Facebook: Грамотная подача результатов UX-исследования для команды. На чём фокусироваться, как структурировать, как оформлять.

7. NN/g: Внутренняя и внешняя валидности UX-исследований и как повысить их.

8. NN/g: Гайды для глубинных интервью.

9. NN/g: Тестирование контента.

10. Сообщество экспертов по проектированию поведения собрало свой обзор трендов в профессии на 2021 год.

И это, кажется, ещё не всё прочитано из входящих.

#research
Собрал дайджест продуктового дизайна за февраль 2021. Сотня свежих статей, инструментов, паттернов, кейсов, трендов и исторических рассказов.

Напомню, что его можно получать разными способами:
Facebook
vc.ru
ВКонтакте
Рассылка по почте

#digest
Выпуски про дизайн-системы были в отпуске, но вот поднабрали сил. Вот что интересного происходило за последние месяцы:

СВЕЖИЕ ПРИМЕРЫ
1. Газпром Нефть Consta: её используют более 50 проектов компании. Есть компоненты на React и шаблоны в Figma.

2. Ростелеком: правда, большинство компонентов пока в виде скриншотов (но есть отдельный сайт с трушными).

3. Brainly: включает раздел с описанием бренда.

4. Райффайзенбанк: компоненты для веба (пока снаружи доступен просто GitHub).

5. Netflix Hawkins: технологические основы (названа в честь города из Stranger Things).

ФРЕЙМВОРКИ
Storybook запустили каталог плагинов. Подробнее о нём. В преддверии этого они выпустили расширения для просмотра и оптимизации компонентов для мобильных, встраивания макетов Figma в живой гайдлайн и расширенной документации в формате MDX.

Документация по написанию плагинов (обзор). И примеры от компаний.

Они также научились показывать нативные компоненты для мобильных. Это упрощает создание живых гайдлайнов для них. Сама библиотека.

ЦЕННОСТЬ И ВЫХЛОП
1. REI: ценность. Хотя итоговый список не нов, сами рассуждения о сложности оценки годные.

2. Ben Callahan: как обосновать вложения для руководства компании. Правда, не хватает примеров расчётов.

ТОКЕНЫ
1. Lukas Oppermann: памятка. Он сделал плагин для Figma, который позволяет экспортировать стили в JSON.

2. Will Boyd: какие значения можно использовать в CSS-переменных. Это один из самых простых способов реализации токенов.

КНИГИ И СТАТЬИ
1. Перевод книги «Design Systems Handbook» от InVision.

2. IBM: методы для координации дизайн-команды, работающей над одним, но большим продуктом.

Тема перешла на второй горб кривой хайпа Гартнера — те, кто ждал быстрой отдачи без вложений, сильно разочаровались. Но компании, которые смогли выстроить выделенные команды и сообщество вокруг них, обеспечили достаточное покрытие — получают ту самую изначально заложенную пользу.

#designsystems
Чуток свежих интерфейсных паттернов и лучших практик подъехало:

1. Peter Ramsey: разбор интерфейса Clubhouse. Насколько он помогает получать качественный контент (спойлер: плохо).

2. Кирилл Улитин: перепроектирование панели инструментов в браузерном редакторе докумнетов МойОфис. Они рассматривали разные популярные подходы и сравнивали их эффективность.

3. NN/g: «интернет-магазин на диване» — когда кто-то рассказывает о товарах на видео.

4. Sarah L. Fossheim: как экранный диктор Apple в часах и телефонах читает инфографику из приложений для отслеживания здоровья.

5. Cyber Duck: обновления GDPR с момента введения в 2018 году. Продолжение с фокусом на способы запроса согласия на cookies.

6. Airbnb: упрощение частей интерфейса в кризисной ситуации пандемии. Многие из владельцев жилья предоставляли его медикам и другим людям в повышенном стрессе, так что даже вроде бы обычные паттерны могли раздражать их.

7. Marc Andrew: серия простых советов по улучшению интерфейса в виде микро-книги. Выдержка — https://marcandrew.me/ui-ux-micro-tips-volume-one/.

8. Baymard Institute: стоит оставлять поисковой запрос поля поиска в интернет-магазинах. Это помогает уточнить выборку. И важность хорошего описания товара от них же.

9. Peter Ramsey: анализ реакции инвестиционного приложения Robinhood на кризисную ситуацию с внезапной массовой торговлей акциями GameStop. Хотя под угрозой был бизнес сервиса, удар по доверию пользователей был жёстким. Автор предлагает интерфейсные улучшения, которые смягчили бы ситуацию.

10. Slack: подход к дизайну для администраторов, потребности которых отличаются от обычных пользователей.

11. Salesforce: проектирование дашбордов. Он советует фокусироваться на вопросах, которые задают себе пользователи при работе с данными.

Или не чуток :)

#patterns
Мини-дайджест обычно посвящён какой-то сфокусированной теме. Но не в этот раз:

1. Золотая статья Richard Yang, которая в очень ёмком виде описывает основные цели дизайнера интерфейсов. Минимум шелухи, максимум на ключевых результатах — упрощение сложных сценариев, причём помня о балансе между физической и ментальной сложностью.

2. Хронология взаимоотношений главы Amazon Jeff Bezos с дизайном. Успех и провалы с историей ключевых запусков.

3. Бомбейшая подборка вредных советов для менеджеров продуктов от Teisanu Tudor, которые помогают убить волю дизайнеров. В таком виде типичные проблемы взаимодействия подсвечиваются ещё лучше.

4. Casper Kessels размышляет о причинах популярности сенсорных экранов в машинах, несмотря на проблемы с их эргономикой. Он проследил рост функциональности за несколько десятилетий и отмечает, что её невозмоно поддержать физическими кнопками.

5. Graeme Fulton разбирает несколько современных примеров тёмных паттернов от Amazon, Facebook, Medium и Twitter. Они строятся вокруг намеренно запутанных текстов.

6. Liz Tan размышляет на тему здорового поведения интернет-сервисов, которые знают своё место в жизни пользователя и не пытаются жить «отныне и вовеки веков, пока смерть не разлучит нас».

7. Per Axbom собрал модель проблем в цифровой этике на разных уровнях — от общества и организации до человека и машины.

Просто отличные статьи из недавнего и нового дайджеста про важные для профессии вещи, которые жалко не закинуть сюда.

#random
Прошлый мини-дайджест на тему пользовательских исследований был всего несколько недель назад. И вот снова накопилось годноты.

В качестве эксперимента 13-15 апреля курирую ещё одну программу для Future London Academy — на этот раз по UX-исследованиям. Горячий состав: звезда ResearchOps Kate Towsey (Atlassian), гений xJM и JTBD Jim Kalbach (Mural), мастера рекрутинга для удалённых исследований David Farkas (Collabralink) и Brad Nunnally (U.Group), гуру вовлечения продуктовой команды в UX-исследования Mandeep Basi (ex-Shopify), а также Rebecca Destello и Anuj Tewari (Facebook). Аж самому не верится :)

Формат — три плотных дня лекций и мастер-классов, после которых — плотные сессии вопросов и ответов, а также отличный нетворкинг (что всегда было отдельной сильной стороной Future London Academy).

Ну и, конечно, статейки-статеечки:

1. Опрос 525 специалистов по множеству тем. Получился интересный срез текущего состояния отрасли: методы, орг.струкутры, инструменты и т.п.

2. Группа веб-стандартов W3C сделала первую версию набора персонажей для учёта требований accessibility.

3. Alan Cooper: некорректное использование персонажей началось вскоре после публикации книги «Психбольница в руках пациентов». Он просто в своё время рассказал дизайнерам интерфейсом о потенциально интересном методе, а переврали его уже последователи.

4. Usethics: юзабилити-тестирование через клик-тесты скриншотов интерфейса.

5. Jean Fox и Jennifer Edgar: метод когнитивных интервью, который в каких-то ситуациях заменяет юзабилити-тестирование.

6. Shopify: исследования физических платёжных устройств в условиях удалённых методов.

7. Пачка свежего от Jeff Sauro и Jim Lewis:
предостерегают от использования в опросах слов вроде «всегда» (преувеличение), «могли бы» (сложно определить грани) или «вы» (непонятно, речь о респонденте или, например, его семье).

простые и чёткие формулировки вопросов при проведении опросов.

причины, по которым респонденты могут неправильно понять формулировки опросов.

почему респонденты забывают причины, детали и последовательность событий, о которых рассказывают.

как определить выборку для опроса NPS.

Увидим, сколько займёт собрать следующую мини-подборку на тему.

#research
Собрал дайджест продуктового дизайна за март 2021. Справочник компонентов, история дизайна в Amazon, аудио-брендинг, бесплатный курс от Google, новые инструменты дизайна, зрелость дизайна, что может массовый смартфон и ещё сотня свежих статей, инструментов, паттернов, кейсов, трендов и исторических рассказов.

Напомню, что его можно получать разными способами:
Facebook
vc.ru
ВКонтакте

#digest
Давненько тут не было подборок новостей про инструменты дизайна. Во-первых, Figma съедает всё и это теряет даже исследовательский смысл. Во-вторых, книжка съедает остальное время, а раскопки требуют плотного погружения. Но вот что было в свежем дайджесте:

1. Figma:
Бесплатный тариф будет ограничен с 21 апреля. Теперь можно вести максимум 3 файла по 3 страницы в каждом и 1 проект. Хотя при этом снимут ограничение на количество редакторов.

— В последнюю неделю марта они выпускали по одному улучшению в день. Наконец-то появились списки. А ещё можно публиковать отдельные компоненты дизайн-системы, не обязательно всю библиотеку сразу. И, самое приятное, — связать личную и рабочую учётную запись. Публичный профиль в сообществе также будет единым.

— В феврале появилась бета-версия FigJam, доски для совместной работы а-ля Miro. Она всё ближе к запуску.

— Также появился улучшенный поиск внутри инструмента а-ля известный плагин Sketch Runner.

2. Sketch 71: Совместная работа с документом вышла из беты.

3. Mesh Gradients: Инструмент позволяет делать эффектные mesh-градиенты. Есть плагины для Sketch и Figma.

4. Spline: Скоро можно будет редактировать векторные иллюстрации в 3D.

5. Mail Studio: Инструмент помогает создавать адаптивные письма рассылки. Есть версии для Windows, Mac и Linux.

6. UXOps: Новый сервис для проведения карточной сортировки.

7. Attention Insight Heatmaps: Ещё один сервис, который моделирует тепловые карты для интерфейсов на основе исторических данных похожих тестов.

8. Dither Me This: Сервис позволяет сделать дизеринг изображения, что в духе одного из нишевых трендов.

9. Float: Простой инструмент для послойной анимации иллюстраций от Gal Shir.

10. Фантастическая коллекция генераторов CSS-кода для любых дизайнерских приёмов от Iris Lješnjanin. Цвета, типографика, сетки, анимация, декоративные элементы и много чего ещё. Во второй статье собраны генераторы SVG на самый разный случай: фигуры, фоны, анимация и т.п.

Надеюсь, в этом году снова найдётся достаточно времени на этот формат.

#tools
Собрал конспект курса Future London Academy по UX-исследованиям, который курировал на прошлой неделе. Инсайты, слайды и заметки про пять сильных лекций и воркшопов:

1. Brad Nunnally и David Farkas, авторы книги UX Research от O'Reilly.

2. Kate Towsey (Atlassian), одна из основательниц идеи ResearchOps и автор будущей книгу на тему.

3. Mandeep Basi (Sociotekno, экс-Shopify) и её обзор способов донесения результатов исследований до продуктовой команды.

4. Jim Kalbach (Mural), автор нескольких ключевых книг в профессии — Mapping Experiences и Jobs to Be Done Playbook.

5. Rebecca Destello и Anuj Tewari (Facebook), которые ни провели исследование исследователей на тему выхлопа от их проектов.

Делая эту программу, мы пытались найти золотую середину — темы должны быть интересны как практикующим UX-исследователям, так и тем кто работает с ними (в первую очередь дизайнеры интерфейсов и менеджеры продуктов). Первые отзывы очень приятные — причём от обеих групп.

Это уже шестой курс, который я помогаю курировать Кате Соломеиной. 24-27 августа пройдёт флагманский по UX и продуктовому дизайну. Если мы все не уйдём на очередную волну карантина, он состоится в офлайне и мы обязательно пройдёмся по старейшим лондонским пабам.

#research
Понедельничная подборка свежих статей для дизайн-менеджеров и тех, кто развивает дизайн-команды в целом. Как сделать дизайнеров счастливее, а взаимодействие с продуктовой командой — лучше:

1. Alicja Suska: Дизайн-долг. В первой части она рассказывает о его сути и причинах появления. Во второй — как отслеживать и замерять. На подходе ещё несколько.

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

3. Victor Yocco: Зрелость UX и как её повысить. В первой части он фокусируется на адвокатах дизайна среди лиц, принимающих решения, а также ROI. Во второй — об обмене знаниями и менторстве. В третьей — об обучении основам дизайна.

4. Stephen Hay: Формула для вопросов на сессиях дизайн-критики. Она стартует комфортное обсуждение без осуждения.

5. Kazden Cattapan: Как объяснять дизайн-решения коллегам из разных ролей: разработчики, редакторы, менеджеры продуктов и топ-менеджеры.

6. NN/g: Фреймворк CX-трансформации компании. Недавно они выпустили отчёт с рекомендациями на тему.

7. IBM: Внедрение сложных практик и методов дизайна. Это рамка «пилот → евангелизм → масштабирование», которая позволяет делать всё поэтапно.

8. Gov.uk: Как устроено дизайн-сообщество в государственных сервисах.

9. NN/g: Карта лиц, принимающих решения. Как системно работать с ними, чтобы получить поддержку.

10. Flexport: Формат ежегодной встречи дизайнеров, которая в этом году прошла виртуально. Они сделали необычный шаблон в Miro в виде дома, где в каждой комнате проходила своя активность.

11. Shopify: Сбор обратной связи в зависимости от стадии проекта и проработки концепта.

12. IBM: Три вида помощи дизайнерам, которыми дизайн-менеджер здорово облегчает их жизнь и помогает развитию. Организация коммуникации, первая ответственность за процесс и обратная связь для самого лидера.

13. IBM: Неплохой обзор концепции Т-образных специалистов и способов развития этих навыков.

Давненько не было подборок на эту тему и вот прорвало :)

#designmanagement
Тридцатая мини-подборка о паттернах и лучших интерфейсных практиках:

1. Smashing Magazine: Ультимативный список интерфейсных компонентов, которые свёрстаны с учётом требований accessibility.

2. Baymard Institute: Новое исследование интернет-магазинов на мобильных. Они сделали обзор основных выводов. Есть новые проблемы, но многие вроде маленьких областей нажатия или отсутствия информации о возврате — вечны.

3. NN/g: Модель поведения пользователей «собирательства ключевых слов» при поиске в интернете. Она возникает, если человек не знает, как именно искать объект (например, это редкий термин для стиля одежды).

4. Lyft: Улучшение интерфейса поддержки пользователей. Он разбирает все альтернативные подходы и логику решений.

5. NN/g: 10 лучших интранет-сайтов 2021 года. В сопроводительной статье они рассказывают о лучших практиках информирования о пандемии.

6. Nick DiLallo: Тексты в интерфейсе, которые инклюзивны.

7. Ahmad Shadeed: Виды подложек для текста на картинке и CSS-код для них.

8. Peter Ramsey: Встреча нового пользователя в Twitch и механика внутренних платежей. Это сложная система, которая никак не объясняется внутри сервиса — приходится искать объяснения в интернете.

9. Kickstarter: Оптимизация интерфейса, которая помогла поднять вложения в проекты на платформе.

10. Тинькофф: Доработки приложения для малого бизнеса, которые помогли поднять его использование клиентами относительно веб-версии.

11. Markswebb: Процесс заказа дебетовой карты. Они сравнивают подходы десяти крупнейших отечественных банков.

12. Baymard: Ключевые атрибуты карточки продукта в блоках кросс-продаж интернет-магазинов.

13. Jim Lewis и Jeff Sauro: Сравнительное исследование нескольких американских сервисов доставки еды. Они выявили ключевые драйверы хорошего пользовательского опыта и оценили их по модели Кано.

Копил-копил и накопил подборочку.

#patterns
С конца прошлого года вышло или анонсировано несколько новых книг по дизайну интерфейсов и около того:

1. Diana Deibel & Rebecca Evanhoe «Conversations with Things. UX Design for Chat and Voice» о проектировании голосовых и чат-интерфейсов. Выдержка из главы №1.

2. Preston So «Voice Content and Usability» о подготовке контента для голосовых интерфейсов и их проектированию в целом. Параллельно вышла его статья об иммерсивной контент-стратегии.

3. Простая онлайн-книга по дизайну в вебе от Алексея Баранова. Основы хорошего дизайна и работа с паттернами.

4. Krystal Higgins «Better Onboarding» о встрече нового пользователя в интерфейсах.

5. «Brand Management for Dummies» от Frontify. Это совсем базовый обзор того, как сделать бренд цельным.

6. Beth Dunn «Cultivating Content Design» о системной работе с контентом в компании.

7. Addy Osmani «Image Optimization» об оптимизации изображений. Обзор и выдержки из неё — https://www.smashingmagazine.com/2021/04/image-optimization-pre-release/.

8. В начале 2022 года выйдет второе издание Stephanie Marsh «User Research». Добавится раздел о ResearchOps и защите персональных данных, помимо множества других обновлений.

А вот что на подходе у Rosenfeld Media:
1. Natalie Marie Dunbar «From Solo to Scaled»

Плотно идёт!

#books
Собрал дайджест продуктового дизайна за апрель 2021. Пересечение ролей дизайнера и менеджера продукта, интернет-магазины на мобильных, тестирование дизайн-систем, дизайн-долг, упражнения, методы проведения воркшопов, новые инструменты дизайна и ещё сотня свежих статей, инструментов, паттернов, кейсов, трендов и исторических рассказов.

Напомню, что его можно получать разными способами:
Facebook
vc.ru
ВКонтакте

#digest
Стопка ссылок для тех, кто внедряет дизайн-системы в коде, а не просто Фигме:

1. Дизайн-система сервиса B2B Center. Всё на месте — компоненты в коде, токены, редактура.

2. Varun Vachhar: Основные способы тестирования. Он разделил их на предмет тестирования (визуальное, композиция, взаимодействие, accessibility, сценарии), а не инструменты.

3. Storybook: Памятка по визуальному тестированию компонентов. Как настроить процесс и почему они рекомендуют оставлять его наполовину ручным.

4. Каталог типовых компонентов, для каждого из которых есть куча примеров из реальных внедрений. Здорово помогает быстро сравнить подходы.

5. Lukas Oppermann: Одна из самых полных и толково описанных статей о пользе внедрения.

6. Container queries появились в одной из веток Chrome. Они позволяют задавать адаптивность на уровне отдельного компонента, а не всей страницы — это здорово облегчает работу над дизайн-системой. Ahmad Shadeed и Stephanie Eckles сделали обзоры самой концепции и текущего состояния.

7. James Gilyead: Система размеров, которая позволяет реализовать гибкую адаптивную сетку как всего экрана, так и отдельных компонентов.

8. Alan Weibel: Критерии, которым должен удовлетворять новый компонент, чтобы попасть в дизайн-систему Salesforce Lightning.

9. Bootstrap 5 вышел из беты. Обзор изменений.

10. Matt Deco из Peacock: Как синхронизировать стили в компонентах в коде и Figma.

11. Mantine: Фреймворк для создания дизайн-системы на React.

</podborka>

#designsystems
На ежегодной конференции Google I/O анонсировали Android 12. Это сильное визуальное обновление (видео).

Новая версия Material Design называется Material You. Она даёт сложные и сочные по цветам темы оформления, которые будут работать по всем продуктам Google. Android сможет выцепить палитру из обоев телефона, чтобы всё выглядело органично.

Меняется многое:

— Элементы интерфейса стали крупнее, а скругления — больше. Это видно по обновлённой панели быстрых настроек (ещё).

— Изначальная идея Material Design слоёных панелей, которые отделяются тенями — всё. Теперь зонирование делается с помощью новой цветовой палитры (основной цвет и его высветленные градации).

— Интерфейс использует новый вариативный шрифт Google Sans Text в дополнение к семейству.

Анимация стала ещё плавнее и стройнее. Она также отражается на размерах элементов
— они растягиваются и сжимаются при перестройке экрана.

— Элементы могут иметь необычные геометрические формы (например, виджет или область нажатия). Но тут пока деталей мало.

— Подкрутили стиль всплывающих окон.

— Переработали виджеты.

Функционально изменений немного — они будут появляться позже, к осеннему запуску. Но уже сейчас появился индикатор работы камеры. А телефон можно будет использовать как пульт для Android TV и машины.

Бета-версия уже доступна. Документация для разработчиков и её обзор.

А вот несколько дизайнерских презентаций:
Обзор нового
Адаптация интерфейса под большие экраны (в дополнение: текстовый обзор и памятка)
Интерфейсные тексты
Поддержка accessibility
Сборка дизайна через Jetpack Compose (также запустили каталог компонентов)

И обновления для разработчиков.

Кстати, Google и Samsung объединили усилия в разработке WearOS. Собственная ОС Tizen от Samsung уйдёт в закат.

Со всеми изменениями это полный разрыв с изначальной идеологией Material Design, так что это название уже не имеет смысла. Но получилось свежо и бодро, даже если чистую оболочку использует не самое большое количество устройств — остальные увидят оформление своего производителя. А в мире уже 3 млрд активных устройств на Android.

#materialdesign #designsystems
Свежая подборка ссылочек для дизайн-менеджеров из грядущего и недавнего дайджеста:

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

2. Redmadrobot: Развитие дизайнеров в компании. Карта компетенций, менторство, способы прокачки навыков.

3. Dennis Hambeukers: Почему у всех пирамид UX, развивающих идею пирамиды Маслоу, всегда разная верхушка? Он предлагает свой подход — когда UX сначала связан с бизнес-стратегией, а потом и помогает определять её.

4. Gavin Elliott: Формат работы с дизайн-долгом. Как описывать, как разбирать, как доказывать.

5. Webflow: Что делать дизайн-менеджеру в быстрорастущей компании. Как поддерживать дизайн и дизайн-команду цельными.

6. Shopify: Необычный формат сессий дизайн-критики. Это виртуальные дебаты, в которых две группы обсуждают интерфейс в диалоге.

7. Gov.uk: Задачи координаторов дизайн-сообщества. Это огромное количество команд (4000 человек), для которых они проводят масштабное обучение и процессную поддержку.

8. Cisco: Роль дизайн-продюсера. Это дизайн-менеджер с зонами ответственности, которые хорошо работают для централизованных команд.

Надеюсь вернуть частоту мини-подборок на тему.

#management
Пополняем коллекцию лучших интерфейсных паттернов и практик. От элементов форм до целых отраслей:

1. Виталий Фридман: Поле выбора даты рождения. Типичные проблемы в проектировании и разработке, оптимальный вариант.

2. Atlassian: 4 способа добавить вдохновляющие моменты в интерфейс (предугадать, повысить эффективность, понять намерение, эмоционально отреагировать); примеры для каждого из них.

3. Lyft: Лучший сегментированный переключатель, который они нашли. В статье есть простая и наглядная памятка по выбору элементов интерфейса для выбора.

4. Jasmine Bilham: Как приложение Headspace для медитации пересмотрело процесс встречи нового пользователя и повысило вовлечённость и возвращаемость.

5. Виталий Фридман: Большие выпадающие меню в навигации и их проблемы. Он показывает, как сделать их хорошо, а ещё — на что можно заменить их, потому что проблем с ними масса и они не всегда нужны.

6. Kathryn Totz: Правильная сортировка товаров в интернет-магазине, когда пользователь попадает в категорию. Иначе может создаться ощущение, что в ней мало полезного.

7. Baymard: Исследование сервисов с подпиской. Как люди относятся к ним и насколько готовы платить.

8. Shopify: Оптимизация интерфейса для пользователей с ограниченными когнитивными возможностями.

9. Ещё одна коллекция тёмных паттернов с возможностью предложить пример автору сайта.

10. Gov.uk: Возможность показать пароль в поле ввода. Сложности, которые возникают при реализации, казалось бы, простого интерфейсного решения.

#patterns
В свежем мини-дайджесте про пользовательские исследования вас ждёт вот что:

1. Jeff Sauro и Jim Lewis продолжают разбирать нюансы проведения опросов. Вот несколько свежих материалов:

Шикарнейшая шпаргалка по составлению опросников. Это дерево решений, в котором можно подобрать правильный вопрос исходя из задачи.

Почему респонденты некорректно отвечают.

Четыре типа вопросов: атрибуты, поведение, возможности, оценки.

Четыре проблемы в качестве данных: от выборки до формулировок.

2. Jeff Sauro и Jim Lewis: Мощная памятка по выбору качественных и количественных методов исследований. Это набор из 27 характерных ключевых слов из вопроса исследования.

3. Facebook: Фокус-группы на удалёнке. Это текстовые ответы респондентов в группе на вопросы модератора, без видео-звонка.

4. Emanuela Cozzi и Lennart Overkamp: Альтернатива персонажам — «динамические личности». Они не пытаются схлопнуть множество респондентов в один профиль, а показывают спектр поведения в разных контекстах.

5. Yao Ding: Проверка интерфейсных решений, которые ориентированы на пользователей с ограниченными возможностями.

#research
Собрал дайджест продуктового дизайна за май 2021. Android 12, тексты в интерфейсах, тестирование дизайн-систем, шпаргалка по опросам, CSS container queries, развитие дизайнеров, сессии дизайн-критики, глоссарий профессиональных терминов, новые инструменты дизайна и ещё сотня свежих статей, инструментов, паттернов, кейсов, трендов и исторических рассказов.

Напомню, что его можно получать разными способами:
Facebook
vc.ru
ВКонтакте

#digest
Небольшая оперативная добавка к недавней подборке лучших интерфейсных паттернов и практик:

1. Rian Rietveld: Как правильно оформлять ссылки на сайтах. Так, чтобы с ними было комфортно взаимодействовать как обычным пользователям, так и людям с ограниченными возможностями.

2. Creative: Интерфейсы сервисов записи к врачу. Статья сравнивает разные подходы к навигации и представлению информации.

3. Philip C Davis: Комбинация командной строки и подсказок в современных интерфейсах. Они дают возможность как быстро набрать команду, так и выбрать вариант из списка.

4. Peter Ramsey: Интерфейс взаимодействия с поисковыми маячками Apple AirTags.

5. Baymard: Расположение кнопки поиска в интернет-магазинах.

6. Виталий Дуленко: Разбор интерфейса того самого OnlyFans.

#patterns
Apple показали iOS15. Это итеративное улучшение на базе текущего дизайна — фокус скорее на возможностях ключевых приложений. Что можно подсмотреть в интерфейсе для своих задач:

— Переработанная панель навигации в Safari — это плавающая панель с адресом сайта и списком вкладок вместо стандартного tab bar. В браузере также появились расширения.

В уведомлениях показывается фото контакта, а не просто иконка приложения. Они также собираются в мини-дайджест (например, утром).

Новый вид стопок фото в мессенджере. А также индикатор фото, ссылок, музыки и другого контента, которым поделились в мессенджере.

В фотографиях распознаётся текст — его можно скопировать, а по телефону в объявлениях на улице — позвонить. Всё это также можно перевести на другой язык (пока у них ограниченный набор). Камера распознаёт и суть объектов — например, даст справку о достопримечательности или картине.

— В приложении Здоровье появился необычный список контактов с интересным представлением аватаров (градиентный фон под ними).

— Фокусный режим, который выключает часть уведомлений и показывает статус в мессенджере.

Новый вид карт, включая навигацию в 3D и дополненной реальности.

Развёрнутые детальные результаты поиска.

Редизайн приложения Погода. Добавились декоративные карточки.

iPadOS

— Наглядное переключение режима мультизадачности. Среди них появился режим центрированного попапа (например, для написания письма), а все окна одного приложения можно увидеть списком. Для двухколоночного вида можно создавать готовые комбинации.

Ноутбук и планшет смогут управляться с одной клавиатуры и мыши, они автоматически связываются друг с другом через Universal Control. Например, можно перетащить картинку с планшета на компьютер.

— При подключении клавиатуры приложение показывает горячие клавиши.

Виджеты добрались и до планшета. Как и автокаталог приложений.

Песочница для создания приложений на Swift.

Что нового в MacOS Monterey.

Что нового в watchOS8.

Интерфейс развивается органично, так что пока обошлось без революций. Бета-версия должна появиться в июле, а финальная станет доступна на осенней презентации.

#ios #trends #events