60
ДАЙДЖЕСТ ПРОДУКТОВОГО ДИЗАЙНА Новости и тренды ЮРИЙ ВЕТРОВ MAIL.RU GROUP ×2 ВЫПУСК

UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

Embed Size (px)

Citation preview

Page 1: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ДАЙДЖЕСТ ПРОДУКТОВОГО ДИЗАЙНА

Новости и тренды

ЮРИЙ ВЕТРОВ

MAIL.RU GROUP

×2 ВЫПУСК

Page 2: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

AKA “ОБЗОР СВЕЖИХ МАТЕРИАЛОВ”™Мое главное хобби :) Все самое интересное из прочитанного

попадает сюда с кратким комментарием.

https://www.facebook.com/groups/pdigest/

Page 3: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ИНТЕРФЕЙСЫ НА VC.RUС перезапуском Цукерберг Позвонит я стал курировать рубрику

«Интерфейсы». Самое толковое будет иметь переводы.

https://vc.ru/interface

Page 4: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ПАТТЕРНЫ И ЛУЧШИЕ ПРАКТИКИ

Page 5: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ВСТРЕЧА НОВОГО ПОЛЬЗОВАТЕЛЯРекомендации на тему того, как измерять эффективность интерфейса для этой критически важной части продукта.

Page 6: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ГАЙДЛАЙНЫ

Page 7: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

OUIДизайн-система Optimizely. На GitHub доступна библиотека

компонентов, есть и живой гайдлайн.

Page 8: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

Живые гайдлайны британского издания The Times. О том, как делалась их дизайн-система.

Алла Холматова рассказывает о построении дизайн-системы британской образовательной компании FutureLearn.

Презентация Антона Виноградова об архитектуре дизайн-системы Альфа-Банка. На GitHub доступна библиотека компонентов.

Дизайн-система GE для управления интернетом вещей. Построена на базе Polymer.

Page 9: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ДИЗАЙН-СИСТЕМЫ В МАССЫНу всё, теперь живые гайдлайны становятся совсем мейнстримом

— про них написали даже Nielsen/Norman Group.

Page 10: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

Обсуждение ограничений Atomic Design у Nathan Curtis и Trent Walton.

Karen Menezes дает рекомендации по грамотной работе с переменными в пре-процессорах.

Salesforce ввели в компании новую роль главного инженера дизайн-системы (Design Systems Ops по аналогии с DevOps) –переводить идеи с языка дизайна на язык разработки.

Page 12: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

И НИЖНЯЯ ПАНЕЛЬ ДЕЙСТВИЙ!Здравый смысл восторжествовал и она стала частью официальных

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

Page 14: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ПОНИМАНИЕ ПОЛЬЗОВАТЕЛЯ

Page 15: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ФИЗИЧЕСКИЕ ОГРАНИЧЕНИЯ IPADКсения Стернина опубликовала результаты исследования физических ограничений при работе с планшетом в виде статьи. По результатам

удалось создать карту безопасных зон для iPad Air 2.

Page 16: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ИЕРАРХИЯ ДОВЕРИЯНесколько уровней доверия к сайту, которые нужно учитывать для

построение качественного взаимодействия с пользователями.

Page 17: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ТРЕНДЫ КИТАЙСКОГО ДИЗАЙНАDan Grover выпустил продолжение своей эпичной статьи про

особенности китайских мобильных приложений.

Page 18: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ИНФОРМАЦИОННАЯ АРХИТЕКТУРА,

КОНЦЕПТУАЛЬНОЕ ПРОЕКТИРОВАНИЕ,

КОНТЕНТ-СТРАТЕГИЯ

Page 19: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

IBM DESIGN THINKINGМетодичку по версии дизайн-мышления от IBM, о котором

они рассказывают последние пару лет.

Page 20: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

МЕТОДЫ ДИЗАЙНАСправочник по методам и практикам совместной работы,

исследований, прототипирования и других этапов дизайна.

Page 21: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

Practical Service Design – методички и шаблоны по проектированию услуг от Erik Flowers из Intuit и Megan Miller из Стенфорда.

James Kalbach описывает разницу между customer journey map, experience map и service blueprint.

Методичка по созданию experience map от Niall O’Connor из CXPartners. Перевод.

Page 22: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ПРОЕКТИРОВАНИЕ И ДИЗАЙН

ИНТЕРФЕЙСОВ

Page 23: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

THE CONVERSATIONAL UIПамятка по дизайну для мессенджеров от Matty Mariansky.

Описывает весь процесс работы над такими интерфейсами и их основные ограничения. Часть 2.

Page 24: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

Хороший зрелый взгляд Matt Hartman на тему реально полезных сценариев использования мессенджеров.

Tomaž Štolfa рассматривает историю интерфейсов командной строки и GUI, перекладывая трезвый взгляд на направления развития мессенджеров.

Meydad Marzan предлагает интересный способ анализа чат-интерфейсов на успешность.

Cennydd Bowles: современные продукты пытаются стать важнее, чем есть на самом деле, отнимая у пользователя кучу времени и сил.

Alistair Croll в частности, про то, как тестировать такие интерфейсы.

Page 25: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ИНСТРУМЕНТЫ

Page 26: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ADOBE EXPERIENCE DESIGN CCComet теперь называется Experience Design CC и доступен в

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

Page 27: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

INVISION LABSСудя по всему, InVision на всех парах идёт к созданию собственного

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

Page 28: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

Основной продукт Craft — плагин для Sketch и Photoshop, облегчающий использование реальных данных в макетах, синхронизацию стилей, а в будущем – и полноценное прототипирование.

Помимо дюжины анонсированных функций, InVision купили три инструмента для дизайнеров (Macaw, Relay и Silver Flows).

Page 29: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ДРУГИЕ ИНСТРУМЕНТЫKoncept пробует совместить возможности прототипированияи юзабилити-тестирования из коробки. Бесплатный пробный период для читателей группы.

Creolabs пытается поженить дизайн и разработку.

Page 30: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ADOBE ANIMATE CCНовое поколение Flash Professional. Векторная анимация, у

которой на выходе не умерший флеш, а HTML5-код.

Page 31: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ИДЕАЛЬНЫЙ ИНСТРУМЕНТErik Friberg подробно разбирает основные задачи в работе современного дизайнера и приводит примеры того, как это

решают существующие продукты.

Page 32: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ПОЛЬЗОВАТЕЛЬСКИЕ ИССЛЕДОВАНИЯ

И ТЕСТИРОВАНИЕ

Page 33: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

АНАЛИТИКА БЕЗ ЦИФРОлег Якубенков описывает метод исследования поведения пользователей анализом статистики их работы в продукте.

Page 34: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ВИЗУАЛЬНОЕ ПРОГРАММИРОВАНИЕ И ДИЗАЙН В БРАУЗЕРЕ

Page 35: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ИНИЦИАТИВА HOUDINIPhilip Walton рассказывает о (возможно) ближайшем будущем CSS

– возможности использовать полифилы аналогично JavaScript.

Page 36: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

УПРАВЛЕНИЕ ИНТЕРФЕЙСНЫМИ

ПРОЦЕССАМИ И ПРОЕКТАМИ

Page 37: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

СОВРЕМЕННАЯ UX-ОРГАНИЗАЦИЯLeah Buley из Forrester рассказывает о современном подходе к

построению UX в компании.

Page 38: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

IN PROGRESSСервис Wake запустил блог, в котором выходят очень

толковые интервью руководителей известных дизайн-команд.

Page 39: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

АДАПТИВНЫЙ ДИЗАЙН (НЕ ТОТ)Как внедрять изменения в компаниях. Дизайн-мышление

помогает придумать будущее, но не внедрить его.

Page 40: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ИСТОРИЯ

Page 41: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ИНТЕРВЬЮ С NORM COXШикарнейшее интервью с изначальным автором иконки бургера

для первого коммерческого графического интерфейса в Xerox.

Page 42: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

CHRISTIAN KRAFTОдин из первых интерфейсных дизайнеров Nokia. Начинал в те времена, когда в телефонах только появились экраны, а значит

приходилось придумывать всё с нуля.

Page 43: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ТРЕНДЫ

Page 44: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

DESIGN IN TECH REPORT 2016Шикарнейший срез текущего состояния и направлений

движения отрасли, один из самых ценных.

Page 45: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

HOLOLENS НА TEDНесколько новых демонстраций Hololens, которые можно считать

одними из самых важных и эффектных в истории интерфейсов.

Page 46: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

PROJECT PHOEBEИнтересный концепт «мутационного дизайна»

от Liam Spradlin.

Page 47: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ПРОГНОЗЫ НА 2016Chase Buckley делает прогнозы сразу на 2017 год. Огромное облегчение

видеть интересный ход мыслей, а не убийственно утомившее «анимация», «видео на фоне», «большие картинки» из года в год.

Page 48: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

Erik Flowers дает прогнозы по перспективам дисциплины проектирования услуг и ее направлениям роста в 2016 году.

Rob Tannen решил заглянуть совсем далеко, на 500 лет вперед.

A List Apart опросил известных дизайнеров и разработчиков по поводу их планов на 2016 и потенциальных направлений развития профессии.

UXPin совсем разошлись, выпустили четыре книги про тренды 2016 года и два бандла с ними – первый и второй. Не хватает бандла бандлов.

Page 49: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ПРОФЕССИОНАЛЬНОЕ РАЗВИТИЕ

Page 50: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

КНИГА «ИНТЕРФЕЙС», 4 ИЗДАНИЕПеревод 4 издания одной из главных книг для дизайнеров

интерфейсов от Алана Купера и команды.

Page 51: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ВИДЕО ШКОЛЫ ДИЗАЙНА ЯНДЕКСАШкола сформировала видео-курс лекций на основе

прошлогодней программы.

Page 52: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ДИЗАЙН И НАУКАКонцепция, в которой дизайн, искусство, наука и инженерия тесно взаимосвязаны и дают новое понимание друг другу.

Page 53: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

ЛЮДИ И КОМПАНИИ В ОТРАСЛИ

Page 54: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

IDEO + KYUIDEO вошла в японскую группу компаний kyu collective, продав не раскрываемую долю. Хотят решать проблемы сложного уровня.

Page 55: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

AMA: GOLDEN KRISHNAВопросы о своей нашумевшей и очень актуальной сейчас

концепции «The Best Interface is No Interface» и книге.

Page 56: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

AMA: АЛЬФА-ЛАБОРАТОРИЯОдин из немногих банков, у кого есть выделенная группа про

работу над новыми сервисами.

Page 57: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

МОДЕРНИЗАЦИЯ NIMAX 2015Елена Огородникова пришла на фоне кризиса, и сделала

огромную работу по стабилизации, а потом возобновлению роста.

Page 58: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

P.S.Свежие материалы можно получать по почте в формате почтовой рассылки. Подписывайтесь.

Самый быстрый способ получить новый дайджест.

*

*

Page 59: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

CREDITS

ГЕННАДИЙ ДРАГУН

ДМИТРИЙ ПОДЛУЖНЫЙ

ПАВЕЛ СКРИПКИН

АНТОН АРТЕМОВ

ДЕНИС ЕФРЕМОВ

ЕВГЕНИЙ СОКОЛОВ

АЛЕКСЕЙ КОПЫЛОВ

АНТОН ОЛЕЙНИК

Page 60: UX-Марафон 2016: Ю.Ветров — Дайджест продуктового дизайна, выпуск 2

СПАСИБО!ЮРИЙ ВЕТРОВ

www.jvetrau.com twitter.com/jvetrau