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

Уже шесть лет руководитель портальной дизайн-команды Mail.Ru Group Юрий Ветров публикует в своем блоге регулярные обзоры свежих статей по теме интерфейсов, новых инструментов и коллекций паттернов, интересных кейсов и исторических рассказов. Из лент нескольких сотен тематических подписок он отбирает примерно 5% стоящих публикаций, которыми интересно поделиться среди экспертов.

Специально для vc.ru Юрий Ветров собрал выжимку из 20 самых интересных ссылок июня.

Я давно интересуюсь темой алгоритмического дизайна и собираю материалы и примеры на эту тему. За четыре года у меня скопилась пара десятков примеров и полдюжины статей в привязке к продуктовому дизайну, но до этой весны это были скорее отдельные всплески безо всякой системы. Сделал краткий обзор темы и рассказал, почему это безумно важно.

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

Дизайн ботов

Принципы дизайна интерфейса ботов описал Эммет Коннолли из Intercom, а Адриан Зумбруннен, переделавший свой сайт под имитацию общения с чат-ботом, рассказал о том, как делал его и чему научился. Ну и в довесок:

Команда кемеровской дизайн-студии «Пятое Измерение» сделала шикарный набор гоп-шаблонов для презентации дизайна. Скачать.

c008c9de25c801.png

На WWDC 2016 была показана iOS 10. Это большой рывок по интеграции основных решений ОС и сторонних приложений, делающий экосистему еще более целостной.

Приложения имеют несколько форматов представления и точек вызова. Во-первых, изменились уведомления на экране блокировки и в самом центре уведомлений: они стали похожи на те, что в часах, а контент не так ограничен высотой. Более того, теперь прямо отсюда можно вызвать общую информацию через 3D touch (которая интерактивна), плюс есть привычные быстрые действия в новом виде. Сам центр уведомлений наконец-то выводит обычный список входящих по хронологии, без дурацкой группировки по приложению. Android и iOS стали еще ближе.

Во-вторых, у приложений появляются виджеты (по нажатию на 3D touch по иконке), которые можно быстро добавлять в ленту виджетов (доступна через свайп влево на экране блокировки). В-третьих, они интегрированы в Siri. В-четвертых, сторонние приложения смогут интегрироваться в основные интерфейсы — например, «звонилки» смогут показываться на экране блокировки, как стандартный телефонный вызов, и попадать в историю звонков.

Интересно, что большой кусок презентации показывал достаточно плотную работу с входящей информацией без ухода с экранов блокировки и уведомлений, а это здравый путь к отказу от бесконечного процесса менеджмента окон — тьфу, запущенных приложений. Это то, что пытался делать Windows Phone и о чем говорит Голден Кришна в своем принципе NoUI.

По обновленным приложениям кажется, что очень выхолощенный визуальный язык платформы после iOS 7 наконец-то добавит характера. В новой музыке появились жирные заголовки, тайлы и смачные тени у обложек. Элементы управления пришли к единому знаменателю на основе меню быстрых действий (и даже поносимая всеми панель быстрых действий с ними стала стройнее).

У названий фотоальбомов куча вариантов надписей, в сообщениях и вовсе торжествует экспрессия в виде анимационных спецэффектов. Живо выглядит новостное приложение и управление «умным» домом. Видимо, не просто так Джони Айв пропал с радаров: его бездушная монохромная унификация была не сильно лучше, чем цыганщина Скота Форстала.

Из интересных интерфейсных решений:

  • Общий буфер обмена со всеми устройствами на iOS и Mac OS. Скопировал на ноутбуке — вставил в телефоне.
  • Быстрый перевод с языка эмоджи на привычный и наоборот. Они стали сленгом, понятным не всем, так что это упростит общение.
  • Подсказки ближайших мест в картах, основанные на календаре и привычках пользователя.
  • CarPlay каким-то образом смог выводить карты на центральную панель инструментов, при том что обычно автопроизводители сильно зажимают сторонние интеграции.
  • При наборе на клавиатуре подсказываются данные контактов — это следующий шаг в их полезности.
  • Голосовая почта наконец-то получит текстовую транскрипцию.
  • Фотопросмотрщик научился выделять людей на фото, причем эта функция работает и без интернета.
  • Неактивный телефон реагирует на поднятие: автоматически загорается экран.
  • Apple Pay будет работать и в мобильном вебе, так что Люк Врублевский может поставить еще одну галочку в списке сбывшихся концептов.
  • Часы позволят авторизоваться на Mac, просто находясь рядом с ним. Это одна из четырех сфер применения «умных» часов и браслетов, которая не особо развита в имеющихся продуктах.

Уже подоспели гайдлайны и шаблоны:

Шикарное руководство Натана Кертиса по использованию переменных в дизайн-системах. В прошлом году Salesforce показали интересную идею с токенами, которые раздаются дизайн-системам на разных платформах, и Кертис описывает схему работы такого мультиплатформенного решения.

Вышло летнее обновление Adobe CC (версия 2015.5). Много нового в Photoshop. Улучшенная работа с библиотеками CC, умная обрезка с заполнением пустых мест, определение шрифта по картинке, умная обработка лиц, простая обтравка по маске, возможность экспортировать макеты в Comet, работа с артбордами, общая производительность. Вот полный список. Кстати, Illustrator тоже может экспортировать в Comet.

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

  • Вышла бета-версия Sketch 39. Появилось облачное хранилище документов и зачатки адаптивности. Кроме этого, Bohemian Coding меняет систему лицензий на Sketch — теперь она покупается не на мажорную версию, а на 10 больших обновлений. В связи с этим убирается точка, и следующие релизы будут 39, 40 и так далее.
  • InVision уже потихоньку раздает бета-версию нового Craft с интегрированным Silver Flows, так что появляется все больше демонстраций из первых рук: Марк Эндрю и Гуан Йи. Помимо этого, Craft научился использовать JSON в качестве источника данных для прототипов. Ну и сама InVision получила еще $55 миллионов инвестиций. Теперь она скупит еще десяток компаний.
  • ProtoPie, новый инструмент для прототипирования на мобильных. Анимация, жесты, поддержка сенсоров и все такое. Давненько никто не пытался выйти на этот перегретый рынок.
  • Запустился обновленный UXPin.
  • Affinity Designer сделали бета-версию для Windows доступной всем.
  • Китон Герцер иронизирует по поводу обилия инструментов для дизайнеров и описывает рабочий процесс с бесконечным переключением между ними. Перевод на русский.

UXPin выпустили новую книгу UX Design in Action. Авторы поговорили с руководителями крупных дизайн-команд в 3M Health Care, Autodesk, Kaplan Education, Slack и Sumo Logic о том, как работает дизайн в этих компаниях. Кажется, UXPin наконец-то дали возможность почитать книгу прямо в браузере, без скачивания PDF.

Дизайн-студия Area17, специализирующаяся на новостных сайтах, опубликовала внутреннюю методичку по работе над проектами. Их рабочий процесс завязан на Adobe Illustrator и не использует дизайн-системы, но все равно достаточно интересен.

Вышло интервью с Максом Орловым из ONY на основе шестой AMA (ask me anything) от «UX-Среды» и vc.ru. Максим ответил на вопросы о ребрендинге «Рамблера» и других проектах компании.

Студия активно работает с интернет-компаниями и классическим бизнесом над айдентикой и дизайном интернет-сервисов: среди проектов Rambler & Co, My.com, «Мегафон», Digital October, «Максима Телеком» (оператор Wi-Fi в московском метрополитене) и другие. «Рамблер» анонсировал ребрендинг самого портала, над которым также работали ONY. В общем, студия накопила солидный багаж ярких примеров работы над айдентикой цифровых продуктов.

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

Intercom выпустили мини-книгу, посвященную методике jobs to be done. Директор по исследованиям Шан Таунсенд недавно выступила с обзором метода и рассказала об опыте компании по его использованию.

Intercom адаптировали ее основные идеи, заточенные под офлайновый бизнес, для интернет-сервисов. Статья и развернутое интервью с одним из главных идеологов методики — Бобом Моэстой из Re-Wired Group.

Пол Вудс из Eden Spiekermann говорит, что роль классических брендинговых агентств в современном цифровом мире размывается. Айдентика в отрыве от продукта имеет все меньшее значение, так что все активнее используется подход «снизу вверх», когда айдентику определяет команда, занимающаяся интерфейсом.

InVision выпустила отчет об исследовании, в каком состоянии сейчас находится профессия продуктового дизайнера. Инструменты, процессы, взаимодействие дизайнеров с другими участниками продуктовой команды и многое другое. Правда, репрезентативность не очень понятна: зачастую такие опросы заточены под Кремниевую долину.

Шикарное интервью с Кириллом Гручниковым, который много лет ведет сайт Pushing Pixels, где берет интервью у дизайнеров интерфейсов для фантастических фильмов. Очень хорошие мысли о том, как разрабатываются эти интерфейсы и почему они выглядят именно так.

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

Дан Несслер переосмыслил классическую диаграмму «двойного алмаза» и предложил ее развернутый вариант. Она показал конкретные методы и подходы, которые применяются на каждом из этапов расхождения или схождения. Перевод текста.

От концепта на Dribbble к коду

  • Третья часть коллекции с еще пятью концептами Dribbble, переведенными в код.
  • Интервью с Крисом Гэнноном, который любит превращать концепты в код и советует дизайнерам делать так же.

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

Отличные мысли студии iA на вечную тему пиктограмм: можно ли использовать их без подписей или лучше выбрать абсолютную понятность с текстовыми названиями кнопок и других элементов управления. В конце они приводят отличную аналогию: иконки — это как прилагательные и наречия в тексте. Без них текст не должен терять связность, но они могут добавить эмоциональности и акцентов — только в меру. Кстати, они сделали игру для iOS на тему иконок.

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

©  vc.ru