АГАМИ. Сайт стоматологической клиники

1. Вводная задача от заказчика, проблематика, цели

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

Ключевая цель нового сайта — презентация приоритетных услуг (имплантация, лечение во сне, или седация, консультации главного врача) и увеличение количества заявок с сайта. Большинство пользователей заходят на сайт с мобильных устройств, поэтому для проекта был выбран формат mobile-first.

Поэтому перед нами встали задачи:

— разработать новый сайт с логичной и интуитивно понятной структурой;

— отразить ключевую экспертизу стоматологии (лечение сложных случаев);

— проработать подачу контента и заголовки, сделав акцент на принципах клиники, профессионализме специалистов и честности в работе с пациентами.

2. Описание реализации кейса и творческого пути по поиску оптимального решения

Предпроектная аналитика

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

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

Конкурентный анализ проводили методом сравнения. Информацию о юзабилити сайтов конкурирующих клиник фиксировали в таблице. Изучали главную, страницы услуг и врачей, кейсы, разделы «О клинике» и «Контакты». Задача была проанализировать подход компаний-конкурентов к формированию структуры сайта и организации контента.

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

В пользовательских интервью приняли участие семь респондентов — это были клиенты клиники, которых пригласили сотрудники «АГАМИ». Во время общения с респондентами получили много инсайтов, которые учли при разработке интерфейсов. Например, больше половины респондентов отмечали консультацию главного врача в качестве преимущества клиники. Поэтому заложили в структуре сайта отдельную страницу для этой услуги и разместили переход на неё в шапке сайта.

Базовое понимание информационной архитектуры сложилось ещё на этапе веб-аналитики. По итогам исследования построили связи от главной к остальным страницам сайта и добавили требования, сформулированные после обработки интервью, а также гипотезы и пожелания из веб-аналитики, конкурентного анализа и бизнес-интервью.

Дизайн

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

Композиция на первом экране в дизайн-концепции задаёт настроение всему сайту. Через графику старались передать живые эмоции, дружелюбие, коммуникабельность и командную работу специалистов «АГАМИ». Не прибегали к стоковым решениям, составляли ТЗ для фотографий, которые использовались в коллаже.

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

Разработали индивидуальные иконки, чтобы они подходили под стилистику проекта. Отрисовав страницы сайта, разработали UI-кит со всеми состояниями элементов для передачи сайта в разработку. Это помогло разработчикам сделать сайт более живым, с анимациями по скроллу и ховерам на элементы.

Смена позиционирования и дизайна

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

Наполнение и структура сайта не изменились, переработали лишь цветовое оформление страниц. Заменили яркие оранжевый и синий цвета на тёмные оттенки: графитно-чёрный и приглушённую охру. Цветовое сочетание стало более премиальным, как и хотел клиент.

Изменили и шрифт. До этого для заголовков использовали «Manrope», а поменяли на утончённый «Stapel». Одна из его отличительных особенностей — акцент на тонких примыканиях штрихов. А вместе с широкими буквами он добавляет дизайну уверенность и спокойствие.

3. Результаты сотрудничества

— Увеличилось количество заявок через сайт на 38%.

— Конверсия с мобильной версии увеличилась на 24%.

— Увеличилось количество консультаций у главного врача на 39%.

— В 7 раз чаще стали спрашивать про седацию, которую при разработке ставили как приоритетную услугу.

— Появились отклики на услуги, страницы которых не были раньше проработаны на сайте.

— Трафик на соцсети увеличился с сайта на 13%.

Максим

руководитель проекта, Агами

Весь этот «глобальный» проект для нашей компании своих целей достиг, но что особенно ценно — в заранее поставленные сроки и бюджет. Работы предстоит ещё достаточно много, хотя с момента публикации сайта мы ежемесячно его «обновляем», пополняем бэклог, добавляем новые функции.

Работать с командой «Эвереста» нам понравилось! Так как мы стоматологическая клиника, а не айти-компания с большим количеством компетенций, то для нас было важно найти партнёра, который бы сделал всё от начала и до конца «по-взрослому»: с погружением в тему, анализом поведения пользователей на сайте, с интервью с реальными пациентами, прототипированием и даже настройкой скорости работы сайта на сервере. И это всё удалось.

Хочется отметить, что всё взаимодействие происходило в онлайне через переписку, встречи, комментарии в Figma. Мы так ни разу и не встречались в офлайне, хотя нам, как клинике, привычно видеть и общаться с нашими клиентами вживую. Это был новый опыт, который оказался интересным и современным.