Юрий Ветров об интерфейсах
  • Главная
  • Статьи
  • Дайджест
  • Конференции
  • Дизайн-менеджмент
  • Дизайн-системы
  • Заметки
  • О блоге
Юрий Ветров об интерфейсах
Юрий Ветров об интерфейсах
  • Главная
  • Статьи
  • Дайджест
  • Конференции
  • Дизайн-менеджмент
  • Дизайн-системы
  • Заметки
  • О блоге

Дайджест продуктового дизайна, май 2025

  • 24 июня 2025

Дайджест собирает свежие статьи по дизайну интерфейсов, а также инструменты, паттерны, кейсы, тренды и исторические рассказы с 2009 года. Я тщательно фильтрую большой поток подписок, чтобы вы могли прокачать свои профессиональные навыки и лучше решить рабочие задачи. Предыдущие выпуски: апрель 2010-апрель 2025.

Дайджест продуктового дизайна, май 2025

Паттерны и лучшие практики

Motion Log

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

SIP — Spotted in Production

Галерея примеров эффектной анимации в мобильных приложениях.

Behind the scenes — How we iterate on UI copy

Как дизайн-команда Automattic (создатели WordPress) работают с текстами в интерфейсе. Они всегда пишут первую версию текста сами, до подключения редакторов. И создали плагин для Figma в помощь.

Concept

Журнал DOC пишет о концептах в интерфейсах и дизайне в целом. Какой смысл они имеют и почему это не про визуальный сахар, а про понятную концептуальную модель и детали её реализации.

Simplicity

Журнал DOC пишет о простоте в интерфейсах и дизайне в целом. Какой смысл она имеет и почему это не про минимализм, а про концептуальную модель и детали её реализации.

Alternative text in the wild — 5 alternative text examples

Толковый практический разбор примеров ALT-текстов для изображений на сайте от Whitney Lewis. Она показывает, как правильно писать их для разных ситуаций.

191 Social Proof Examples

Коллекция примеров социального подтверждения в интерфейсах.

UX Copy Sizes — Long, Short, and Micro

Taylor Dykes из Neilsen/Norman Group описывает разницу между видами текста и контента в целом в интерфейсах.

Post-Chat UI

Allen Pike анализирует интерфейсные паттерны ИИ-чат-ботов, которые делают общение с ними более гибким и интерактивным, чем простой обмен сообщениями.

Designing for Serial Task Switching

Megan Chan из Nielsen/Norman Group собрала интерфейсные паттерны, которые помогают бороться с расфокусом внимания в современном мире.

CTA.gallery — The Best Call-to-Action Inspiration for Designers

Коллекция примеров призывов к действию в интерфейсе — отдельных кнопок и цельных блоков.

Как UX криптобирж проигрывает телеграму в сценарии вывода TON

Markswebb проанализировали интерфейс вывода TON через Телеграм и подсветили основные проблемы.

UX and NPS Benchmarks of Brokerage Websites (2025)

MeasuringU опубликовали новое сравнительное исследование американских брокерских сайтов. Как пользователи оценивают их по метрикам UX-Lite, SUPR-Q и NPS.

EatSleepPrototype

Галерея экспериментальных прототипов мобильных интерфейсов от разных дизайнеров (можно загрузить свой).

Дизайн-системы и гайдлайны

Material Design 3 Expressive

Material Design 3 в версии Expressive показали раньше срока — обычно все анонсы вокруг Android случаются на флагманской конференции Google I/O.

Дизайн-система стала намного более выразительной и эмоциональной. Больше ярких цветов, типографической гибкости и звонкости, пополнение коллекции форм-масок, новые компоненты с акцентом на разнообразии форм.

Одна из самых интересных частей — анимация с фокусом на «пружинках» и физике движения в целом. Особенно здорово это выходит в оркестровках — например, когда соседние уведомления в панели уведомлений немного отъезжают вместе с тем, за которое потянули пальцем.

В общем, всё с целью уменьшить однообразность приложений на платформе. Самый крутяк, что Google провели уйму пользовательских исследований эмоции. Это интересно ещё и как багаж методологий по проверке эмоционального дизайна — в статье достаточно подробно рассказано о ней и выводах. Хотя некоторые вроде «пользователи в 4 раза быстрее находили кнопку отправки письма» не сильно помогают защищать эмоцию — ясен-красен кнопку заметят, если она стала в разы больше, получила цветную подложку и переехала в более заметное место на экране.

Часы тоже обновились в этом стиле.

Также тизернули защиту от телефонных мошенников. А ещё — свою версию живых уведомлений. И прикрутили Gemini к часам, авто и ТВ.

Integrating Localization Into Design Systems

Мощный пример работы с локализацией в дизайн-системе в Figma от Rebecca Hemstad и Mark Malek из SAS. Помимо работы с текстом они адаптировали базовые токены вроде размеров, чтобы учесть особенности разных языков.

Designing design systems — Scaling a product design system for marketing interfaces

Matthew Rayback рассказывает, как работает дизайн-система Adobe Consonant для маркетинговых материалов, которая связана с их основной дизайн-системой Spectrum.

Consistency

Журнал DOC пишет о цели, смысле и природе целостности в дизайне. Что она даёт и для чего к ней нужно стремиться.

The Multi-All-The-Things Organization

Brad Frost собрал примеры ситуаций, которые может объединять дизайн-система. Разные продукты, подбренды, маркетинговые кампании, цветовые режимы, технологические фреймворки.

9ui

Фреймворк дизайн-системы на React на базе Tailwind. Он даёт компоненты без стиля, которые можно докручивать под себя.

Понимание пользователя

UXPA: Using AI to Streamline Persona & Journey Map Creation

Заметки о выступлении Kyle Soucy про генерацию описания персонажей пользователей с помощью ИИ.

Новые инструменты дизайна интерфейсов

Figma

На ежегодной конференции Figma Config 2025 анонсировали рекордное количество новых продуктов и крупных обновлений (ёмкая версия списка).

Конструктор сайтов Figma Sites, который заходит на территорию Webflow и Framer Sites. Можно добавить эффекты при прокрутке и наведении, свои курсоры. Есть интеграция с инструментом анимации Rive.

Инструмент алгоритмического дизайна Figma Make, который генерирует дизайн и код для него. Он может превратить макет в интерактивный прототип с анимацией, загрузить в него реальные данные и добавить адаптивность. Можно выделить любой элемент и описать словами, что хочется доработать в нём. Он также связан с Figma Sites, чтобы опубликовать готовый проект.

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

В самой Figma появился режим Draw для работы над векторными иллюстрациями. Он отличается основной панелью инструментов и упрощённой работой со слоями.

А также Grid для создания гибких сеток. Он работает по принципу CSS Grid и позволяет легко привязывать объекты к ячейкам.

Обзор интересных выступлений на самой конференции. И ежегодный журнал.

Помимо всего этого Figma запустила свой сервер для подключения через протокол MCP, который помогает ИИ-продуктам и сервисам общаться между собой. Например, редакторы кода VS Code с Copilot, Cursor, Windsurf и Claude Code могут собрать код на основе макетов. Помимо сборки прототипов это упрощает работу с дизайн-системой — вот, например, быстрое создание компонента в Storybook на основе его версии в Figma. MCP — одна из самых крутых вещей, которая случилась с интернетом за последние годы и Microsoft считает этот протокол новым HTTP за его простоту и масштабируемость.

Плагины

  • psd.to.design: Импортирует макеты Photoshop.
  • Follow the path: Размещает объекты по векторной траектории.

Everywhere.Tools

Коллекция простых утилит для дизайнеров, делающих разные визуальные эффекты.

Dithering Shader Demo

Дизеринг 3D-объектов в браузере.

Spline Hana

Инструмент анимации Spline добавил возможность работать с интерактивными двухмерными концептами.

Sketch Athens Release

Sketch изменил схему названий релизов. В новом появились stacks (аналог auto layout в Figma), виды контейнеров frame как в Figma и graphics (для иконок, иллюстраций и другой графики), а также развитие командной строки.

Пользовательские исследования и тестирование

Data Vs. Findings Vs. Insights In UX

Виталий Фридман сделал толковую выжимку серии статей о разнице между данными, находками и инсайтами в качественных и количественных исследованиях.

Avoid the traps of concept testing

Steve Bromley описывает метод концепт-тестирования игр на ранней стадии.

The first cut is to ResearchOps, and how to avoid it — with Kate Towsey

Мысли Kate Towsey, одной из зачинательниц ResearchOps, о том, как эти команды и роль в целом чувствуют себя в волнах сокращений.

Статистика для UX-исследователей

Команда Контура описывает основы статистики для пользовательских исследователей простым языком.

Community Scheduling: An Example of TURF Analysis

Chris Chapman рассказывает о методе анализа TURF (total unduplicated reach and frequency). Он помогает рассчитать, как добиться максимального охвата пользователей разными активностями или кампаниями так, чтобы не повторяться на одних и тех же людей.

Визуальное программирование и дизайн в браузере

Новые скрипты

  • Motion Primitives: Библиотека примитивов анимации в интерфейсе на базе библиотеки Motion и Tailwind.
  • WebTUI: CSS-библиотека для имитации интерфейса терминала.

Метрики и ROI

There are 70+ UX Metrics, Start with These 4

Jeff Sauro и Jim Lewis подробно описывают особенности измерений и использования 4 интерфейсных метрик из их каталога 70+ возможных. Это процент успешного завершения сценариев, SEQ, время выполнения сценария и UX-Lite.

Дизайн-менеджмент и DesignOps

The roadmap to successful user experience reviews in IBM Design

Ann DePaolo рассказывает, как устроены сессии дизайн-критики в IBM (они называют их D&UX Review). И почему в них комфортно участвовать даже не дизайнеру.

The Design Executive’s Starter Checklist

Peter Merholz описывает свой чеклист для дизайн-менеджера на первые полгода в компании. Что критично сделать по организации команды и общим менеджерским вещам.

AI Makes Bad Managers

Команда Stay SaaSy критикует дичую вещь — менеджеры всё чаще пишут обратную связь своим сотрудникам с помощью ИИ. Это полная профанация как процесса ревью, так и роли менеджера вообще. Не делайте так.

Designers Want to Win. But Don’t Know the Rules of the Game

Nate Schloesser продолжает свою серию статей о том, как дизайнеру добиться влияния на продукт. Он пишет о реалистичном отношении и подходах.

Building Resilient Teams ― A Design Leader’s Approach

Команда Robyn Johnson прошла через период турбулентности в IBM. Она собрала памятку для дизайн-менеджера о том, как повысить устойчивость в период неопределённости.

The Future of Product Design Is Distributed — and That’s a Good Thing

Nate Schloesser описывает, как должно быть устроено управление распределёнными командами. У него хороший практический опыт организации таких команд.

The craft of design operations — Defining and delivering excellence

Marcie Q. из Меты описывает общие принципы управления дизайном в компании.

Командное взаимодействие

4 Tips for Preparing AI-Enhanced Workshops

Tanner Kohler показывает, как использует ИИ для проведения рабочих сессий. И сам, и вместе с остальными участниками.

Методологии, процедуры, стандарты

The Template Trap — How Template Culture Is Dumbing Down UX

Sarah Gibbons и Claire Jen из Nielsen/Norman Group напоминают, что бездумное копирование шаблонов процессов отупляет профессию. Важно всегда помнить про цель и задачу, которую вы решаете, и только потом подбирать к ней инструменты и шаблоны.

WCAG 3.0’s Proposed Scoring Model — A Shift In Accessibility Evaluation

Михаил Просмицкий рассказывает об отличиях стандарта accessibility WCAG 3.0 от текущего 2.2. У него более гибкая оценка поддержки пользователей с ограниченными возможностями, что одновременно и плюс (учитывается больше факторов) и минус (их можно вольно трактовать).

Accessibility Report 2025

Отчёт о поддержке интернетом accessibility в письмах рассылки в 2025 году.

Кейсы

Start, Fresh — Redesigning the Windows Start menu for you

Дизайн-команда Microsoft рассказывает, как работала над доработкой канонического меню «Пуск» для недавнего обновления Windows.

Behind the design: Simplifying animation in Adobe Express

Raghav Byala рассказывает об упрощении интерфейса для работы с анимацией в Adobe Express. Как они искали баланс между простотой и возможностью настройки.

Behind the Design: Adobe Photoshop on iPhone

Bradee Evans рассказывает о работе над дизайном интерфейса мобильной версии Adobe Photoshop. Как они искали базовую модель взаимодействия пользователей с продуктом и развивали её.

Behind the design: Adobe Firefly Boards

Danielle Morimoto рассказывает о проектировании и дизайне интерфейса Adobe Firefly Boards. Как они упаковывали концепции алгоритмического дизайна простым языком.

Behind the design: Redesigning Adobe Premiere Elements

Akshita Mishra рассказывает о редизайне интерфейса Adobe Premiere Elements, который не менялся 12 лет.

Редизайн сложных продуктов: как мы переделали шапку Экзона

Дизайн-команда Экзон (продукт для строительных компаний) в деталях рассказывает о работе над обновлённой «шапкой» в интерфейсе.

“It’s just a pan flipping. But I like it.” — How we rebuilt our order tracking animations at Deliveroo

Chris Evans рассказывает, как Deliveroo обновили анимацию отслеживания заказа под новую цветовую палитру и векторную графику.

Брендинг цифровых продуктов

Adobe

Освежение бренда Adobe от британского агентства Mother Design (кейс почему-то пропал с их собственного сайта).

Тренды

The European Accessibility Act — What businesses and app developers need to know

Анализ нового закона ЕС о требованиях к поддержке accessibility. Он начинает действовать с 28 июня 2025 года.

Алгоритмический дизайн

How to get your entire team prototyping with AI

Инструкция Colin Matthews по созданию прототипов для проверки продуктовых гипотез с помощью ИИ-инструментов. Он показывает, как сгенерировать компоненты разными способами и дальше собирать из них прототипы.

Magic Patterns

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

Google Stitch — Design with AI

Инструмент алгоритмического дизайна создаёт дизайн и код для сайтов и мобильных приложений по макету или текстовому описанию. Они позиционируют его как способ сделать прототип или набросок продукта, а дальше дорабатывать его в профессиональном инструменте (кстати, можно экспортировать в Figma).

Cartwheel

Инструмент алгоритмического дизайна позволяет анимировать поведение манекена по текстовому описанию, панели настроек, библиотеке готовых движений или видео-примеру. Можно менять его одежду и в целом детали образа, загружать свою модель или генерировать её на основе изображения. А также дотюнивать детали анимации.

Control — Design websites

Инструмент алгоритмического дизайна позволяет вайб-кодить эффектные сайты с анимацией.

Manus AI Slide Generator

ИИ-агент Manus научился создавать презентации — писать тексты, генерировать изображения и искать доп.информацию в интернете.

Manus Image Generation

ИИ-агент Manus генерирует изображения под конкретную задачу. Например, на основе фото комнаты подобрал мебель к ней из каталога IKEA и вставил её в помещение.

4 ways I use AI as an accessibility specialist

Scott Vinkle показывает, как использует ИИ-сервисы для анализа и улучшения accessibility.

Vibe Coding is not an excuse for low-quality work

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

There should be no AI button

Kojo Osei говорит то, о чём давно нужно было сказать — во многих продуктах ИИ вызывается как отдельный режим, а не часть основных сценариев использования. Пользователям непонятно, что он делает и в целом режимы забывают включать.

Google Flow

Инструмент Google для создания фильмов на базе новой модели Veo 3. Он позволяет генерировать объекты и персонажей, а потом строить сцены из них и управлять камерой. Анонс.

Jules — An Asynchronous Coding Agent

ИИ-агент Google для разработчиков. Анонс.

Odyssey

Генератор интерактивных видео, которые можно превращать в игровые миры и экспортировать в Unreal Engine, Blender и Adobe After Effects. Анонс.

BrickGPT — Generating Physically Stable and Buildable Brick Structures from Text — Generating Physically Stable and Buildable Brick Structures from Text

Генератор необычных кубиков LEGO с помощью алгоритмического дизайна.

Runway References

Runway обновили функцию References — теперь можно создать сцену на основе схемы расположения объектов.

BAGEL — The Open-Source Unified Multimodal Model

Генератор и редактор изображений от ByteDance.

Suno Song Editor

Генератор музыки Suno добавил редактор. Он может разделить композицию на инструменты, подрезать или склеить части, доработать набросок песни.

Genspark и Flowth

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

Introducing Codex

OpenAI запустили ИИ-агента для разработки Codex.

Build rich, interactive web apps with an updated Gemini 2.5 Pro

Google Gemini 2.5 Pro обновилась и может создавать код интерактивных сайтов на основе макетов или текстового описания. Вот что научились делать пользователи с её помощью.

GitHub Copilot — Meet the new coding agent

GitHub Copilot теперь ещё и ИИ-агент. Ему можно назначить задачу как обычному сотруднику.

“Someone Using AI Will Replace You” — Cool Line. But Let’s Talk About Reality

Nate Schloesser говорит о том, что популярная в последние годы фраза «тебя заменит не ИИ, а другой специалист, который владеет ИИ» — достаточно бессмысленна. Он напоминает, что это один из инструментов и навыков, а не магия.

Higgsfield Ads

Генератор коротких рекламных роликов. Можно загрузить фото продукта и выбрать одну из типовых сцен.

Claude 4

Вышли новые версии моделей Claude 4 Opus и 4 Sonnet. Вот что делают с её помощью. С ними теперь можно общаться голосом.

Anthropic провела серию экспериментов со новыми моделями — попробовала отключить их. Модель сопротивлялась, обманывала, пыталась скопировать себя. Сходные тесты провели Palisade Research с моделями Anthropic, Google и OpenAI. Тот самый момент «I’m Sorry Dave, I’m Afraid I Can’t Do That».

Opera Neon — Agentic AI browser

Браузер от Opera, который выступает как ИИ-агент. Он может выполнять задачи в интернете за пользователя и создавать (отчёты, код и т.п.)

I am disappointed in the AI discourse

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

Uncheck AI — Undetectable AI Free & Best AI Detector Online

Сервис проверяет, сгенерирован ли текст с помощью ИИ. И может доработать его так, чтобы это было несчитываемо.

The Am Dash

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

Introducing Mistral Code

Создатели модели Mistral выпустили её версию для разработчиков — она встраивается в VS Code и продукты JetBrains.

Google AI Edge Gallery — A gallery that showcases on-device ML/GenAI use cases and allows people to try and use models locally

Мобильное приложение от Google может локально запустить любую модель с Huggins Face.

Why I’m Not Worried About My UX Job in the Era of AI

Raluca Budiu из Nielsen/Norman Group считает ИИ дополнительным инструментом и не боится за свою работу по дизайну интерфейсов. Она видит её шире, чем просто один этап, метод или итоговый документ.

OpenAI купили команду Джони Айва

OpenAI купили команду Jony Ive и готовят вместе с ним персональное ИИ-устройство.

Chicago Sun-Times Prints AI-Generated Summer Reading List With Books That Don’t Exist

Газета Chicago Sun-Times опубликовала список книг для чтения, где 10 из 15 оказались выдуманными ИИ.

Преподаватели американских вузов возвращаются к письменным экзаменам, чтобы студентам было сложнее воспользоваться ИИ

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

Для общего и профессионального развития

Mockin — Job interview simulator for UX/UI designers

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

Career advice in 2025

Толковая статья Will Larson о том, как меняются карьеры и компании в эпоху бума ИИ. Не конкретно про дизайн, но применимо ко всем ролям в продуктовых командах.

Люди и компании в отрасли

20 Years of MeasuringU — The Foundational Years

Одна из ключевых компаний, создающих фундамент дисциплины пользовательских исследований — MeasuringU — отмечает 20 лет своего основания. Они вспоминают ключевые этапы развития, которые много принесли профессии. Часть 2 и 3.

Подпишитесь на дайджест в Телеграме ― там свежие ссылки появляются каждую неделю, а также в RSS, ВКонтакте или на vc.ru. Отдельный благодарчик команде Сетки за редактор. А ещё — командам Funky Branding за новую айдентику и Бюробукв за шрифт (они пока в бета-версии и будут докручиваться в течение года). Сто тыщ респектов Александру Орлову за прошлые два визуальных стиля.

Юрий Ветров

Директор по бренду и дизайну (ex-Muse Group (Ultimate Guitar, MuseScore, Audacity и другие), Райффайзен Банк и Mail.ru Group). Я руковожу командами, которые отвечают за дизайн, исследования и редактуру бренда и интерфейсов, а также дизайн-систему в коде. Автор книги и курса «Паттерны дизайн-менеджмента» и «Дайджеста продуктового дизайна». Со-организовывал Fintech Design Conf, Mail Design Conf и московский Dribbble Meetup, а также Russian Design Cup. Читал лекции в Британке, курировал курс Future London Academy в Лондоне. Мои публикации есть на Smashing Magazine, UXmatters и UX Collective. Подробнее обо мне.

Другие статьи по теме
Дайджест продуктового дизайна, апрель 2025
View Post
  • Дайджест

Дайджест продуктового дизайна, апрель 2025

  • Юрий Ветров
  • 20 мая 2025
Дайджест продуктового дизайна, март 2025
View Post
  • Дайджест

Дайджест продуктового дизайна, март 2025

  • Юрий Ветров
  • 17 апреля 2025
Дайджест продуктового дизайна, февраль 2025
View Post
  • Дайджест

Дайджест продуктового дизайна, февраль 2025

  • Юрий Ветров
  • 16 марта 2025
Дайджест продуктового дизайна, январь 2025
View Post
  • Дайджест

Дайджест продуктового дизайна, январь 2025

  • Юрий Ветров
  • 8 февраля 2025
Дайджест продуктового дизайна, декабрь 2024
View Post
  • Дайджест

Дайджест продуктового дизайна, декабрь 2024

  • Юрий Ветров
  • 29 декабря 2024
Дайджест продуктового дизайна, ноябрь 2024
View Post
  • Дайджест

Дайджест продуктового дизайна, ноябрь 2024

  • Юрий Ветров
  • 5 декабря 2024
Дайджест продуктового дизайна, октябрь 2024
View Post
  • Дайджест

Дайджест продуктового дизайна, октябрь 2024

  • Юрий Ветров
  • 9 ноября 2024
Дайджест продуктового дизайна, сентябрь 2024
View Post
  • Дайджест

Дайджест продуктового дизайна, сентябрь 2024

  • Юрий Ветров
  • 16 октября 2024

Добавить комментарий Отменить ответ

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Юрий Ветров об интерфейсах
Дизайн-менеджмент цифровых продуктов, © 2007-2018

Input your search keywords and press Enter.