• Добавлены все видео с конференции.

31 марта-1 апреля 2016 в Сан-Франциско прошла первая конференция Clarity по дизайн-системам. Конспекты и другие материалы:

• Конспект всех выступлений от Chris Coyier.
• Brad Frost законспектировал выступление Isaak Hayes и Donna Chan, в котором они показывают, как можно оценить эффективность внедрения дизайн-системы.
• Ещё один конспект от Brad Frost: выступление Richard Danne о работе над гайдлайнами NASA в 1970х. Кстати, в прошлом году на них собирали деньги на KickStarter, а теперь переиздание выходит в доступном для всех виде.
• Sketchnotes всех выступлений от Susan Lin. Второй день.

• Julie Zhuo на Quora.
• Сессия с командой Framer.

• Frog меняет стратегию работы и переходит от единого CCO (Chief Creative Officer) к распределённому лидерству. Hans Neubert ушёл в Huge, Inc и компания решила использовать это для того чтобы стать более адекватной современным реалиям. Мнение Fast Co Design.

• Fast Co Design о том, как Accenture интегрировала купленную в 2013 году Fjord. Интересный результат совмещения двух культур, когда дизайн не поглощается крупной компанией, а начинает менять её изнутри.
• IDEO обновили сайт. Интересно, что сотрудничество с kyu collective, купившим часть компании в феврале, не особо отмечено.
• Frank Chartrand, бывший сотрудник Teehan+Lax, грустит о закрытии компании и рассказывает о том, насколько важна она была для канадского рынка.

Usethics обновили свой сайт. Влад Головач рассказывает о работе над ним и в целом дилемме сапожника без сапог.

На вопросы о дизайне в Avito отвечают Иван Волков, Лев Гончаренко, Евгений Беляев, Олег Ващуков, Иван Белобородов, Олег Фролов, Андрей Ткаченко, Илья Карпов и Кирилл Половников. Это один из крупнейших продуктов в рунете, который работает над изменением дизайна флагманского сервиса и расширяет линейку продуктов. Интересно узнать, кто стоит за этими улучшениями и как дизайн-команда видит будущее Avito.

AirBnB запустили сайт о дизайне в компании. Статьи, анонсы и всё такое. Например, Alex Schleiffer рассказывает о дизайн-системе компании DLS (Design Language System).

Иван Бойко обращает внимание на тему на границе UX и UI.

Ежемесячные рассылки для тех, кто давно хочет делать сайд-проект в своей компании — ребята делятся опытом.

• Peter Hornsby иронизирует над типичным клиентским проектом в стиле Эдгара Алана По.

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

Образовательная площадка для дизайнеров интерфейсов — курсы от профессиональных дизайнеров для начинающих специалистов. Готовятся программы более сложных уровней и из смежных областей. Авторы могут сами создавать полноценный курс для дальнейшей продажи.

Сайт Design Facts собирает исторические факты и актуальные сейчас цифры, касающиеся разных сфер дизайна. Отличный материал для тех, кто хочет организовать сеанс «Своей игры» на тему.

Компания iA опубликовала свой внутренний словарь для общения с клиентами. В нём как серьёзные описания по делу, так и шутки из внутренней культуры.

Для онлайн-конференции UX-Марафон собрал дайджест продуктового дизайна за первый квартал 2016 в виде презентации. Прошлый в таком формате оказался востребованным.

Cesar Hidalgo из MIT Media Lab запустил при помощи Deloitte и Datawheel шикарнейший сайт Data USA с открытыми данными по профессиям и отраслям в США. Здесь есть в том числе очень подробный профиль дизайнера. Отечественный рынок становится всё более зрелым и хотя бы более простой версии такого анализа не хватает.

• Mayo Clinic нашли способ побороть укачивание в шлемах виртуальной реальности. Они обманывают мозг, заставляя его думать, что человек двигается.

• Как BMW использует шлемы виртуальной реальности для проектирования приборных панелей машин. Это позволяет представить их в реальной обстановке — насколько они комфортны в реальном положении водителя.

• Достаточно интересный рассказ о том, как Microsoft пытается превратить видение будущего MS Office, показанное в своих роликах, в реальность.

Hugh Durkin предсказывает, что магазины приложений в привычном виде скоро кончатся.

• Прогноз от Trendwatching.

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

• Microsoft выпустил платформу Bot Framework. Они делают большую ставку на них в своей новой стратегии и видят мессенджеры как новую ОС, в которой можно попытать успеха.
• Платформа для ботов от Kik. Руководитель продукта Ken Livingston говорит, что мессенджеры это новые браузеры, а боты — новые сайты.
• Платформа для ботов в Facebook Messenger. Список уже известных ботов.
• Botlist собирает ботов из всех известных платформ в удобном каталоге с поиском.
• Chris Messina срывает покровы с мифов о e-commerce в азиатских мессенджерах. Во-первых, зачастую они просто вызывают мобильную веб-страницу. Во-вторых, особых доказательств их успешности нет. Привет карго-культистам, которые копируют чужие решения, не зная ничего об их успешности.
• Bloomberg срывает покровы у виртуальных ассистентов. И раньше говорилось, что им иногда помогают люди в тюнинге ответов, но, судя по статье, сейчас почти везде используется рутинный и утомительный ручной труд.
• Bot Family, ещё один каталог ботов, собранный из разных платформ.
• Занятная статья на тему того, должны ли боты учитывать разные диалекты, сленг и другие особенности локализации.
• Дизайнер Adrian Zumbrunnen переделал свой личный сайт под имитацию общения с чат-ботом. Аналогичный пример от Joakim Norman.

6/ THIS is what a WeChat transaction actually looks like (ordering McDonalds); not a chat but an app-within-an-app. pic.twitter.com/bEKCBnpuHW

— Connie Chan (@conniechan) 1 апреля 2016 г.

Donald Norman силён в профессиональной философии дизайна. Он описывает два возможных пути развития профессии — как ремесло и как способ мышления. Хотя они связаны между собой, действительно глубокое погружение в каждое из направлений требует разных навыков.

• Бывший дизайнер Ryanair рассказывает о работе над посадочным талоном.

• На удивление вменяемый концепт iOS 10 от Federico Viticci и Sam Beckett. Они разбирают реальные проблемы в использовании iPhone и iPad и предлагаю улучшения для их решения, в том числе для улучшения планшетов как устройств для реальной работы. Не всё здраво, но сам подход очень правильный.

Неплохой рассказ о работе над игрой Break this Safe для Apple Watch. Как ограничения платформы влияли на игровую механику и дизайн интерфейса.

Яндекс разработали свой собственный шрифт Yandex Sans при помощи Christian Schwartz и Ильи Рудермана. Костя Горский подробно рассказывает о процессе работы над ним. Первые страницы с новой гарнитурой.

На примере возрастающего спроса на защиту данных, Scott Sehlhorst показывает, как важно детально изучать запросы пользователей. Вполне возможно, что они имеют в виду под этим что-то более простое и базовое, чем технические специалисты.

• Советы Robert Hoekman Jr по проведению установочных встреч.

O’Reilly выпустили книгу Tom Greever «Articulating Design Decisions». UXMatters публикует главу 4 из неё.

• Julie Zhuo рассказывает о главных уроках из своего опыта дизайн-менеджмента.
• Thomas Lockwood о трендах в дизайн-менеджменте и лидерстве. Интересно, что действительно толковых специалистов сложно найти, поскольку они зачастую не светятся публично.

Artefact Group сделали отличнейший опросник на тему зрелости дизайна в компании. Он позволяет оценить организацию по 5 параметрам — эмпатия, мастерство, характер, производительность и влияние дизайна. Fast Co Design сделали обзор ключевых выводов из ответов 300 компаний, уже прошедших опрос.

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

• Выдержка из книги Robert Hoekman Jr. для UXPin, посвящённая ранним этапам дизайн-проектов, определяющим продукт.

BuzzFeed переосмыслили своё понимание дизайнерских ролей в компании. Они сильно выросли за последний год и хотят соответствовать новым задачам. И самое крутое — команда опубликовала внутренний документ с описанием ролей. Золото!

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

• Как работает дизайн-команда сети коворкингов WeWork. Достаточно подробно описана интеграция в общую продуктовую работу.
• Структура продуктовых команд в GOV.uk.

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

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

• Christopher ODonnell из HubSpot показывает, как можно менять дискурс в доказательстве необходимости измненений в продукте. Сначала достаточно эпизодов из жизни пользователей, затем это метрики использования и вовлечённости, после этого — ценность для бизнеса, а в конце — ценность для самого пользователя.
• Kevin C. Kupillas из HubSpot рассказывает о том, как находить проблемы пользователей и предлагать продуктовые решения в привязке к ним.
• Похожий по смыслу подход от Jeff Sauro, в котором он показывает логику провязку интерфейсных решений от ключевых метрик бизнеса.

Чеклист по проведению сравнительных исследований от Jeff Sauro.

• Zell Liew советует уходить от HTML-сеток к CSS-сеткам и пошагово показывает, как сделать этот переход.
• Kenan Yusuf собрал таблицу сопоставлений способов реализации приёмов flexbox в старых браузерах.
• Коллекция интерфейсных решений, собранных на flexbox.

• Перевод серии статей о прототипировании дизайна с помощью Swift и XCode.

• Наглядный генератор сеток на основе flexbox. Есть много готовых примеров, которые можно брать за основу.

• О проведении A/B-тестов в Тильде. В материале памятка по процессу для начинающих.
• Readymag теперь позволяет выгружать весь сайт для использования кода на стороннем хостинге, а также вставлять куски кода к себе и настраивать мета-теги.

• Emilia Hanses из украинской компании Yalantis рассказывает о том, как GitHub помогает в маркетинге компетенций по дизайну и разработке. Многие концепты выкладывают и на Dribbble, и на GitHub в виде готового кода.
• Мой коллега Павел Рыбин собрал хорошо выстрелившую анимацию двух рестлеров на чистом HTML и CSS. Оригинал.

• Zell Liew рассказывает, как работать с его библиотекой Typi для адаптивной типографики. Достаточно интересно, как там задаётся вертикальный ритм — от интерфейсного шага.
• Тестовый сайт для экспериментов со шрифтами из коллекции Google Web Fonts. Можно поиграть с параметрами загрузки.

• Шпаргалка по работе с Bootstrap 4.

• Библиотека Modaal для реализации попапов в самых разных вариациях, которые соответствуют требованиям к доступности WCAG 2.0 уровня AA.
• Как делалась браузерная игра The Aviator, использующая библиотеку Three.js для работы с WebGL.
• Вышла вторая версия библиотеки Chart.js для отрисовки диаграмм.

Новая система прототипирования со смешанным окружением. Импорт из Sketch в вектор, работа с артбордами как с экранам приложения, полное соответствие структуры макета в векторе структуре в HTML, создание переиспользуемых компонентов в интерфейсе приложения (HTML, React, SVG, XJST, поддержка последнего стандарта ES2015, Babel и CoffeeScript для описания логики и многое другое.

Инструмент для передачи дизайна от дизайнеров разработчикам вышел из беты. Основное его отличие от аналогов в поддержке Photoshop и Sketch, а также расширениях для IDE (Android Studio и XCode), помимо работы с вебом.

На конференции F8 дизайн-команда Facebook показала Origami Studio, новое поколение своего инструмента Origami (его создатель Brandon Walkin недавно покинул компанию). Он стал полностью самостоятельным — его отвязали от Quartz Composer, хотя принцип работы остался. Облегчается работа с однородными списками и матрицами элементов, использующими реальные данные, можно использовать компоненты Android и iOS, доступен предпросмотр на устройстве без подключения по проводу, изменения отражаются в прототипе без перезапуска. На этой неделе совершили качественный скачок сразу два инструмента для визуального программирования, так что Bret Victor должен быть доволен. Публично доступен он станет позже, но уже сейчас Facebook хвалится, что его используют 200 дизайнеров компании. Видео анонса с F8.

Новый Framer делает работу более визуальной. Теперь с блоками интерфейса можно работать прямо на экране устройства справа от кода. Благодаря этому можно грубо набросать прототип, а потом уже в коде тюнинговать взаимодействия и экспериментировать. Кроме того, есть наглядная панель свойств как промежуточный инструмент, где параметры можно менять как в типичных графических редакторах. Это здорово снижает порог входа и приближает Framer к заветам Брета Виктора, одного из главных апологетов визуального программирования. Анонс на русском.

Больше материалов:

• Небольшая методичка по работе с новым Framer от Marc Andrew.
• Советы по работе с Framer.js.

• UserZoom купили аналитический сервис YouEye. Это расширит возможности подбора респондентов.

Сервис Updraft интегрируется в мобильные сайты и приложения и позволяет собирать обратную связь от бета-пользователей и тестировщиков. Пока доступны версии для веба и iOS.

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

David Travis советует начинать внедрение пользовательских исследований в компании с юзабилити-тестирования. Это самый простой и понятный метод, после успеха которого будет проще переходить к остальным.

• Ещё одна коллекция флагов в SVG.

• Ani Kostova показывает, как работать с иллюстрациями в Gravit.

• Перевод второй части статьи о связке Sketch и Flinto для дизайна и прототипирования приложения под iOS.

• Теперь можно прототипировать интерфейсы для Apple TV.
• Больше подробностей о Canvas, новом поколении инструмента. Это отдельное приложение, в котором можно будет создавать макеты.

• Как сделать круговой индикатор загрузки в Principle. Перевод.

• Плагин UserFlows позволяет генерировать спецификацию по сценариям взаимодействия в интерфейсе. Видео работы.
• Вышел Sketch 3.7 с переработанными символами. Bohemian Coding говорят, что это первый релиз из серии, у них в планах более мощная картинка того, как должны работать символов. Более подробный разбор улучшений.
• Плагин Checkpoints позволяет быстро создавать версии экрана. Пара слов о нём.
• Плагин Runner добавляет строку быстрого поиска по функциям, символам, так что не придётся пользоваться вложенными меню.
• Platforma — большой комплект шаблонов для прототипирования промо-сайтов и корпоративных сайтов. Шаблоны для Sketch, Photoshop и Illustrator, адаптированные для Bootstrap.

• InVision добрался и до инструмента анимации в браузере Easee — покупают команду. Не иначе в InVision пришла Marissa Mayer, судя по темпам покупок :)

Вышла вторая бета Adobe XD. Улучшена работа с сетками, текстом, базовыми объектами, контентом. В продолжение темы:

• Перевод развёрнутого интервью с Tom Krcha, одним из авторов идеи Comet, о текущем состоянии и планах продукта.

• Критерии хорошего сервиса от команды GOV.uk.

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

Полгода назад вышла статья про объектно-ориентированный UX, почему-то наделавшая шуму, хотя в ней говорилось о стандартной практике анализа требований к сущностям, которую просто подзабыли в современном lean-мире. Sophia Voychehovski написала продолжение, лучше раскрывающее мысль. Правда, автор зачем-то противопоставляет свой подход сценарному, хотя это просто дело вкуса и привычки.

• Русская версия эмулятора дислексии.

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

Шаблон дизайна под Windows Phone 8.1 для Sketch. Учитывая умирание платформы вряд ли актуален, но до кучи полезен.