Yury Vetrov
2 318

Продуктовый дизайн: 20 самых важных материалов за апрель

Дайджест руководителя портальной дизайн-команды Mail.Ru Group Юрия Ветрова.

Поделиться

В избранное

В избранном

1. Дизайн «Альфа-Банка»

«Альфа-Банк» оформил свою дизайн-систему в отдельный сайт (до этого была просто библиотека на GitHub). Есть как компоненты в коде, так и описание принципов дизайна, а также шаблоны в Sketch ― один из лучших примеров на нашем рынке, да ещё и удачно сопровождённый их новым стилем иллюстраций.

2. Our Exact Customer Research Process for Userlist.io

Отличный кейс исследования по методике Jobs to Be Done для запуска сервиса Userlist от Клэр Суэллентроп (Claire Suellentrop). Пошагово рассказано о процессе исследования и сделанных выводах по функциональности и интерфейсу продукта.

3. In Defense of Design Thinking, Which Is Terrible

Здоровый взгляд Хой Винь (Khoi Vinh) на никак не умолкающую дискуссию о том, полезен ли для профессии лейбл «дизайн-мышление» или это пустой маркетинговый баззворд. Даже если кто-то использует его неправильно, это мощный инструмент для того, чтобы сделать дизайн более массовым явлением (пусть даже кто-то поначалу будет делать это неправильно).

То же самое сейчас происходит с программированием — огромное количество курсов для детей и просто начинающих наверняка породит массу дрянного кода, но это решаемая проблема. Он также полемизирует с Наташей Джен (Natasha Jen) из Pentagram, чьё одиозное выступление в 2017 году — чистейший кликбейт и непонимание роли дизайнера в современных продуктах и мире в целом.

Ричард Бэнфилд (Richard Banfield) — ещё один дизайнер, которого утомил кликбейт Наташи Джен. Он разбирает её псевдокритику.

4. DSCONF 2018

Конференция по дизайн-системам DSCONF прошла 14-15 марта в Хельсинки. Опубликованы видео выступлений с неё.

5. Scrolling and Attention

Свежие выкладки Терезы Фессенден (Therese Fessenden) из Nielsen/Norman Group о том, насколько пользователи готовы прокручивать страницы. Хотя основная часть всё ещё не опускается ниже первого экрана, это число уменьшилось с 80% в 2010 году до 57% сейчас.

6. Книги о дизайн-системах

Актуализировал прошлогоднюю заметку про книги о дизайн-системах. Мне было интересно разобраться в первоисточниках, поэтому в прошлом году я засел за чтение всего, что выходило на тему паттернов, компонентов и модульности. Идеальной книги нет, но часть из них показывает очень правильные точки зрения.

7. Новости инструментов дизайна

  • Figma: примеры свежих экспериментов по использованию API. Некоторые из них: официальный конвертер макетов в код для React на GitHub (как это устроено и что он умеет) и сторонний Pagedraw; GitHub экспортирует библиотеки иконок в продукт.
  • Sketch the Ripper разбирает макеты Sketch в онлайне. Плагины: Stackswell для адаптивных макетов. Статьи: Мэтью Талеби (Matthew Talebi) описывает более-менее здоровый процесс работы с шаблонами и перечисляет разные способы его распространения.
  • InVision: купила Wake, который показывает текущие макеты дизайнеров в команде. А ещё у них были крутейшие интервью с дизайн-командами, так что и Design Genome Project перепадёт.
  • Framer: появилась работа с 3D-объектами и их анимация. Это востребованный визуальный стиль, который делает продукты бодрее.
  • Studio: инструмент вышел из беты.
  • Flawless: появилась возможность сравнивать макеты с реализацией приложения на iOS (в эмуляторе).
  • Visual Inspector: плагин для Chrome позволяет ковырять стиль сайтов в более наглядном виде, чем стандартный инспектор кода. Изменения можно обсуждать с коллегами.
  • Solis: приложение для Macbook облегчает вёрстку адаптивных сайтов. Его можно подключить к любому редактору кода и получить гибкий и мгновенный предпросмотр даже для изменений в файлах препроцессоров.
  • Lonely Page: ещё один конструктор одностраничников.
  • Sheet2Site: генератор простых сайтов из таблиц в Google Sheets.

8. Creating Themeable Design Systems

Брэд Фрост (Brad Frost) описывает принцип создания тем оформления в дизайн-системах по всем модным канонам ― токены, единая архитектура элементов интерфейса.

9. Banner Blindness Revisited — Users Dodge Ads on Mobile and Desktop

Кара Пернис (Kara Pernice) из Nielsen/Norman Group описывает знакомые и свежие выкладки из исследований, посвящённых баннерной слепоте.

10. Emotional Intelligence Has 12 Elements. Which Do You Need to Work On?

Дэниел Голман (Daniel Goleman) и Ричард Бояцис (Richard E. Boyatzis) предлагают отличную модель для описания эмоционального интеллекта по 12 характеристикам: самоанализ, самоконтроль, социальный анализ и управление взаимоотношениями. На основе неё удобно оценивать базовые навыки специалиста в команде.

11. «Как мы разрабатывали стиль корпоративной иллюстрации "Лаборатории Касперского"»

Хороший рассказ студии «Мыслеформа» о создании гайдлайнов иллюстраций для «Лаборатории Касперского». Разбор стилеобразующих элементов и вариаций по исполнению.

12. How to Assess Brand Affinity & Sentiment

Джефф Сауро (Jeff Sauro) показывает, как измерить отношение пользователей к бренду. Он приводит пример оценки для пары десятков известных компаний.

13. The Inside Story of Reddit’s Redesign

Рассказ о редизайне Reddit, который не менялся с 2008 года. В такой ситуации опасно делать резкие шаги ― важно начать процесс обновления, а после этого сделать его непрерывным. Есть официальный анонс (выкатываться он будет постепенно). На очереди Craigslist.

14. Hardening the «soft» skills

Лиа Гарвин (Lia Garvin) из Google даёт советы по прокачке soft skills в команде. Его коллега Хардик Пандья (Hardik Pandya) сравнительно недавно попал в компанию и описал свой опыт интеграции в неё. Получилась хорошая памятка по профессиональной гигиене и командному взаимодействию для любого специалиста.

15. How we structure (some) UX teams at Shopify

Алёна Маккензи (Alaine Mackenzie) из Shopify рассказывает о текущей структуре дизайн-команд в компании и том, почему она изменилась за последние годы.

16. Design System Fundamentals

Глава дизайн-системы Microsoft Fluent Джо Питт (Joey Pitt) рассказывает о принципах работы её команды. Как строится цикл обновлений, как они завязаны на версии Windows.

17. UX research findings ― Distinguishing base hits from home runs

Отличная статья Пола Макинерни (Paul McInerney) из IBM о том, как и в каких ситуациях пользовательские исследования корректируют планы продуктовых команд.

18. Perception Engines

Том Уайт (Tom White) научился генерировать человекоподобные абстрактные иллюстрации с помощью алгоритма — он скармливает ему обучающую выборку, а затем подбирает относительно узнаваемое исполнение. Проект сделан в рамках инициативы Google Artists and Machine Learning, у неё есть блог.

19. Академия AIC

AIC запустила академию для начинающих дизайнеров с бесплатной стажировкой. В свежей статье Сергей Попков сравнивает плюсы и минусы найма сильного дизайнера и прокачки начинающего с нуля. Он рассказывает о системе развития стажёров в AIC и Skillbox. Кстати, в последних числах апреля AIC объединилась с Лабораторией Артёма Геллера — они сфокусируются на работе над государственными сайтами.

20. Quantitative User-Research Methodologies: An Overview

Сравнительная таблица методов количественных пользовательских исследований от Кейт Мейер (Kate Meyer) из Nielsen/Norman Group.

Читайте полную версию дайджеста в моём блоге. В нём, как обычно, много новых материалов по дизайну для Apple Watch, Android Wear, Material Design, расширений для Sketch, свежих скриптов и ещё тонна всего. За свежими ссылками также можно следить в группе на Facebook, сообществе во «ВКонтакте» или канале Telegram — спасибо всем, кто помогает наполнять её. Вы также можете получать свежие обзоры по почте.

#дизайн

{ "author_name": "Yury Vetrov", "author_type": "self", "tags": ["\u0434\u0438\u0437\u0430\u0439\u043d"], "comments": 4, "likes": 14, "favorites": 17, "is_advertisement": false, "section_name": "default", "id": "37567", "is_wide": "" }
{ "is_needs_advanced_access": false }

Комментарии Комм.

Популярные

По порядку

0

Прямой эфир

Подписаться на push-уведомления
[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "create", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "create", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } } ]