Практика 9
Есть мнение, что использование дизайн-системы в проектировании интерфейса обеспечивает консистентность всего этого интерфейса.
Отчасти это правда: сделать консистентно без дизайн-системы невозможно, но ей одной все не ограничивается. Один и тот же экран два дизайнера могут спроектировать при помощи одинаковых элементов совершенно по-разному. Особенно часто это случается на больших проектах, когда один рисует десктоп, второй мобильную версию и делают это параллельно, потому что сроки поджимают (ну а как иначе?).
В результате верстальщик справедливо задается вопросом, почему для одного и того же экрана нужно верстать два принципиально разных блока.
Отчасти это правда: сделать консистентно без дизайн-системы невозможно, но ей одной все не ограничивается. Один и тот же экран два дизайнера могут спроектировать при помощи одинаковых элементов совершенно по-разному. Особенно часто это случается на больших проектах, когда один рисует десктоп, второй мобильную версию и делают это параллельно, потому что сроки поджимают (ну а как иначе?).
В результате верстальщик справедливо задается вопросом, почему для одного и того же экрана нужно верстать два принципиально разных блока.
Как избежать неконсистентности
Как избежать неконсистентностиНе дизайн-системой единой
1. Определите приоритетное разрешение экрана
Заказчик охотно предоставит данные о том, с какого типа устройства его сайт просматривают чаще всего (это в его интересах). С него и следует начинать работу.
Если известно, что большая часть пользователей посещает сайт с десктопа, то макеты проектируются сначала для него, а потом уже адаптируются под мобильную версию.
Одновременное начало работы может привести не только к визуальной неконсистентности, но и функциональной: разные задачи могут решаться с помощью разных механик.
Статистика одного очень известного сайта
2. Иметь "насмотренность" в рамках проекта
Если на проекте работает один полностью вовлеченный дизайнер, то проблема консистентности решается им по ходу дела: погруженный в проект человек старается облегчить себе работу и не изобретать велосипед.
Если над проектом работает команда, один из дизайнеров должен контролировать все происходящее, в том числе на консистентность. Для этого нужно периодически проводить воркшопы: совместное рисование некоторых экранов способствует погружению дизайнеров в работу друг друга.
Скриншот календаря нашего дизайнера
3. Проводить дизайн-ревью
Все, что может быть понято неправильно, будет понято неправильно. Даже развернутая по всем правилам дизайн-система и огромное количество комментариев для разработчиков не гарантируют, что все кнопки будут скруглены должным образом.
Мы стараемся отслеживать судьбу наших проектов и только приветствуем, когда разработчики приходят к нам за обратной связью, с просьбой оценить, все ли реализовано верно. Это как авторский надзор в дизайне интерьеров).
Переписка с постоянным клиентом
Такой подход, во-первых, повышает лояльность пользователя, для которого в итоге сайт выглядит более-менее одинаково при любых обстоятельствах; во вторых, экономит время верстальщика, не заставляя верстать разные блоки для одинаковых сущностей и минимизируя риски что-то реализовать не так.