Xetova — быстрорастущая технологическая компания в Найроби, добившаяся успеха в предоставлении продуктов и услуг на основе ИИ для государственных организаций, НПО и корпораций. Однако по мере расширения компании стало очевидным, что отсутствие целостной системы дизайна мешает работе пользователей и мешает новым дизайнерам быстро вносить свой вклад в команду.

Я создал дизайн-систему

Цели дизайн-системы

Чтобы решить эту проблему, я возглавил команду дизайнеров по внедрению новой системы дизайна для Xetova. Система дизайна — это набор рекомендаций по дизайну, шаблонов и компонентов, которые используются для создания единообразного внешнего вида продуктов компании.

Создавая новую централизованную систему проектирования, мы стремились:

  • Объединить наши команды дизайнеров и инженеров, предоставив им более структурированный и управляемый подход к созданию продуктов.
  • Ускорьте процесс проектирования и разработки, используя готовую библиотеку и шаблоны проектирования.
  • Улучшите восприятие бренда и доверие пользователей за счет единообразного интерфейса, доступного для всех пользователей.
  • Повысьте доступность в наших продуктах, внедрив доступность и включение в наши библиотеки компонентов как с точки зрения дизайна, так и с точки зрения кода.

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

Это изменило поведение пользователей

Сделав дизайн-систему единым источником достоверной информации для строителей — дизайнеров и разработчиков — мы оказали положительное влияние на то, как конечные пользователи взаимодействуют с продуктами Xetova:

  1. Повышенная согласованность и надежность продукта: мы улучшили согласованность и предсказуемость наших продуктов прогнозной аналитики, увеличив охват системы проектирования для продуктов с 2% до 80%.
  2. Сокращение путаницы у клиентов: мы получили на 23 % меньше жалоб, связанных с путаницей с продуктом. Они были основаны на сеансах обзора обратной связи между командой дизайнеров и руководителем отдела продукта и менеджером по обеспечению качества.
  3. Более высокая воспринимаемая покупателем ценность: в течение 6 месяцев после внедрения системы дизайна воспринимаемая покупателем ценность продукта выросла на 20 % благодаря стабильному и качественному пользовательскому опыту.
  4. Повышение удовлетворенности клиентов. Благодаря более последовательному и целостному взаимодействию с пользователями наши показатели удовлетворенности клиентов выросли на 10 %.

И реализовал эти бизнес-цели

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

  1. Увеличение использования компонентов системы дизайна: количество страниц и функций, использующих компоненты системы дизайна, выросло с 9% до 78%.
  2. Сокращение времени проектирования и разработки. На проектирование и разработку новых функций уходит на 37 % меньше времени, поскольку теперь командам стало проще использовать и внедрять предварительно разработанные системные компоненты.
  3. Улучшение взаимодействия в команде: уровень сотрудничества между командами дизайнеров и разработчиков вырос на 25 % за первые 6 месяцев, поскольку у них был общий набор инструментов и руководств для использования.
  4. Сокращение несоответствий в дизайне: количество несоответствий в дизайне, о которых сообщили пользователи или которые были выявлены в ходе тестирования QA, уменьшилось на 50 % за первые шесть месяцев адаптации.
  5. Повышение согласованности дизайна продукта: согласованность дизайна разных продуктов выросла на 50 % в течение первых 6 месяцев, поскольку все дизайнеры имеют доступ к системе дизайна, а ее элементы наследуются во всех файлах дизайна продукта. .

Как я это сделал

Исследования и определение

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

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

«Я не могу повторно использовать компонент из другого проекта, так как у них нет схожей структуры», — Front End Engineer

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

После этого мы определили общие шаблоны и элементы дизайна для наших продуктов. Это включало создание списка основных компонентов интерфейса. Затем мы использовали эту информацию для создания списка приоритетов для нашей дизайн-системы MVP.

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

Дизайн

На основе этого исследования мы представили инструменты и процессы, которые помогут нашей команде последовательно применять систему дизайна в своей работе. Это включало создание общей библиотеки проектов с многократно используемыми компонентами, а также установление процесса проверки и утверждения, чтобы гарантировать, что все проекты соответствуют рекомендациям:

  1. Системы цветов и шрифтов, соответствующие общим правилам бренда.
  2. Компоненты, доступные, интуитивно понятные и эстетичные
  3. Включение широко используемой системы значков Material Design для легкого внедрения дизайнерами, разработчиками и пользователями.

Мы обратились к нескольким системам дизайна, таким как Uber’s Base Gallery, Slack’s design guides, Material и другим системам дизайна, чтобы узнать о некоторых передовых методах, рекомендациях и инструментах, которые мы могли бы применить в нашей системе дизайна.

Система дизайна теперь доступна для всех членов команды Xetova.

С кем я сотрудничал

Я сотрудничал с кросс-функциональной командой для создания дизайн-системы. В состав команды входили следующие участники:

  1. Менеджеры по продуктам. Они рассказали о бизнес-целях и задачах системы дизайна.
  2. Разработчики: они следили за тем, чтобы дизайн-система была легко реализуема и соответствовала стеку технологий компании.
  3. Исследователи: они провели исследование пользователей, чтобы понять потребности и болевые точки нашей целевой аудитории, и использовали эту информацию для обоснования решений по дизайну.
  4. QA: они обеспечили доступность дизайн-системы и ее соответствие отраслевым стандартам.
  5. Другие дизайнеры. Они следили за тем, чтобы система дизайна соответствовала принципам брендинга и визуальной идентификации компании, а также предоставляли отзывы и предложения по улучшению системы дизайна.

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

Проблемы, с которыми я столкнулся

Как дизайнер, создающий дизайн-систему, я столкнулся с некоторыми проблемами:

  1. Управление конфликтующими приоритетами. У разных заинтересованных сторон могут быть разные приоритеты и цели для системы дизайна, что может затруднить создание системы, отвечающей всем потребностям.
  2. Баланс согласованности и гибкости. Найти правильный баланс между согласованностью и гибкостью в дизайн-системе было непросто. Обеспечение достаточной гибкости дизайн-системы, позволяющей использовать различные продукты и варианты использования, при этом сохраняя согласованность, было непростой задачей.
  3. Использование устаревших дизайнов. Нам пришлось рассмотреть и ассимилировать устаревшие дизайны и компоненты, которые накапливались с течением времени, было сложно согласовать их с новой системой дизайна.
  4. Управление изменениями. Внедрение новой системы дизайна может быть разрушительным для команд, которые привыкли работать определенным образом. Управление изменениями и предоставление достаточной поддержки и ресурсов, чтобы помочь командам адаптироваться к новой системе, было непростой задачей.
  5. Измерение успеха. Было сложно определить и измерить успех дизайн-системы. Определение ключевых показателей эффективности и отслеживание прогресса имели решающее значение для обеспечения успеха системы проектирования.

Размышления

В этом проекте я получил ценную информацию об отношениях между дизайнером и не дизайнером, которой я поделился в этой статье 👇



Первоначально опубликовано на https://stephaniekabi.com.