Росатом
Дизайн-система
UX/UI Дизайн
Моисеенко Кирилл
Достижения
Создал новые UI-компоненты и оптимизировал существующие. Благодаря стандартизации интерфейсов сократилось время разработки новых модулей, а от команды фронтенда количество правок уменьшилось. Новые компоненты повысили согласованность системы и ускорили запуск цифровых продуктов компании
Контекст
В рамках развития дизайн-системы я разработал новые компоненты, расширяющие её функциональные возможности. Задачей было обеспечить единообразие интерфейсов, повысить гибкость системы и упростить работу дизайнеров и сократить время разработки при создании новых продуктов
Обзор
B2E, развитие корпоративной дизайн-системы
Моя роль
Дизайнер
Что было сделано
Анализ текущей дизайн-системы, разработка и добавление новых компонентов, систематизация правил их использования и обновление библиотеки
Ключевые результаты
50+
Новых компонентов для дизайн системы
+Корпоративный раздел
13
Доработаны текущие компоненты
+rep от Разработки
100%
Соответствий в UI между продуктами
↑100%
0
Обращений от разработчиков
Бессцено
Изучение гайдлайнов
2 дня
Сбор требований
2 дня
Дизайн
2 недели
Доработки по ДС
1 неделя
Дизайн процесс
На старте работы я погрузился в существующую дизайн-систему: изучил гайдлайны, библиотеку компонентов и правила их применения. Важно было понять логику построения интерфейсов, визуальный язык и паттерны взаимодействия, чтобы сохранить единый стиль и не нарушить целостность опыта пользователей.
Такой анализ позволил быстрее ориентироваться в системе, находить готовые решения и корректно использовать их при проектировании нового функционала
Такой анализ позволил быстрее ориентироваться в системе, находить готовые решения и корректно использовать их при проектировании нового функционала
Изучение гайдлайнов
Разработал дизайн нового функционала, опираясь на существующую дизайн-систему. Это позволило сохранить визуальную целостность продукта и ускорило внедрение решений в разработку
Дизайн
На рабочем столе реализуется возможность добавления и удаления виджетов на экран
Теперь можно настраивать рабочий стол, в зависимости от задач менеджера. Доступна возможность очистить рабочий стол нажатием одной кнопки
Формирование рабочего стола с возможностью формирования нескольких экранов для размещения на них виджетов
Пользователь имеет возможность создавать дополнительные экраны и добавлять на них виджеты из перечня доступных и давать экранам наименования
Разработаны виджеты которые отображают информацию в текстовом, графическом и ином стандартном для web-формате, в том числе в виде диаграмм различного вида
Интерфейс поддерживает светлую и тёмную тему, что позволяет каждому пользователю выбрать комфортный для работы вариант
В рамках работы над проектом я разработал новые виджеты, которые были созданы на основе существующей дизайн-системы. Каждый элемент я адаптировал под принятые в продукте правила визуального стиля и взаимодействия, чтобы сохранить констистентность интерфейсов.
После тестирования и согласования компоненты были внедрены в текущую дизайн-систему, что расширило её библиотеку и позволило команде быстрее собирать новые экраны и поддерживать единый пользовательский опыт
После тестирования и согласования компоненты были внедрены в текущую дизайн-систему, что расширило её библиотеку и позволило команде быстрее собирать новые экраны и поддерживать единый пользовательский опыт
Дизайн - система
