Программа рефакторинга дизайн-системы
Помог дизайн-системе с решением накопившихся проблем, которые тормозили запуск продуктов и плохо влияли на их качество.
Для наглядности поднял Docusaurus и Storybook. Наполнил проект в Гитхабе. Записал скринкаст и показал движение типичной задачи дизайн-системы по новому регламенту.
Презентация привлекла внимание.
Стало понятно, что проблемы есть не только в дизайн-системе и качестве выпускаемых продуктов, но и в DoR, в дизайн-ревью, в тестировании, сборе и анализе метрик.
Предложил исправлять ситуацию через внедрение инженерной культуры и начать с описания фундаментальных ценностей и принципов. Это нужно для того, чтобы команды одинаково понимали, что такое «качество», «продукт» и «дизайн» в представлении ПСБ.
Какие принципы дизайна получились:
Полезный
Все решения проектируются через призму пользы для пользователя и банка. В этом нам помогает DoR и набор вопросов с которых дизайнер начинает работу над задачей:
- Что делаем?
- Зачем это пользователю?
- Как он сейчас решает эту проблему?
- Сколько людей будут этим пользоваться и как часто?
- Какие метрики бизнеса будут затронуты?
- Что будем считать показателем успеха внедрения?
В итоге у дизайнера должен получиться простой и понятный сценарий, движение по которому можно описать фразеологизмом «Как по маслу».
Вопросы помогают нам разобраться не только в болях и потребностях пользователя, но и в пользе для банка. Не стесняйтесь говорить об этом и искать коммерческую или репутационную выгоду.
Идеальный
При проектировании сценариев мы руководствуемся ТРИЗовским принципом об идеальном конечном результате и только после консультации с командой упрощаем его, если в этом есть необходимость и достаточные основания.
Почтительный
С большим уважением относимся ко времени, деньгам и доверию наших клиентов.
Фундаментальный
Мы отдаем предпочтение устоявшимся передовым практикам и избегаем нестандартных паттернов проектирования.
Что нам близко:
- Закон Фиттса
- Эвристики Нильсена
- Показатели Шнайдермана
- Стандарты W3C и три столпа: семантичность, адаптивность, кроссбраузерность
- Принцип: Пользовательские данные священны
- Принцип: Пусть потеет машина
- Принцип: Интерфейс — зло
Унифицированный
Все наши продукты и решения выглядят и ощущаются одинаково. Они основываются на дизайн-системе, паттернах и VoT. Все это придает им узнаваемый стиль ПСБ и формирует доверие к бренду.
С общими принципами разобрались, а что дальше? Набросал драфт принципов сервисов, дизайн-системы, портрет дизайнера и принципы команды дизайн-системы.
На следующем уровне детализации описал план рефакторинга дизайн-системы в соответствии с принципами.
Команда
- Михаил Шамин, дизайнер
Релиз
Что ещё
- Развитие библиотеки компонентов
- Лендинг для сервиса «Топливо»
- Цифровой рубль
- Услуга «Кодовое слово»
- Рефакторинг сценария «Перевод физлицу через СБП»
- Паттерн выбора телефона
- Алгоритм поиска по справочникам
- Рефакторинг ленты операций СБП
- Концепт окна для смены тарифного плана
- Рефакторинг формы доверенности