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

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

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

Поэтому раз за разом отправляю всех в канал «Ищу дизайнера» (@designer_ru). Это крупнейшая база вакансий для дизайнеров, так что я который год рекомендую и продолжу рекомендовать её.

P.S. Я не размещаю рекламу, но иногда делаю обмен постами — в Телеграме почти нет органического роста. Спасибо ребятам за поддержку исследования дизайн-команд.
Кто бренд с интерфейсом свяжет, тот — хурма. Ну, за всю её и подборка:

1. Сервис аналитики Hotjar от британского агентства How & How.

2. Сервис пользовательских исследований User Interviews, сделанный своими силами.

3. Сервиса для автоматизации продаж Salesloft от американского агентства Focus Lab.

4. Одна из главных бирж фрилансеров Upwork от американского агентства Porto Rocha.

5. Справочник Yelp.

6. Продолжение ребрендинга Циан от отечественного агентства Щука. Как и зачем его делали.

7. Испанский сервис такси Cabify, сделанный собственными силами.

8. WeTransfer запустили своё медиа. Они стали одним из самых ярких примеров связи бренда с интерфейсом и на этом сайте их стилистика раскрывается ещё сильнее.

9. VPN-сервис Bluf VPN от эстонского агентства Tabasco.

Много всякой крутоты — научись в неё и ты.

#branding
Ультра-короткая, но мега-жирная подборка лучших интерфейсных практик и паттернов:

1. NN/g: Способы организации товаров в интернет-магазинах, которые не укладываются в основные категории.

2. Slack: Проектирование и поэтапный запуск новой функции Slack коротких аудио- и видео-клипов. Они прошли много итераций и показывают, как менялось взаимодействие пользователей.

3. Adam Argyle: Адаптивный список с множественным выбором, органично работающий на компьютерах и сенсорных устройствах.

4. Creative Navy: Обзор методов, помогающих упростить первое использование интерфейсов физических устройств (и не только).

Чтобы долго не копить, надо сразу всё излить

#patterns
Пользовательские исследования исследовались, исследовались, да не выисследовались. Так что мини-подборка свежего в помощь:

1. IBM: Составление roadmap UX-исследований в продукте или команде.

2. NN/g: Структурированные подборки своих статей об удалённом юзабилити-тестировании, а также методах полевых и контекстных исследований.

3. Jeff Sauro и Jim Lewis: Как измерить прошлый опыт работы пользователя с продуктом. Это комбинация срока использования, частоты и процента востребованных ключевых функций.

4. Jim Lewis и Jeff Sauro: Как предсказывать значения метрики SUS на основе их новой метрики UX-Lite, которая сильно проще. Ну и предыстория появления UX-Lite.

5. Sophia V. Prater: Процесс дизайна и исследований ORCA (Objects, Relationships, CTAs, Attributes) в рамках концепции Object-Oriented UX.

#research
Междупраздничная подборка для дизайн-менеджеров, лидеров и других, желающих сделать дизайн-команды лучше:

1. Как описать миссию дизайн-команды и видение будущего дизайна? Формат воркшопа от Nielsen/Norman Group и опыт RedHat.

2. Sainsbury's: Подход к продуктовой работе, ориентированный на конкретный выхлоп.

3. Nielsen/Norman Group: Третий уровень зрелости дизайна в их фреймворке.

4. Shopify: Удалённая менторская программа. Как запустили её и как она устроена.

P.S. Напомню, что в начале декабря делаю эксперимент — интенсив по дизайн-менеджменту для Smashing Magazine. Это 5-дневная версия моего курса и книги «Паттерны дизайн-менеджмента» — по 2,5 часа вечером с 1 по 15 декабря. Много теории и практики теперь и на английском языке.

#management
Шустро поднабралась ещё одна мини-подборка по брендингу цифровых продуктов:

1. Microsoft: Новые принципы дизайна. Пара советов на тему внедрения принципов в рабочие практики.

2. BBC: Gareth Ford Williams рассказывает о комплексной задаче оптимизации брендинга для accessibility в рамках недавней эволюции. Он вызвал много насмешек (мол, увеличили расстояние между квадратиками за десятки миллионов фунтов), но это был целенаправленный тюнинг всех аспектов для облегчения восприятия.

3. Facebook от внутренней студии Creative X.

4. Meta: Новый бренд материнской компании Facebook от внутренней студии Creative X.

5. Ребрендинг Mail.ru Group в VK от британской Saffron Branding и внутренней команды.

6. Ребрендинг сервиса для создания мини-сайтов Exposure от американского агентства Smith & Diction.

7. Новая айдентика облачного сервиса Kion от американского агентства Focus Lab.

8. Новая айдентика productivity-сервиса Heyday от американского агентства Order.

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

#branding
1
Короткий выпуск про дизайн-системы:

1. Команда Sparkbox провела интересный эксперимент — они попросили группу разработчиков написать форму на базе дизайн-системы IBM Carbon (с которой они не были знакомы) и такую же — самим с нуля. С дизайн-системой вышло на 47% эффективнее. Они готовят более масштабное исследование ROI.

2. Storybook: Бета интерактивных историй для описания компонентов со сложным поведением, которое нужно симулировать пошаговым сценарием.

3. ЦФТ Elephas: Дизайн-система отечественной компании Центр Финансовых Технологий. Страница на сайте клуба отечественных дизайн-систем.

4. Дизайн-система компании Nord Health.

5. Обзор функции UXPin Merge. Она позволяет связать компоненты в коде и инструмент дизайна.

#designsystems
Собрал дайджест продуктового дизайна за октябрь 2021. Material Design 3, Photoshop в браузере, планирование исследований, миссия и видение, прошлый опыт пользователя, принципы дизайна, игры по accessibility, новые инструменты дизайна и ещё сотня свежих статей, инструментов, паттернов, кейсов, трендов и исторических рассказов.

Напомню, что его можно получать разными способами:
vc.ru
Facebook
ВКонтакте
RSS
Четвёртый год я провожу исследование: какие дизайн-команды в отечественных продуктовых компаниях самые сильные?

Такой рейтинг будет полезен рынку. Дизайнерам — лучше понимать, где есть хорошие вызовы и комфортная среда для профессионального роста. Компаниям и дизайн-командам — видеть, что нужно докачать.

Результаты исследования опубликую в январе. Вы найдёте отчёт в крупных дизайн-каналах и изданиях.

P.S. Результаты за 2020, 2019 и 2018.
Подборка свежих интерфейсных паттернов и лучших практик:

1. Сравнение интерфейсов Playstation 5 и Xbox Series X в плане эффективности навигации.

2. Baymard: Советы по проектированию сложных таблиц сравнения тарифных планов.

3. Riya Chakravarty: Простой способ напомнить коллегам о том, что вы показываете сырую версию дизайна — водяные знаки на макетах.

4. Shopify: Лучшие практики по созданию промо-сайтов, адаптированных под требования accessibility.

5. Salesforce: Разница в проектировании обычных интерфейсов и ботов/плагинов для мессенджеров. Конкретные отличия этого контекста жизни пользователя.

6. Jordan Bowman: Памятка по предотвращению ошибок в интерфейсе.

7. Tess Gadd: Памятка по использованию аккордионов в интерфейсах.

8. Gov.uk: Зачем внедрили отдельный чекбокс для ситуаций, когда пользователь не выбирает ни одно из значений. Где-то важно иметь явный отказ, где-то это помогает менее опытным пользователям.

#patterns
Мини-подборка о пользовательских исследованиях:

1. Издательство ДМК Пресс готовит к выходу перевод второго издания известной книги Кэрол Барнум «Основы юзабилити-тестирования». Первое издание появилось 11 лет назад.

2. NN/g: Ориентиры по выборке респондентов для пользовательских интервью. Она описывает разные ситуации, которые влияют на размер. И совету по рекрутингу.

3. Jim Lewis и Jeff Sauro: Влияет ли расположение вариантов в шкале опроса (горизонтально или вертикально) на ответы? Их исследования и предыдущие публикации других авторов говорят — не особо.

4. Meta / Facebook: Профессиональные наблюдения за 10 лет карьеры, которые помогли Logan Wells выстроить хорошую связку с продуктовыми командами.

5. NN/g: Закон Кэмпбела — он говорит о том, как и почему метрики подвержены манипуляциям. И что делать, чтобы нивелировать этот эффект.

6. Jeff Sauro и Jim Lewis: Разница между количественными методами исследований: перепись населения, соц.опрос, анкеты и опросники.

Когда-нибудь эпопея с книгой и курсом по дизайн-менеджменту закончится и я снова начну писать подводки к спискам, но пока так.

#research
Свежие новости из дизайнерского книгоиздательства. Под конец года много немного, зато всё — жыр:

1. Steven Hoober «Touch Design for Mobile Interfaces». Она посвящена особенностям интерфейсов для мобильных сенсорных экранов. Анонс и обзор.

2. Перевод второго издания известной книги Кэрол Барнум «Основы юзабилити-тестирования». Первое издание появилось 11 лет назад.

3. Известный на Dribbble дизайнер Michael Flarup готовит книгу-коллекцию «The iOS App Icon Book». Она собрала лучшие примеры иконок приложений для iOS. Есть ещё пара дней, чтобы вписаться на KickStarter.

А вот что на подходе у Rosenfeld Media:
1. Kate Rutter «Practical Metrics for Designers»

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

Напомню, что его можно получать разными способами:
vc.ru
Facebook
ВКонтакте
RSS
В последние годы я делаю боль-мень обстоятельный разбор трендов этого и следующего года. Но в 2021 году положил все силы на завершение книги и полную переделку курса по дизайн-менеджменту (спойлер: в миллиметре от финиша). Поэтому сделаю просто обзор того, что прогнозируют на следующий год и чем отметился уходящий.

Начну с одного из лучших — уже второй год это материал от EditorX. Они проанализировали самые заметные вещи в визуальном и интерактивном дизайне, которые повлияют на профессию в 2022 году. Например, продолжение моды на эстетику начала 2000х или Y2K, которая давно заметна в одежде.

Своё ежегодное исследование самых востребованных инструментов для дизайна интерфейсов провели UXTools. Продолжается доминирование Figma и стремительное падение Sketch и InVision. Интересной будет схватка Miro и FigJam, хотя тут шансов у Фигмы меньше. Они также стали уделять больше внимания инструментам для UX-исследований.

Журнал UX Collective ежегодно отмечает точки движухи в профессии дизайна интерфейсов. Они перебирают приличное количество публикаций за год и выделяют явные всплески.

Sidney Alcantara сделала шикарный обзор трендов в базовом оформлении самых популярных операционных систем: Android, iOS, Windows и MacOS. Как и почему они приходят к контурным иконкам для лучшего сочетания с основным шрифтом, учёту темы оформления пользователя, современным цветовым палитрам вроде LCH, более мягким скруглениям, адаптивной типографике и другим деталям.

Лично мне было печально видеть восходящую моду на OOUX (объектно-ориентированный UX) — сдули пыль с доисторического подхода к проектированию интерфейсов (aka «диаграмма классов» из UML). Одно из главных золотых правил профессии — идти от потребностей пользователей и их ментальной модели. А не того, как устроена внутрянка системы. Она сама должна меняться и перекраиваться в зависимости от того, как лучше организовать сценарии использования и навигацию между ними. И выступать требованием к структуре объектов, но ни в коем случае не быть ограниченной ими.

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

Другие подведения итогов:
Лучшие обложки книг от AIGA
— Заметные инновации от Fast Company и Popular Science
Яркие проекты на Readymag
Самые популярные эмоджи

Про 2022 год материалов побольше:

1. Общедизайнерские тренды выделяют 99 Designs, Webflow, Graphic Mama и Depositphotos.

2. Pantone и Shutterstock объявляют цвета: оба сходятся на фиолетовом.

3. Профессиональные от InVision.

4. Общие от Fjord.

5. Технологические от Gartner: кривая хайпа, стратегические и радар влияния.

Дико рад тому, что почти не встречал избитой банальщины вроде «анимации», «крупной типографики» или «фоновых видео», которая преследовала жанр обзоров трендов много-много лет. Я, конечно, обычно оставляю только самые адекватные материалы и оно точно будет всплывать в дешманских. Но это в любом случае приятно.

Меньше чем через месяц пройдёт выставка CES 2022, где всегда показывают кучу технологических живчиков. Так что год стартует с хорошего вброса свежих идей и точно будет прирастать ими. А я точно расквитаюсь с книгой и курсом, так что смогу снова детально следить за этим скоростным поездом.

Для сравнения: что обещали на 2021, 2020, 2019 и 2018 год.

#trends
Последняя в этом году мини-подборка собирает свежие материалы о паттернах и лучших практиках:

1. NN/g: Структурированная подборка своих статей об описании дизайн-паттернов.

2. Sam Seely: Памятка по проектированию горячих клавиш в интерфейса. Как выбирать сочетания, как обучать пользователя, как избегать конфликтов.

3. Gareth Ford Williams: Большая памятка по грамотной вёрстке субтитров для фильмов и другого видео-контента.

4. Niels van Berkel, Mikael Skov и Jesper Kjeldskov: Три типа взаимодействия с интеллектуальными системами.

5. Avinash Bussa: Подробная памятка по дизайну интерфейса умных часов. Перевод.

6. Peter Ramsey: Анализ интерфейса регистрации в платёжном сервисе Cash App.

7. Creative Navy: Короткие советы по снижению физической и ментальной нагрузки на кассиров.

8. Graham F. Scott: Переосмысление информационной архитектуры сайта для разработчиков Shopify.

9. NN/g: Редизайн интранета компании Johnson & Johnson.

10. Небольшая коллекция хороших интерфейсных паттернов.

#patterns
Собрал дайджест продуктового дизайна за декабрь 2021. Тренды 2022 года (вторая пачка), тестирование дизайн-систем, голосовые интерфейсы, ключевые исторические публикации, управление жестами в машинах, энциклопедия компонентов, алгоритмический дизайн, новые инструменты дизайна и ещё полсотни свежих статей, инструментов, паттернов, кейсов, трендов и исторических рассказов.
 
Напомню, что его можно получать разными способами:
vc.ru
Facebook
ВКонтакте
RSS
Ежегодная выставка технологических чудес и экспериментов CES 2022 в этом году прошла 5-7 января в Лас-Вегасе и интернете. Обычно здесь показывают кучу прорывной крутячки. Правда, из-за дефицита чипов многие крупные компании пропустили участие даже в онлайне. Но кой-чо занятное было.

Последние годы было много разной интересной дичи с гибкими экранами. Но не в этот раз — разве что 17" планшет от ASUS с кучей степеней свободы. Ну и ещё один эксперимент со вторым экраном у клавиатуры ноутбука у Lenovo.

Компьютеры
1. Стандарт Evo PCs от Intel будет продвигать гибкие экраны и интеграцию Windows с iPhone

2. Google будет улучшать интеграцию Windows и Android

3. Лютый концепт рабочей станции от Razer

4. Чудеса гибкости в 55" мониторе Samsung

5. Атипичный почти квадратный монитор LG

6. Домашний игровой сервер Alienware
 
Умные очки
1. Новые кино-очки без телевизора Nxtwear Air

2. Распознающие текст и лица очки MyEye Pro от OrCam помогают людям с проблемным зрением

Носимые устройства
1. Био-сенсоры Abbott

2. Razer всё-таки сделали свою киберпанковскую маску с усилителем голоса. Это было непросто.

Авто
1. BMW с кузовом изменяемого цвета

2. Концепт-кар Cadillac с огромным экраном

3. Amazon будет встраивать свои экраны на базе Fire TV в машины. Например, огромный для задних сидений BMW.

ТВ
1. Пульт Samsung заряжается от радиоволн

2. Samsung позволит смотреть и покупать NFT через телик. Ну и встроит игровой стриминг Stadia и GeForce Now.

3. Куча изогнутых концепций от LG

4. Проектор Samsung с автофокусом и подстройкой

Умный дом
1. Весы Withings как швейцарский нож

2. Кран Moen с управлением жестами

3. Много ванно-банных приблуд от Kohler

4. Домашний робот-помощник Labrador Retriever

5. Экспериментальные зубные щётки Oral-B и Y-Brush

Разная разорвишка
1. Массажёр для тех, кто много играет

2. Окрашиватель волос L’Oréal

3. Принтер для временных цветных татуировок Prinker M

4. Умная гитара Samsung

5. Мышка/флешка XPG

Не знаю, будет ли с такими показателями весенняя Mobile World Congress, но, мало ли.
 
#ces #trends #events
Первая мини-подборка 2022 года — про пользовательские исследования:
 
1. NN/g: Структурированная подборка своих статей о ResearchOps.
 
2. Nacho Parietti: Три модели описания поведения пользователей, которые сделают MVP более успешным. Они опираются на связь поведения и ценности для людей. Часть 2 и 3.

3. Meta: Метод количественного исследования концепций на ранней стадии, когда конкретной визуализации нет (да и она только вредит).

4. NN/g: Особенности контекстных методов пользовательских исследований — полевых и дневниковых.
 
5. Meta: Количественные дневниковые исследования.
 
6. Контур: Когнитивные искажения у команды, которые важно отловить в процессе пользовательских исследований.
 
7. Jim Lewis и Jeff Sauro: Анализируют формы опросов, где пользователь должен точно выбрать «да» или «нет» в списке вопросов. Это в целом помогает повысить процент ответов, хотя усложняет интерфейс.
 
8. IBM: Как продать agile-команде важность предварительных исследований. Как известно, они часто не вписываются в чистый agile-процесс.
 
9. Jim Lewis и Jeff Sauro: Разница между опросниками в виде шкалы из радио-кнопок и ползунка. Подтвердилось, что радио-кнопки проще и быстрее.
 
Через месяц вернусь к формату 2 постов в неделю, а пока — сколько смогу.
 
#research
👍2
Свежая мини-подборочка про дизайн-системы:

1. Подробная методичка Storybook по тестированию компонентов.

Другие новости Storybook
— Готовят к запуску энциклопедию компонентов — она агрегирует дизайн-системы разных компаний на фреймворке. Можно посмотреть кучу реальных примеров для каждой ситуации.

— Разные способы настройки для описания принципов дизайна и других важных разделов помимо самих компонентов. Описание компонентов можно также встроить в любой другой живой гайдлайн.

— Обзор инструментов дизайна, которые работают в связке.

2. Open Props: Фреймворк для токенов.

3. Dan Mall: Особая ценность дизайн-систем при изменениях в компании — ребрендинг, слияние и другие масштабные обновления.

4. Brad Frost: Интервью, в котором он размышляет на тему того, что будет после атомарного дизайна.

5. Doctolib: Переделка цветовой палитры.

6. Дизайн-система компании Bank Soft System. Шаблоны в Figma и страница на сайте клуба отечественных дизайн-систем.

7. Shopify: Размышления на тему гибкости и роли дизайн-систем.

8. Brad Frost: Должны ли дизайн-системы включать информацию помимо интерфейсов.

9. Wanda: Дизайн-система сервиса Wonderflow.

10. Tamagui: Фреймворк для создания дизайн-систем на React Native.

#designsystems
Курирую UX-Марафон №27 по дизайн-менеджменту 10 февраля. Это самая крупная онлайн-конференция по дизайну интерфейсов от Александры Постоваловой.
 
Для третьего коллаба сфокусировались на разных ситуациях в жизни дизайн-менеджера — приход опытного человека в новую компанию, становление дизайн-менеджером и возвращение обратно в эксперты:
 
1. Юрий Ветров (Райффайзен Банк).
 
2. Валера Назаров (Aviasales).
 
3. Даша Егорова (МТС).
 
4. Егор Гилёв (Wrike).
 
5. Алексей Кандауров (Циан).
 
6. Александр Кудымов (Acronis).
 
7. Станислав Игнатьев (X5 Retail Group).
 
8. Артур Касимов (Ситимобил).
 
Я сделаю небольшую вводную вначале с обзором ситуаций на старте работы дизайн-менеджера.
 
Начало в 11:00. Участники получат видео-запись, презентации и другие полезные материалы.
 
#designmanagement
Запустил обновлённый сайт книги и курса «Паттерны дизайн-менеджмента». Точнее, всей одноимённой инициативы — это ещё и:
Серия мини-конференций
Каталог и исследования продуктовых дизайн-команд
Инструменты
 
В прошлом году сделал огромный рывок, чтобы полностью перезаписать курс на русском и сделать пилот на английском, закончить все материалы для книги (редакционная вычитка и пара сотен диаграмм), ну и объединить всё это единой стилистикой и сводным сайтом. Наконец-то готово почти всё (жду первый свёрстанный вариант книги от издательства).
 
Отдельно отмечу несколько вещей:
Обновлённая статья про карту компетенций с шаблонами в Google Sheets и Vectorly. Один из моих главных хитов теперь живёт здесь.
Мини-конференция вместе с UX-Марафоном 10 февраля
— Свежее исследование дизайн-команд, про которое подробно расскажу в понедельник. Ну и динамика рейтинга за разные годы для каждой из команд.
 
Я ещё отвешаю пару тонн нижайших поклонов за курс и книгу. Но пока поблагодарю за дизайн Колю Иванова — его концепция визуального стиля стала основой для всего. И агентство Pragmatica Жени Ярового — они сделали титаническую работу, связав общим дизайном сайт, курс, книгу, презентации и все остальные материалы. Я давний фанат Webflow и первую версию сайта собирал сам пару лет назад, но ребята подняли его на новый уровень.
 
Отдельный респект команде Pragmatica:
— Лера Вялкова и Маша Пьянкова (управление проектом)
— Герман Жевмерев, Евгений Яровой, Илья Федоренко (концепция дизайна)
— Алина Елисеева и Дима Ануфриев (диаграммы)
— Мария Арсенова (отрисовка страниц и адаптивов)
— Алла Щетинина (подхватила дизайн всего в последний момент и довела до конца)
 
Дальше сайт будет развиваться и пополняться, но база вышла уже годная. Английская версия в простом варианте, но также будет постепенно обрастать мясом. На очереди — переосмысление дайджеста, но сначала надо выдохнуть.