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

Интервью с создателем меню «бургер»

Шикарнейшее интервью с Нормом Коксом, автором иконки «бургера» для первого коммерческого графического интерфейса в Xerox. Идеальные ответы на тему одной из самых идиотских дискуссий в сообществе за последние годы — это просто один из паттернов, который может быть к месту или не к месту на конкретном экране конкретного продукта. Кокс мастерски сводит к этому все вопросы интервьюера.

Microsoft Web Framework

Microsoft опубликовала Web Framework — визуальный язык для своих веб-сервисов. Очень неплохо подан и описан сам язык, особенно анимация —, а вот описание компонентов более примитивно: чистая статика с очень небольшим набором решений. Будет интересно следить за его развитием.

Прогнозы на 2016 год

• Чейз Бакли сделал прогноз сразу на 2017 год. Огромное облегчение — видеть интересный ход мыслей, а не утомившие слова «анимация», «фоновое видео» и «большие картинки», которые повторяются из года в год.
• Сайт A List Apart опросил известных дизайнеров и разработчиков по поводу их планов на 2016 год и потенциальных направлений развития профессии.
• Эрик Флауэрс дал прогноз по перспективам проектирования услуг и направлений его роста в 2016 году.
• Роб Таннен решил заглянуть совсем далеко, на 500 лет вперед. Он обращается к книге Кевина Келли «Чего хотят технологии», в которой автор, основываясь на внутренней логике развития техники, пытается понять, куда движется индустрия. Он рассматривает эту логику с точки зрения интерфейсов и дизайнеров, а сами интерфейсы сравнивает с языком и алфавитом: они помогли наладить общение между людьми, а UX позволяет общаться человеку и компьютеру. Очень интересный подход.
• Дизайнеры известных студий и продуктовых компаний пофантазировали на тему дизайнерских профессий будущего. Что-то звучит здраво, но многое из описанного будут делать скорее люди из других отраслей, а не дизайнеры, которым не хватит узкоспециализированных навыков в той же биологии.

Единый язык анимации

• Yiming предлагает 7 вопросов, которые позволяют системно подойти к интересной анимации: кто (компонент), где (окружение), когда (хореография), почему (поведение пользователя), что (свойство), с чем (взаимозависимость свойств) и каким образом (функция времени).
• Амин Ал Харзвани и Тобиас Бернард размышляют о семантике интерфейсной анимации: как сделать ее осмысленной, целостной и предсказуемой.
• Кит Олийник из Capital One/Adaptive Path предложил интересную категоризацию принципов интерфейсной анимации. Он совместил задачи анимации — функциональная, пространственная, эмоциональная — и 12 принципов Диснея. Получилось хорошее переложение теории на практику.
• Вал Хед размышляет на холиварную тему — актуальны ли 12 принципов анимации Диснея для интерфейсов. Не все из них хорошо подходят для задач цифровых продуктов, но в целом это хорошая система классификации, которая нужна для системной работы.

Школа дизайна «Яндекса»

Школа дизайна «Яндекса» сформировала видеокурс лекций на основе прошлогодней программы. В канале на YouTube доступны первые записи, постепенно будут появляться остальные. Создатели школы Лола Кристаллинская и Тарас Шаров рассказали об итогах прошлогоднего набора.

Нативное приложение Creolabs

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

Другие новости инструментов:

• Эрик Фриберг комплексно подошел к вопросу о том, что должен уметь идеальный дизайнерский инструмент. Он очень подробно разобрал основные задачи, которые выполняет современный дизайнер, и привел примеры, как их помогают решать существующие продукты.
• Вышел Sketch 3.5 (и следом 3.5.1). Что нового.
• InVision покупает Macaw — судя по FAQ, во многом ради нового продукта Scarlet. Инструмент становится бесплатным, но обновляться не будет.
• Обновился сайт Marvel. Появилась коллекция примеров прототипов.

Дизайн-решения, проверенные в Mail.Ru Group

Ксения Стернина анализирует результаты пользовательских исследований продуктов Mail.Ru Group за много лет и пытается обобщить информацию из них. В результате должна получиться библиотека паттернов, дополненная выводами об их полезности и работоспособности на практике. Это первая презентация из серии.

Другие мои коллеги, Ольга Курицына и Олег Паринов, рассказывают о необычном поведении пользователей в интерфейсах главной страницы Mail.Ru и Почты для бизнеса. Вторая часть.

Подход компании к построению UX

Одно из лучших выступлений последних лет от Лии Були, в котором она рассказывает о современном подходе к построению UX в компании. Недавно она перешла в Forrester, где стала заниматься аналитикой рынка дизайна, что само по себе важный шаг для профессии. В этом выступлении Лия рассказывает об опросах компаний разного уровня и размера, благодаря которым она сформулировала критерии успеха UX-команд. Все это доступно в виде отчета за $499.

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

Внедрение изменений с помощью «адаптивного дизайна»

Шикарнейшая статья Майи Бернштейн и Марти Лински на тему внедрения изменений в компаниях. Дизайн-мышление считается хорошей методологией для того, чтобы придумывать будущее, но дальше все зачастую оказывается печально — оно так и остается красивым визионерством. А вот в связке с современным подходом к менеджменту — адаптивные лидерством — задуманное можно реализовать.

Майя и Марти предлагают методологию «адаптивного дизайна» на стыке дизайн-мышления и адаптивного лидерства. Она позволяет внедрять в компанию смелые идеи и изменения. Название, правда, не очень удачное, потому что занято responsive и adaptive-техниками работы с вереницей устройств и экранов.

Дизайн-мышление в IBM

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

Четвертое издание книги «Интерфейс. Основы проектирования взаимодействия»

Патенты в дизайне

Сара Бурштейн собирает свежие патенты, которые касаются дизайна. Физические устройства, интерфейсы, промышленный дизайн.

Ближайшие конференции по веб-дизайну

Список конференций по дизайну и веб-разработке на первое полугодие 2016 года. Еще один список конференций на 2016 год.

Как разработать эффективную кнопку CTA

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

Вдогонку — отличные советы от Кима Флаерти из NN/g: как показать пользователю, что контент есть и на следующих экранах.

Как верно определить число участников юзабилити-тестирования

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

Отчет Litmus о рынке почтовых клиентов

Компания Litmus выпустила подробный отчет об основных изменениях на рынке почтовых клиентов и в целом перспективах для дизайнеров и разработчиков рассылок. Авторы сайта Really Good Emails собрали на CodePen коллекцию кусков кода для писем рассылки.

Живые гайдлайны и компонентные системы

• Карен Менезес дает рекомендации по грамотной работе с переменными в пре-процессорах. В конце статьи — толковые советы по структурированию базовых значений визуального языка.
• Хорошие мысли Дана Молла о грамотном построении компонентов. Он говорит о том, как важно понимать разницу между паттернами представления и паттернами структуры информации.
• Мой коллега Артем Мезин рассказывает, как технологически устроен фреймворк Почты Mail.Ru. Интерфейсная часть этой истории станет третьей публикацией в серии статей про унификацию дизайна наших продуктов.
• Живой гайдлайн от edX.
• Кэти Басай, недавно пришедшая в дизайн-команду Salesforce, рассказывает, как дизайн-система Lightning помогла ей легче включиться в работу и посвящать больше времени работе над продуктами, а не изобретанию велосипеда. Полезно тем, кто думает, что подобные фреймворки забирают у дизайнера работу.
• Вышла вторая версия инструмента быстрого прототипирования в браузере от команды GOV.uk.

Веб-типографика

• CSS-утилита OpenType от Kenneth Ormandy, позволяющая легко использовать менее востребованные возможности веб-типографики.
• Отличный материал по внедрению шрифтовых сеток, основанных на идее масштабирования относительно базового текста.
• Библиотека Typi, облегчающая внедрение адаптивной типографики. Сопроводительная статья с разбором проблематики.

Дизайн-ресурсы Facebook

Огромная коллекция шаблонов телефонов, умных часов с перспективой других устройств.

Проблема с Dribbble

Тобиас ван Шнайдер призывает всех наконец-то выдохнуть насчет Dribbble: это в первую очередь инструмент для прокачки навыков, а если кто-то видит в нем что-то еще — это его личная проблема восприятия. Похожие мысли у Теда Гоаса — он просит прекратить травлю авторов непрошеных редизайнов.

Другое мнение у Бенджамина Бергера. Как и многие из нас, он устал от потока мусора, который породили движения Daily UI и »100 макетов за 100 дней». Это оторванные от реальности работы, которые не решают внятно описанные проблемы и прокачивают ограниченную группу навыков. Было бы лучше направить эти усилия на улучшение действительно полезных сайтов некоммерческих организаций и других компаний, которые не могут себе позволить нанять дизайнера. Это позволит и навыки развить, и реальную пользу принести.

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