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

Цели:

Приоритизировать и перестроить контент главной страницы для повышения конверсии, уменьшить длину прокрутки (scroll time) и улучшить доступность контента
Создать дизайн, который будет визуально привлекательным и соответствовать бренду Corbo Chiropractic и его целевой аудитории

Это фриланс-проект для клиники хиропрактики в Торонто — Corbo Chiropractic.

У клиники был хороший сайт «спины», но имелись некоторые проблемы с UX и несоответствующее визуальное брендингование на страницах.

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

Цели:

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

Создать дизайн, который будет визуально привлекательным и соответствовать бренду Corbo Chiropractic и его целевой аудитории.

Это фриланс-проект для клиники хиропрактики в Торонто — Corbo Chiropractic.

Цели:

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

Создать дизайн, который будет визуально привлекательным и соответствовать бренду Corbo Chiropractic и его целевой аудитории.

Как

Решения по дизайну и обоснование

До

После

Информационная перегрузка

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

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

Информационная перегрузка

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

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

Информационная перегрузка

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

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

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

Сохраняйте некоторое свободное пространство на странице, встраивая дополнительную информацию в интеракцию при наведении (смотрите гифку выше)

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

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

До

После

Оптимизация целевой страницы для удобства и CRO:

Создание своевременной стратегии CRA, которая направляет пользователей в их пути к конверсии. обеспечивает плавную навигацию для пользователей за пределами прямых навигационных точех
Сохранение идентичности бренда и визуальных отсылок к природе и листьям через фотографии, изогнутые разделительные линии и градиенты = Обеспечивая узнаваемость бренда для пользователя, при этом значительно повышая визуальную эстетику
Фокус на оптимизации для мобильных устройств и адаптивности - учитывая, что значительное количество пользователей посещает сайт с мобильных устройств

Оптимизация целевой страницы для удобства и CRO:

Создание своевременной стратегии CRA, которая направляет пользователей в их пути - обеспечивает плавную навигацию для пользователей за пределами прямых навигационных точек
Сохранение идентичности бренда и визуальных отсылок к природе и листьям через фотографии, изогнутые разделительные линии и градиенты = Обеспечивает узнаваемость бренда для пользователя, при этом значительно повышая визуальную эстетику
Фокус на оптимизации для мобильных устройств и адаптивности - учитывая, что значительное количество пользователей посещает сайт с мобильных устройств

Optimizing for Mobile

This section includes optimized mobile screens with 'before' and 'after' comparison and rationale for my design decisions.