Eng

ПрофсоUX 19

Конференция #1
для UX-профессионалов в России

2 марта 2019

ул. Лодейнопольская, 5
КЦ «Петроконгресс»

2 марта, Санкт-Петербург, КЦ Петроконгресс

Дизайн-система: разработка, внедрение, подводные камни

На кого рассчитан доклад:

  1. Большие компании, которые планируют, начали или уже разработали дизайн-систему.
  2. Те, кто сталкивается с проблемами организации команды, процессами разработки ДС или ее внедрением в продукт.
  3. PO, PM, UX/UI-дизайнеры, Front-end разработчики участвующие в разработке ДС
  4. Все те, кто соскучился по докладам про дизайн-системы 😉

Здравствуйте, меня зовут Антон и я работаю проектировщиком в компании SEMrush.

В мои обязанностей входит унификация интерфейсов, разработка UX-гайдлайнов и внедрение дизайн-системы в команды разработки. Так же, я занимаюсь процессами взаимодействия между командами UX, UI и UIKit-а. Да, для нашей дизайн-системы выделена отдельная команда на фуллтайм. В нее входят два UI-дизайнера, один UX и три front-end разработчика.

Так исторически сложилось, что в компании уже было несколько подходов к единому гайдлайну. Был ui-kit с неполным списком компонентов, был графический гайдлайн, и этого вроде бы хватало. Но, со временем количество инструментов и команд выросло. Пришло много дизайнеров, разработчиков. Только от этого интерфейс лучше не становился. Все тянули одеяло в свою сторону, все хотели чтобы их инструмент был красивее чем другой. Всем было хорошо, только от этого страдали пользователи. Потом разработчики, а потом и бизнес.

В какой-то момент, было принято решение собрать рабочую группу из заинтересованных лиц и привести все в порядок. Рабочая группа, в конечном итоге, превратилась в отдельную команду.

В своем докладе я хотел бы затронуть такие темы как:

  • Дизайн-система — как единый источник информации (не только про компоненты, но еще и про паттерны взаимодействия, исследования и описание процессов взаимодействия с командами и многое другое).
  • Чаще всего, дизайн-системы ассоциируются только с UI-дизайном (компоненты и гайды). Мне бы хотелось сделать акцент на полноценной разработке с учетом UX.
  • Преимущества выделенной команды для ДС. Сайт дизайн-системы = Продакшн UI Kit команды.
  • Почему важно участие и вовлеченность всех UX-дизайнеров в разработке и обсуждении компонентов и гайдлайнов.
  • Внедрение дизайн-системы в команды разработки.
  • Статистика до-после. Метрики, по которым оценивается эффективность ДС.
  • UX-гайдлайны, UX-паттерны, комбинированные компоненты.
  • И конечно же, проблемы и подводные камни с которыми мы столкнулись во время разработки (проблемы миграции со «старого» на «новый» кит, длительность разработки, одновременное использование нескольких ui-kit-ов, длительность поставки гайдлайнов для разработчиков, недоверие к новому киту и другое).

Также, можно рассказать о том, что сейчас решает наша ДС:

  • Front-end разработчики стали меньше верстать, оптимизировали свою работу, тем самым могут заниматься «более полезными» вещами.
  • Пользователи все чаще и чаще видят одинаковые интерфейсные решения, ощущения что они на разных сайтах — меньше. Интерфейс движется в сторону унификации, при том, что не все разработчики используют react.
  • Согласовать интерфейсное решение с командой разработки и ПО стало проще.
  • Сократилось время на поиск UI/UX решений. Теперь их можно переиспользовать (и при желании доработать).
  • Проблема актуальности и версионности компонентов почти решена.

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

Антон Дуканич

 

Обсудить заявку