Кейс Доктор Гришин

1 этап
Формирование структуры и прототипирование

После выяснения всех бизнес-целей и задач, агентство «МедМаркетинг» разработало 8-9 прототипов основных страниц:

• Главная
• О докторе
• Результаты операций
• Ответы на вопросы и другие

Специалисты интернет-маркетингового агентства «МедМаркетинг»:

• Провели тщательный анализ, благодаря которому обнаружили, что сайт занимает хорошие СЕО-позиции. Поэтому перед нами стояла непростая задача – сохранить все url – адреса сайта, чтобы позиции не просели.
• На старом сайте не было некоторых полезных разделов, которые мы решили добавить. Например, описание и фото, как выглядел пациент до и после операции.

• Мы работали с готовым фирменным стилем. Хотя наш арт-директор предложил для сайта свой шрифт – Futura.

Он был подобран, с учетом общей стилистики сайта, а также гармонично сочетался с новым логотипом доктора Гришина.

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

2 этап
Отрисовка дизайна и програмирование

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

Основные посадочные страницы – это все услуги. Всего их представлено 8 – по основным направлениям работы доктора Гришина. Для каждой страницы специалисты агентства «МедМаркетинг» долго выбирали необходимую картинку: большую, яркую, сочную. Благодаря им происходит непосредственное влияние на его психоэмоциональный фон. Человек видит красивую картинку, и понимает, что его проблема будет решена, и он будет выглядеть так же, если не лучше!

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

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

Главная страница

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

На этой же странице размещено большое фото доктора Гришина, и перечисляются семь фактов о нем, как о профессионале. Для целевой аудитории сайта это очень важно – объяснить, почему можно доверять этому специалисту. 

Страницы услуг

Так как именно эти страницы являются наиболее важными на сайте, каждая из них представляет собой отдельный лендинг. Здесь представлены:

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

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

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

• Имя.
• Телефон. 
• И кнопка «Отправить». 

О докторе

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

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

Затем идет блок с видеоотзывами его пациентов. Видео можно просмотреть, кликнув на кнопку и вызвав всплывающее окно pop-up.

Для зарегистрированных аккаунтов на youtube, есть возможность поделиться видео. И стандартно: просмотреть его на этом видеохостинге, изменить качество воспроизведения, увеличить окошко на весь экран.

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

Станица «Стоимость»

Цены на услуги представлены в виде выпадающего списка. Выполнено в четырех цветах:

• белый;
• светло-серый;
• темно-серый;
• бирюзовый. 

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

Страница «Вопрос-ответ»

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

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

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

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

• Имя;
• Возраст;
• e-mail;
• непосредственно графа, где задается вопрос.
  

В топе сайта расположены три сквозные кнопки, которые видны на любой странице сайта:

• Вопрос/ответ.
• Запись на прием.
• Обратный звонок. 

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

С кнопки «Вопрос/ответ» идет отсылка на соответствующую страницу.

Когда посетитель нажимает на кнопку «Запись на прием», перед ним появляется форма со следующими полями:

• Имя;
• Телефон;
• e-mail;
• выпадающий список услуг;
• а также возможность загрузить свое фото. 

При клике на кнопку «Обратный звонок», выпадает аккуратное окошко, где на темном фоне белым цветом выделено всего две графы:

• Имя;
• Номер телефона.

Сайт доктора Гришины был выполнен на CMS под названием Drupal. Она является одной из самых популярных в мире системой управления контента, к тому же проста в управлении. 

Отдельно хотелось бы сказать о ромбах. Именно это геометрическая фигура была выбрана, чтобы в ней преподносить различную графическую и текстовую информацию. Эта геометрическая фигура была выбрана не просто так. Согласно ассоциативной психологии, ромб – мощный прямолинейный знак. Его любят те, кто не боится выражать свою точку зрения. Если углы ромба прорисованы слишком остро, это говорит о явной склонности к агрессии. Поэтому все ромбы на данном сайте имеют плавные линии. Таким образом, при помощи ромбов различной величины и цветовой палитры, дизайн сайта невольно наталкивает посетителя, что доктор Гришин – сильная мощная фигура. Такому специалисту точно можно довериться.

Где на сайте присутствуют ромбы:

• Перед названиями всех разделов в рабочем меню также идут ромбы.
• На главной странице возле каждой услуги слева стоит небольшой ромб.
• Они логично «перетекают» в фотографии операций, где картинки до и после расположены внутри таких же ромбов. 
• Сертификаты и дипломы, представленные на странице «О докторе», сначала видны в таких ромбах. 
• На странице «Результаты операций» фотографии до и после также помещены в ромб. Такая форма позволяет дополнительно сосредоточить внимание посетителей сайта на середине картинки.

• Видео в ромбах.
• Маркированные списки, рядом с которыми изображены небольшие ромбы и другие.

Также наши дизайнеры разрабатывали дизайн для социальных сетей, чтобы они выглядели в единой стилистике с обновлённым сайтом. 

3 этап
Подготовка контента и наполнение

Копирайтеры нашего агентства написали тексты для сайта доктора Гришина, учитывая СЕО-запросы по данной тематике. Такой подход позволит в дальнейшем вывести сайт в ТОП поисковых систем.

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

Кликнув на него, всплывает окно pop-up, и посетитель сайта может просмотреть видеоролик.

Хотелось бы также отметить, что наши специалисты выполнили титанический труд по обработке всех изображений на сайте. Особенно это касается фото до и после операций. Так как все изображения были присланы самими пациентами доктора Гришина, они имели различные размеры, форматы, цвет, яркость и насыщенность. Кроме того, некоторые из них были выполнены горизонтально, другие же – вертикально. Фон изображений также был различным. Наши специалисты тщательно обработали каждое фото. Строго отцентрировали каждое изображение, убрали «некрасивый» фон. Проделали огромный объем работы, чтобы на сайте все фотографии выглядели уместно, правильно и симметрично.