Сделали редизайн для производителя ПО для электротранспорта. И заодно добыли инсайты по рынку. Кейс ThunderSoft

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

Рассказываем, как мы сделали редизайн мобильного приложения и веб-панели для ThunderSoft — разработчика программного обеспечения для зарядной инфраструктуры. В этом кейсе покажем, как подружить сложный технологический продукт и лаконичный современный дизайн.

А еще расскажем, как проектный менеджер Purrweb притворялась сотрудницей транспортной компании и ходила на разведку к конкурентам ThunderSoft, чтобы найти лучшее решение для клиента.

Приложение доступно в сторах — чтобы установить, отсканируйте QR-код.

Обогнали конкурентов по техническим фичам, но отстали в дизайне

ThunderSoft производит ПО для управления зарядными станциями и развивает экосистему, которая объединяет водителей электромобилей и владельцев станций. Их решения использует, например, компания «Яблочков» — один из ведущих в России разработчиков и производителей станций зарядки.

Команда ThunderSoft обратилась к нам с задачей провести редизайн двух продуктов: мобильного приложения для клиентов и веб-панели для специалистов, управляющих зарядными станциями.

У инхаус-команды клиента была серьезная техническая экспертиза, а вот опыта в дизайне не хватало — в плане UI/UX продукт для клиентов отставал. Разработчики просто добавляли новые фичи в приложение, никак не адаптируя при этом интерфейс.

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

Хотя компания обогнала других игроков рынка по технологиям, было очевидно, что в плане UI/UX их продукт отстает от конкурентов. И это отталкивало пользователей.

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

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

Что нам предстояло сделать

Клиент поставил такие задачи:

• Изучить конкурентов, выделить лучшие практики и понять, как адаптировать их под продукт ThunderSoft.
• Полностью переработать пользовательский флоу и навигацию, обновить интерфейс в мобильном приложении и веб-панели.
• Отрисовать дизайн под новые фичи. Например, продуктовый анализ и сбор статистики.
• Разработать дизайн и пользовательский интерфейс, который будет легко кастомизировать: ThunderSoft продает свой продукт как white label решение для других компаний.

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

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

Устаревший дизайн и низкие конверсии? Кажется, вам нужен редизайн

Мы в Purrweb готовы помочь. Проведем аудит, улучшим UX, чтобы пользователи чаще совершали целевые действия, и обновим UI, сделав его современным и стильным. Свяжитесь с нами, чтобы получить бесплатную оценку проекта.

Получить оценку

Получить оценку

Исследовали рынок под прикрытием

Выяснить, что происходит в нише ThunderSoft, можно было только изнутри. Так что Любовь Пянзина, проектный менеджер Purrweb, записалась на несколько тест-драйвов к конкурентам — притворялась корпоративным клиентом, желающим установить зарядную станцию.

Вместе с клиентом провели опросы пользователей и обнаружили несколько важных инсайтов.

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

Поможем повысить конверсии сайта или приложения с помощью редизайна

Более 10 лет создаем IT-продукты для бизнеса и стартапов и знаем, что хороший дизайн «продает». Делали редизайн для таких компаний как Яблочков, Панам Пицца, SOAK и многих других. Хотите получить бесплатную оценку проекта? Свяжитесь с нами

Получить оценку

Получить оценку

Мобильное приложение ThunderSoft: до и после

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

Онбординг: добавили туториал

В приложении не было туториала, который мог бы помочь новым пользователям разобраться с функциями. Мы его добавили: при первом запуске пользователю показывают ключевые фичи приложения — зарядку по QR-коду, поиск зарядных станций и просмотр баланса.

Главный экран: убрали лишнее

Главный экран был перегружен блоками и информацией, которые не нужны пользователю на первом шаге. Мы провели ревизию и оставили только самое важное.

Карта: сделали удобнее

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

Зарядная сессия: упростили флоу

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

Профиль и история: добавили статистику

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

Экран оплаты: убрали путаницу

Старый экран оплаты содержал слишком много вариантов и был неинтуитивным. Новый дизайн: минимум шагов, понятные иконки способов оплаты, прогресс-индикатор.

Избранное и уведомления: добавили функции

Добавили возможность добавлять зарядные станции в избранное и настраивать уведомления об окончании зарядки или освобождении станции.

Веб-панель ThunderSoft: до и после

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

Посмотрите, как мы с этим справились. Не будем показывать все сто с лишним экранов, которые мы редизайнили, а только несколько примеров: просто почувствуйте разницу! 🙌

В настоящее время команда ThunderSoft  готовится к релизу веб-панели с обновленным дизайном.

Фильтры: оптимизировали отображение информации

Страница станции: добавили визуализацию

Зарядки и бронирование: упростили навигацию

Дашборд для владельцев станций

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

Темная и светлая темы для дизайн-системы и white label

Дизайн-систему проектировали так, чтобы при разработке интерфейса для другого бренда нужно будет поменять только 9 цветов в коде, и всё автоматически настроится. А на темную тему можно переключиться прямо в Figma. Вот такая дизайнерская магия! 🔮

Светлая и темная тема:

Лого состоит из знаковой и шрифтовой части.

Результат

Недавно ThunderSoft зарелизили MVP-версию приложения с новым дизайном и оно доступно в Google Play и App Store. Релиз веб-панели состоится позже.

Команда ThunderSoft осталась довольна результатами: теперь у мобильного приложения современный дизайн с хорошим юзабилити, а отображение данных в веб-панели стало намного удобнее и компактнее.

Заказчики уверены, что новый дизайн продуктов поможет успешно решать бизнес-задачи компании: привлекать лояльных пользователей и мотивировать сервисные центры переходить на веб-панель ThunderSoft для управления станциями.

Мы успешно подстраивались под требования и дедлайны технической части команды ThunderSoft. Они это оценили: с их стороны в проект было вовлечено много специалистов, и нам удалось с ними синхронизироваться и наладить коммуникацию.

Кстати, о коммуникации: в чатике с заказчиками была очень классная неформальная атмосфера 😀 Мы обменивались мемами и много шутили. Даже когда обсуждали рабочие задачи. Посмотрите, какой вайб у нас там был — ну круто же, когда так!

➡️ Нужен глубокий и вдумчивый редизайн? Мы в Purrweb готовы помочь. Погрузимся в контекст вашего бизнеса, проанализируем проблемы и слабые стороны дизайна, изучим лучшие практики на рынке и придумаем, как адаптировать их для вашего продукта.

Реализуем проекты по редизайну любой сложности — посмотрите нашу услугу редизайна сайтов.

Есть задача? Свяжитесь с нами, и мы предложим варианты реализации, обсудим сроки и бюджет.

Почему Purrweb?

Экспертиза в дизайне. Более 10 лет создаем IT-продукты. За это время работали с более чем 320 клиентами, накопили большой опыт в UX/UI-дизайне для самых разных продуктов.

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

Умеем работать без детального технического задания. Вам не нужно приходить с детально проработанным ТЗ. Нам достаточно общего запроса и контекста, чтобы самим разобраться в задаче и предложить решение, которое идеально подходит именно для вашего проекта.