ЧАСТЬ 2: ПОИСК ИНСАЙТОВ

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

Pyoneer (https://www.pyoneer.io/): Интересный интегрированный инструмент для поддержки дизайн-мышления. В нём богатый набор возможностей — customer journey map, персонажи, агрегация обратной связи из разных источников для поиска возможностей роста, привязка аналитики. И всё это на базе «двойного алмаза».

Пять лет назад дизайнеры Mailchimp построили мощную базу знаний, объединяющую знания о пользователях из множества источников (пользовательские исследования, аналитика, обратная связь, изучение конкурентов и рынка и т.п.), которая позволяет быстро получить ответы на множество вопросов — https://alistapart.com/article/connected-ux.

Долгое время время в теме был чуть ли не полный штиль — из аналогичных примеров было слышно только про Atlassian (https://www.youtube.com/watch?v=6gvbdFLU73M), WeWork (https://vimeo.com/215143249), Nasdaq (http://nasdaqdesign.com/mosaiq/) и Intuit. Но недавно начали появляться специализированные сервисы для работы с базой инсайтов. Они помогает агрегировать данные пользовательских исследований, обратную связь и другие каналы, чтобы находить среди них полезные идеи для развития продукта:

— Dovetail (https://dovetailapp.com/)
— Aurelius (https://www.aureliuslab.com/)
— NomNom (https://nomnominsights.com/)
— Reframer от Optimal Workshop (https://www.optimalworkshop.com/reframer)

В прошлом году побывал в гостях у NomNom и получил пачку полезных советов по внедрению подхода у нас в команде — https://jvetrau.com/fla-2017/. Мы крутим эту идею давно, но без готовых инструментов она выглядела неподъёмной. Сейчас внедрение стало куда более реальным, так что снова включились в активную работу — глядишь, к дизайн-системе для предсказуемой выкатки продуктов добавится инсайт-система для не менее предсказуемого поиска идей по их развитию.

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

P.S. В первой части — инструменты дизайна интерфейсов — https://t.me/pdigest/86.

#tools

Июльский дайджест полностью готов — осталось только нажать «Опубликовать» утром в понедельник. Вот несколько целостных памяток и наборов принципов из него:

1. Amber Case говорит о проблемах современных экранов, которые излучают синий свет — это сажает глаза и мешает сну — https://medium.com/@caseorganic/why-blue-light-is-so-bad-the-science-and-some-solutions-d992a352464b. Синий свет выделяет наибольшую энергию, поэтому в другой статье она и учёные рекомендуют оранжево-красные, которые используют военные и та же BMW — https://www.fastcompany.com/90177573/how-blue-became-techs-favorite-color-and-why-it-shouldnt-be.

2. Louise Downe, глава дизайна Government Digital Services (делают GOV.UK) приводит свои принципы проектирования услуг — https://blog.louisedowne.com/2018/06/14/15-principles-of-good-service-design/.

3.1. Памятка по поддержке пользователей с ограниченными возможностями от команды американских гос.сайтов — https://accessibility.digital.gov/.

3.2. На эту же тему Microsoft записали серию коротких обучающих роликов — https://www.youtube.com/playlist?list=PLtSVUgxIo6KqBBGqNdPQG64f-hTs1YxFM.

Конечно, на днях стартовал третий месяц лета и конкуренция за внимание огромная, но мало ли, успеете устать от отдыха так, что захочется полезного :)

#principles

Онлайн-школа дизайна и иллюстрации Bang Bang Education знатно пошумела этим летом с фильмом "100 лет дизайна". Да и темп выпуска новых курсов от сильных отечественных дизайнеров у них не утихает — это один из главных игроков на рынке онлайн-образования для дизайнеров.

Школа ведёт канал в Телеграме — https://t.me/bangbangeducation. В нём уйма полезного — свежие беседы с арт-директорами, дизайнерами, руководителями дизайн-студий и стартапов; рассказы про новые курсы; советы; подборки полезных ссылок и находок (в основном по графическому дизайну, по истории дизайна, по дизайн-мышлению и немного по искусству) под тегом #абсолютный_список.

В начале года мы обсуждали с ними коллаб на одну из моих любимых тем. Кажется, контент для него на подходе — значит, и более детальный анонс не за горами :)

Собрал дайджест продуктового дизайна за июль 2018 ― https://jvetrau.com/digest-2018-jul/. Спасибо ребятам из Setka за редактор статей и помощь в работе с ним.

Напомню, что его можно получать разными способами:
— ВКонтакте — https://vk.com/pdigest
— Facebook — https://www.facebook.com/groups/pdigest/
— Рассылка по почте — http://eepurl.com/bu61XX

8 августа одной из старейших UX-компаний Nielsen/Norman Group исполняется 20 лет. Якоб Нильсен собрал самые популярные статьи за каждый год работы компании — https://www.nngroup.com/articles/nielsen-norman-group-20-years/ — они делают огромную услугу проф.сообществу, делясь с нами такой массой полезностей. Причём зачастую это достаточно глубокие и актуальные материалы, которые всё ещё задают тренды спустя столько лет.

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

1. Продолжение рассказа о большом пользовательском исследовании голосовых помощников Alexa, Google Assistant и Siri. Во второй статье они пишут об отношении людей к таким устройствам и ожиданиям о качестве ответов и формате диалогов — https://www.nngroup.com/articles/voice-assistant-attitudes/. Про первую было в недавнем обзоре голосовых интерфейсов — https://t.me/pdigest/83 — это один из лучших материалов на эту горячую тему. Более ранняя публикация на тему — https://www.nngroup.com/articles/voice-first/.

2. Хвалят основанное на жестах управление iPhone X — https://www.nngroup.com/articles/iphone-x/. Удивительно: компания очень настороженно относится ко многим новым интерфейсным решениям (зачастую оправданно).

3. Разбирает один из самых известных концептов компании ― F-образный паттерн чтения сайтов — https://www.nngroup.com/articles/f-shaped-pattern-reading-web-content/. Правда, многие понимают его совсем неправильно ― он сигнализирует о не очень эффективной организации контента, а не оправдывает её. Она приводит другие паттерны поведения пользователей при работе с информацией.

4. Выводы из исследования о том, как пользователи относятся к почтовым рассылкам — https://www.nngroup.com/articles/newsletters/. Например, понятие "спам" изменилось — сейчас им всё чаще называют письма от сервисов, на которые пользователь сам подписался.

5. Исследование на тему навязчивости разных форматов рекламы в вебе и на мобильных — https://www.nngroup.com/articles/most-hated-advertising-techniques/. Правда, оно делалось на базе wireframes, а не реальных баннеров, но в любом случае смотрели на влияние разных отвлекающих факторов и в целом анти-рейтинг выглядит логично.

6. Jeff Sauro и Christian Rohrer из Capital ONE создали интегральный метод экспертной оценки юзабилити PURE — https://www.nngroup.com/articles/pure-method/. Он хорошо работает для поиска и ранжирования наиболее явных проблем в тех продуктах, где проведение юзабилити-тестирования сложно. Статья Jeff Sauro — https://measuringu.com/pure/.

Я был на их серии мастер-классов Usability Week в 2012 году — https://www.nngroup.com/courses/. Они, конечно, достаточно базовые. Но это отличный способ закрыть пробелы в ключевых навыках. 3-дневный курс от Bruce Tognazzini в его рамках так вообще идеальный ликбез — он хоть и основан на его книге 1994 года, но эти принципы были и будут актуальны ещё долго.

Компанию основали мастодонты профессии — Jakob Nielsen, Donald Norman и Bruce Tognazzini (он, правда, светится на публике меньше). Они вырастили отличную команду, которая постоянно рассказывает наружу интереснейшие находки. Так что спустя 20 лет остаются не просто важной для истории компанией, но и одним из ключевых её двигателей.

#industry #links

Чаще всего мне задают два вопроса:

1. Как ты всё успеваешь и правда ли сам пишешь дайджест? (спойлер: сам)
2. Подскажи дизайнера!

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

В итоге отправляю в группу «Ищу_дизайнера» ― она специализируется на дизайнерских вакансиях. Она одна из крупнейших в Фейсбуке (33 тыщи), я и сам публикую наши открытые позиции в ней. В прошлом году у них появился канал в Телеграме ― https://t.me/designer_ru/.

Сама группа в Фейсбуке ― https://www.facebook.com/groups/512613598826785/ (у ребят есть ещё и сайт с жирным доменом www.designer.ru). Видимо, всем спрашивающим буду кидать ссылку на этот пост 🙂

P.S. Кстати, на первый вопрос обычно отвечаю презентацией о фоновых исследованиях ― https://www.slideshare.net/jvetrau/wud2014-yvetrov-background-research. Какие-то сервисы поменялись, но в целом подход работает и сейчас.

P.P.S. В этом канале нет и не будет рекламы, но взаимопиар — почти единственный способ растить аудиторию канала в Телеграме. Я иногда делаю ВП, но без фанатизма и в любом случае про то, что не стыдно рекомендовать.

Продолжаем качать насмотренность и искать добротные интерфейсные паттерны или интересные эксперименты с ними. В этом выпуске:

1. Nathan Gitter впечатлился выступлением «Designing Fluid Interfaces» на WWDC 2018 и сделал серию экспериментальных интерфейсных решений, которые показывают похожую анимацию в ходе управления жестами — https://medium.com/@nathangitter/building-fluid-interfaces-ios-swift-9732bb934bf5.

2. Команда SteelKiwi Inc. сравнивает реализацию типовых интерфейсных задач в Android и iOS — https://medium.muz.li/differences-between-designing-native-ios-apps-and-native-android-apps-e71256dfa1ca. Годная памятка для тех, кто только начинает изучать специфику мобильных платформ.

3. Экспериментальная лаборатория пытается понять, какие новостные форматы подойдут для поколения Z. В первой части статьи Tristan Ferne разбирает имеющиеся на рынке подходы — https://medium.com/bbc-news-labs/beyond-800-words-new-digital-story-formats-for-news-ab9b2a2d0e0d. Во второй дизайн-команда сделала несколько интерактивных прототипов — https://medium.com/bbc-news-labs/beyond-800-words-prototyping-new-story-formats-for-news-e3102e783b5f.

4. Kim Flaherty из Nielsen/Norman Group подсказывает, как лучше показывать разделы помощи и поддержки клиентов на сайте — https://www.nngroup.com/articles/customer-service-model/.

5. Dre Zhou из Askable показывает, как предзаполнение форм и избегание совсем нулевых результатов повышает конверсию и комфорт пользователей — https://uxdesign.cc/default-valid-vs-default-invalid-641570ae2fec.

Коротенько, потому что многие жалуются на длинную писанину. Но ведь столько всего интересного происходит в профессии, что фиг остановишься! Короч, до скорых встреч :)

#patterns

Для восьмого выпуска мини-дайджеста о дизайн-менеджменте подсобрал примеров работы известных дизайн-команд и полезных советов об их организации. Например:

1. Chris Lee пообщался с дизайн-менеджерами и директорами Dropbox, Airbnb, Facebook и других компаний и составил небольшую памятку по их подходам к управлению дизайн-процессами и командами — https://medium.muz.li/things-i-learned-interviewing-design-leaders-from-the-valleys-top-companies-ddeec3042f7a.

2. Кстати, vc.ru с весны ведёт отличную серию историй российских дизайн-студий и креативных агентств — https://vc.ru/category/%D0%B8%D1%81%D1%82%D0%BE%D1%80%D0%B8%D0%B8%D0%B0%D0%B3%D0%B5%D0%BD%D1%82%D1%81%D1%82%D0%B2. Вышла уже дюжина рассказов с хорошим обзором бизнеса и результатов.

3. Andre Le Masurier из лондонского Google рассказывает о том, как устроена команда дизайна бренда — https://www.invisionapp.com/blog/googles-andre-le-masurier/.

4. Блог дизайн-команды Asana ― https://medium.com/asana-design. Пока пустовато, но ребята бодрые и должны раскачаться.

5. Dave Malouf размышляет на тему применимости организационной модели Spotify и любых других методологий и рабочих подходов — https://medium.com/amplify-design/the-allure-of-a-shiny-misunderstood-silver-bullet-925a9f643f2. Важно понимать, что они предполагают определённую культуру и договорённости, которые могут работать в одной и не получиться в другой компании.

6. Издательство Rosenfeld Media выпустило книгу Kevin Hoffman «Meeting Design: For Managers, Makers, and Everyone» ― https://rosenfeldmedia.com/books/meeting-design/. UXmatters публикует главу 5 из неё о стилях фасилитации — https://www.uxmatters.com/mt/archives/2018/08/book-excerpt-meeting-design.php.

P.S. Кстати, моя заметка о DesignOps вышла на английском — https://uxdesign.cc/designops-or-ux-strategy-or-design-management-or-design-leadership-b579c1070f18. Между тем, в LinkedIn настоящий шторм переименований должностей — интересно, какого масштаба достигнет эта волна к концу года :)

#designmanagement #designops

Организаторы одной из трёх крупнейших отечественных дизайн-конференций Design Prosmotr запускают новую, с упором на иностранных спикеров. Design Trend (http://designtrend.ru/) пройдёт на выходных 15-16 сентября в Москве. Упор на графический дизайн, брендинг и всё такое.

В составе Luke Hayman (Pentagram), Rama Allen (The Mill), Ken Cato (Cato Brand Partners), Fritz Gottschalk (Gottschalk+Ash), Adrian Shaughnessy (Unit Editions), Fredrik Öst и Erik Kockum (Snask), Greg Durrell (Hulse&Durrell) и пара отечественных ребят — 13 экспертов из 7 стран.

Иностранные спикеры к нам приезжают часто (сейчас, например, очередное лето на Стрелке с топовыми ребятами), но в таком объёме за раз — не так регулярно. Пару лет это делали организаторы российского OFFF, но сейчас он на паузе. Не знаю, перехватят ли ребята знамя, но инициатива отличная и сил они положили на это прилично. Больше подробностей про место проведения, билеты и всё остальное — http://designtrend.ru/.

Если вы ищете, куда ещё сходить прокачаться, то Татьяна Смирнова ведёт канал @mosdesign с анонсами митапов, конференций и других мероприятий в Москве про дизайн. Вот, например, афиша на август — https://t.me/mosdesign/60, на подходе сентябрьская. Многие начинали аналогичные подборки, но со временем затухали. Я и сам бы хотел делать такую в своём дайджесте, но и так слишком много времени трачу на него. Надеюсь, у Тани хватит терпения надолго :) Подписаться — https://t.me/mosdesign/.

#events #conference

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

1. Kyle Peatt рассказывает историю создания дизайн-системы Shopify Polaris — https://ux.shopify.com/the-system-always-kicks-back-d94b945407f2. Очень годный разбор особенностей и проблем внедрения и популяризации платформы. Например, многие компании видят дизайн-систему как способ поднять базовый уровень дизайна продуктов, но типовые решения могут ограничивать дизайнеров; поэтому они постоянно делают «концепт-кары» — эксперименты с интерфейсными паттернами в духе единого дизайна, которые двигают Polaris вперёд.

2. Matt Bond недавно перешёл в Asana, но стоял у истоков дизайн-системы Atlassian — https://medium.com/asana-design/the-key-lessons-i-learned-creating-a-popular-design-system-d078c817b4dd. Он рассказывает о ключевых выводах, которые сделал для себя при работе над ней.

3. Толковый рассказ Anthony Zhang из Oscar Health о постепенном развитии дизайн-системы в компании — https://medium.com/oscar-tech/six-lessons-learned-by-creating-a-design-system-at-a-fast-moving-start-up-30ba8458fa20. Как делать её без надрыва, потихоньку дополняя и обновляя.

4. Liz Khoo из Salesforce рассказывает о взаимодействии команд, работающих над дизайн-системой — https://medium.com/salesforce-ux/evolving-a-design-system-at-scale-88aa2f249525.

Ну и скриптец в тему: Facundo Corradini показывает способ задавать цвет текста в элементе управления в зависимости от фона средствами CSS — https://css-tricks.com/switch-font-color-for-different-backgrounds-with-css/. Это упрощает описание компонентов в дизайн-системах.

Между делом открылась регистрация на специализированную конференцию Clarity в Нью-Йорке — https://www.clarityconf.com/ (10-12 декабря). Первая была огонь, вторая совсем в молоко (был там и обломался — https://www.facebook.com/502273249/posts/10155309403678250/). На третью программы пока нет, но надо быть осторожным, чтобы опять не попасться на имеющие мало отношения к теме презентации.

#designsystems

Кто за ROI дизайна не воевал, тот жизни не видал. Тема всплывает регулярно — почти каждая дизайн-команда в период роста своего количества и качества просит больше ресурсов, влияния на продуктовые решения и других ништяков, которые нужны для более лучших продуктов. Вот несколько мыслей на тему:

1. Angela Huenerfauth и David Teller предлагают крайне интересный метод оценки зрелости дизайна продукта — http://uxpamagazine.org/creating-usability-maturity-models/. Они договорились с менеджерами продуктов об отслеживании этого показателя по ходу работы разработки и принимают совместное решение о достаточном уровне юзабилити для его выпуска. На вид сложновато, но это, возможно, оттого что подход пока совсем незнаком.

2. Aaron Powers и Scott Mackie из Athena Health полемизируют с недавними провокационными статьями Alan Cooper и Jared Spool о ROI дизайна — https://medium.com/athenahealth-design/getting-questions-about-the-roi-of-ux-3-ways-to-refocus-the-conversation-to-opportunities-9a3ef763cb34. Это здоровый вопрос любой продуктовой команды — в какие активности лучше всего инвестировать ресурсы. Авторы показывают несколько примеров из своей практики, которые упрощали выбор команд.

3. Dani Nordin из Athena Health описывает подход компании к решению дизайн-долга — https://medium.com/athenahealth-design/creating-a-sustainable-strategy-for-tackling-product-wide-ux-debt-5542c6b028bd. Толковый системный метод, как и всё, о чём пишет команда.

4. Памятка Jeff Sauro по ключевым интерфейсным метрикам — https://measuringu.com/ux-benchmark-metrics/.

Тема сложная, так что всего четыре ссылки. Да и этим летом я слегка зачастил с публикациями, поэтому попробую найти баланс между их здоровым количеством и ЖЕЛАНИЕМ ОБЯЗАТЕЛЬНО РАССКАЗАТЬ ВАМ ОБ ВОТ ЕЩЁ ОДНОЙ СТАТЕЕЧКЕ :) Постепенно возвращаюсь к формату 2-3 постов в неделю.

#metrics #roi

Собрал дайджест продуктового дизайна за август 2018 ― https://jvetrau.com/digest-2018-aug/.

Напомню, что его можно получать разными способами:
— ВКонтакте — https://vk.com/pdigest
— Facebook — https://www.facebook.com/groups/pdigest/
— Рассылка по почте — http://eepurl.com/bu61XX

#digest

В августе в мире новых инструментов дизайна выдалось относительное затишье, но это они к осени готовились. Вот пачка свежих блестящих игрушек для тех, кто уже успел перескочить со Скетча на Фигму, а с неё — на Framer X (и опять подумывает, что засиделся):

React Proto (https://react-proto.github.io/react-proto/): Экспериментальный инструмент помогает переводить макеты Sketch в компоненты на React. Он облегчает разбивку экрана на отдельные паттерны, каждый из которых может иметь вложенность и логику поведения.

Affinity Publisher (https://affinity.serif.com/en-gb/publisher/): Компания запускает конкурента InDesign — постепенно откусывает всё больше от продуктовой линейки Adobe. Бета-версия уже доступна и пока что бесплатна. Видео-демонстрация — https://www.facebook.com/affinitybyserif/videos/2095064040528220/.

Principle 4.0 (http://principleformac.com/posts/principle-four.html): Много улучшений по редактору и возможностям анимации.

Trailer (https://www.trailerapp.io/): Приложение для Mac помогает делать видео работы с интерфейсом для продуктовых промо-роликов. Видео работы — https://www.youtube.com/watch?v=1Zod9UkS05Y.

Preely (https://preely.com/): Инструмент помогает собирать и тестировать интерактивные прототипы интерфейсов. Импорт из Sketch и достаточно обширная аналитика по выполнению сценариев.

FramerX: Постепенно рассказывают о ключевых функциях: лейауты — https://framer.com/x/layout/ и рисование — https://framer.com/x/drawing. Работа с лейаутами крайне интересна и обещает сильно упростить жизнь дизайнерам. Antoine Plu делится впечатлениями о бета-версии — https://blog.prototypr.io/framer-x-preview-9d067f35cf9a (он записал скринкаст работы).

А ещё появилось официальное описание того, как работают компоненты — https://framer.gitbook.io/framer/components/design. Возможность импортировать любые компоненты на React упоминается.

Adobe XD: Июльское (https://theblog.adobe.com/july-2018-release-of-adobe-xd-stroke-enhancements-commenting-on-design-specs-and-more/) и августовское обновления (https://theblog.adobe.com/august-2018-release-of-adobe-xd-reorder-assets-asset-extraction-and-more/). Улучшение работы с выдачей спецификаций разработчикам и интеграция со сторонними инструментами. Читайте подробный разбор Adobe XD от издания Prototypr — https://blog.prototypr.io/hands-on-with-adobe-xd-f82be12f405f.

Figma: Добавлены расширенные способы взаимодействия с прототипом — https://blog.figma.com/the-finale-of-prototyping-week-interactions-e30182a8ff8e. Небольшой курс от Designlab — https://trydesignlab.com/figma-101-course/.

Abstract (https://www.goabstract.com/): Серьёзно обновился сайт инструмента.

Бонус: Пачка шикарных шаблонов для набросков интерфейсов дополненной и виртуальной реальности от Владимира Курбатова — https://medium.com/inborn-experience/templates-for-ar-vr-sketches-e424dfb60e54.

Готовимся к новому рывку наших старых знакомых (Sketch должен приструнить выскочек, а Adobe проведёт конференцию MAX с кучей анонсов), ждём новых «убийц» привычных продуктов и следим за тем, насколько разойдутся шопоголики из InVision в сезон распродаж.

#tools

В среду анонсировали новые телефоны iPhone Xs, Xs Max и Xr. Хотя печально видеть, что весь мир упоролся и готов есть гумус ложками (экраны с «чёлкой», ухудшающей ландшафтный режим, стали нормой), дизайн для них никто не отменял.

За два дня успели нагенерировать уйму шаблонов для подачи макетов:
— iPhone Xs и Xs Max от Lstore (https://lstore.graphics/free-iphone-xs/), Apply Pixels (https://applypixels.com/template/iphone-xs/), Virgil Pana (https://dribbble.com/shots/5239796-iPhone-XS-vector-mockup) и Pixeden (https://www.pixeden.com/psd-mock-up-templates/psd-iphone-xs-max-mockup).
— iPhone Xr от Apply Pixels (https://applypixels.com/template/iphone-xr/) и Pixeden (https://www.pixeden.com/psd-mock-up-templates/psd-iphone-xr-mockup).

Разрешение (https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/adaptivity-and-layout/) и плотности (https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/image-size-and-resolution/) экрана новых телефонов есть в официальных гайдлайнах. Самое важное:
— iPhone Xs — 1125px × 2436px (5,8", @3x)
— iPhone Xs Max — 1242px × 2688px (6,5", @3x)
— iPhone Xr — 828px × 1792px (6,1", @2x)

Сам iOS 12 прилетит на устройства в понедельник, 17 сентября. Актуальный UI Kit для Sketch, Adobe XD, Photoshop и Keynote есть на сайте Apple — https://developer.apple.com/design/resources/.

Apple Watch как платформа для сторонних приложений оказались не такими востребованными (даже свежих шаблонов быстро не нашлось), но показали их 4 поколение с более крупным экраном и изменёнными циферблатами на новой watchOS 5 — https://www.apple.com/ru/apple-watch-series-4/. Они тоже стремятся к безрамочности. Размеры экрана — https://developer.apple.com/design/human-interface-guidelines/watchos/visual-design/display-sizes/:
— 44mm — 368px × 448px
— 40mm — 324px × 394px

В общем, пора обновлять портфолио, а то что вы как лохи с морально устаревшим iPhone X :)

P.S. Как правильно писать — Xs или XS? Даже в гайдлайнах Apple пока по-разному, так что ждём устаканивания.

#tools #templates

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

1. Шикарнейшая памятка по работе с интерфейсной анимацией от Taras Skytskyi — https://uxdesign.cc/the-ultimate-guide-to-proper-use-of-animation-in-ux-10bd98614fa9. Он обозревает реальные ситуации в работе с цифровыми продуктами, а не абстрактные законы из мира классической анимации и всё это на наглядных примерах.

2. Therese Fessenden из Nielsen/Norman Group рассказывает о теории заметности и интерпретации элементов интерфейса — https://www.nngroup.com/articles/prominence-interpretation-theory/. Их сочетание влияет на восприятие продукта в целом.

3. Простые и наглядные советы Rachel McConnell из Deliveroo по написанию хороших названий для кнопок в интерфейсе — https://medium.com/deliveroo-design/lets-do-this-how-to-write-better-calls-to-action-ea534768b599.

4. Xinyi Chen и Yuxuan (Tammy) Zhou из Nielsen/Norman Group описывают подходы к быстрой авторизации через QR-код или одноразовый код в китайских мобильных приложениях — https://www.nngroup.com/articles/mobile-login-china/.

5. Saadia Minhas детально разбирает ситуации, в которых нужно использовать чекбокс и тумблер — они решают схожие задачи, но не взаимозаменяемы — https://uxplanet.org/checkbox-vs-toggle-switch-7fc6e83f10b8.

6. Памятка Stéphanie Walter по дизайну мобильных форм — https://www.smashingmagazine.com/2018/08/ux-html5-mobile-form-part-1/. Со времён классической книжки Luke Wroblewski мало что поменялось, но её нового издания явно не хватает, так что статья полезна. Часть 2 рассказывает об обработке полей ввода на мобильных — https://www.smashingmagazine.com/2018/08/ux-html5-mobile-form-part-2/.

Хороший дизайнер (носматриваеться).

#patterns

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

1. Что включается в релизы и с чего вообще начинать — https://medium.com/eightshapes-llc/releasing-design-systems-57fca91a23f6.

2. Как строить релизный цикл — https://medium.com/eightshapes-llc/design-system-release-cadence-2e3e6694ba21

3. Версионирование на разных уровнях (библиотека компонентов, сами компоненты, дизайнерские шаблоны и токены) — https://medium.com/eightshapes-llc/versioning-design-systems-48cceb5ace4d

4. Как и когда выкатывать новые версии — https://medium.com/eightshapes-llc/visual-breaking-change-in-design-systems-1e9109fac9c4

Кстати, если вы пропустили, то весной он написал серию статей об описании компонентов в живых гайдлайнах — https://medium.com/eightshapes-llc/documenting-components-9fe59b80c015 (две части ещё не опубликованы).

Ну а самый главный вопрос — когда же он наконец напишет книжку, ведь статей у него уже несколько десятков. Это будет самое ценное руководство по внедрению дизайн-систем. Тем более, что самую первую книгу о них написал тоже он, ещё в 2009 году — http://www.peachpit.com/store/modular-web-design-creating-reusable-components-for-9780321601353.

Короч, подписывайтесь — https://medium.com/eightshapes-llc/.

#designsystems

Вышла электронная книга «Enterprise Design Sprints» по дизайн-спринтам от InVision — https://www.designbetter.co/enterprise-design-sprints. Автор — Richard Banfield, который уже выпускал книгу на тему — http://shop.oreilly.com/product/0636920038573.do.

Я пока не добрался до неё, но оригинальная «Sprint» от Jake Knapp из Google Ventures (https://www.thesprintbook.com/) — одна из лучших книг по дизайну интерфейсов в целом. На вид процесс понятен и концептуально похож на дизайн-мышление, чего тут писать на 500 страниц?! Но книга запредельно методологична — этого не хватает очень многим практическим изданиям. В этом году вышел её перевод — https://www.alpinabook.ru/catalog/StartupsInnovativeEntrepreneurship/124511/.

Jake ушёл из Google Ventures в конце прошлого года (https://medium.com/@jakek/taking-some-old-advice-d48b94175de8) — хочет написать 12 книг и консультирует другие компании.

Например, недавно он провёл мета-дизайн-спринт для New York Times — https://open.nytimes.com/how-to-run-13-design-sprints-at-once-inside-maker-week-at-the-new-york-times-5d3b95ca2441. В рамках ежегодного хакатона компании 13 команд одновременно решали свои задачи с помощью методологии.

Весной я писал про дискурс вокруг дизайн-мышления — https://t.me/pdigest/59 и https://t.me/pdigest/60, вариацией на тему которого являются дизайн-спринты. Сильные компании адаптируют методологию под свои задачи и специфику продуктового дизайна. Наиболее известны три:

1. Design Sprints от Google — https://designsprintkit.withgoogle.com/ (максимальный хайп)
2. IBM Design Thinking — https://www.ibm.com/design/thinking/ (фокус на масштабирование)
3. Design 4 Delight от Intuit — http://www.intuitlabs.com/design-for-delight/ (начали одними из первых)

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

Да и полностью повторить их по методичке редко возможно — например, дизайн-спринты предполагают 5-дневный формат. Но даже внутри Google их используют в упрощённом виде. А на одном из их калифорнийских митапов на вопрос «Кто использует дизайн-спринты в 5-дневном формате» руку не поднял никто. В общем, трезво оценивайте то, что льют вам в уши :)

#designthinking #designsprint #methodology