Дайджест продуктового дизайна

Только я собрался собрать мини-подборку о дизайн-системах, как Figma провела мини-конференцию Framework на тему 16 апреля (и сделает ещё пару доп.событий 18 и 23 числа).   Во-первых, запустили много фешенебельных новых функций: шрифтовые и градиентные токены, аналитика использования библиотек. И, самое главное — родная связка с реальным кодом компонентов через Code Connect, благодаря которой разработчики могут получить его прямо из макета (причём это не мусорная автогенерация).   Во-вторых, выпустили серию кейсов о командах дизайн-систем:   — Компонентный спринт в Washington Post. Дизайнер и разработчик в паре про прорабатывают все вопросы в течение 10 дней.   — Как переезжали на Figma в Carvana и Alaska Airlines.   Была ещё пара общепроцессных статей, но они водянистые. Зато неплохой обзор плагинов для связки кода и дизайна в Dev Mode.   Бонус — несколько статей о новых возможностях переменных в CSS: 1. Michelle Barker: Относительно новая функция color-mix(), которая помогает делать вариации цветов в токенах.   2. Bramus van Damme: Функция light-dark(), которая позволяет задавать цвета для обычной и тёмной темы оформления.   3. Lea Verou: Предлагает отличную идею групп для переменных. Они могли бы упростить описание шрифтовых наборов, цветовых градаций и других связанных токенов.   #designsystems

Шепотка новых материалов о пользовательских исследованиях:   1. NN/g" Мощная детальная памятка по проведению дневниковых исследований. Виды, подготовка, проведение, анализ данных.   2. Chris Chapman: Метод оценки отношения пользователей к цене Van Westendorp.   3. Jeff Sauro и Jim Lewis: Сравнивают возможные подходы к выборке респондентов для опросов. 4. Dovetail: Сервис для ведения базы знаний и инсайтов анонсировал прорву новых возможностей по автоматизированной обработке результатов исследований, выделению тем, обработке видео и т.п. 5. Chris Chapman: Точной итоговой оценки у опросников зачастую не существует. Попытка получить её — самообман, поэтому нужно воспринимать их как поддержку принятия решений.   6. IBM: Советы по подготовке, проведению и использованию результатов исследований, с учётом ожиданий ключевых участников проекта. 7. Maze: Опросили 1200 участников продуктовых команд на тему состояния рынка пользовательских исследований. Каких-то откровений нет, но вдруг пригодится.   #research

Чтобы пакет с пакетами про алгоритмический дизайн не успел переполниться, закидываю его сюда:   Relume: Грамотная концепция конструктора сайтов на базе алгоритмического дизайна. Он помогает составить карту сайта, сделать wireframes и собрать стиль на основе мудбордов. Всё это можно экспортировать в Webflow или Figma (они сделали тонну компонентов для типовых ситуаций).   NN/g: Помощь пользователям-новичкам при работе с алгоритмическими чат-ботами. Они провели небольшое исследование китайских сервисов и описала типичные проблемы людей, которые сталкиваются с таким впервые.   OpenAI: Попросили семь художников и режиссёров попробовать их новую модель Sora для генерации видео. Получилась крутая демонстрация возможностей.   Google AI Studio: Общедоступная версия языковой модели Gemini 1.5 Pro через новый, частично визуальный интерфейс.   Midjourney Character Reference: Теперь можно сохранить черты лица или детали одежды персонажа в разных генерациях.   Vincent Koc: Фреймворк «компас генеративного ИИ». Он помогает проектировать интерфейсы таких продуктов. MeasuringU: Можно ли использовать ChatGPT для тестирования дерева в информационной архитектуре? Успешность выполнения задач сильно завышена, а вот простоту решения задачи предполагает неплохо.   Jakob Nielsen написал спорную статью об автоматической поддержке accessibility с помощью ИИ. Это вызвало огромную волну критики в проф.сообществе и Adrian Roselli собрал ссылки на все такие статьи.   Maze: Сервис для проведения пользовательских исследований добавляет алгоритмические функции. Он подскажет как грамотно сформулировать вопрос для респондента, задать догоняющие вопросы, анализировать общие темы и в целом организовывать проекты.   Devin: Платформа для разработчиков, которая мощно развивает концепцию копилотов. Она не только пишет код и исправляет баги, но и помогает разобраться в незнакомых технологиях, выкатывать на прод и много чего ещё.   Adobe Acrobat: Дизайн интерфейса Generative summary. Их принципы алгоритмического дизайна.   Victoria Turk: Анализирует современные инструменты генерации изображений по текстовому запросу и показывает на конкретных примерах, насколько они полны клишированных стереотипов.   Leonardo AI: Генератор фото и иллюстраций по текстовому описанию.   Blaze: Алгоритмический генератор текстов для блогов, социальных сетей и рекламы.   Jakob Nielsen: Приводит несколько исторических аналогий на тему страха «использующие ИИ-инструменты отупеют». Это далеко не всегда так.   Everypixel: Глоссарий самых популярных терминов, использующихся на текущем этапе эволюции ИИ.   Adobe Project Music GenAI Control: Генератор музыки по текстовому описанию. Можно докрутить готовую композицию по скорости, экспрессивности и т.п.   Arcads: Генератор вертикальных рекламных видео с вымышленными актёрами. На входе – ваш сценарий.   HeyGen Avatar in Motion 1.0: Генератор вертикальных рекламных видео с вымышленными актёрами в движении.   Grok-1: xAI Илона Маска опубликовала исходный код своей ИИ-платформы Grok-1 на GitHub.   YandexGPT 3: Новая версия языковой модели Яндекса. Также в Yandex Cloud появился API YandexArt для генерации фото и иллюстраций.   Яндекс Почта: Научилась пересказывать важные письма за последнюю неделю с помощью YandexGPT.   Intuit Assist: Алгоритмический помощник подсказывает, как управлять финансами.   #ai #algorithms

Дайджест продуктового дизайна за март 2024. Менеджмент дизайн-систем, как спроектировать плагин для браузера, страницы 404, исследование отечественных UX-писателей, «сочные» дизайн-решения, алгоритмический дизайн, дневниковые исследования и ещё полсотни свежих статей, инструментов, паттернов, кейсов, трендов и исторических рассказов.   Напомню, что его можно получать разными способами: — Telegram — vc.ru — DSGNERS — ВКонтакте — RSS

И снова прорва свежих ссылок об интерфейсных паттернах и лучших практиках:   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. Societe Generale: Как распознать фейковый MVP на ранней стадии — это зачастую пустая трата времени команды. Конкретные методы по выруливанию ситуации. 2. Figma: Сессия регулярной критики текущих задач для разработчиков. Их шаблон в FigJam. 3. Atlassian: Памятка для коммуникации внутри больших команд, которая повышает прозрачность и снижает нагрузку на всех. 4. Robert Fabricant: Размышления на тему «коррекции рынка» в отношении дизайн-менеджеров высокого уровня. В целом это понятная ситуация на фоне массовых сокращений и окончания конфетно-букетного периода. Хотя выводы и способы решения спорные — они не адресуют реальные проблемы. А они в том, что у компаний разные потребности в дизайне, разная зрелость и половинчатые изменения. 5. GoPractice: Советы по выбору метрики «полярной звезды». 6. Wise: Принципы дизайн-команды. Они связаны с картой навыков и их развития.   #management

Давненько не было мини-выпусков о пользовательских исследованиях. Вот вам мясной по уровню сложности:   1. Jeff Sauro и Jim Lewis: Разбираются, не устарел ли стандартизированный опросник SUS, которому уже четыре десятка лет (он был создан для конкретного проекта). В целом он всё ещё работает, хотя есть методы попроще.   2. Stephen Schneider, Serena Hillman, Paula Bach и Guoping Ma: Упрощённая версия SUS для корпоративных интерфейсов. Они сократили опросник до 5 вопросов и назвали его ESUS (Enterprise SUS).   3. Chase S. Boothe, Lesley Strawderman, Reuben F. Burch V, Brian K. Smith, Cindy L. Bethel и Kate Holmes: Вариация UEQ-G для стандартизированного опросника UEQ (User Experience Questionnaire). Он состоит из 26 вопросов про ощущения от продукта.   4. Jeff Sauro и Jim Lewis: Нюансы поиска респондентов для опросов. 5. Vandhana Bhaskaran: Формирование доверия в цифровых продуктах. Она ссылается на несколько исследований по теме.   6. Анна Лопарёва: Как найти в компании коллег, которые не профессиональные исследователи, но пытаются проводить такие проекты. И чем можно помочь им.   7. Alex Cottrell: Опыт использования Jobs to Be Done в страховой компании Zurich. 8. Steve Bromley: Советы игровым исследователям о ситуациях, когда попросили провести тест в последний момент или не внесли изменения в продукт после исследования. Это полезно и вне игровой разработки.   #research

Отложка неотложных новостей и свежих материалов про дизайн-системы:   1. Nathan Curtis: Новая серия статей посвящена смене поколения дизайн-системы. Первая часть даёт определение, вторая говорит о планировании, третья о выкатке, четвёртая о именовании и последняя о новом цикле. 2. Kevin Coyle: Собрал для Brad Frost примеры использования алгоритмических инструментов в дизайн-системах. Код компонентов, тестирование, документация. Его презентация на Smashing Conf. 3. Storybook 8 вышел из беты. Улучшенная поддержка мобильных, автоматизированные визуальные тесты и в целом улучшенные инструменты тестирования, серверные компоненты, отвязка привязки к React для других фреймворков. Также появилась бета-версия плагина Visual Tests для визуального тестирования компонентов. 4. Павел Киселёв: Подход к созданию дизайн-системы в Figma с гибкой тематизацией для разных брендов. Он сделал плагин Source Foundation, который помогает в этом, а также приложил кучу примеров. 5. VK для бизнеса: Генератор токенов и компонентов в коде на основе Figma. 6. Dave Rupert: Выделяет толковую мысль: настоящая ценность дизайн-системы проявляется в триггерные моменты. Он составил пример таких событий вроде обновления бренда. 7. Javier Cuello: Чеклист по дизайну и тестированию компонентов в Figma. 8. НЛМК: Дизайн-система металлургической компании. Есть компоненты в коде и Figma. 9. Supernova 2.0: Вышла вторая версия инструмента для описания дизайн-систем. Добавили совместную работу над документами и быстрый глобальный поиск.   #designsystems

Моя книга «Паттерны дизайн-менеджмента» снова в продаже. Первый тираж разлетелся за три недели, так что вышла заминка из-за подписания нового договора, исправления небольших косяков и всего такого. Изначальный план с Альпиной был напечатать пробник в 1000 штук и посмотреть на динамику, с которой они расходятся. Кажется, что идёт бодро для такой нишевой темы (даже заработал бедж «бестселлер»).   #books

Дайджест продуктового дизайна за февраль 2024. Эвристики, QR-коды, опросы, поиск на мобильных, дизайн-системы, алгоритмический дизайн, визуализация данных, accessibility и ещё полсотни свежих статей, инструментов, паттернов, кейсов, трендов и исторических рассказов.   Напомню, что его можно получать разными способами: — Telegram — vc.ru — DSGNERS — ВКонтакте — RSS