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

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

Уже семь лет Юрий Ветров публикует в своём блоге регулярные обзоры свежих статей по теме интерфейсов, новых инструментов и коллекций паттернов, интересных кейсов и исторических рассказов. Из лент нескольких сотен тематических подписок он отбирает примерно 5% стоящих публикаций, которыми интересно поделиться среди экспертов. Специально для vc.ru Юрий Ветров собрал выжимку из 20 самых интересных ссылок апреля.

Creating Usability with Motion — The UX in Motion Manifesto

Одна из лучших статей на тему интерфейсной анимации от Иссара Вилленскомера. Он говорит о том, что пора забыть принципы Диснея, и предлагает свою классификацию из 12 принципов (перевод на русском). Иссара также учит анализировать интерфейсную анимацию на примере достаточно сложного мобильного приложения и показывает, как выделить использованные приёмы.

WPO Stats

Сайт-коллекция историй о том, как оптимизация производительности работы сайта дала положительный эффект для бизнеса.

137e59c3f8a65c.png

Illustrating a more human brand, part 1

Золотая статья Майкла Джетера, в которой он во всех подробностях расписал историю развития стиля иллюстраций в Dropbox. Он рассказывает, как и какие задачи решал каждый из подходов на конкретных этапах жизненного цикла компании. Похожую проблему решали в Creative Market.

UX-стратегия на практике, часть 5: дизайн с выхлопом

Пятая часть серии о трансформации роли дизайнеров — как перевести боль пользователей на язык бизнеса. Она состоит из трёх этапов:

  • Помощь в поиске и решении проблем бизнеса и пользователей.
  • Оценка максимального выхлопа при решении проблем.
  • Переход от решения проблем к инновациям.

В шестой части описан пошаговый план внедрения UX-стратегии. Мало совершить подвиг в виде удачного редизайна устаревшего сервиса — нужно обеспечить повторяемость хороших результатов. Поэтому нужно думать о перестройке социотехнической системы, а не просто об обновлении нескольких экранов. Причина плохих продуктов — это плохая машина, которая их производит, так что чинить нужно в первую очередь её.

Notification System Design (99+)

Дизайнер Quora Генри Модисетт привёл дельные мысли о том, как должна работать система уведомлений в продукте. Он разобрал разные категории пользователей и ситуации, в которых они работают, и дал советы по метрикам оценки эффективности уведомлений.

f3df3b26f43bfb.png

PURE — Practical Usability Rating by Experts

Джефф Сауро и Кристиан Рорер создали интегральный метод экспертной оценки юзабилити PURE. Он хорошо работает для поиска и ранжирования наиболее явных проблем в тех продуктах, где проведение юзабилити-тестирования затруднено. Очень здорово, что он привязан к конкретным сценариям, что помогает лучше оценить их критичность. Статья Джеффа Сауро.

b17986291669de.png

Design Sprint Kit

Google запустила отдельный сайт для методологии Design Sprints. Он детально описывает процесс, публикует шаблоны и истории успешного применения. Анонс.

NomNom — Power to product teams

Сервис помогает работать с обратной связью от пользователей. Он собирает запросы и отзывы по многим каналам (официальные каналы поддержки, социальные сети, Intercom и тому подобные), после чего агрегирует связанные предложения, чтобы понять их ценность для продукта. Основной посыл очень близок к легендарной базе знаний Mailchimp.

93fe5704712051.png

Lists

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

68d2409d95f1ad.png

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

Вышла одна из самых обсуждаемых версий Sketch 43. Обновлённый формат файла потребовал отказаться от поддержки старых плагинов. Питер Новелль разобрал новые возможности по экспорту границ SVG-объектов.​

Новые плагины для Sketch: Batch Create Symbols помогает создать сразу несколько символов из выделенных объектов. Zeroheight помогает организовать совместную работу с общими символами. А также: Bootstrap-подобная сетка внутри любого блока, автоматическое раскладывание оригиналов символов на странице по алфавиту, переименование копии символа в макете, которые стали называться не так, как оригинал, экспорт макетов почтовых рассылок в HTML, создание графиков sparkline, разбор структуры папок и слоёв, сбор нескольких слоёв вместе, замена одного цвета на другой, эмулятор нарушений цветового восприятия, генератор популярных паттернов на фоне. А также обсуждение на Designer News, в котором приведено большое количество полезных плагинов.

39d8dd957ea9ac.png
  • Material Design Color Tool для выбора цветовой палитры в Android-приложениях от команды Material Design. Можно посмотреть, как цвет выглядит на условном экране и проверить его на доступность.
  • Figma анонсировала платную подписку. Над небольшими проектами можно работать бесплатно.
  • У Adobe XD вышли мартовское и апрельское обновления бета-версии. Упростилось копирование элементов из Photoshop и Illustrator, улучшилась работа с комментариями, добавлены базовые функции работы с объектами и продолжается синхронизация версий для Windows и macOS.
  • У Framer вышла третья версия инструмента с переработанным интерфейсом. Главное изменение — больше нет стандартного экрана с двумя областями, предпросмотр прототипа происходит в отдельном окошке.

  • У ​Gravit вышла третья версия инструмента.
  • Вышел новый плагин для Slack от FiftyThree, который помогает обсуждать макеты.
  • Module Framework запустили конструктор сайтов на базе шаблонов от Great Simple Studio.
  • Sizzy позволяет проверить состояния адаптивности сайта на разных популярных размерах экрана (работает только для полностью адаптивных сайтов).

Is Usability a Science

Очень интересная дискуссия Тодда Зазеленчука, Дэвида Трэвиса и Филиппа Ходжсона из Userfocus о том, является ли юзабилити наукой. И да, и нет: с одной стороны, UX-исследования следуют принципам научных методов; с другой — редко выражаются в виде теорий или вносят вклад в общепрофессиональную базу знаний.

Luke Wroblewski — Mobile in The Future

Запись трёхчасового выступления Люка Вроблевски на тему современного дизайна мобильных интерфейсов.

A History of Patterns in User Experience Design

Шикарнейшая хронология книг, публикаций и библиотек, посвящённых паттернам от Эрин Малоун, приложившей руку к легендарной Yahoo! UI Patterns. С начала года я прочитал большинство из них и составил список рекомендаций.

17aad37d539f8d.jpg

Другие новости дизайн-систем:

  • Shopify Polaris — новый лидер в списке лучших дизайн-систем.
  • React Sketch.app — Airbnb довели до ума и опубликовали своё экспериментальное решение по экспорту компонентов из дизайн-системы на React в Sketch. По ссылке рассказ команды о том, как и зачем сделали эту библиотеку.
  • Натан Кёртис описал организационные модели команд, работающих над дизайн-системой. Он показывает идеальный вариант и показывает примеры из своего опыта (с упоминанием проблем каждого).
4efb633ff5c146.png
  • Дэн Мэлл описал свой подход к выбору пилотного проекта для внедрения дизайн-системы — это матрица, в которой потенциальные кандидаты ранжируются по нескольким параметрам.​

Designing accessible products

Хороший набор конкретных интерфейсных приёмов по обеспечению доступности интерфейсов при работе с клавиатуры от Адхитьи Кумар. В начале достаточно стандартный обзор, со второй половины идут паттерны.

Designing User Interfaces for an Aging Population

В марте издательство Morgan Kaufmann выпустило книгу Джеффа Джонсона и Кейт Финн «Designing User Interfaces for an Aging Population». UXmatters опубликовал первую главу из неё.

Designing at leverage points

Глубокий и системный взгляд Адама Сейнта из Shopify на построение любых дизайн-процессов через организацию многослойных систем, где каждый следующий уровень базируется на предыдущем. Нирвана для тех, кто любит более комплексные модели описания процессов, чем просто последовательность шагов.

d69ddbce821c46.png

Shaping Our Design Principles

Руководитель дизайн-команды Creative Market Геррен Ламсон описал принципы дизайна, которые они создали для продуктов и самой команды. Есть детали и самого процесса создания. Продолжение.

714cf5d494dac9.jpg

The MVP is dead. Long live the RAT

Рик Хайэм из Skyscanner поднял вопрос о том, что концепция MVP потеряла изначальный смысл — вместо быстрой проверки продуктовой гипотезы команды всё чаще пытаются «причёсывать» раннюю версию. Он предлагает использовать подход и термин RAT (Riskiest Assumption Tests), который возвращает изначальный смысл.

0e7d149cc49725.png

A Brief History of Design at Microsoft

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

462b323f14bfbf.jpg

Другие статьи об истории интерфейсов: Алан Кей рассказал о том, в чём был секрет успешности исследовательской лаборатории Xerox PARC, а Лешек Завадски собрал старые версии сайтов известных продуктов, чтобы понять, как менялось их УТП.

Ethics for Designers

Сайт, посвящённый вопросам этики для дизайнеров. Он собирает инструменты и статьи, а также описывает важные навыки.

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

©  vc.ru