Март '16

Первые материалы с конференции Interaction16, которая прошла 2-4 марта в Хельсинки.

• Интервью на базе AMA с Никита Обухов про Tilda Publishing.

• Еще один крупный консалтер Capgemini (180 тыс. сотрудников) купил в феврале Fahrenheit 212, инновационную дизайн-студию. Компания продолжит работать под своим брендом, как и Fjord. Смысл тот же, что и у остальных — для дизайнеров это новые возможности по решению проблем, для консалтера это новая экспертиза. Анонс на сайте покупателя.

• Подборка рабочих скетчей дизайнеров известных компаний.

• Большая подборка концептов 404 страниц, в основном из работ в рамках #DailyUI.

• Хорошая ирония на тему одинаковых сайтов — автор спрашивает, какой из двух типовых сайтов вы сейчас рисуете?
• Yaron Schoen хорошо аргументирует обратную точку зрения — однородность дизайна хороша для пользователя, ведь использование стандартных паттернов облегчает работу с продуктами.

• Google запускает очень важную для профессии инициативу — образовательную программу для продуктовых дизайнеров вместе с американским The Savannah College of Art and Design. Они переупаковали уже имеющиеся курсы колледжа и собрали из них современный и востребованный формат.
• Christina Wodtke даёт своё мнение о мифах про продуктовых дизайнеров. В том числе о том, что experience нельзя спроектировать.
• Мощнейший манифест современного дизайнера от Julie Zhuo из Facebook.

Balraj Chana выложил своё тестовое задание на роль мобильного дизайнера в Google.

• Вышла глава про сетки.

Новый сайт популярной когда-то инициативы #May1Reboot — в этот день пройдут массовые запуски редизайнов сайтов. Один из главных инициаторов её возрождения — Tobias van Schneider.

Простые мотивационные советы для дизайнеров на случай, если мысль зашла в тупик.

Интереснейший материал Joichi Ito об антидисциплинарных исследованиях как следующем шаге после междисциплинарных. Он описывает концепцию Neri Oxman, в которой дизайн, искусство, наука и инженерия тесно взаимосвязаны и дают новое понимание друг другу. Одна из сильнейших статей на тему современной философии дизайна.

• Ещё одна коллекция киношных интерфейсов.

• Очень толковый рассказ Fast Co Design о том, как работает и куда двигает UX Parrish Hanna, руководитель дизайна Ford.
• Очень интересное переосмысление автомобилей от Бентли для эпохи автономных машин. Во-первых, сам подход к интерьеру, который больше похож на дорогой гостиничный номер. Во-вторых, голографический дворецкий.

• Толковые мысли Mark Rolston на тему того, какие именно части дизайнерской работы могут заменить алгоритмы.
• Вот где настоящая магия. Netflix вырезает персонажей для постеров, накладывает тексты и делает автоматические эксперименты со всем этим.

• О возможностях и ограничениях, которые порождает перед издателями всеобщая мобилизация. Очень информативная и значимая статья.
• Как устроена работа с аналитикой в Buzzfeed, который славится своей эффективной работой со множеством каналов. Перевод.
• AOL запустили экспериментальную лабораторию Alpha для своих новостных сайтов. Пробуют работать с виртуальной реальностью, мессенджерами, видео, умными телевизорами и другими платформами.

• Заголовок желтоват, но проблема поставлена верная — есть два технических сделать картинку в виртуальной реальности более настоящей и менее «укачивающей». Сейчас производители выбрали тот, что комфортнее для мужской физиологии.
• Студия Artefact подумала на тему того, как сделать шлемы виртуальной реальности менее асоциальными. 10 концептов и идей на эту тему.
• Tessa Chung собрала для автомобильного сайта Autoblog эксперимент с интерьером машины в виртуальной реальности. Она пошагово описывает процесс работы над ним.
• Инициатива Google VR View, облегчающая встраивание изображений и видео 360 на сайт.

Microsoft показали несколько новых демонстраций Hololens, которые можно считать одними из самых важных и эффектных демонстраций в истории интерфейсов. Во-первых, посмотрите выступление Alex Kipman на TED. Не верится, что это не кино. Во-вторых, отдельную демонстрацию «голографического Скайпа».

Интересный концепт «мутационного дизайна» от Liam Spradlin. Он описывает идеологию интерфейса, который подстраивается под пользователя, используя его контекстные данные. Есть две больших статьи, код и сообщество.

• Tomaž Štolfa рассматривает историю интерфейсов командной строки и GUI, перекладывая трезвый взгляд на направления развития мессенджеров. Статья разбирает хорошие гибридные решения на стыке текстовых и графических интерфейсов.
• Meydad Marzan предлагает интересный способ анализа чат-интерфейсов на успешность. Это градация по «самостоятельность/паразитирование» и «простой/сложный сценарий» — гарантированный успех имеют только простые сценарии, паразитирующие на других продуктах.

John Maeda выпустил новый отчет KPCB Design in Tech 2016. Шикарнейший срез текущего состояния и направлений движения отрасли, один из самых ценных. Фокус смещается в построение дизайн-систем и дизайн-культуры, а от специалистов требуются новые навыки. Что происходит в самих компаниях и как дизайн становится частью стратегии крупнейших корпораций, что нужно сделать для обучения нового поколения и многое другое. Очень плотно насыщенный информацией отчёт.

• История формата PSD и того, почему его внутренности такие захламленные.

История появления тележек в магазинах, которые позволили продавать гораздо больше, хотя изначально не были приняты обществом. Не совсем про цифровые интерфейсы, но полезно как предыстория e-commerce.

Очень интересное интервью с Christian Kraft, одним из первых интерфейсных дизайнеров Nokia. На его счету огромное количество интерфейсных патентов и решений, которые используются и сейчас. Причем он начинал в те времена, когда в телефонах только появились экраны, а значит приходилось придумывать всё с нуля.

Tim Brown о том, как IDEO сдвигает фокус своих задач на более сложные и масштабные проекты на примере школьной инициативы в Перу.

• Salesforce описывают итерации работы над формами в своих продуктах. Хорошо описана логика принятия решений.
• Рассказ о редизайне крупнейшего инструмента для подачи налоговых деклараций TurboTax.

• Как The Telegraph создавал свою новую CMS. Интересный пример масштабных изменений.

Google объединил свои инструменты для маркетинговой аналитики в Analytics 360 Suite. Он включает веб-аналитику, A/B-тестирование, визуализацию сложных данных и взаимосвязей, возможность подключать сторонние источники данных и работу с рекламными кампаниями.

В конце прошлого года команда сервиса Segment запустила школу аналитики. В ней очень простым языком описываются ключевые аспекты, процессы, инструменты. Новые статьи постепенно выкладываются, сейчас доступны полтора раздела. Некоторые материалы:

• Перевод статьи о ключевых метриках для популярных моделей роста.

Сервис управления проектами для дизайнеров. Для подписчиков дайджеста открыли доступ к бета-версии. Авторам интересны отзывы и критика.

• Шикарный пример описания вакансии дизайнера, который начинается со слов: «почему мы вас не наймем».

Перевод комикса, показывающего методологии разработки ПО в виде разных автомастерских.

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

• Emmet Connolly, директор продуктового дизайна Intercom, рассказывает как устроена дизайн-команда в компании.
• Jake Knapp из Google Ventures рассказывает о том, как работает команда дизайн-партнеров. Он ссылается на интересный формат обратной связи внутри рабочей группы, состоящей из полностью автономных специалистов.
• Интервью с Geoff Teehan. Личная часть повторяет то, что было в недавних статьях, зато есть интересные детали про структуру дизайн-команд в Facebook. Он руководит тремя группами — новостная лента, реклама в ней и общеинтерфейсная команда.
• Bob Baxley в преддверии своего выступления на MX Conference 2016 рассказывает об опыте управления дизайнерами.
• Дизайн-команда GOV.uk запустила программу тренингов по дизайну для всех гос.служащих. Это мощный инструмент для распространения правильного мировоззрения в организациях.
• Как работает дизайн-команда Open Table.
• Как работает дизайн-команда Instacart.

На сайте Tandem Seven выложен отчёт Leah Buley для Forrester, в котором она рассказывает о современном подходе к построению UX в компании. На вид не пиратка.

Дмитрий Колтунов рассказывает, как организация книжного клуба помогла его стартапу Alice развивать сотрудников и решать стоящие перед компанией проблемы.

Интервью с Mauro Porcini, Chief Design Officer PepsiCo о том, как компания меняет себя с помощью дизайна. Хотя речь идет о далёких от цифровых продуктах вещах, всё что он говорит звучит очень близко проблематике нашей отрасли. Дизайн-стратегия, дизайн-культура, внедрение инноваций и многое другое — очень круто. В том же номере HBR вышло интервью с Indra Nooyi, CEO компании, где есть много деталей с другой стороны. Как она пришла к пониманию того, что компании нужен новый подход к дизайну.

Мощнейшая серия статей о перестройке петербургской дизайн-студии Nimax. Елена Огородникова пришла в компанию в прошлом году, на фоне кризиса, и сделала огромную работу по сначала стабилизации, а потом возобновлению роста. Редко когда так подробно рассказывают о внутренней кухне больших изменений. Вторая часть.

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

• Подробнее о новом инструменте.

• Обучение flexbox в виде игры tower defence.

• Простейшая инструкция Daniel Fosco для дизайнеров по работе с Git.

• Webflow выпустили методичку для дизайнеров, которая здорово поможет начинающим.

• Ещё одна реализация фильтров Instagram на CSS.

• David Lee о том, как сделать контент в прототипах более реалистичных с использованием массивов. Для тех, кто хотя бы немного понимает в программировании, это не новость, но поскольку инструмент рассчитан на дизайнеров, для многих это будет новым.
• Русскоязычный блог про Framer от Антона Карташова.
• Как дизайн-команда Facebook использует Framer.

• Коллекция экспериментов Jen Simmons на тему.

Обзор текущего состояния веб-анимации от Rachel Nabors. Она приводит два сервиса для проверки работоспособности тех или иных функций в браузере — Are we animated yet? и WAAPI Browser Support Test, поскольку caniuse.com часто ошибается. В продолжение темы:

• Библиотека Spirit.js для CSS-анимации. Patrick Brouwer о работе над ней.

• Ещё одна тема оформления в духе Material Design для Bootstrap.
• Сравнение Bootstrap 4 и Foundation 6. Хотя Bootstrap всё еще в бете, автор говорит, что Foundation вышел сырым и сравнивать их в таком состоянии можно.

Свежая презентация Виталия Фридмана, в которой он собрал огромную кучу полезных скриптов и хаков. Ещё немного новых скриптов:

• Большая коллекция анимаций иконки бургера.
• Дискретный слайдер фото на CSS.
• Интересная анимация частиц внутри слова.
• Барабаны на SVG.
• Скрипт, позволяющий на лету обрезать фото под нужный размер.
• Анимация чернильного пятна на CSS.

• Создатели инструмента запустили плагин для Sketch, позволяющий получить код на Swift или Objective-C. Корявый, но достаточный для того чтобы поковырять прототип вживую.

• Сайт-методичку по работе с SVG перевели на русский.
• Советы Viget по экспорту графики из Illustrator в SVG.
• Лучшая статья на тему SVG-анимации. Emanuele Sabetta подробно разбирает все подходы к её созданию, инструменты, библиотеки и вот это вот всё.
• Памятка Florens Verschelde для дизайнеров по экспорту в SVG.

Tom Bredin-Grey в деталях разбирает проблему выстраивания межпараграфных отступов и вертикального ритма в CSS. Он выпустил библиотеку MegaType, которая делает работу с текстом в вебе предсказуемой.

See the Pen MegaType demo by Thomas Bredin-Grey (@tbredin) on CodePen.

Zell Liew отвечает ему и пытается разобраться, так ли критично соблюдение вертикального ритма до пикселя. Правда, в примерах не хватает классических добротных сайтов СМИ. Другие материалы о веб-типографике:

• Zell Liew продолжает свою серию статей про адаптивную типографику и показывает, как совмещать размеры вьюпорта и em/rem.
• Robin Rendle пробует написать новый манифест типографики в продолжение идей Яна Чихольда, с учётом особенностей веба. Очень интересные системные мысли.
• Zach Leatherman рассказывает о современных техниках оптимизации загрузки веб-шрифтов.
• CSS-фреймворк Gutenberg для работы с типографикой в вебе.
• Библиотека footnote.js для создания сносок к тексту в вебе.

• Simon Taggart описывает подход компании Big Commerce к описанию переменных в дизайн-системах.
• Jina Bolton устраивает первую конференцию Clarity по современным дизайн-системам. Пройдет 31 марта-1 апреля в Сан-Франциско.
• Salesforce ввели в компании новую роль главного инженера дизайн-системы (Design Systems Ops по аналогии с DevOps). Его задача — переводить идеи с языка дизайна на язык разработки.
• Презентация Антона Виноградова об архитектуре дизайн-системы Альфа-Банка. На GitHub доступна библиотека компонентов. Видео выступления.
• Ну всё, теперь живые гайдлайны становятся совсем мейнстримом — про них написали даже Nielsen/Norman Group. Ждем серии тренингов и включения в базовые курсы.
• Дизайн-система GE для управления интернетом вещей. Построена на базе Polymer.
• Живые гайдлайны Canon хостинговой компании Rackspace.
• Алла Холматова рассказывает о построении дизайн-системы британской образовательной компании FutureLearn.
• Nathan Curtis опубликовал чеклист для команд, начинающих работать над своей дизайн-системой. Он помогает выбрать направления работы и распределить обязанности по команде.
• Живые гайдлайны британского издания The Times. О том, как делалась дизайн-система The Times.

Philip Walton рассказывает о (возможно) ближайшем будущем CSS — инициативе Houdini, которая даёт возможность использовать полифилы аналогично JavaScript. Сейчас многие передовые возможности CSS вроде shapes и функций наложения слоёв на практике использовать нельзя, а обходные решения катастрофичны для производительности работы браузера. Houdini позволит расширять стандарты W3C. Правда, в комментариях иронизируют, что для того чтобы не ждать 10 лет до появления свойства CSS во всех браузерах, придётся подождать 10 лет до внедрения Houdini.

Jeff Sauro рассказывает, как бороться с ложными и ложноотрицательными срабатываниями при проведении пользовательских исследований.

Zarget, ещё один инструмент для изучения карты кликов и проведения A/B-тестирования.

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

Дмитрий Ханин рассказывает о совмещении интервью и опроса с последующим ранжированием найденных проблем.

Philip Hodgson из Userfocus достаточно ёмко описывает способы борьбы с эффектом наблюдателя, когда пользовательский исследователь своим поведением влияет на респондента.

Google запустили интересную инициативу по пользовательским исследованиям. Они организовали мобильную UX-лабораторию, которая приезжает к пользователям сама.

Google выпустил приложение Accessibility Scanner для Android. Оно показывает проблемные места в приложении и формирует отчёт со скриншотами. Пара слов о его работе.

Jim Ross опровергает ещё пачку мифов, на этот раз о том, почему можно обойтись без пользовательских исследований.

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

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

Генератор картинок-заглушек Motif для использования в OpenGraph — в соц.сетях будут подтягиваться правильные превью.

Сервис обновился, работать стало еще приятнее. Один проект — бесплатно.

• В Тильде теперь можно создать интернет-магазин.