Кейс: UX дизайн агрегатора тёплых полов

КЕЙС: UX/UI разработка агрегатора тёплых полов

ТЁПЛЫЙ ПОЛ

ОПИСАНИЕ ЗАДАЧИ

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

ЭТАПЫ РАБОТЫ

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

1

Оценка и анализ требований

Перед началом работ я обязательно узнаю возможности программистов и стек, на котором работает или будет работать проект.

2

Знакомство с командой и стеком

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

3

Анализ рынка, конкурентов и ЦА

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

4

Анализ UX (пользовательского опыта)

Перед стартом разработки и дизайна необходимо описать и отобразить основные flow (пути) пользователя в блок-схемах.

5

Составление User Flow (Путь пользователя)

По сути, это создание каркаса сайта, основанного на построенных ранее User Flow. Наброски быстро создаются, их легко править и первично тестировать.

6

Создание Wireframe (Каркас проекта)

Нанесение дизайна и улучшение user interface, проработка мелких деталей, вроде теней или градиентов.

7

UI дизайн и прототипирование

Тестирование может проводиться как на этапе 4, так и на этапе 8 - на готовом дизайне. Зависит от целей и задач проекта.

8

Тестирование интерфейса

После тестирований необходимо снять аналитические данные и обработать их, затем выбрать наиболее успешный дизайн или внести правки и повторить тестирование.

9

Срез аналитики и статистических данных

АНАЛИЗ КОНКУРЕНТОВ

Анализ конкурентов позволяет отследить характерные рынку тренды
и акцентировать внимание пользователя на важных деталях

1

Акцент на категориях. Ключевые категории занимают 80% экрана главной страницы.

2

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

3

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

РОЛИ В ПРОЕКТЕ (АНАЛИЗ ЦА)

Квалифицированный специалист,
который занимается закупкой и установкой теплых полов.

Человек, который делает ремонт и самостоятельно решил подобрать теплый пол.

Профессионал

Делает ремонт

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

Портреты ЦА

РЕШЕНИЕ

Акцентировать на ключевых категориях

Разработать калькулятор для расчета стоимости

Разработать и внедрить онлайн подбор теплых полов

Сделать главную агрегирующей страницей

ПУТЬ ПОЛЬЗОВАТЕЛЯ (USER FLOW)

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

Путь пользователя

ЦВЕТОВАЯ ГАММА

#ff5400

#323232

#5b5b5b

#ffffff

ШРИФТЫ

Для заголовков

Для текста

Для подписей

СЕТКА

Сетка помогает создать базовую структуру, скелет из «невидимых» линий, на который ложатся элементы дизайна. Это связывает их в общую систему и рационально поддерживает композицию.

Сетка

WIREFRAMES

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

Каркас агрегатора

ФИЧИ: КАЛЬКУЛЯТОР ДВУХ ВИДОВ ДЛЯ A/B ТЕСТИРОВАНИЯ

#ff5400

A

Простой калькулятор на одну страницу с запросом вводных данных.

B

Калькулятор в виде квиза на 4 этапа с последующей лид формой.

Дизайн для десктопа

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

ФИНАЛЬНЫЙ ДИЗАЙН

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

Дизайн для десктопа

АТОМАРНЫЙ ПОДХОД

#ff5400

Атомарный подход позволяет легко вносить изменения в весь дизайн. Дизайн построенный из компонент быстро поддаётся изменениям.

Компоненты и UI KIT

ФИНАЛЬНЫЙ ДИЗАЙН

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

Адаптивный дизайн

Готов к решению сложных задач

Рассматриваю разные варианты и формы сотрудничества

Сделать оффер

+995 595 09 11 98 / +7 977 287 94 57 / tsanavagn@gmail.com

© Вся представленная информация на сайте достоверна.
Цанава Георгий - UX/UI дизайнер.
tsanava.com