Цифровой госпиталь и медицина на 360°: как мы обновили сайт частной клиники №1 в России
Иногда больницы у русского человека вызывают недоумение и страх: процедурный кабинет, где пахнет лекарствами и не только, представили? Но зачастую это наши страхи из детства и юношества суровых 90-х, потому что сейчас всё иначе.
В этой статье мы расскажем нашу историю, как мы, AGIMA, провели редизайн сети медицинских клиник премиального сегмента: какие задачи бизнеса нужно было решить, как рассказать о новой услуге с помощью дизайна и динамических иллюстраций, зачем начинать проектирование с копирайтинга и что изменилось в интерфейсе. А еще как можно применить подобный подход для своего бизнеса, когда есть крутой офлайн, а его онлайн-аналог устарел. Разбираемся, что делать.
Интро: АО «Европейский Медицинский Центр» (ЕМС) — одна из крупнейших частных медицинских компаний России. В EMC работает более 600 врачей из Западной Европы, США, Израиля, России. Ежегодно проходит лечение до 90 000 пациентов. В состав EMC входят 9 медицинских центров в Москве и Московской области. EMC работает по всем медицинским направлениям, предлагая пациентам индивидуальный комплексный подход к заботе о здоровье и доступ к инновационным методам диагностики и лечения.
Редизайн в цифрах
Наша команда разработки проекта: 24 специалиста.
Посетителей сайта в месяц: 1084360.
Клиентов ЕМС: 20%.
В конце 2019 года ЕМС сфокусировалась на новом подходе «Здоровье на 360°». Его цель — сформировать индивидуальный roadmap каждому клиенту, став медицинским советником на протяжении всей жизни на пути к longevity, помочь пациентам на каждом шаге к долгой, комфортной и при этом активной жизни. Адаптировать старый сайт под новое позиционирование не получалось: он уже устарел технологически и структурно. Помимо этого была еще одна проблема: дизайн больше подходил для государственного учреждения, а не для частной клиники, одного из лидеров в премиальном сегменте в России.
Четыре главные задачи:
- Создать онлайн-платформу представительства премиального мультиплатформенного цифрового госпиталя, полностью переработать структуру сайта и основательно развернуться лицом к пользователю.
- Сфокусировать посетителей на новой парадигме «Здоровье 360°».
- Подготовить сайт под изменение бизнес-процессов и добавить новые инструменты, которые позволят совершать большее количество целевых действий.
- Сохранить SEO-позиции в поисковой выдаче после запуска обновленного сайта.
1. Исследуем и анализируем
Сначала провели предпроектное обследование, пообщались с топ-менеджерами клиники и выявили четыре основных проблемы в интерфейсах, которые мешали использовать старый сайт на максимум и не отражали luxury-позиционирования:
- Сайт устарел как технологически, так и структурно.
- Дизайн сайта ассоциируется с государственным учреждением.
- Контент сайта напоминает «Большую советскую энциклопедию» с огромным количеством текста и не отвечает современным представлениям о сайте премиум-клиники с передовыми технологиями и компетенциями.
- Весь контент смешан: новости, публикации — много сущностей в одном разделе, дублирование контента в разных разделах. Это путало пользователей.
2. Проектируем здоровье на 360°
В создании сайта у нас было 2 разных подхода, и оба отлично сработали:
1. Главную страницу мы проектировали от текста. Сначала подключили копирайтеров и редакторов, которые забрифовали команду, а потом нарисовали прототип.
2. Остальные страницы сперва были спроектированы с учетом требований заказчика, а потом в них был добавлен текст.
Оба этих варианта применимы для разработки дизайна сайта. Первый будет более насыщенным с точки зрения контента, второй — чуть более функциональным.
При формировании новой структуры сайта мы погрузились в аналитику и цифры: оценили текущий сайт с позиции пользовательского трафика, определили структуру для новых разделов, проверили ее исходя из базовых сценариев и протестировали на пользователях. Самыми популярными разделами оказались клиники, статьи, главная и сервисы. Как мы выяснили, наиболее распространенный пользовательский сценарий — посмотреть симптомы болезни, изучить стоимость лечения и записаться на прием к профильному врачу.
3. Разрабатываем редизайн медицинского центра
Закончив с функциональной частью сайта клиники, мы перешли к UX/UI-обновлениям.
Главная
На главную вынесли сервисы, которые позволяют сразу находить нужный канал коммуникации с клиникой и переходить туда. Мы аккуратно вписали рассказ о концепции «Здоровье на 360°»: интерактивная вставка с рассказом привлекает внимание, но не мешает посетителям, которые пришли за конкретной услугой или к конкретному врачу.
Подбор специалистов
Этот раздел мы тоже реструктурировали. На сайте появился список всех врачей, работающих в клинике. Для выбора специалиста посетитель может воспользоваться поиском или набором фильтров. Здесь же мы добавили интеграцию с МИС (медицинская информационная система) — возможность сразу же выбрать дату и время и сформировать запись.
Запись к врачу на прием
На старом сайте была только форма заявки, где клиенты описывали симптомы болезни и оставляли свои пожелания по времени посещения. На новом сайте мы сделали виджет записи к врачу напрямую в расписание специалиста, то есть теперь клиент не ждет пока ему ответят, — он может сразу записаться на удобное время. Это разгрузило операторов колл-центра, которые были вынуждены получать задания, подбирать свободные слоты врачей и отзваниваться клиенту.
Новости
Статьи — один из самый популярных и важных разделов сайта. Материалы подчеркивают экспертность врача и помогают посетителю в выборе нужного специалиста.
В старом разделе «Новостей» были статьи, публикации и множество другой информации. Пользователям было сложно ориентироваться в материалах, поэтому мы разделили все на подразделы «Новости», «СМИ о нас», «Страницы специализаций» и другие.
Немного цифр о переносе информации:
- карточек специализаций — 285;
- карточек врачей — 623;
- карточек программ — 56;
- карточек услуг — 233;
- карточек статей — 442;
- карточек заболеваний — 287;
- карточек новостей — 589;
- карточек вопросов и ответов — 246.
Новые фичи
Клиенты EMC, которые ждут прибавления в семействе, могут гибко сконфигурировать услугу будущих родов. С помощью калькулятора легко понять, как дополнительные опции влияют на финальную стоимость. А на послеродовой период можно сразу добавить необходимые и персонализированные услуги, которые понадобятся молодой маме.
Чтобы сайт был гармоничным, мы сохранили преемственность сферы в деталях на страницах
4. Рисуем динамические иллюстрации
Чтобы полноценно раскрыть суть новой услуги, мы нарисовали динамические иллюстрации: сферу и точечного человека. Сфера демонстрирует высокотехнологичность услуг и показывает, что в клинике можно заботиться о здоровье комплексно — на 360°. Динамическую сферу повторяет «точечный человек», который отражает идею связанности: все в организме человека оказывает взаимное влияние друг на друга.
Итог
Вместе с командой ЕМС мы перенесли офлайн в онлайн и создали полноценный цифровой госпиталь: у пациентов клиники появилась возможность на одной площадке создать свой инструмент контроля за здоровьем и здоровьем своих близких. Теперь пользователи могут комфортно записаться к врачу, рассчитать стоимость услуг, подготовиться к появлению ребенка на специальном калькуляторе и изучить информацию о клиниках, не выходя из дома.
Совсем недавно сеть клиник EMC стала лауреатом премии Luxury Lifestyle Awards. Их официально признали лучшим в Европе медцентром в премиум-сегменте.
Так вот кого надо проклинать за этот интерфейс. Теперь невозможно увидеть последние новости, которые отлично видны в приложении. Форму записи в погоне за инноваций угробили, проще позвонить и голосом записаться теперь. Фу
Вы один тех из немногих пользователей, кому на сайте клиники нужны новости. Простите что пришлось ущемить ваши потребности
верно, хуже стало
по версии самой клиники?
Комментарий удален модератором
Это конечно маркетологи в работе )
полностью звучит "частная платная клиника №1 по оказанию высокотехнологичной помощи."
Комментарий недоступен
Интересно конечно, что ваш коментарий в нектором роде тоже прекрасная иллюстрация этого эффекта ))
поздравляю, вы самоутвердились за счет других
Хороший и подробный кейс, спасибо.
Мария, а почему все ваши комментарии только к статьям от AGIMA? 🤔
У.Е.!? Не, серьезно?
А типа парсить с сайта ЦБ курс и выводить в валюте не 90-х, а нормально, не?
$ - доллар
€ - евро
Это как раз политика клиники, думаю выбора не было. У них и внутри клиники это есть.
Чтобы европейцам считать в Euros, а американцам в Dollars 😂
Какая-то невероятно неудобная и нелепая работа
можно конкретнее? или вы тут просто самоутвердиться?
Агима, блин, у вас дизайнеры приличные деньги получают. Неужели нужно было использовать самую первую фотку со стока?
https://uvgullascollegeofmedicine.com/medical-education-in-philippines/
Да это просто сестра близнец ))
А вообще стоковые фото это конечно боль, с которой сложно бороться. Для минорного блока покупать экслюзив на гетти да еще и с ограничением по времени — странно.
Да и клиенты клиники врядли обладают такой насмотренностью чтобы узнать повторяющийся образ...
Вобщем да это пролема но не та которую нужно решать
Я надеюсь все из-за того, что джуна отправили. Не хочу верить, что главный дизайнер это делал.
Вы забыли добавить бэкграунд, чтоб от курсора хуинюшки разлетались
ЕМС - разводят клиентов, AGIMA – развели ЕМС! Браво, AGIMA!
Форма записи До изменений, была совсем из начала 0-х, Вы визуально сделали приятнее, но , как видно из комментариев выше забыли про ux, или тестовая выборка вам говорила иное ?
В каких-то из диджитал компаний Москвы ЕМС сейчас входит в ДМС? Интересно, кто сохранил высокий уровень ДМС нынче
Я о таком не слышал. Но знаю что во многих компаниях с определенного грейда только включают ЕМЦ в корп пакет. Но это личный опыт а не инсайды от клиента )
<< Метрики также подтверждают позитивные изменения: глубина и время просмотра на новом сайте увеличились в два раза, а количество отказов сократилось на 20%.
пользователи просто найти ничего не могут. Измерять сайт медицинской клиники глубиной просмотров - это ни о чём.
Каждый элемент неудобен, базовые вещи даже сложно сделать и найти вообще.
Клиника судя по докторам норм, а вот с сайтом конечно всё просто максимально странно.
На vc шрифты все достаточно большие и достаточно контрастные, читать легко и приятно. На сайте клиники мне было тяжеловато понять, что написано недостаточно темным мелким шрифтом на небелом фоне.
Вместо жирности часто используется другой цвет, но я пытался туда нажать.
Но чумовая вращающаяся сфера сразу намекает на то, что все очень современное. Смотрел в мобиле, за десктоп не знаю.
Ну и про анкету (ссылка в футере) - а чего она на сайте с доменом, похожим на Минздрав, да ещё и http?
Со шрифтами ту такой тонкий момент... VC - это сайт сугубо для чтения. Ему не надо выпендриваться и демонстрировать статус. Поэтому контраст шрифтов выкручен на максимум. А вот ЕМЦ важнее показать статус, поэтому мы контраст выкручивали по границе рекомендаций доступности, ради визуального эффекта. И сфера для этого же.
Тут конечно приходится искать балланс между удобочитаемочитаемостью и впечатлениями, и угодить прям всем конечно очень сложно, и не всегда возможно.
это вы про какую анкету в футере? вроде все ровно https://www.emcmos.ru/anketa-pacienta/
Отдельное «спасибо» за все эти свистелки-перделки, которые на колени кладут браузер — «самое нужное» на подобно сайте.
Комментарий недоступен
ого, а конфигурацию не подскажете? такого быть не должно
Реально 24 и проводник в кибер пространство цифровых экзо коммуникаций из емс сделали это? Ахаха
такое чувство, что сайт не тестировали и запускали в торопях. в адаптиве полно не понятных отступов и горизонтального скролла
Пиксельному Жану-Рене грустно(
Да он так в жизни выглядит )
Вы конечно молодцы там в своей програмке, а вот Гугл сильно хромает)
убожество, которым невозможно пользоваться
А что скажете по поводу сайта?
Интересно среди 24х специалистов был хотя бы один QA? Я зашел на первую страницу и уже увидел кучу косяков с версткой. ну вот хотя бы плашка с информацией о ковид. Очевидно же что все криво. Заголовок съехал, иконке на закрытие не хватает отступов и вообще в целом смотрится ущербно. Дичь.
о, эта плашка наша боль-боль. пример "нет ничго более постоянного чем врменное"
ее впилили уже после релиза, "очень срочно надо вчера", и теперь все никак не обновят, хотя уже вроде даже сверстано (
Дальше главной не смотрел. Не думал, что компании на главных страницах могут позволить такое количество багов. А как же тестирование?
Ну и сами агима по гпх оформляют. Meh
Ну конечно, брифование заказчика - полностью ответит на вопросы удобно ли пользователям, что хорошего надо сохранить от существующего дизайна/архитектуры, а что надо переделать... даже как-то обидно