🎮 Дизайн-система WB и как AI помогает решать проблемы

Вчера посмотрел вебинар BBE с Владиславом Ткаченко — руководителем отдела автоматизации дизайна RWB (RUSS + Wildberries). Честно, материал немного взорвал мне мозг.

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

Внутри вебинара:
– Базово про архитектуру дизайн-системы внутри компании;
– Примеры критически сложных компонентов;
– Почему команда упирается в ограничения Figma и её технологий;
– Почему «PX-проектирование» важнее UX;
– Как AI поможет выйти за рамки текущих технологий, но при этом сохранит процессы и людей;
– Как будут выглядеть дизайн-системы уже «завтра».

📎 Ссылка на вебинар

👀 Найм дизайнера без портфолио

Вчера листал LinkedIn и увидел несколько вакансий на senior- и middle-позиции, где наличие портфолио не было обязательным для отклика. Если его нет, но есть сильные проекты или интересный опыт, предлагалось просто созвониться на 30 минут и показать всё прямо в Figma. Что-то новенькое — раньше такого на рынке не видел.

Звучит, на самом деле, довольно логично, учитывая, что многие опытные специалисты могут вообще не собирать портфель или просто не обновлять его годами. Да, есть риск потратить больше ресурсов на отбор, но и воронка расширяется: появляется шанс вытащить талант, который просто работу работает, а не про упаковку себя и самопродвижение думает.

🔄 Schema 2025: Новые фичи в Figma

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

➡️ Extended Collections — для создания мультибрендовых дизайн-систем. Есть базовая система, дальше продуктовые команды накидывают свои темы и переопределения. Всё наследуется из «родителя», но локальные кастомизации не теряются.

➡️ Slots — ну наконец-то! Теперь можно добавлять свои слои прямо в инстансы компонента. То есть больше не нужно детачить компонент только ради одного нового пункта в нём.

➡️ Check Designs — AI-линтер. Отмечаешь макет как готовый и система сама проверяет, правильно ли ты используешь токены/переменные, и подсказывает нужные.

📎 Ссылка на анонс

▶️ Митя Осадчук — Как дизайн-культура меняет IT

Подкаст с Митей Осадчуком — экс-креативным директором VK, экс-дизайн-директором IVI и нынешним UX/UI-директором B2C-направления в Сбере. Короче, это легенда, которая вместе со своими командами сделала много крутых проектов и продолжает двигать индустрию.

Чуваки поболтали обо всём на свете: про дизайн-культуру в корпорациях, трансформацию рынка, любовь к крафту и командной игре, найм дизайнеров, ИИ-революцию, work–life balance, дизайн-образование в России, путешествия, места силы и отцовство. Прикладного тут почти ничего нет, но чтобы замотивироваться или просто скрасить вечер — более чем достаточно.

📎 Ссылка на видео

🎮 Blueprints — разборы UI-компонентов

Проект Ильи Гребня, основателя Design Systems Surf, в котором рассматриваются структура, состояния и поведение UI-компонентов, а также современные подходы и примеры их использования.

Разборы Ильи:
– Checkbox;
– Chip;
– Radio button;
– Segmented control;
– Slider;
– Switch;
– Tabs.

📎 Ссылка на проект

🥸 DevTools для дизайнера

Полезная статья от Димы, дизайнера в Voximplant. Автор простым языком объясняет, как устроены DevTools в браузерах и как использовать их в работе дизайнера. Особенно полезно новичкам, работающим с вебом.

Внутри статьи:
– Что такое DevTools;
– Из чего состоит рабочее окно;
– Инспекция элементов;
– Проверка адаптивности;
– Быстрая проверка идей;
– Работа с медиа-файлами;
– Применение в дизайн-ревью.

📎 Ссылка на статью

✨ Влияние Liquid Glass на Linear

Команда Linear рассказывает, как они обновляли своё мобильное приложение с учётом появления Liquid Glass в iOS, а также новых вызовов, связанных с ростом продукта.

Интересно, что они решили не использовать API Apple и разработали собственную реализацию Liquid Glass, чтобы реализовать навигацию так, как считают нужным.

📎 Ссылка на статью

✏️ Редизайн продукта

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

На видео — фрагмент презентации обновлённой экосистемы Яндекс 360, который подрезал у их Head of Product Design в LinkedIn. Уже вижу несколько интересных решений, которые возьму в тестирование.

Кстати, если знаете кейсы, статьи или видео о редизайне SaaS-продуктов (именно их веб часть), поделитесь, пожалуйста, ссылками в комментариях — буду очень признателен.

UPD: Если кому-то интересно посмотреть саму конференцию, то вот ссылка на неё.

✨ Как сделать дизайн-систему

Бесплатный, компактный и прикладной авторский курс от Михаила Шамина — продуктового дизайнера в ПСБ — по проектированию дизайн-систем. Как пишет сам автор, в курсе нет базовых вещей, связанных с дизайном компонентов: фокус — на закулисье — как устроены процессы, которые приводят к итоговому результату.

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

📎 Ссылка на курс

🎮 Разработка и внедрение единой дизайн-системы сразу для 13 сервисов

Кейс команды «Яндекс 360» о том, как они собрали и внедрили «Орбиту» — новую общую дизайн-систему для Почты, Диска, Календаря и других продуктов. В материале, к сожалению, мало деталей — авторы прошлись по верхам, но хочется верить, что позже выйдут отдельные статьи по затронутым темам.

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

Внутри статьи:
– Истоки: для чего нужна дизайн-система;
– Figma, Storybook и дизайн-токены: магия автоматизации;
– Стандарты и контроль: дисциплина во благо;
– Команда: как повысить вовлечённость;
– Фокус на доступности: создание продукта для всех;
– Метрики и будущее: как измерить эффект от внедрения;
– Советы тем, кто в начале пути.

📎 Ссылка на статью

💎 Редизайн информационной архитектуры Intercom

Интересная статья от Пранавы Тандры, бывшего продуктового дизайнера Intercom, о переосмыслении архитектуры сложного приложения: упрощении навигации, улучшении UX и создании пространства для AI.

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

Внутри статьи:
– Предпосылки редизайна;
– С чего начали работу (аналитика, интервью и тесты);
– Принцип № 1: объединение похожих вещей;
– Принцип № 2: каркас для AI и автоматизации;
– Принцип № 3: уменьшение шума;
– Принцип № 4: оптимизация личных настроек;
– Переосмысление навигации;
– Результаты и чему научились.

📎 Ссылка на статью

⭐️ Редизайн Linear: перезагрузка дизайна

В 2024 году команда Linear полностью обновила дизайн приложения. Это первая из двух статей, где команда подробно объясняет причины и подход к редизайну, с фокусом на том, почему он важен.

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

📎 Ссылка на статью

⭐️ Редизайн Linear: процесс и результат

В 2024 году команда Linear полностью обновила дизайн приложения. Это вторая часть материала, в которой представлен новый интерфейс и рассказано, как команда подошла к реализации проекта.

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

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

📎 Ссылка на статью

📈 Дашборды: между красотой и эффективностью

Статья от Владимира Фрадкова, продуктового дизайнера Ozon Tech. Про то, почему красивые панели часто бесполезны, и как собрать дашборд, который действительно помогает принимать решения.

Внутри статьи:
– Что такое дашборд и зачем он нужен;
– Почему дашборды часто не работают;
– Иерархия внимания от глобального к локальному;
– Инструменты визуализации;
– Единоначалие фильтров;
– Почему разрозненная фильтрация — это проблема;
– Упрощение разработки;
– Отказ от разработки с нуля.

📎 Ссылка на статью

🖥 Как измерить влияние исследований на разработку

Сложный, скорее лидерского уровня, материал от Анастасии Лестовой — UX-исследовательницы и Product Discovery Lead в Контур.Маркировке, о попытке создать набор метрик для оценки эффективности исследовательских процессов в команде Discovery.

Предложенные метрики:
– Успех исследования;
– Применение результатов;
– Появление новых гипотез;
– Добавление задачи;
– Изменение приоритетов;
– Отмена задачи;
– Релиз в продакшен.

📎 Ссылка на статью

⭐️ Для чего дизайнерам нейросети: сравниваем инструменты и создаём дизайн карт

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

Внутри статьи:
– Как выбрать подходящий AI-инструмент;
– Как создать серию изображений в одном стиле;
– Дизайн карт с помощью нейросетей: практический кейс;
– Как нейросети повлияли на наш креативный процесс;
– Итоги экспериментов и мысли.

📎 Ссылка на статью

☀️ Как по-настоящему понять пользователя, чтобы решить его проблему в реальной жизни с помощью дизайна?

Статья от Алексея, ведущего продуктового дизайнера. Это, скорее, теоретическое пособие о первом ромбе модели Double Diamond — для начинающих и для тех, кто хочет привести процесс в порядок. Тон местами учебниковый, но структура в целом понятная.

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

📎 Ссылка на статью

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

Александр Попов, продуктовый дизайнер компании «Цифра», написал статью о том, как измерять удовлетворённость пользователей в суровом мире enterprise-продуктов, где, по сути, у рядовых пользователей нет свободы выбора инструмента для своей работы.

Внутри статьи:
– Проблема традиционных метрик;
– Специфика пользователей;
– Особенности измерения UX;
– CASTLE как альтернатива HEART;
– Как измерить CASTLE;
– Поведенческие метрики;
– Методы сбора данных;
– Связь с бизнес‑показателями;
– Истории успеха или немного кейсов.

📎 Ссылка на статью

🎮 Метрики лояльности

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

📎 Часть 1: Бизнес-метрики: LTV, CLV, Churn Rate, Customer retention, Redemption Rate, Repurchase Rate, Repeat Purchase Probability, Loyal Customer Rate.

📎 Часть 2: Метрики клиентского опыта (CX): NPS, CES, CSAT, CSI.

📎 Часть 3: Метрики и опросники юзабилити (UX): SEQ, SUS, UMUX, UMUX-Lite, SUPR-Q, UEQ, UEQ-S.

🌛 От проблемы к запуску: как превратить результаты исследований в реальные продукты

Это продолжение предыдущей публикации Алексея о первом ромбе Double Diamond (Discover и Define). Теперь фокус — на том, как перейти от инсайтов к рабочим решениям и довести их до релиза.

От инсайтов к идеям — через HMW-вопросы, идеацию и приоритизацию по матрице Impact × Effort. Затем — гипотезы с метриками, прототипы от lo-fi до hi-fi, тесты на успешность выполнения задач, время выполнения и число ошибок, итерации, фиксация правил в дизайн-системе, передача в разработку и проверка сборок. Итог — конспект фаз Develop и Deliver, который можно взять за основу и адаптировать под свой процесс.

📎 Ссылка на статью

✨ За кулисами: создание новой системы иконок Atlassian

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

Интересно, что они осознанно выбрали контейнеры 16×16, чтобы не создавать лишние визуальные отступы в элементах и сохранить стилистическое единообразие с новым шрифтом. Обычно за основу берут 24×24 и не заморачиваются.

Ещё интересно, что в систему сразу заложили разделение на одно- и многоцелевые иконки. С учётом того, что UI-иконки могут содержать логотипы подпродуктов, это полезная практика, которая может не допустить размытия смысла иконки.

📎 Ссылка на статью