31 января 2023

UX форм поиска на сайтах российских клиник

Всем привет! Это Оля — UX-дизайнер студии Everest. Уже шесть лет мы разрабатываем крупные веб-сервисы и мобильные приложения с фокусом на UX для банков, ритейла, телекома и других отраслей. В 2022 году мы запустили собственный Исследовательский центр, который регулярно публикует экспертные обзоры популярных сайтов и сервисов с фокусом на UX-составляющую. Это наше 15-е исследование. Оно посвящено поиску на сайтах клиник.
Примечание
За время подготовки исследования часть проблем, о которых мы пишем, могут быть исправлены компаниями на момент публикации. В материале мы их оставляем в качестве примера, чтобы обратить внимание читателей и уберечь от подобных решений в своих или клиентских проектах.
Продуманный поиск на сайтах и в приложениях — один из самых простых и быстрых способов для пользователей найти нужную информацию и добиться своих целей. Пользователи используют поиск, чтобы найти товары и услуги, полезный контент и другие ключевые возможности. Отказываясь улучшать функционал поиска, площадки теряют конверсии, продажи и, в конечном итоге, клиентов.
При проектировании часто возникают вопросы о конкуренции между поиском и навигацией. Разработчики спорят, на чём стоит делать главный акцент.

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

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

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

Мы проанализировали топ-20 крупнейших медицинских компаний в рейтинге Forbes за 2021 год. В большинстве случаев клиники предлагают пользователям стандартную поисковую строку без дополнительного функционала. Например, таким образом он реализован у клиник Мать и дитя, MedSwiss, Семейный доктор.

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

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

Мы выбрали 5 клиник, чтобы на их примере рассмотреть хорошие и не очень практики в проектировании поиска. В список вошли:
  • DocMed — сеть клиник доказательной медицины. В сеть входят многопрофильные детские клиники DocDeti, взрослые медицинские учреждения со стационаром DocMed и стоматологии DocDent.
  • Медси — крупнейшая в России федеральная частная сеть медицинских клиник, предоставляющая полный комплекс услуг по профилактике, диагностике и лечению заболеваний, а также реабилитации для детей и взрослых. Сеть включает в себя 1876 медицинских кабинетов.
  • ЕМС — многопрофильная клиника с 30-летним опытом, одна из крупнейших в России. В состав холдинга входит семь многопрофильных медицинских центров, один реабилитационный и три гериатрических центра, а также родильный дом.
  • CMT — многопрофильный медицинский центр в Санкт-Петербурге, регулярно входит в рейтинги лучших клиник города.
  • Чайка — частная сеть амбулаторных клиник в Москве. В них представлен полный набор врачебных специальностей, лабораторная и высокотехнологичная диагностика.
В этом исследовании мы анализировали поисковую строку, выпадающий список с подсказками и страницу с результатами поисковой выдачи.

Сравнительная таблица

Поисковая строка

✦ DocMed
Поиск представлен иконкой и находится в правом углу хедера, рядом с кнопкой «Записаться» и входом в личный кабинет. Требуются некоторые усилия, чтобы найти поиск — он теряется на фоне пунктов меню, иконок WhatsApp и быстрого звонка. Согласно исследованиям, на десктоп-версиях сайта лучше размещать поле поиска, а не ограничиваться иконкой. Или как минимум иконку поиска стоит сделать более заметной. Например, отделить от меню пустым пространством, выделить визуально (размером, цветом).
При клике на иконку лупы раскрывается отдельная поисковая панель. Это удачное решение — внимание пользователя фокусируется на одном действии.

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

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

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

У рассматриваемой выше компании DocMed нет кнопки поиска, что может ввести в замешательство часть аудитории.
«Meдси» позволяет начать поиск и через Enter, и по клику на соответствующую кнопку.
✦ EMC
Поиск представлен иконкой в правой части хедера. Он находится достаточно далеко от меню сайта. С одной стороны, благодаря расстоянию он не сливается с другими элементами шапки и при движении взгляда пользователя по F-паттерну должен быть заметен. С другой стороны — он неприметен визуально.

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

Текст плейсхолдера «Что вы ищете» неопределенный и может смущать пользователя. Лучшим решением может быть указание конкретных примеров запросов — анализов, услуг, специализации врачей.
✦ CMT
Поиск представлен не иконкой, а полем. Он более заметен, чем у рассмотренных выше конкурентов. Однако плейсхолдер можно улучшить подсказками о возможностях поиска на сайте.
✦ Чайка
У клиники есть 2 поиска. Один находится в хедере, второй — на главной странице под баннерами первого экрана. Поиск в шапке лучше разместить в стандартном месте, где его ожидает увидеть пользователь — в центре или в правом углу. Сейчас из-за непривычного расположения поиск менее заметен.

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

Поисковые подсказки

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

В поисковое поле DocMed подгружаются разделы сайта, в которых есть совпадения по набранному запросу: врачи, услуги, новости. Система показывает количество результатов в каждом разделе — это важная функция. Она помогает пользователю понять, с каким объёмом информации ему придётся работать, хочет ли он просматривать все найденные результаты или предпочтет переформулировать запрос для более узкой выдачи.
Для каждого раздела отображается шесть результатов поиска. Скролл не предусмотрен. Оформление вывода результатов лаконичное, без визуального шума.
При вводе запроса результаты в выпадающем списке можно улучшить, проработав с точки зрения юзабилити следующие моменты:
  • В результатах не выделяется область совпадения с запросом (при этом совпадение может находиться в любой части слова), логика подбора результатов не ясна.
  • По умолчанию предлагаются результаты поиска в разделе услуг. Возможно, у этой компании такой вариант выдачи оправдан аналитикой пользовательского поведения, но решение неоднозначное. При наборе первых букв «тер», предполагающих популярный запрос «терапевт», поиск выдает анализы на прогестерон и другие услуги сомнительной релевантности.

Результат выдачи никак не выделяется при наведении курсора, но на отобранных поиском карточках врачей и услуг появляется кнопка «Записаться».
Формат вывода результатов очень важен. Каждый вариант должен сохранять баланс краткости и содержательности. С одной стороны, нельзя перегружать пользователя информацией, с другой — нужно давать ему понять, чего стоит ожидать при переходе на страницу.

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

При выводе результатов поиска по разделу услуг отображается название услуги и её цена. На данном этапе этой информации достаточно. Однако отображение результатов в формате списка улучшило бы сканирование. Сейчас взгляд пользователя перескакивает от одной колонки к другой — это усложняет восприятие информации.
Для врачей выводится фотография, имя, специализация и график приёма.
Вывод информации о врачах можно доработать. На этом шаге свободную дату приёма можно заменить стоимостью (или просто добавить её).
Кнопка «Записаться» для услуг и врачей появляется только при наведении курсора мыши. Кнопка ведёт к конверсионному действию — записи в клинику, поэтому лучше отображать её сразу.
Рассмотрим техническую реализацию вкладки «Новости». Список с подсказками занимает весь экран, при прокрутке в браузере отображается скролл. Он создает у пользователя ощущение, что можно проскроллить контент в модальном окне, но это не так — скроллится страница за модальным окном (содержимое которой скрыто списком с результатами поиска).
Вероятно, это техническая ошибка. Её необходимо исправить, чтобы не вводить пользователя в заблуждение. Помимо этого, стоит показать границу списка результатов поиска (если мы говорим о версии для ноутбуков), чтобы пользователь сразу видел всю область, с которой он взаимодействует.

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

Чтобы начать печатать запрос, нужно кликнуть на поле поиска курсором. Это лишний клик — лучше дать пользователю возможность начать набирать запрос сразу.
При работе с поиском рядом отображается дополнительная функциональность: возможность перехода на страницы «Вопросы и ответы», «Найти врача», «Заказать обратный звонок» и другие.
Такое решение может быть удобно: пользователь сразу получает ответ на свой запрос и переходит к нужному действию. Однако весь перечень необходимо продумать и обосновать аналитикой. Например, нужен ли в списке пункт «Войти в личный кабинет», если вход уже отображается на главной странице рядом с поиском?

Также в блоке находится промобаннер. Это уместный вариант, но рекламное предложение в нём должно быть актуальным с точки зрения запроса пользователя, иначе блок будет восприниматься как визуальный шум. Высока вероятность, что здесь сработает эффект «баннерной слепоты» — пользователи научились не замечать рекламу такого рода.
✦ CMT
При вводе запроса отображаются поисковые подсказки:
В реализации функционала подсказок много плюсов:
  • совпадения с запросом выделяются;
  • указаны категории, к которым принадлежат результаты поиска (диагностика, цены и т. д.);
  • категория отличается от основного текста подсказки начертанием и размером шрифта, их легко различить;
  • список с подсказками лаконичный, нет отвлекающих элементов;
  • выводится не более 10 результатов.

По наведению курсора фон выбранного варианта меняется. Фон стоило сделать контрастнее — его задача выделять ссылки для перехода. В текущем варианте серый фон очень слабо отличается от белого, на котором выводятся результаты. Для пользователей с нарушениями зрения он не будет работать.
Поле с подсказками визуально не контрастирует с фоном, а иногда даже сливается с ним (когда фон белый). Можно сделать его более контрастным.

Названия некоторых разделов не позволяют понять, куда они ведут, например «Диагностика / Диагностика ЛОР-заболеваний».
Это процедуры? Или приём врача? Можно подумать и догадаться, однако с первого взгляда смысл не считывается. Название может не совпадать с ментальной моделью пользователя. Можно протестировать другие названия — например, «Обследования», «Процедуры», «Консультации».

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

Для каждого результата отображается категория, которая визуально отличается от запроса по начертанию. Категории понятные, точные: специальность, услуга, болезнь.
Не хватает приоритизации и логики в выводе результатов (например, можно выводить сначала специалистов, затем услуги и т. д.). Существующий вариант выдачи не даёт представления о предложениях клиники, иногда даже не соответствует ожиданиям пользователей. Например, при наборе слова «тер», предполагающего запрос «терапевт», услуги врача не выводятся в подсказки.
Также непонятно, зачем нужен скролл при выводе всего 5 результатов — они могут поместиться на одном экране. Исследования рекомендуют выводить всю область списка с подсказками на экран.
Список с подсказками лаконичный, нет визуального шума.
При наведении курсора выбранный результат выделяется цветом, ссылка для перехода заметна и очевидна.
В списке с подсказками не выделяются совпадения текста в запросе и результатах, — это минус.

Страница результатов

✦ DocMed
Вывод результатов поиска по клику на кнопку Enter не срабатывает — нужно кликать на «Все результаты поиска». Выше мы писали, что лучше поддерживать оба способа.

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

На первом экране страницы с результатами выводится их количество. Это хорошее решение — оно помогает пользователю сориентироваться, готов ли он взаимодействовать с таким объёмом данных или хочет детальнее уточнить поиск.
Ниже расположена поисковая строка с введённым запросом. Пользователь может его переформулировать или просто посмотреть, какой именно текст был введён. Исследования рекомендуют предоставлять пользователю возможность переформулировать запрос, чтобы сделать фразу более точной или выполнить новый поиск.
Основываясь на взаимодействии с подсказками, пользователь уже может знать, что поиск ведётся в разделах «Врачи», «Услуги», «Новости». Однако при взгляде на первый экран видны результаты только по одному разделу, а не полный контент страницы.
Возникает вопрос: мы получили 59 результатов всего или это только найденные «врачи»? Сами категории на этой странице не указаны, списка с подсказками здесь уже нет, поэтому пользователю приходится вспоминать, какие разделы были на прошлом шаге. В итоге пользователь не понимает, сколько результатов найдено в каждой из категорий.

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

Как уже было отмечено, результаты на странице группируются по категориям — «Врачи», «Услуги», «Новости». Врачи и услуги выводят результаты в формате карточек, новости — списком. В этом есть логика, т. к. для каждого типа информации действительно может быть удобен свой формат. В карточках врачей заметнее всего фотография, это оправданно. Согласно одному из наших исследований на базе коммерческих проектов в сфере медицины, пользователи обращают внимание на фотографию врача.
Хорошо, что есть переход ко всем врачам клиники (кнопка «Все врачи»), страницы сайта связаны между собой.
На карточке заложена возможность отображения стоимости приёма, но она не выводится. Возможно, это временная ошибка на сайте, которую не успели поправить. По поводу функции «Записаться» мы уже говорили — кнопки CTA лучше выводить сразу. Здесь она появляется при наведении.

Блок с услугами выводится в формате карточек. Названия услуг на сайте отличаются по длине, некоторые могут быть достаточно длинными (что видно на скриншоте ниже). В таких случаях предпочтительнее использовать не карточки, а списки, чтобы упростить процесс сканирования информации. В списке можно выделить текстовое совпадение запроса пользователя с наименованием услуги.
В карточках новостей отсутствует совпадение с текстом запроса пользователя. Плюс их довольно много. Пользователь не понимает, сколько новостей подобрано по запросу, неясно, по какому принципу они выводятся, нужно много скроллить. Можно предположить, что посетители мало взаимодействуют с этим блоком и он не решает задачи, заложенные бизнесом.
✦ Медси
На странице результатов поиска сначала отображается строка с введённым ранее запросом, он находится перед глазами у пользователя — это правильно.
В левой части экрана отображается меню с перечнем категорий, в которых найдены совпадения. Указано количество совпадений.
Это плюс — с помощью меню категорий можно переходить по странице. Поиск производится по разным разделам (врачи, услуги, клиники и т. д.), в которых может быть нужный пользователю результат. Посетитель сайта видит количество результатов, может выбрать именно ту категорию, которая ему нужна.
Поработать стоит над порядком вывода результатов — информация о клиниках выводится выше, чем информация о врачах, но пользователь, скорее всего, будет искать клинику через страницу контактов.
Информация, выведенная на странице, сгруппирована, за счёт чего её удобнее просматривать.
Однако формат вывода результатов в каждой категории нужно дорабатывать. Например, по запросу «терапевт» предлагается 417 врачей. Пользователь видит только 4 карточки специалистов, чтобы просмотреть других, нужно кликнуть на кнопку «Показать больше», которая открывает еще 4 врачей. Для того чтобы развернуть полный список, нужно сделать более 100 кликов. Пользователи откажутся от взаимодействия со страницей гораздо раньше.

Вместо этого можно было вывести часть врачей и добавить кнопку «Показать всех» с переходом на отдельную страницу врачей. Либо добавить фильтры для уточнения поиска и уменьшения числа результатов. Из достоинств можно выделить крупные фотографии врачей. Но не хватает указания специализации.
К выводимым услугам можно добавить стоимость — это поможет пользователю понять, подходит ли ему предложение клиники. Сейчас выводится только наименование. Услуги можно представить в виде списка, а не колонок, чтобы улучшить сканирование. Необходимо дать возможность перейти на отдельную страницу с услугами. В текущем решении просмотреть весь список услуг по запросу пользователя нельзя.
В блоке с клиниками выводится адрес каждой и ближайшая станция метро. Это важная информация. Можно продумать формат с использованием карты или указывать номер/цвет линии метро, чтобы ещё лучше ориентировать пользователя.
✦ EMC
Поиск осуществляется по клику на кнопку Enter. На странице отображается поисковое поле с введенным на прошлом шаге запросом — пользователю важно видеть его и иметь возможность переформулировать при необходимости.
Результаты поиска представлены ниже на странице в виде списка.
Среди удачных решений: есть табы, в которых можно выбрать определённую категорию и просматривать результаты только по ней. Доступны разделы «Видео», «Новости», «Услуги», «Врачи» и другие.
Пользователю демонстрируют количество результатов в каждом табе-разделе. Однако реализация не самая удачная — текст мелкий, светлый. Пользователь может его не заметить, — лучше размещать число результатов по разделу рядом с названием таба.
Во всех категориях результатов, кроме раздела «Врачи», демонстрируется текстовое совпадение с запросом.
Среди недостатков можно отметить горизонтальный скролл, находящийся под табами. Большинство пользователей негативно относятся к горизонтальному скроллу. На этом сайте в нём нет необходимости — все разделы можно разместить на пространстве экрана. Или использовать другой вариант отображения — отдельным блоком справа.
Информация о конкретном результате поиска также требует доработки.

В результатах поиска врача выводится только ФИО. Нет фотографии, не указана специализация. Этот результат не даёт пользователю достаточной информации для принятия решения о том, устраивает ли его результат поиска и стоит ли переходить на страницу. К выводимому результату стоит добавить фотографию врача, точную специализацию, стоимость приёма.
В результатах поиска по разделу услуг выводится название с фрагментом текста-описания с соответствующей страницы. Пользователю демонстрируется текстовое совпадение с его запросом, что хорошо. Однако информация, подгруженная из описания, не помогает пользователю понять, подходит ли ему услуга.
Эти замечания можно отнести и к организации результатов поиска по остальным категориям. Все они представлены однотипно — горизонтальными карточками, в которых отображается часть текста из описания страницы с подсвеченными совпадениями.
Запрос «терапевт» в категории «Специализации» показывает 0 вариантов. Следует проверить базу данных с врачами, чтобы избегать таких ошибок. Это особенно важно для популярных запросов.
✦ CMT
Вывод результатов происходит по клику на Enter либо по кнопке «Все результаты» в выпадающем списке.
Выводится поисковая строка, однако запрос в ней не отображается, он сброшен. Запрос обязательно нужно демонстрировать, чтобы пользователь видел его и мог исправить при необходимости.
Все результаты выводятся списком. Есть выделение текстового совпадения с запросом пользователя, это правильное решение.
Порядок вывода результатов неизвестен, нет деления выдачи по категориям. Под названием результата есть указание раздела сайта, на котором размещена найденная страница (например, «Главная > Цены»). Однако раздел не отделён визуально, поэтому потребуются усилия, чтобы заметить эту информацию.
Результаты поиска отображены хаотично, сложно сканировать их и находить нужное; непонятен весь объём выполненного поиска, по каким разделам он вёлся, есть ли внутри интересующая информация. В результатах выводится недостаточно данных для того, чтобы принять решение о переходе на какую-либо из подобранных страниц. Есть много причин прекратить взаимодействие с результатами поиска

Внизу страницы есть настройка сортировки выдачи. Её можно разместить выше: когда пользователь доскроллит до неё, необходимости в ней уже нет. Следует продумать типы сортировки, реализованный на сайте поиск по дате публикации не важен при поиске услуги или врача. Вывод результатов по категориям «Врачи», «Услуги», «Процедуры» быстрее приведёт пользователя к тому, что он ищет.
✦ Чайка
Поиск работает по нажатию на Enter. В поисковой строке отображается введённый ранее запрос.
Дальше по странице результаты группируются по блокам (услуги, доктора, процедуры и статьи), у каждого из них свой формат отображения результатов.

Первый блок — «Услуги». Выводится 5 услуг, можно развернуть полный список. На карточке услуги выводится название, стоимость, кнопка действия («Записаться»). Много плюсов: понятна приоритетность вывода карточек, дана необходимая информация (стоимость), есть возможность совершения целевого действия.
Для улучшения качества поиска можно добавить количество подобранных результатов и выделить совпадения с запросом.

В разделе услуг карточки раскрываются, в них выводятся названия клиник сети, в которых можно получить эту услугу. Иконку, которая разворачивает список клиник, можно заменить текстом, чтобы пользователь понимал, что он увидит при клике.
Также при выводе списка клиник лучше разместить рядом ближайшие станции метро, чтобы пользователь мог выбрать удобное отделение.
В блоке с докторами выводится фотография врача, ФИО, специализация и контакты. Улучшить блок можно добавлением общего количества результатов по запросу. В остальном результаты выведены аккуратно, достаточно подробно, они соответствуют запросу пользователя и оставляют положительное впечатление у посетителя сайта.
Назначение следующего блока, озаглавленного «Что мы лечим», неочевидно — в разделе выводятся процедуры/болезни, информационные страницы. Неясно, под какую потребность пользователя создан блок, какую задачу бизнеса он решает, какие действия ожидаются от посетителя сайта. Не отмечено каких-либо совпадений с изначальным запросом.
Следующий блок включает в себя статьи. Его расположение и формат уместны, но его стоит переименовать, поскольку текущий заголовок — «Страницы» — не даёт представления о дальнейшем содержании.

Опыт Everest

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

В 2020 году сайт, который мы разрабатывали для GMS Clinic, взял серебро в премии «Золотой сайт» в категории «Сайт медицинского учреждения». Хотим поделиться идеями, реализованными в этом проекте.

GMS Clinic — это сеть многопрофильных медицинских и диагностических центров с передовым оснащением в Москве и Санкт-Петербурге. Проблемой предыдущей версии сайта была его сложная структура, которая затрудняла быстрый поиск информации. Это влияло на конверсию, а следовательно, на выручку компании. К тому же шла большая нагрузка на кол-центр: сотрудники в ручном режиме обрабатывали то, что можно было автоматизировать с помощью интерфейсов.

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

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

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

Выводы по каждой клинике

DocMed

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

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

Медси

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

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

EMC

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

CMT

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

Чайка

На сайте можно отметить удобное поле с подсказками, наличие в них категорий, изменение отображения по ховеру. Отдельно хочется выделить страницу с результатами — у неё безусловно самая удачная реализация среди всех рассмотренных: продуманный формат для каждой категории, ограниченное число отображаемых вариантов и удобные переходы к ним, вывод необходимой пользователю информации.
Наши аналитики помогут:
Запустить новый продукт. Соберём требования, проведём необходимые исследования и подготовим ТЗ для разработки
Улучшить существующий. Выявим проблемы и предложим оптимальные варианты для их решения
Нужно исследование или юзабилити-аудит?
Оставить заявку

Анализ агрегаторов

Для подбора врачей пользователи сегодня часто используют сайты-агрегаторы, на которых собирается информация о множестве клиник и специалистов. Мы проанализировали поиск на сервисах СберЗдоровье, НаПоправку, ПроДокторов и делимся результатами с вами.
✦ СберЗдоровье (docdoc.ru)
У компании нет классической строки поиска. Вместо этого расположена небольшая форма подбора, которая состоит из двух полей:
— Врач, клиника, болезнь, услуга
— Метро, район, округ, город МО
В каждом из полей есть выпадающий список, в котором результаты сортируются по алфавиту. При этом запрос можно ввести вручную. Поиск по Enter работает.

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

Без фильтрации на странице выдачи выводятся все врачи:
При вводе запроса в фильтр в выпадающем списке предлагаются категории для выбора — специальность, болезнь, врач, диагностика, услуга. Хорошее решение: выбирая значение из категорий, пользователь уже знает область, по которой будет происходить поиск. Скорее всего, пользователь знает, нужен ли ему врач, услуга или процедура, поэтому ограничение по категории будет полезно.
До того как пользователь ввёл какие-либо символы, отображается выпадающий список со всеми подсказками. Посетитель сайта может воспользоваться скроллом, чтобы найти нужный ему запрос. Вероятнее всего, он продолжит печатать, так как это требует меньше ментальных и временных затрат, однако у него есть выбор. Пользователь понимает, чего можно ожидать от сервиса.
При наведении курсора мыши на один из вариантов меняется фон за ним, что помогает пользователю увидеть кликабельность. Интерфейс отзывчив.
Поиск возможен и по Enter, и по клику на кнопку «Найти».
✦ НаПоправку
Сайт разместил строку поиска на главной странице. Есть подсказка в плейсхолдере — «Врач, услуга, клиника, симптом». Пользователь сразу понимает, что можно искать.
При вводе двух символов запроса появляется выпадающий список с подсказками. Выделяются совпадения текста с запросом. Подсказки делятся на категории — специальности врачей, услуги и др. При наведении курсора на пункт списка подсказка выделяется визуально. Все эти решения упрощают пользователю работу с подсказками.
Подсказки по врачам представлены в отличном от других результатов формате — с фотографией и специализациями. Это помогает пользователю составить представление о специалисте и принять решение о переходе на страницу.
Если не выбрать определённый запрос, система подбирает самый релевантный и выводит результаты по нему. Решение имеет свои плюсы и минусы: с одной стороны, сокращается количество выводимых результатов. С другой — если набираемые символы встречаются в нескольких словах (например, «ОРТОпед», «ОРТОдонт»), в результатах может быть исключён вариант, который ищет пользователь.
Поиск работает как по нажатию на Enter, так и по клику на кнопку «Найти», это хорошо, т. к. отвечает разным паттернам поведения.

Поисковая строка остаётся на странице результатов, что даёт пользователю возможность переформулировать запрос. Также добавляется фильтр, в котором можно указать географию поиска — для ресурса, работающего по всей территории России, это важная функция.
✦ ПроДокторов
Строка поиска размещена сразу после заголовка-описания сайта. Плейсхолдер подсказывает, по каким параметрам можно осуществлять поиск.
При клике появляется дополнительная подсказка в выпадающем окне. Есть сомнения в её необходимости, так как плейсхолдер из поискового поля также остается на месте и информация дублируется.
После ввода двух символов появляется список с подсказками.
Из плюсов: выделяются совпадения с запросом, указаны категории поиска, при наведении курсора элемент списка выделяется, результаты по врачам и клиникам отличаются визуально. Из минусов: категория внешне совпадает с результатом запроса, список с подсказками громоздкий и требует скроллинга.

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

Наш сайт
Шоурил 2022
Телеграм-канал
everest.cx
Смотреть
@everest_ux
Исследовательский центр работает на базе UX-студии Everest
Исследовательский центр работает
на базе UX-студии Everest
Мы проектируем интерфейсы и логику для крупных сервисов, личных кабинетов, автоматизированных рабочих мест сотрудников