Каким должен быть продуктовый дизайнер в современной IT-компании
Роль дизайна в IT часто бывает недооценена. Дизайн продукта требует понимания бизнеса и целевой аудитории, от него зависят и коммерческие показатели компании. Продуктовый дизайнер помогает создать связь между бизнесом, целевой аудиторией и технологиями.
Я — Карина Касиманова, руководитель отдела дизайна международной продуктовой IT-компании Kolesa Group. В этой статье расскажу про:
- влияние дизайна на бренд компании;
- как устроена дизайн-команда Kolesa Group;
- как дизайнеры работают со специалистами из других отделов;
- реальные бизнес-кейсы;
- где выучиться на специальность;
- советы людям, которые хотели бы работать дизайнером в IT.
Влияние дизайна на бренд компании
Согласно исследованию McKinsey от 2018 года, компании, которые используют качественный дизайн, увеличили свою прибыль на 32% и общую доходность акционеров на 56% быстрее. Дизайн увеличивает добавленную стоимость товаров и услуг: iPhone продается дороже других смартфонов в том числе из-за хорошего дизайна.
В IT, например, в продуктовых приложениях, продукт задает дизайн, а не наоборот. Миссия продукта, его УТП, ценность и то, какие потребности пользователей он закрывает — всё это напрямую влияют на дизайн. В плане брендинга все то же самое.
Как устроена дизайн-команда в Kolesa Group
Дизайн-отдел в Kolesa Group состоит из двух команд (всего 18 человек):
1) графические дизайнеры (есть тимлид);
2) продуктовые дизайнеры (есть техлид).
У Kolesa Group 4 основных платформы: Kolesa.kz, Krisha.kz, Market.kz, Avtoelon.uz. Создание и сохранение логики графической части — это часть бренда компании. Очень важно верно пронести её через все эти платформы, используя все наши инструменты: маркетинг, PR, социальные сети, через сами продукты.
Графические дизайнеры работают в тесной связке с продуктовыми дизайнерами. Графдизы также несут продуктовую ценность в своей работе дополнительно через каналы: маркетинг, HR и т.д.
В графической команде есть motion-дизайнер. Это даёт нам много возможностей. Можно транслировать наши продукты с помощью motion design: а это двигающиеся заставки, видео в социальных сетях, в рекламе в YouTube и для подкаста «Код и кофе», а также в других каналах. В дальнейшем мы хотели бы внедрить motion-design и в наши приложения. Например, для более качественных и детальных анимаций.
Расскажу, как у нас в компании происходят процессы.
1. Продуктовый дизайнер транслирует ценность продукта, учитывая потребности пользователей через интерфейсы в приложениях и веб-сайты.
2. Далее подключается графический дизайнер, который добавляет иконки, иллюстрации, учитывая брендинг продукта.
3. Отправляем на исследование команде UXR.
4. Отрабатываем обратную связь, вносим правки в дизайн.
5. Отправляем в продакшн на тесты, наблюдаем, принимаем решения. В результате у нас создается целостный продукт со всеми составляющими.
Как дизайнеры связаны со специалистами из других отделов
Дизайн-отдел участвует практически на каждом этапе разработки продукта от этапа discovery до post-production.
1. Разработка продукта у нас начинается с этапа discovery, где собираются продуктовые гипотезы через метрики, воронки, аналитику, исследования. Product-менеджеры создают бэклог задач, который утверждается руководством (pitching).
2. Затем идёт следующий этап разработки продукта — дизайн. На этом этапе мы прогоняем наш фреймворк, который начинается от изучения задачи и заканчивается поддержанием дизайна, пока он живет в live. На этапе дизайна участвуют:
- Product-менеджеры
Они сверяют, насколько бизнес-кейсы, которые они поставили, соответствуют тому дизайну, который был создан.
- Исследователи
Мы тестируем дизайны и смотрим реакцию наших пользователей. Но ещё не отправляем в live.
- Разработчики
Мы включаем их в процесс, чтобы понимать возможности технологий и платформ. Чтобы не создать такой дизайн, который не сможет быть разработан на данном этапе, в данной команде и в данном продукте. Здесь разработчики выступают в качестве экспертов — они смотрят на дизайн и задают вопросы. Благодаря этому мы делаем тот дизайн, который может пойти в разработку. Просто нужно учитывать возможности технологий и платформ, способности каждого отдела и правильно с ними коммуницировать.
3. Следующий этап разработки продукта — его передача непосредственно разработчикам. Как только они закодили продукт\фичу, он отправляется на дизайн ревью. Чтобы проверить насколько дизайн разработан так, как это было в наших макетах.
4. После апрува дизайнера, дальше все идёт к QA для тестирования.
5. После апрува от QA, это возвращается к разработчику, и он отправляет это в live. Продукт запускается для всех пользователей.
6. Следующий этап разработки — постпродакшн, когда мы наблюдаем, что с этой фичой/ функционалом происходит. Там подключается отдел СЗП, QA, и уже выставляют задачи разработчикам. А если нужно пересмотреть эту фичу и пересобрать, всё это возвращается обратно в дизайн. Так живёт разработка продукта.
Реальные бизнес-кейсы
Теперь перейдём к рабочим кейсам, где мы с помощью дизайна решали реальные проблемы наших продуктов.
Кейс №1
Повысили конверсию во «Все отзывы» в Kolesa.kz
Проблема
30% пользователей, искавших новый автомобиль, читали отзывы о нём на экране с описанием, но во «все отзывы» переходили только 3,46%. То есть интерес у людей был, но возможность прочитать множество отзывов они не замечали.
Цель
Повысить конверсию с 3,46% (5 тысяч пользователей) ориентировочно до 10% (≈14,5 тысяч пользователей).
Решение
Было решено изменить дизайн внешнего блока «отзывов». Прогноз возможного роста конверсии смоделирован по аналогичным фичам в продукте.
Как строилась работа:
1. Для увеличения конверсии команда сформировала гипотезы по изменению дизайна.
2. Дизайнеры сделали черновые макеты, где мы обсуждали какой макет лучше сработает, соответствует ли он дизайн-коду всего продукта.
3. После утверждения финального дизайна мы отдали его в разработку, затем на продакшн.
4. Сделали пост-релизную аналитику. Конверсия выросла — мы оставили этот дизайн.
Была ещё проблема: в отзывах не указывался автор, они вызывали меньше доверия и обладали меньшей уникальностью. Для решения мы полностью поменяли дизайн карточки, увеличили размер фотографии авто с отзывов, добавили имя автора и сделали заметнее кнопку перехода ко всем отзывам.
Результат
Конверсия в переход во «Все отзывы» выросла за месяц с 3,46% до 9,13%.
Кейс №2
Улучшили процесс коммуникации между продавцом и покупателем в «личных сообщениях» (ЛС) внутри Market.kz.
Проблема
Готовясь к большому обновлению, мы перевели приложение Market.kz на технологию SPA (single page application). Появилась проблема — приложение долго считает, что пользователь «онлайн», после того как он вышел. Отсюда неудобства:
1. Push-уведомления о новых сообщениях приходят, когда пользователь онлайн, хотя в этот момент они не нужны. И наоборот — не приходят, когда человек закрыл приложение, а мы считаем, что он в «онлайне».
2. Покупатель не пишет продавцу, ошибочно считая, что долго не будет ответа. Или напротив — ждёт быстрой реакции продавца, хотя тот уже ушел.
Цель
Улучшить user experience и не допускать дальнейшего пропуска пользователем важных уведомлений.
Решение
Мы решили сделать внутренние уведомления в SPA и прописать логику:
1) «Не отправлять пуши в активный диалог, в остальных случаях — отправлять даже «онлайн» пользователю».
2) При сворачивании приложения меняем статус пользователя на «офлайн», и теперь ему приходят обычные пуши.
Как строилась работа
1. Поставили задачу и сформулировали гипотезу.
2. Продуктовый дизайнер провёл брейншторм с мини-discovery командой, которая обладает знаниями текущей реализации «Личных сообщений»: frontend-разработчиком, backend-разработчиком, дизайнером, QA-инженером.
2. Дизайнер сформулировал дизайн-гипотезу, которую мы проверили на качественных исследованиях.
4. Вывели пользовательские сценарии и сделали дизайн.
5. Дизайн прошёл контроль качества у техлида и руководителя дизайна.
6. Отдали дизайн в разработку, затем на дизайн-ревью и тестирование.
7. Релиз.
8. Мониторим показатели и работу новой функциональности.
Результат
1. Количество диалогов между пользователями выросло в 2 раза.
2. Среднее время ответа на Android снизилось в 2,24 раза, на iOS — в 2,2 раза.
3. Бонус — немного выросла доля прочитанных сообщений (+1 процентный пункт).
Где выучиться на специальность
Курсы:
Сборники полезных статей и материалов:
Telegram-каналы:
Советы людям, которые хотели бы работать дизайнером в IT
Единственный мой совет — пробовать. Потому что IT-индустрия — это про опыт. Используйте разные инструменты, пробуйте быть графическим дизайнером, UX-дизайнером, UI-дизайнером, motion-дизайнером. Обязательно изучайте язык бизнеса. После этого вы поймёте, от чего именно конкретно вы кайфуете и где вам хотелось бы раскрыться.