Дайджест собирает свежие статьи по дизайну интерфейсов, а также инструменты, паттерны, кейсы, тренды и исторические рассказы с 2009 года. Я тщательно фильтрую большой поток подписок, чтобы вы могли прокачать свои профессиональные навыки и лучше решить рабочие задачи. Предыдущие выпуски: апрель 2010-апрель 2022.
Паттерны и лучшие практики
Four Tradeoffs When Designing Navigation Menus
Dan Brown из EightShapes перечисляет 4 компромисса при проектировании меню в интерфейсе.
Designing A Better Language Selector
Виталий Фридман разбирает грамотные способы сделать переключение языка в интерфейсе.
Intranet-Search Essentials
Anna Kaley из Nielsen/Norman Group собрала лучшие практики дизайна поиска в интранете.
How Inclusive Are Your Designs? Use This Audit to Find Out
Памятка по дизайну инклюзивных интерфейсов от команды сервиса Indeed. Анонс от Sneha Dasgupta.
Why So Many Luxury Brands Are Terrible at Ecommerce
Kate Moran анализирует, почему многие люксовые бренды делают такие плохие интернет-магазины по сравнению с фешенебельным опытом в офлайне.
Design Guidelines for Selling Products with Multiple Variants
Советы Kim Salazar из Nielsen/Norman Group по представлению товаров с модификациями в интернет-магазинах.
Make It Clear Where Hit Areas in Visual Elements Lead: 33% of Sites Don’t
Советы Mark Crowley из Baymard о том, как выделять кликабельные элементы в сложных карточках. Тем более, если есть риск перепутать области нажатия.
How to Display Price Discounts on the Product Page: Avoid These 4 Pitfalls (18%+ Have One or More)
Kathryn Totz из Baymard подсвечивает типичные проблемы в представлении скидок в интернет-магазинах.
UX and NPS Benchmarks of News Websites (2022)
Jeff Sauro, Dylan Atkins и Jim Lewis провели повторное сравнительное юзабилити-тестирование новостных сайтов и выделили ключевые драйверы хорошего отношения к ним.
How Linkedin Increased Notification Opt-in Rates by 500%
Сайт Growth Design подсвечивает отличный паттерн для включения уведомлений в LinkedIn. Он гипер-контекстный и от этого работает особенно удачно.
Дизайн-системы и гайдлайны
Building a button component
Adam Argyle описывает все аспекты реализации кнопки в коде с учётом всех современных требований (состояния, accessibility, тёмная тема и т.п.).
Android 13 для дизайнеров
Ежегодная презентация Google I/O прошла 10-11 мая. Обычно я делаю разбор нового для дизайнеров в свежем Android 13, но его особо нет — разве что оптимизация для мёртвого жанра планшетов и альтернативных способов ввода (перо и клавиатура). Уделили время лучшей провязке разных Android-устройств.
Также показали новый интерфейс выбора фото и запроса разрешений у пользователя. Можно настроить логику работы кнопки/жеста «назад» и использовать стандартный сканер QR-кодов. Android Studio подсказывает, как оптимизировать accessibility.
Тёмная тема оформления
Dark Mode Toggles Should be a Browser Feature
Bramus Van Damme считает, что переключение тёмной темы должно быть кнопкой в самом браузере, а не на конкретном сайте. Это сэкономит много лишнего кода. Он показывает своё предложение по реализации.
You Don’t Need A UI Framework
Josh Comeau рассуждает на тему необходимости использования готовых интерфейсных фреймворков. Зачастую они избыточны.
UXPin Merge Component Manager
Новая функция управления компонентами в UXPin Merge позволяет импортировать реализацию в коде в инструмент дизайна, а дальше — собирать интерактивные прототипы.
Automate accessibility tests with Storybook
Varun Vachhar рассказывает об автоматизированном тестировании accessibility в Storybook.
Manage Accessible Design System Themes With CSS Color-Contrast()
Daniel Yuschick разбирается с особенностями работы нового свойства CSS color-contrast(), которое здорово поможет в повышении качества accessibility в дизайн-системах. Это позволит автоматически выбирать цвет шрифта для текущего фона из набора возможных.
Понимание пользователя
Top Tasks — To Focus On What Matters You Must De-Focus On What Doesn’t
Топовая памятка топового Gerry McGovern по методу анализа топовых задач пользователей в продукте. Это один из самых полезных способов понять потребности пользователей.
Understanding User Behaviors Across Surfaces
Hayley Yudelman, Aakanksha Parameshwar, Sohit Karol и Harini Sampath рассказывают об исследовании кросс-платформенной работы пользователей Google Cloud. Как они переключаются между графическим интерфейсом, командной строкой и другими способами управления сложным сервисом.
Neurodiversity and Inclusion — Choosing Kinder Design
Sophie Clifton-Tucker даёт советы по оптимизации интерфейса под разные виды «нейроразнрообразия» (термин, который всё чаще всплывает в дизайнерских статьях).
Personas vs. Archetypes
Page Laubheimer из Nielsen/Norman Group сравнивает методы персонажей и архетипов для описания целевой аудитории.
5 illustrations to understand and promote accessibility
Несколько наглядных постеров о нюансах поддержки accessibility от Stéphanie Walter.
4 Research-based Principles for Preventing Service Agent Burnout
Emily Witt из Salesforce рассказывает о выводах из исследования работы операторов поддержки в пост-пандемийную эпоху.
How Can a Blind Person Use Virtual Reality?
Интервью с Jesse Anderson, который изучает вопросы accessibility для слабовидящих в виртуальной реальности. Как создатели устройств и конкретных приложений помогают в этом.
Новые инструменты дизайна интерфейсов
Figma
Крупные обновления: работа с тёмной темой, переосмысленный auto layout, свойства компонентов для упрощения версий (беглый обзор), вариативные шрифты, куча полезного для совместной работы. Экранный диктор для прототипов.
Конференция Figma Config прошла 10-11 мая в интернете. Обзор основных тем.
Статьи
Nathan Curtis: Форматы общих библиотек в дизайн-системе. Как организовать команду и процесс обновления, а также разделить компоненты на отдельные частные библиотеки.
Motion DevTools
Плагин для Chrome добавляет в инструменты разработчика панель для тюнинга анимации в вебе.
Leonardo
Генератор цветовых палитр от Adobe сильно обновился и теперь позволяет делать в том числе палитры для визуализации данных.
Пользовательские исследования и тестирование
User research strategy
Jonathan Richardson предлагает подход к стратегии пользовательских исследований для серии связанных проектов. Часть 2.
How to Create An Effective Taxonomy
Sina Schreiber из Condens и Roberta Dombrowski из User Interviews провели воркшоп по проектированию таксономии базы знаний и инсайтов из пользовательских исследований. В статье материалы и шаблон.
The Interplay Between Perceived Usability and Quality in Visual Design for Tablet Game Interfaces
Uttam Kokil и Tracy Harwood рассказывают о своих находках на тему известного предположения «красивое кажется более удобным». Они изучили предыдущие исследования на тему и протестировали прототип игры в разных вариациях.
Insights Repositories with Nada Alnakeeb and Joanna Perez
Толковая дискуссия с Nada Alnakeeb из DoorDash и Joanna Perez из Netflix о базах знаний и инсайтов из пользовательских исследований.
Welcome to the Journal of User Experience
Bill Albert и Jim Lewis анонсируют переименование классического профессионального издания «The Journal of Usability Studies» в «The Journal of User Experience». Для такого научно обоснованного журнала это не просто формальность, а отражение окончательной смены эпох в профессии.
How to triangulate data from multiple sources in user research
Nikki Anderson из Dovetail делится своим опытом триангуляции данных при проведении пользовательских исследований.
Similar but different. Data Science, User Experience, and Behavioral Science
Connor Joyce разбирает разницу между профессиями Data Science, User Experience и поведенческой наукой. Они анализируют пользователя с разных точек зрения. Connor также описывает своё понимание профессии специалиста по прикладному поведению пользователей.
Recruiting High-Income Participants — Challenges and Tips
Советы Kate Moran из Nielsen/Norman Group по рекрутингу респондентов с высоким доходом, которых сложно найти обычными способами.
How Indeed Established a Major UX Research Org in Just a Few Years
Dave Yeats рассказывает историю развития команды пользовательских исследований сервиса Indeed. Как они выросли с 2 до 100 человек.
Checklist for Moderating a Usability Test
Чеклист для модератора юзабилити-тестирования от Maria Rosala из Nielsen/Norman Group.
Drag-and-Drop Versus Numeric Entry Options — A Comparison of Survey Ranking Questions in Qualtrics
Shaun Genter, Yazmín García Trejo и Elizabeth Nichols изучили разницу в способах представления опросов, где от пользователя требуется расставить список в нужном порядке. У перетаскивания и вбивания номеров вручную свои плюсы и минусы.
Digital Ethnography with Megan McLean of Spotify
Интервью с Megan McLean из Spotify об особенностях этнографических исследований в эпоху вечной удалёнки.
Overcoming Social Desirability Bias
Советы Dan Busso из Meta, помогающие снизить эффект «социальной благожелательности» при проведении пользовательских исследований. Например, при общении с подростками.
Find usability issues in games with playtests
Краткая памятка по проведению игровых тестов от Steve Bromley.
Визуальное программирование и дизайн в браузере
Principles of Color? Going Beyond sRGB
Jim Nielsen рассуждает о возможном прогрессе развития экранов устройств. После перехода на ретину один из немногих способов поднять планку дальше — расширенные цветовые пространства и модели описания цветов.
LCH is the best color space for UI — Deep dive into color theory
Vojtěch Vidra и Ondřej Pešička описывают преимущества формата описания цветов LCH и показывают, как работать с ним.
Contextual Spacing For Intrinsic Web Design
Stephanie Eckles перечисляет варианты описания в CSS адаптивности для конкретных элементов интерфейса.
Deep Dive into Text Wrapping and Word Breaking
Разные способы реализовать перенос строк в адаптивности на CSS.
Новые скрипты
Метрики и ROI
A Guide to Study-Based UX Metrics
Уникальная памятка по интерфейсным метрикам на уровне всего исследования от Jeff Sauro и Jim Lewis. Удовлетворённость и лояльность, бренд и визуальный дизайн, юзабилити и полезность, доверие, плюс куча специализированных вроде голосовых интерфейсов.
Net Promoter 3.0
Fred Reichheld, Darci Darnell и Maureen Burns предлагают важное дополнение к NPS: концепцию «заработанного» роста. Она считает клиентов, которые пришли благодаря хорошему сервису, т.е. продолжили пользоваться или начали благодаря рекомендации. Многие компании научились манипулировать NPS, так что они пытаются сбалансировать метрику статистикой реальных продаж. Занятно, что это противоречит школе мысли Byron Sharp, который не верит в заметный рост благодаря рекомендациям.
Designers, (Re)define Success First
Lennart Overkamp размышляет на тему прогресса во внедрении этичного дизайна. Прогресс скорее теоретический, потому что дизайнеры мало влияют на суть бизнеса. Он разбирает разные этапы, где всё-таки можно вклиниться.
Дизайн-менеджмент и DesignOps
The Leadership Ceiling — A framework for diagnosing your situation
Peter Merholz рассказывает о концепции «лидерского потолка» Tim Kieschnick. Он оценивает три ключевых составляющих (цель, люди, процесс) по наименее успешному из них — это и есть потолок, который будет тормозить все инициативы. И предлагает разные подходы к работе с ним.
How we think about UX quality
Интересный подход к решению дизайн-долга в Shopify — отдельная команда, которая ищет и решает проблемы в админке продавцов. Sadie Redden и Jordan Ouellette рассказывают о разных уровнях этих проблем.
Hiring and Retaining UX Teams During the Great Resignation
Evan Sunwall рассказывает о результатах исследования Nielsen/Norman Group по современным подходам к найму дизайнеров, когда многие привыкли к миру удалёнки.
UX Roadmaps — Who, When, and How Much Time?
Обзор форматов интерфейсных roadmap от Sarah Gibbons из Nielsen/Norman Group. Кто, когда и как делает их.
How Do You Operationalize Relationship Design as a Skill Set?
Laine Riley Prokay описывает развитие навыков командной работы в Salesforce. Это часть их карты компетенций.
A Conversation About Saying No with Mia, April, and Barrett
Mia Blume, April Neufeld и Barrett Fay из Design Dept рассуждают о способах управления календарём дизайн-менеджера.
8 golden rules of feedback
Правила обратной связи для обсуждения дизайна от Renato Galindo из Atlassian.
Why the player/coach model fails
Mia Blume пишет об ограничениях роли играющего тренера. Она считает, что это возможно только на относительно короткий период перехода в роль постоянного лидера.
Change Is Inevitable
How To Give Effective Feedback Remotely
Советы Joshua Mauldin по организации обратной связи по дизайну при удалённой работе.
How Are Your Facilitation Skills?
Команда Design Dept пишет о важности навыков фасилитации для дизайн-менеджера. Как они помогают выводить сложные ситуации из конфликта в компромисс.
Люби меня, люби. Как дизайнеру и продакту улучшить совместную работу
Иван Соловьёв из Сбер Здоровья даёт советы по тому, как наладить здоровое взаимодействие между дизайнером и менеджером продукта. Чтобы менеджер приходил с проблемой, а не решением.
Продуктовый менеджмент и аналитика
A conversation with Marty Cagan
Интервью с Marty Cagan о его понимании роли и формата пользовательских исследований в современной продуктовой работе.
Методологии, процедуры, стандарты
A Product Design Process for the Real World
Ещё одна версия расширенного «двойного алмаза», на этот раз от Ted Goas. С описанием активностей на каждом этапе процесса, включая разработку.
Кейсы
Developing An Award-Winning Onboarding Process: Case Study
Kata Nagygyörgy и Diana Lakatos рассказывают о перепроектировании сайта с документацией для разработчиков platformOS. Хороший поэтапный рассказ с кучей деталей и методов.
Брендинг цифровых продуктов
The Instagram rebrand embraces the “squircle” — A perfect union between the circle and square
Ребрендинг Instagram, сделанный внутренними силами в партнёрстве с несколькими словолитнями (основной шрифт делали Colophon Foundry). Один из ярчайших примеров за последние годы с сильным характером. Официальная страница и анонс.
Тренды
Everything is trending all at once on TikTok
Terry Nguyen отлично приложил саму идею трендов в современном мире. Зачастую их выдумывают авторы статей и дальше они имеют ограниченную жизнь, а их общий посыл — помочь упаковать какую-то часть культуры для более удобного потребления.
Алгоритмический дизайн
A Guide To Asking Robots To Design Stained Glass Windows
Чумовой рассказ Scott Alexander о том, как он учил нейросеть DALL-E рисовать витражи с определёнными сюжетами. Он постоянно уточнял формулировку запроса, чтобы добиться определённого результата. Это отличный пример того, как дизайнеры могут управлять роботами-дизайнерами.
Imagen
Генератор фото и иллюстраций по текстовому описанию от Google, похожий по смыслу на DALL-E.
Driving a Porsche Taycan for a Week, a UX review
Casper Kessels неделю тестировал автомобильный интерфейс Porsche Taycan. Он подробно описывает его работу.
Customizing Color Fonts on the Web
Myles C. Maxfield и David Jonathan Ross показывают возможности цветных вариативных шрифтов на движке WebKit. Это определённо одна из самых интересных тем года.
Для общего и профессионального развития
Ethical Design Resources
Коллекция ссылок на тему этичного дизайна.
The power of emoji
Интервью с Jennifer Daniel из комитета по стандартам эмоджи, в котором она неплохо раскрывает особенности процесса работы над ними. Как выбираются, как поддерживаются, какие возможности могут появиться.
Your simulator needs a tune-up
Sparky Witte из Live Neuron Labs описывает когнитивные искажения, которым подвержены дизайнеры интерфейсов и продуктовые команды в целом.
Люди и компании в отрасли
Inside Microsoft’s new Inclusive Tech Lab
Рассказ о новой лаборатории инклюзивных технологий Microsoft. Они анонсировали модульную мышь для людей с ограниченными возможностями. И в целом сделали очень интересное офисное пространство.
Подпишитесь на дайджест в Телеграме, ВКонтакте или на vc.ru ― там свежие ссылки появляются каждую неделю. Спасибо всем, кто делится ссылками в группе, особенно Геннадию Драгуну, Павлу Скрипкину, Дмитрию Подлужному, Антону Артемову, Денису Ефремову, Алексею Копылову, Тарасу Бризицкому, Евгению Соколову и Антону Олейнику. Отдельный благодарчик команде Сетки за редактор и Александру Орлову за визуальный стиль.
