Pull to refresh
VK
Building the Internet

Дайджест продуктового дизайна, февраль 2017

Reading time11 min
Views7.4K
Уже семь лет я публикую регулярные обзоры свежих статей по теме интерфейсов, новых инструментов и коллекций паттернов, интересных кейсов и исторических рассказов. Из лент нескольких сотен тематических подписок отбирается примерно 5% стоящих публикаций, которыми интересно поделиться. Предыдущие материалы: апрель 2010-январь 2017.

Дайджест продуктового дизайна, февраль 2017


Паттерны и лучшие практики


Form Design for Complex Applications
Обзор паттернов отображения форм в сложных веб-приложениях от Andrew Coyle. Перевод.



Do responsive sites have to be so tall on mobile?
Kevin Vigneault из Viget пишет о том, что важно помнить и о высоте адаптивных сайтов. Часто простое расположение блоков друг под другом приводит к огромному количеству прокруток.



Есть ли стандартная иконка шаринга?


Baymard Institute

Гайдлайны платформ и компаний


Patterns ≠ Components
Nathan Curtis описывает разницу между паттернами и компонентами. В статье также хороший список книг и статей, повлиявших на развитие идеологии модульного дизайна.



В продолжение темы:



Design Principles Behind Great Products
Антон Бадашов из Rambler & Co проанализировал принципы дизайна известных веб-сервисов.



В продолжение темы:



Material Design
  • Teo Yu Siang разбирает проблемы в навигации Android. Очень многие навигационные элементы, включая сравнительно недавно добавленную нижнюю панель, не имеют текстовых подписей. Да, зачастую на экране нет места для этого, но тот же iOS использует подписи в нижней панели.


Android Wear


Понимание пользователя


Модели медиапотребления. Что люди читают, почему, когда и как (PDF)
Команда медиапроектов и UX-лаборатория Mail.Ru Group провели исследование того, как люди читают медиа. Это качественное, а не количественное исследование — они просто отвечают на вопрос «как бывает», собирают разные варианты поведения и изучают их глубоко. Нет задачи понять, насколько часто или типично это поведение, главное — всесторонне описать найденные кейсы. При этом количественные данные из сервиса аналитики Медиатор подтверждают выводы исследования.



Scott Belsky on the importance of your product’s first mile
Толковое интервью со Scott Belsky, создателем Behance и партнёром венчурного фонда Benchmark Capital. Первая половина общая, вторая раскрывает две его концепции развития продуктов — «первая миля», касающаяся onboarding, и этапность привлечения пользователей.



Jobs-to-be-Done


Speaking up for Experiences
Отличная презентация Stephen Anderson о том, чему дизайнеры интерфейсов могут научиться у игровых дизайнеров. Много полезных мыслей о том, как рассматривать взаимодействие пользователей с продуктом в более вовлекающем ключе.



Информационная архитектура, концептуальное проектирование, контент-стратегия


UCDtoolbox — Find and learn methods for UCD
Студенческий проект UCD Toolbox собирает методы проектирования интерфейсов в единую базу с инструментами подбора. Он полностью переработан и позволяет подбирать методы проектирования и исследований под конкретную ситуацию.



Five Models for Making Sense of Complex Systems
Christina Wodtke описывает разницу между mind maps, концептуальными картами, картами системы, ментальными и концептуальными моделями.

Проектирование и дизайн экранов интерфейса


Motion design handovers made easy
Paul van Oijen предлагает подход к спецификации интерфейсной анимации для передачи разработчикам. Он раскладывает основные трансформации с объектами и динамику их изменений. Частично эта задача может решаться плагинами для AfterEffects, которые экспортируют параметры анимации в JSON, но описанный в статье формат отлично подойдёт для дизайн-систем.



Getting Started With VR Interface Design
Sam Applebee и Alex Deruette из Kickpush показывают, как прототипировать интерфейсы виртуальной реальности в Sketch.



В продолжение темы:



Sketch



Craft


Figma


InVision


Adobe After Effects


Marvel


UID8 — UX Drawing App
Вышло новое приложение для создания скетчей интерфейсов на планшете, UID8. В отличие от более примитивных собратьев ориентируется на привычный процесс рисования на бумаге и поддерживает переходы между экранами.

Современные инструменты паблишинга


Современные редакционные CMS


Abstract


Avocode


Zeplin




Компромисс между дизайнером и разработчиком
Неплохая статья о передаче макетов в разработку от Алекса Барашкова и Влада Камельского.

Пользовательские исследования и тестирование, аналитика


Юзабилити и функциональность дистанционного банковского обслуживания, 2017
UsabilityLab запустили сравнительное юзабилити-исследование мобильных приложений банков, где, кроме юзабилити-тестирований частотных задач, компания замахнулась на оценку юзабилити всей функциональности, переработав модель 7 этапов Donald Norman. Также, затронем вопрос «доступности». Исследование будет готово в апреле.



Cassette
Приложение Cassette упрощает проведение пользовательских интервью. Помимо аудио-записи оно предлагает черновую транскрипцию и категоризацию инсайтов.



Классификация методов пользовательских исследований


Всему голова — нейрофизиологические исследования в разработке игр
Ксения Стернина с коллегами из ВШЭ последние полгода занималась проектом с использованием нейрофизиологических показателей человека.



The Beginners’ Guide to Contextual Interviewing
Советы David Travis из UserFocus по проведению интервью в реальном контексте жизни или работы пользователя.

A/B-тестирование


How Accurate Are UX Metrics From Online Panels?
Jeff Sauro сравнивает результаты опросов пользователей из разных панелей по нескольким популярным метрикам, включая NPS, SUPR-Q.

Визуальное программирование и дизайн в браузере


Framer




Из концепта на Dribbble в код


Новые скрипты


CSS shapes


Работа с цветом в вебе


Flexbox


UX-стратегия и менеджмент


Целеполагание для дизайнеров



Построение дизайн-культуры


Stakeholder mapping
Cassie Slack из Shopify предлагает карту заинтересованных лиц в проекте, которая делит их по двум критериям — влияние и заинтересованность. По каждой из получившихся четырёх категорий у неё есть советы по продуктивному взаимодействию.



Организация дизайн-критики


Кейсы


Кейсы редизайна


История


Control Panel
Шикарная коллекция старых приборных панелей на Flickr. 2300 фотографий редких устройств, приборов и социо-технических систем.



Тренды


2017 Design Trends Guide
Кажется, самый полный обзор трендов от Loredana Papp-Dinea, Mihai Baldean и Milo Themes на Behance. Хотя во многом это всё те же набившие оскомину «большие шрифты», «фоновые видео» и «анимация», здесь собрано, кажется, вообще всё что востребовано в последние годы.



Другие прогнозы на 2017:


The Circular Design Guide
IDEO решили, что в профессии давненько не было новых баззвордов и в конце 2016го запустили руководство по циклическому дизайну. Берём дизайн-мышление, устойчивое развитие, гибкие и lean-методики и — вуаля! — новый метод готов. Срочно обновляем профессиональные профили.



В продолжение темы:



The UX of Voice — The Invisible Interface
Jason Amunwa из Digital Telepathy рассуждает на тему особенностей проектирования голосовых интерфейсов. На выставке CES 2017 был настоящий бум устройств, использующих Amazon Alexa, так что многие дизайнеры столкнутся с проектированием для голосовых ассистентов в этом году.



Алгоритмический дизайн




Мессенджеры и боты


Автомобильные интерфейсы


Умные часы и браслеты




Для общего и профессионального развития


Designers.how
Интересный онлайн-курс, который фокусируется на обучении популярным инструментам продуктовых дизайнеров. Сейчас есть уроки по Swift, Sketch, Origami, AfterEffects, Adobe XD, Flinto, Cinema 4D.



Books That Have Influenced Our UX Careers, part 1 — Design
UXmatters планирует запустить раздел с рекомендованными книгами. В преддверии этого они опросили дюжину колумнистов на тему их любимых книг по дизайну интерфейсов. В остальных выпусках будут книги по пользовательским исследованиям и юзабилити-тестированию.

How to get experience without experience — A new designer’s paradox
Richard Yang даёт советы начинающим дизайнерам на тему того, как получить опыт и портфолио без реальных задач. Он советует сделать непрошенный редизайн и подробно описывает, как выбрать подходящий проект и подать его.



Фильм «Graphic Means»


Люди и компании в отрасли


Покупки дизайн-студий крупными компаниями


Переходы и назначения известных дизайнеров


Stanford d.school
Блог стенфордской d.school на Medium. Одна из недавних статей от директора по обучению Carissa Carter говорит о том, как воспитывают в студентах гибкость по отношению к процессу. В статье отличная аналогия с рецептами.



Dropbox Design


Design at Creative Market


Flipboard Design
Блог дизайн-команды Flipboard на Medium. В феврале они запустили новую версию приложения и рассказывают о работе над ним.



Другие блоги дизайн-команд:



How IBM Is Embracing the Future Through Design
Ещё один хороший рассказ о том, как IBM переосмыслил дизайн в компании.

Материалы конференций


UX STRAT 2016
В 2016 году прошли две части конференция UXSTRAT 2016: 4-5 июня в Амстердаме и 14-16 сентября в Providence, США. Она посвящена дизайн-стратегии и собирает мощный состав тематических спикеров. Презентации опубликованы на SlideShare. Выделю наиболее интересные из них.






















Свежие ссылки можно также отслеживать в одноименной Facebook-группе или получать раз в месяц по почте. Спасибо всем, кто также публикует ссылки в ней, особенно Геннадию Драгуну, Павлу Скрипкину, Дмитрию Подлужному, Антону Артемову, Денису Ефремову, Алексею Копылову, Тарасу Бризицкому, Евгению Соколову и Антону Олейнику. Все больше материалов в обзорах появляется благодаря им.
Tags:
Hubs:
Total votes 23: ↑19 and ↓4+15
Comments0

Articles

Information

Website
vk.com
Registered
Founded
Employees
5,001–10,000 employees
Location
Россия
Representative
Миша Берггрен