Дайджест собирает свежие статьи по дизайну интерфейсов, а также инструменты, паттерны, кейсы, тренды и исторические рассказы с 2009 года. Я тщательно фильтрую большой поток подписок, чтобы вы могли прокачать свои профессиональные навыки и лучше решить рабочие задачи. Предыдущие выпуски: апрель 2010-август 2023.
Исследование: Отношение к продуктовым дизайн-командам в России
Пятый год я провожу исследование: какие дизайн-команды в отечественных продуктовых компаниях самые сильные? С прошлого года результаты стали открытыми (результаты за 2021, 2020, 2019 и 2018).
Такой рейтинг будет полезен рынку. Дизайнерам — лучше понимать, где есть хорошие вызовы и комфортная среда дл я профессионального роста. Компаниям и дизайн-командам — видеть, что нужно докачать.
Паттерны и лучшие практики
Auto Interfaces
Коллекция паттернов автомобильных интерфейсов. Разбито по сценариям использования и экранам, в бета-версии есть полтора десятка машин.
The invisible problem
Шикарный детальный анализ проблем в клавиатурах на мобильных от легенды Scott Jenson. Он также предлагает своё решение, которое представил на симпозиуме UIST.
Accessibility and Inclusivity: Study Guide
Nielsen/Norman Group сделали структурированную подборку своих статей об accessibility и инклюзивности.
App Motion
Коллекция примеров анимации в мобильных приложениях.
Illustrations Universe
Каталог примеров продуктовой иллюстрации.
Новый подход в дизайне адаптивности веб-сайтов
Аида Пачева из ONY описывает свой подход к адаптивности в вебе. Она ориентируется на современные подходы вроде component queries, а не жёсткие breakpoints для всего макета.
Michael Angeles, Leon Barnard & Billy Carlson — Wireframing for Everyone
A Book Apart выпустили книгу Michael Angeles, Leon Barnard и Billy Carlson «Wireframing for Everyone» о проектировании wireframes.
How to make charts and graphs more accessible
Советы Whitney Lewis по поддержке accessibility в визуализации данных и инфографике в вебе.
Rewriting Digital Content for Brevity
Советы Taylor Dykes из Nielsen/Norman Group по упрощению интерфейсных текстов. Как убирать лишнее и упрощать подачу информации в целом.
UX and NPS Benchmarks of Home Paint Websites (2023)
MeasuringU опубликовали новое сравнительное исследование сайтов краски для дома. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.
Дизайн-системы и гайдлайны
The Design System Ecosystem
Brad Frost собрал глоссарий терминов и понятий современной дизайн-системы в большой компании. Не везде нужно всё из описанного, но оно востребовано на масштабе.
Design System Challenge: Rebranding 100+ touchpoints in under 9 months
Robin Westerhoff рассказывает о запуске дизайн-системы Odido (слияние голландских T-Mobile и Tele2). Как выбирали стратегию перехода на неё и организовали иерархию стилей.
Behind the scenes of designing a design system component
Памятка Rama Krushna Behera по созданию компонента в дизайн-системе. От проектирования логики работы до реализации и гайдлайнов. Шаблон в Figma.
Accessible but never boring, part 1
Stephanie Smith рассказывает о доработке цветовой палитры в дизайн-системе Wise под требования accessibility. Часть 2 говорит о типографике, иконках и других аспектах.
Brightening up accessibility with a new colour system
Laura Soto Miranda рассказывает об обновлении цветовой палитры в дизайн-системе Deliveroo. Как она стала лучше в плане accessibility.
Web Components Accessibility FAQ
Памятка Manuel Matuzovic по поддержке accessibility в стандарте веб-компонентов.
Ясный и простой языки — как адаптировать тексты, основы инклюзивной коммуникации
Гайдлайны Сбера по ясному и простому тексту в любой коммуникации.
Понимание пользователя
Ableist interactions
Hidde de Vries использует термин «эйблизм» для продуктовых запусков, которые не учитывают требования accessibilty.
Новые инструменты дизайна интерфейсов
Figma
Интеграция с Zoom и Google Meet, управление доступом к плагинам для организаций, оформление рабочих пространств организаций и управление доступом к ссылкам на файлы.
Много небольших улучшений интерфейса: панель assets, вставка видео в FigJam, прокачка копирования и вставки, куча тюнинга для свойств объектов.
Design tool memory usage
Команда Bjango сравнила работу с памятью популярных инструментов дизайна: Figma, Sketch, Photoshop, Illustrator, Affinity Designer. Figma проигрывает с большим отрывом почти по всем сравнениям.
A Collection of Free Grunge, Vintage & Concrete Textures
Коллекция гранжевых и бетонных текстур.
Icon Bundler
Простой веб-сервис помогает оптимизировать иконки в SVG для разных фреймворков (React, Vue и Svelte).
Пользовательские исследования и тестирование
State of User Research 2023 Report
User Interviews опубликовали исследование профессии пользовательского исследователя за 2023 год. Они опросили 929 специалистов по самым разным темам, включая орг.структуру, демократизацию, обычные и алгоритмические инструменты и т.п.
UX-Research Methods: Glossary
Nielsen/Norman Group опубликовали свой глоссарий методов пользовательских исследований.
Essential Metrics for Click Testing
MeasuringU перечисляют метрики, которые можно получить и посчитать с помощью метода клик-тестов.
Choose the right playtest method
Шпаргалка по методам пользовательских исследований игровых интерфейсов от Steve Bromley.
How to debug participant recruitment in B2B user research
Советы Sofya Bourne по поиску респондентов для пользовательских исследований в B2B-среде. Она перечисляет основные проблемы и даёт способы их решения.
Confounding Variables in Quantitative Studies
Caleb Sponheim описывает спутывающие переменные в пользовательских исследованиях. Это время суток, сезон, возраст и другие подобные факторы, которые могут показать ложную зависимость.
Strategies for Customer Obsession with Prayag Narula of Marvin
Подкаст с со-основателем и главой сервиса Marvin Prayag Narula (это база знаний и инсайтов из пользовательских исследований).
Визуальное программирование и дизайн в браузере
WCAG 2.2 — It’s finally here
Стандарт W3C по accessibility WCAG 2.2 практически стал официальной рекомендацией. Daniel Berryhill обновил свой обзор его главных особенностей.
Stop Lazy Loading Product and Hero Images
Jason Grigsby просит не использовать «ленивую загрузку» для абсолютно всей графики — это ломает саму идею и пользовательский опыт.
Дизайн-менеджмент и DesignOps
Cross-Functional-Collaboration — Challenges and Strategies for Success
Tim Neusesser из Nielsen/Norman Group описывает проблемы кросс-функционального взаимодействия при работе над дизайном. И даёт рекомендации по снижению рисков.
Patterns Next Level Design Program — Elevating Design Leadership and Expertise
Maryann Slama и Andreina Dyer рассказывают о программе обучения дизайнеров Patterns в IBM. Как она устроена и чему именно учатся.
Продуктовый менеджмент и аналитика
Problem Statements Solve for Someone
Scott Sehlhorst показывает способ грамотно сформулировать проблему для продуктовой команды с точки зрения конкретной группы пользователей и ситуации, в которой она возникает.
Методологии, процедуры, стандарты
Elizabeth McGuane — Design by Definition
A Book Apart выпустили книгу Elizabeth McGuane «Design by Definition» о дизайн-процессе.
To sprint or not to sprint.. Thoughts on a controversial branding offering
Агентство Smith & Diction делится своим опытом проведения бренд-спринтов. Это специфичный метод, который работает только в проверенной среде с гарантированным доверием клиента и подрядчика.
Кейсы
Redesigning Swiggy’s new user onboarding — A product design case study
Толковый рассказ Akshata Chandra о редизайне процесса встречи нового пользователя в приложении Swiggy. Как упрощали его и вовлекали людей.
Брендинг цифровых продуктов
Goodnotes
Ребрединг приложения для заметок Goodnotes от американского агентства Motto.
Miro
Обновление айдентики сервиса командной работы Miro от американского агентства AKQA.
Marshmallow
Ребрендинг цифровой страховой компании Marshmallow от американского агентства Ragged Edge.
Sock
Ребрендинг финтеха Sock от британского агентства Koto.
Redefining Facebook’s brand identity
Обновление айдентики Facebook, сделанное внутренними силами.
Shop
Освежение айдентики сервиса для интернет-заказов Shop от американского агентства Porto Rocha.
Dribbble
Ребрендинг Dribbble, сделанный внутренними силами.
Android
Обновление лого Android, сделанное внутренними силами.
Are rebrands starting to look the same? The challenges defining commercial design
Elizabeth Goodspeed пытается разобраться, почему многие ребрендинги похожи друг на друга. И как на это влияют особенности формирования трендов.
Тренды
JW Illustration Trend Report 2023
Тренды в иллюстрации 2023 года от Jacky Winter Group.
Алгоритмический дизайн
DALL-E 3
Новое поколение позволяет точнее описать детали сцены, рисует людей с меньшим количеством галлюцинаций и генерирует корректный текст. Этические барьеры расширили — помимо известных людей, теперь нельзя мимикрировать под стиль ныне живущих художников (как убрать себя из обучения модели). Кстати, генерировать можно будет прямо из ChatGPT.
Adobe Firefly
Инструмент вышел из беты и доступен подписчикам Creative Cloud.
v0 by Vercel
Платформа для разработчиков Vercel запустила алгоритмический генератор интерфейсных компонентов. На выходе — код React на базе shadcn/ui и Tailwind CSS. Логика построения компонентов рандомная, но затея интересная.
Accordion Editing and Apple Picking — Early Generative-AI User Behaviors
Sarah Gibbons, Tarun Mugunthan и Jakob Nielsen из Nielsen/Norman Group описывают несколько моделей поведения пользователей при работе с генеративными сервисами по текстовому запросу.
We Surveyed 1093 Researchers About How They Use AI — Here’s What We Learned
User Interviews опросили 1093 специалистов по пользовательским исследованиям об их опыте работы с алгоритмическими инструментами. Что и для каких задач они используют.
Is AI better at picking and pairing fonts than you?
Matej Latin изучил, насколько удачно подбирают шрифтовые пары сервисы алгоритмического дизайна FontJoy и ChatGPT. Кое-что могут, но с кучей проблем и ограничений.
The case for AI hallucination
Louis Charron показывает, как «галлюцинации» в генераторах картинок по текстовому запросу помогают креативности. Он сравнил разные версии Midjourney, которые сначала теряли поэтичность, а под конец немного вернули её.
Гид по Midjourney: как использовать нейросеть, чтобы получать желаемый результат при генерации изображений
Алина Сидоренко из агентства Friflex написала толковую памятку по работе с Midjourney. Как получить результат в разных стилях и видах дизайна (иллюстрации, текстуры, логотипы, интерфейсы и т.п.).
IKEA Instructions LoRA with Stable Diffusion XL
Генератор иллюстраций в духе инструкций для мебели IKEA от Jaret Burkett на базе Stable Diffusion XL.
New Meta AI Experiences and Tools
Мета оцифровала пару десятков знаменитостей вроде Mr Beast и Snoop Dogg в качестве ИИ-ботов для чата с говорящей головой. И добавила много разных функций вроде алгоритмической генерации стикеров и редактирования фото.
Midjourney AI Styles library — 4000+ Artists, Techniques, Artistic Movements + Genres, Titles
Андрей Ковалёв собрал коллекцию стилей, в которые умеет Midjourney. Их можно использовать в своих запросах.
Squish Meets Structure — Designing with Language Models
Презентация Maggie Appleton о современных языковых моделях и алгоритмических сервисах. Она описывает особенности их построения, проблемы в получении внятных результатов и свои интерфейсные концепты их решения.
Spirals
Алгоритмический генератор спиралевидных фото.
EmojiGen — AI Emojis
Алгоритмический генератор memoji.
Information Foraging with Generative AI — A Study of 3 Chatbots
Raluca Budiu, Feifei Liu, Emma Cionca и Amy Zhang из Nielsen/Norman Group провели исследование генеративных ботов Bard, Bing и ChatGPT. Насколько хорошо они решают разные задачи пользователей.
What Codegen Is (Actually) Good For
Emil Sjölander и Jake Albaugh описывают особенности современных инструментов для разработчиков, которые автоматизируют часть работы и генерируют код. И что из этого подошло для нового режима для разработчиков в Figma.
HeyGen — AI Spokesperson Video Creator
Сервис переводит видео на другой язык. При этом он сохраняет голос и подгоняет мимику персонажа под новый текст.
HeyGen — AI Spokesperson Video Creator
Сервис переводит видео на другой язык. При этом он сохраняет голос персонажа.
Musicfy — Create
Сервис позволяет напеть мотив песни и преобразовывает его в мелодию на конкретном инструменте.
Stable Audio — Generative AI for music & sound fx
Новая модель от создателей Stable Diffusion позволяет генерировать музыку по текстовому описанию.
Onboard AI
Алгоритмический помощник помогает анализировать репозитории GitHub.
ChatGPT can now see, hear, and speak
ChatGPT сможет принимать запросы голосом и лучше анализировать загруженные картинки. Например, предложит рецепт на основе фото продуктов в холодильнике. На такой картинке можно выделить детали, про которые хочется узнать. Тест-драйв.
YouTube is going all in on AI
YouTube будет предлагать идеи и сценарии для видео на основе данных об аудитории и её предпочтениях. Авторы смогут генерировать фоны по текстовому запросу и автоматически дублировать ролики на другие языки.
A Guide to Prototyping Automotive Interfaces
Отличная памятка Casper Kessels по прототипированию автомобильных интерфейсов подручными средствами. Инструменты и способы быстрого вывода на устройство.
Для общего и профессионального развития
Dan Mall’s 10 Principles for a Worthy Design Career
Годнейшие принципы профессиональной жизни Dan Mall. Он развивает много личных проектов и делает это сфокусировано. Я сам ответил бы на эти вопросы похожим образом.
The Tyranny of the Marginal User
Иван Вендеров пишет о беде крупных продуктовых компаний, где полезные функции регулярно удаляются, потому что ими, якобы, не пользуется достаточно пользователей. Он проработал в Google 6 лет и видел это своими глазами.
Люди и компании в отрасли
Wise Design
Блог дизайн-команды финтеха Wise.
Подпишитесь на дайджест в Телеграме ― там свежие ссылки появляются каждую неделю, а также в RSS, ВКонтакте или на vc.ru. Отдельный благодарчик команде Сетки за редактор. А ещё — командам Funky Branding за новую айдентику и Бюробукв за шрифт (они пока в бета-версии и будут докручиваться в течение года). Сто тыщ респектов Александру Орлову за прошлые два визуальных стиля.
