Цель проекта:
Полный редизайн сайта (веб и моб)
для улучшения удобства использования, визуальной привлекательности
и оптимизации для конверсии (CRO)
Сроки проекта:
2 недели
Роль:
UX Designer
Ссылка на live сайт
Дизайн взаимодействия
B2C
Улучшение пользовательского интерфейса
Оптимизация CRO
Навигация
Что
Что
Что
Это фриланс-проект для клиники хиропрактики в Торонто — Corbo Chiropractic.
У клиники был сайт с хорошей изначальной структурой и базовой навигацией, но имелись проблемы с UX и несоответствующий визуальный брендинг.
Моя задача заключалась в том, чтобы полностью переделать сайт, преобразовывая представление большого количества информации для ясности, поиска и визуальной привлекательности.
Цели:
Приоритизировать и перестроить контент главной страницы для повышения конверсии, уменьшить длину прокрутки (scroll time) и улучшить доступность контента
Создать дизайн, который будет визуально привлекательным и соответствовать бренду Corbo Chiropractic и его целевой аудитории
Это фриланс-проект для клиники хиропрактики в Торонто — Corbo Chiropractic.
У клиники был хороший сайт «спины», но имелись некоторые проблемы с UX и несоответствующее визуальное брендингование на страницах.
Моя задача заключалась в том, чтобы полностью разработать сайт, преобразовав способ представления большинства информации для ясности, поиска и визуальной привлекательности.
Цели:
Приоритизировать и перестроить контент главной страницы для повышения конверсии, уменьшить длину прокрутки и улучшить доступность контента.
Создать дизайн, который будет визуально привлекательным и соответствовать бренду Corbo Chiropractic и его целевой аудитории.
Это фриланс-проект для клиники хиропрактики в Торонто — Corbo Chiropractic.
У клиники был хороший сайт «спины», но имелись некоторые проблемы с UX и несоответствующее визуальное брендингование на страницах.
Моя задача заключалась в том, чтобы полностью разработать сайт, преобразовав способ представления большинства информации для ясности, поиска и визуальной привлекательности.
Цели:
Приоритизировать и перестроить контент главной страницы для повышения конверсии, уменьшить длину прокрутки и улучшить доступность контента.
Создать дизайн, который будет визуально привлекательным и соответствовать бренду Corbo Chiropractic и его целевой аудитории.
Как
Как
Как
Решения по дизайну и обоснование
Решения по дизайну и обоснование
До
До




После
После


Информационная перегрузка
Одной из главных проблем, с которыми столкнула клиника, является необходимость делиться достаточным объемом информации о каждой услуге, которая могла бы вызвать интерес у потенциальных клиентов (планирование/решение по CJM) и донести реалистичные ожидания, не заставляя пользователя прокручивать длинные страницы и сталкиваться с множеством страниц, перегружающих информацией.
Я приняла решение отказаться от отдельных страниц для каждой услуги, которые были вложены под вкладку Услуги в навигации меню — создавая разрозненный опыт с фактическими страницами Услуг.
Информационная перегрузка
Одной из главных проблем, с которыми столкнула клиника, является необходимость делиться достаточным объемом информации о каждой услуге, которая могла бы вызвать интерес, установить правильные ожидания и обучить, не заставляя пользователя прокручивать длинные страницы и сталкиваться с множеством страниц, перегружающих информацией.
Было принято решение отказаться от отдельной страницы для каждой услуги, которая была вложена под вкладку Услуги в навигации меню — создавая разрозненный опыт с фактическими страницами Услуг.
Информационная перегрузка
Одной из главных проблем, с которыми столкнула клиника, является необходимость делиться достаточным объемом информации о каждой услуге, которая могла бы вызвать интерес, установить правильные ожидания и обучить, не заставляя пользователя прокручивать длинные страницы и сталкиваться с множеством страниц, перегружающих информацией.
Было принято решение отказаться от отдельной страницы для каждой услуги, которая была вложена под вкладку Услуги в навигации меню — создавая разрозненный опыт с фактическими страницами Услуг.


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









После
После






Оптимизация целевой страницы для удобства и CRO:
Создание своевременной стратегии CRA, которая направляет пользователей в их пути к конверсии. обеспечивает плавную навигацию для пользователей за пределами прямых навигационных точех
Сохранение идентичности бренда и визуальных отсылок к природе и листьям через фотографии, изогнутые разделительные линии и градиенты = Обеспечивая узнаваемость бренда для пользователя, при этом значительно повышая визуальную эстетику
Фокус на оптимизации для мобильных устройств и адаптивности - учитывая, что значительное количество пользователей посещает сайт с мобильных устройств
Оптимизация целевой страницы для удобства и CRO:
Создание своевременной стратегии CRA, которая направляет пользователей в их пути - обеспечивает плавную навигацию для пользователей за пределами прямых навигационных точек
Сохранение идентичности бренда и визуальных отсылок к природе и листьям через фотографии, изогнутые разделительные линии и градиенты = Обеспечивает узнаваемость бренда для пользователя, при этом значительно повышая визуальную эстетику
Фокус на оптимизации для мобильных устройств и адаптивности - учитывая, что значительное количество пользователей посещает сайт с мобильных устройств
This section includes optimized mobile screens with 'before' and 'after' comparison and rationale for my design decisions.
Итоговые результаты
Итоговые результаты
Итоговые результаты


Более вовлеченные посетители, которые остаются дольше и меньше покидают сайт
255% увеличение средней продолжительности сессии
12% снижение bounce rates
Более вовлеченные посетители, которые остаются дольше и меньше покидают сайт
255% увеличение средней продолжительности сессии
12% снижение bounce rates