От первых задач до дизайн-системы: как мы работаем над развитием интерфейса

По разным данным, человек получает от 60 до более 70 % информации с помощью зрения. Именно поэтому визуальная составляющая – один из главных аспектов работы над продуктом. Привлекательность и удобство интерфейса, которое позволяет быстро найти нужную информацию и легко ориентироваться в нем, называется «юзабилити» (от англ. usability – удобство и простота использования, степень удобства использования). В этой статье я хочу рассказать о важности дизайна интерфейса и о том, как мы в Solar webProxy выстроили работу над ним, на примере нашего SWG-решения.

Почему дизайн интерфейса настолько важен

Один из важнейших аспектов юзабилити – время. Современный человек ценит каждую секунду своей жизни. Именно поэтому так важно разрабатывать интерфейс, который приведет пользователя к цели в кратчайшие сроки. Здесь можно привести банальный пример с веб-серфингом. Допустим, пользователю необходимо найти какую-либо информацию. На одном сайте он долго ее ищет и не может найти, даже если она там есть. Естественно, в какой-то момент пользователь отправится на другой сайт, где найдет нужную информацию за считаные минуты. В другой раз он будет отталкиваться от предыдущего опыта и не пойдет на сайт, который вызвал у него проблемы при поиске. С информационными системами дело обстоит намного сложнее, ведь для поиска информации в основном используется основная документация (например, руководство пользователя). Однако, обычно она очень полная, и в ней сложно быстро найти необходимую информацию, подсказки, которые смогут дать ответ на возникший вопрос. В связи с этим у пользователя возникает негативный опыт, который в дальнейшем может сложить негативное впечатление от взаимодействия с интерфейсом.

Когда задумываться о дизайне интерфейса

Дизайном интерфейса целесообразно заниматься системно, с момента запуска первых продуктов компании. Однако так получается далеко не всегда: часто для компании более важно как можно скорее выйти с продуктом на рынок и нарастить аудиторию. И качество дизайна уходит на второй план. Это особенно характерно для MVP (минимально жизнеспособного продукта) – сначала необходимо подтвердить, что решается актуальная проблема для правильно определенной целевой аудитории на соответствующем рынке. И только потом компании приступают к «шлифовке» дизайна интерфейса.

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

Чтобы развивать продукт дальше, нужно осознавать изменения в процессах принятия решений. На первый план должны выйти реальные потребности клиентов, а не экспертиза команды.

Какой путь мы прошли

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

Первая версия нашего шлюза веб-безопасности появилась в 2015 году. Тогда она кардинально отличалась от той, которая есть на сегодняшний день.

Первая версия Solar webProxy выглядела так:

Найти необходимые настройки, просматривать результаты и ориентироваться в системе было непросто. Но тогда для нас было важнее другое – качественно решать текущие задачи (например, предоставление администраторам безопасности возможности просмотра информации, собранной в процессе мониторинга, или настройки функций безопасности, таких как блокировка рекламы). Чаще всего такие задачи были очень простые и требовали просто хорошего технического исполнения. Когда первые задачи были решены, и мы поняли, что наш продукт действительно отвечает требованиям потребителя, появилась потребность в совершенствовании дизайна интерфейса.

Мы выбрали метод бизнес-задач с артефактами (элементами, непосредственно входящими в состав продукта) и активностями дизайн-команды. Через некоторое время увидели первые положительные результаты:

1.       Налаженный рабочий процесс, выработанные критерии постановки и приемки задач интерфейса.

2.       Краткосрочное и среднесрочное планирование развития интерфейса.

3.       Регулярное обновление интерфейса.

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

Постепенно мы добились еще большего прогресса в нашем деле. В результате на этапе разработки каждой фичи ставились такие задачи :

1.       Долгосрочное планирование работ развития интерфейса.

2.       Качество реализации дизайна и дизайн-ревью.

3.       Создание гайдлайнов, описывающих логику работы и стилистику интерфейса продукта.

4.       Фреймворк на базе гайдлайнов, единые базы кода и т.д.

5.       Дизайн-принципы или критерии выбора дизайн-решения, которыми руководствуется компания при создании и развитии продуктов.

6.       Формирование дизайн-системы.

Основной вывод, который мы сделали из процесса создания дизайн-системы – это то, что к ней нужно относиться так же, как и к любому другому программному продукту, – составлять план развития и вносить изменения как на основе обратной связи, так и на основе собственных наблюдений. И главное – трезво закладывать время на доработки и внесение изменений.

Как теперь устроен процесс

Постепенно мы поменяли не только наш процесс работы с дизайн-командой, но и ее значимость в разработке каждой фичи. UX-исследования стали одним из обязательных этапов работы.

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

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

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

Все результаты исследований, полученные в процессе, доносим до команды, согласуем реализацию и добавляем в базу знаний Confluence. Еще мы проводим регулярные встречи, где демонстрируем результаты исследования всем заинтересованным лицам, приглашаем коллег (например, presale-менеджеров) для участия в исследовании или просим помочь с поиском нестандартных пользователей (например, фокус-группу).

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

О культуре UX и слаженном подходе

Кроме исследований, нужно не забывать развивать культуру UX- и дизайн-грамотности в компании: в Ростелеком-Солар проводятся демонстрации, брейнштормы по генерации идей, обмен материалами и тенденциями. Грамотная культура взаимодействия между дизайнерами и остальными членами команды очень важна, так как вашей дизайн-командой становится вся компания, а результатом дизайна не только хорошие продукты, но и сама организация.

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

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

Что получилось в итоге

В нынешней версии Solar webProxy было решено множество проблем в части юзабилити. Для наглядности продемонстрирую современный интерфейс системы:

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

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

Все это – лишь единичные примеры изменений в интерфейсе, которые появились благодаря системной работе над его дизайном.

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

Источник: habr.com

0 0 голоса
Рейтинг новости
0
0
Подписаться
Уведомить о
0 комментариев
Межтекстовые Отзывы
Посмотреть все комментарии