Забота или все-таки технологичность: как мы сделали ребрендинг сервиса ДМС BestDoctor
Мы ушли от традиционных решений в области диджитал-продуктов и разработали стиль, близкий к лайфстайл-проектам.
В статье словами дизайнеров Кати Дорошевой и Насти Айгузиной, аккаунт-менеджера Юры Григоренко и проджект-менеджера Жени Пушкиной рассказываем, как пришли к такому решению.
Интересный факт до начала рассказа — первый брендбук для BestDoctor разработал тоже Pinkman, а точнее — основатель студии Миша Розов еще в 2017 году.
Задача клиента: показать ДМС одновременно дружественным и серьезным
BestDoctor — сервис, предоставляющий услуги медицинского страхования. За пять лет с момента основания компания прошла путь от стартапа до узнаваемого продукта, которым пользуется Ozon, «МегаФон», AliExpress Россия, ivi.ru, Mail.ru Group, «Нетология». В середине 2020 года BestDoctor обратился к нам за новым фирменным стилем, чтобы отразить произошедшие изменения.
Здесь важно прояснить момент с позиционированием. Команда сервиса хочет, чтобы сотрудники компаний воспринимали контроль здоровья как легкий, приятный процесс, и делает все, чтобы уйти от скуки и бюрократизации в ДМС. Если представить себе разных врачей в клинике, то BestDoctor не тот хмурый строгий человек в белом халате, который забрасывает тебя страшными терминами, а дружелюбный специалист, который простыми словами с улыбкой все объяснит.
Пользуются услугами сервиса сотрудники разных должностей, но решение о подключении компании к технологичному ДМС принимают сами основатели или, если говорить про крупные компании, HR-директора. И вот они привыкли к консервативному, серьезному образу страховых организаций. Нам предстояло создать стиль, который вызовет доверие у клиентов сервиса, но при этом не будет ассоциироваться с тяжеловесными операционными процессами и строго формальной коммуникацией. Мы работали с несколькими форматами — презентацией, сайтом и приложением.
Начало работы: интервью с командой и клиентами сервиса
Для того, чтобы разобраться в продукте, мы общались не только с основателями, но также с отделом продаж и продакт-менеджерами. Изучили сильные стороны компании, которые в дальнейшем стали основой визуального-словаря бренда:
- Удобство: услуги можно получить и через приложение, и в чате, и по телефону, поддержка доступна 24/7.
- Медицинская экспертиза: у BestDoctor есть свои врачи.
- Широкий сервис: консультации с психологом и чекапы включены в ДМС.
В созвонах участвовало до 20 человек от команды BestDoctor. Каждый рассказывал нам о своих задачах и выражал пожелания, как продукт должен быть упакован. В дальнейшем это повлияло на то, что носители отличаются друг от друга.
Больше всего инсайтов дали интервью с HR-директорами компаний, которые уже работают с BestDoctor. У них был опыт с другими страховыми, и мы смогли узнать, почему они решили перейти на технологичный ДМС:
- Упрощённая процедура согласований — нет бюрократии.
- Знакомство сотрудников с сервисом. Команда BestDoctor проводит презентацию перед сотрудниками компаний-клиентов. Рассказывает, кто они такие, чем помогут, что нужно делать в разных случаях, отвечает на все вопросы.
- Гибкость. У BestDoctor нет понятия нестраховой случай. Они включаются, даже если изначально страховка не покрывает происшествие.
После разговора с клиентами BestDoctor мы поняли, что мнения разделились: для сотрудников важны забота и вовлеченность, а для HR-директоров — технологичность и точность сервиса.
Почему нам потребовалось два месяца и пять итераций, чтобы прийти к окончательной концепции
Первая сложность была в работе с референсами. На этом этапе мы всегда анализируем конкурентов внутри и вне продуктовой ниши. Это помогает нам, с одной стороны, быть уместными, а с другой — оригинальными. И здесь, в случае с BestDoctor, локально мы были потеряны: в России слишком узкий medtech-рынок, чтобы составить исчерпывающую выборку. При этом клиент хотел ориентироваться на зарубежные сервисы про заботу о себе и здоровый образ жизни: Collective Health, Oscar Health и OneMedical. Нам нужно было найти решение, чтобы соответствовать стандартам индустрии, но при этом привнести в фирменный стиль локальность и найденную на этапе интервью аутентичность.
Вторая сложность заключалась в настройке процессов под аутстаффинг. Обычно он реализуется с высадкой в офис клиента, но в этот раз все сидели по домам и даже находились в разных городах из-за пандемии. Поначалу мы уходили на неделю в работу и возвращались с результатом, который приходилось переделывать — взаимопонимания не возникало. Процесс пошёл значительно быстрее, когда мы с продакшн-командой BestDoctor (двумя дизайнерам и контент-менеджером) стали общаться ежедневно. У нас были созвоны каждое утро на протяжении полутора месяцев. Благодаря синкам мы быстрее собирали обратную связь по проделанной работе, точечно запрашивали информацию у внутренних стейкхолдеров через ребят и вместе решали поставленные перед нами бизнес-задачи.
Как мы создавали логотип: антиква в цифровых продуктах и «Звезда жизни» по-новому
По большей части в мире и в России для диджитал-продуктов выбирают гротески (шрифты без засечек). Антиква (шрифты с засечкам) встречается довольно редко. Ее можно увидеть в Whereby (аналог Zoom), MailChimp и Co-Star. Благодаря тому, что в 2019 году Apple выпустили свой шрифт с засечками, процесс внедрения сколько-то ускорился.
Мы решили пойти смелым путем и использовали антикву в текстовой части логотипа, а также как акцент на носителях. Наше решение можно объяснить просто: ДМС предназначен для заботы о здоровье, поэтому мы выбрали тот шрифт, который больше других отражает человечность. Антиква привлекает внимание за счет утонченной архитектуры и обилия деталей, в неё хочется всматриваться.
Шрифтам с засечками в BestDoctor отводится примерно 30% текстового контента. Мы вводили их в тех частях, где нужно было «заручиться поддержкой» пользователя. Например, для отзывов клиентов и цитат команды BestDoctor, когда они говорят о своих особенностях, также в заголовках и в других частях текста, написанных крупным кеглем.
Остальные 70% остались для гротеска, он более читаемый, практичный и более привычный для рассказа о продукте. Его использовали для текстов в мелком кегле и для всех функциональных частей вроде кнопок в приложении.
Для знака логотипа были разные варианты: наш финальный выбор определяет то, что на рынке digital health предпочитают традиционные символы. Остановились на «Звезде жизни» — она графически очень современная, к тому же благодаря простоте символ — долговечный и универсальный.
Изначально «Звезда жизни» — эмблема службы Экстренной медицинской помощи, запатентованная в США. Это звезда синего цвета с посохом Асклепия по центру. У каждого луча звезды своё значение. Многие организации в разных странах обыгрывают этот символ по-своему: меняют цвет и пропорции, убирают посох. Например, звезду жизни использует Apple в Medical ID.
Клиент одобрил символ, узнаваемый в сфере здравоохранения. В логотипе BestDoctor у оригинального знака появились два дополнительных луча. Они символизируют одновременную поддержку и бизнеса компаний-клиентов, и комфорт каждого сотрудника. Еще одна новая графическая деталь — скругление между лучами.
Из логотипа родился паттерн в виде размноженной звезды. Он символизирует экосистему BestDoctor, планы компании на развитие. Паттерн использован как акцентный элемент общего графического конструктора.
Отказ от иллюстраций и иконок на сайте
В сложных диджитал-продуктах есть свои привычные дизайн-решения: иллюстрации и иконки. Их использовал и BestDoctor на прежнем сайте. Иконки и иллюстрации помогают донести смысл, поэтому часто сопровождают все фрагменты текста. Мы не пошли по такому пути по нескольким причинам.
Во-первых, микрографика упрощает стиль. Сфера медицины — основополагающая, каждый человек хочет быть уверен в том, что о его здоровье позаботятся профессионалы. А иллюстрации выглядят как игровой элемент, создают наивный образ.
Во-вторых, в такой форме невозможно понятно рассказать о заботе о клиентах или чекапах. Если нарисовать две руки и в них фигурку врача, то получится всего лишь отвлекающий ребус.
В-третьих, иконки и иллюстрации в коммуникации работают на быстрый захват внимания пользователя. Нам же было важно добиться более глубокого вовлечения — чтобы при повторном посещении страницы или столкновении с баннером человеку хотелось остановиться, рассмотреть детали и, возможно, увидеть BestDoctor с новой стороны.
Мы создавали для сервиса устойчивый и солидный визуальный язык, чтобы он вызывал доверие и соответствовал статусу компании. Поэтому, вместо иллюстраций и иконок, дополнили историю о поддержке и взаимопонимании фотографиями и вариативными графическими силуэтами.
Графический стиль, палитра и фотографии
В графических композициях мы реализовали идею объятий. Между геометрическими формами нет расстояния, они округлые и иногда перетекают друг в друга. И хотя это абстракция, на интуитивном уровне считываются телесность, близость, контакт.
В цветовой гамме клиент хотел отойти от ассоциации с медучреждениями и их атрибутикой. Мы выбрали жизнерадостные и вместе с тем припыленные цвета, какие часто встречаются в лайфстайл тематике. Чтобы вписаться в сектор здравоохранения, за основу взяли красный, но в мягком оттенке, который не вызывает тревоги. Поддерживающие цвета — оранжевый, зелёный, голубой — тоже приглушённые.
Фотографии позволяют человеку соотнести изображение с собой, добиться ощущения большей близости, чего не дают ни одни иллюстрации. Частый мотив в фотостиле BestDoctor — прикосновения, что тоже поддерживает метафору заботы. Другой важный аспект — искренность: люди должны быть в естественных позах с минимальной ретушью.
Поработав с фотостоками, мы с трудом нашли несколько изображений, подходящих BestDoctor, и вместе с клиентом решили в ближайшее время провести бренд-съемку. Такие фотосессии, как полноценное кино, рассказывают пользователю о компании, помогают создать доверие и ощущение единства в отличие от разрозненных изображений со стоков.
Как мы сделали фирменный стиль масштабируемым
В разработке стиля, как правило, студия отдает заказчику минимальный набор — гайдбук, исходники логотипа и графических элементов. Мы же с BestDoctor договорились подготовить редактируемые носители, которые сразу можно будет использовать в работе: блоки для сайта и презентаций.
Блоки для сайта
Мы провели два исследования. Первое — анализ карты сайта: сколько на нем страниц, какие разделы, как пользователь взаимодействует с ними. Стало ясно, что старый сайт представляет собой лабиринт из похожих развилок. Это было связано с тем, что новые блоки добавлялись на Tilda по мере необходимости и не всегда органично вписывались в логику отдельных страниц.
Дальше мы проанализировали контент. Выявили повторяющиеся секции на одной странице, определили, где информация избыточна, а где её не хватает. Каждая страница была составлена по своей схеме без единой концепции. Опять же потому, что сайт делали разные люди в разное время.
Главный вывод: сайт нуждался в прозрачной структуре и последовательности в сопровождении клиента. Мы составили новую карту и выделили, какие блоки нужно сделать, чтобы команда BestDoctor могла дальше собирать из них страницы. Сами разработали концепцию главной, страницы о продукте и о компании.
Вот список блоков, которые в них вошли:
- Hero block. Самый первый блок, который встречает пользователей на странице. На сайте BestDoctor блок состоит из заголовка и лида — маленького абзаца, который описывает суть.
- Social proofs. Несколько типов блоков, которые подсвечивают опыт и репутацию компании. Это блоки с цифрами, с логотипами клиентов, с отзывами, с упоминанием в СМИ.
- Catchphrase. Этот блок обычно находится в конце страницы, состоит из емкой фразы и кнопки, призывающей к действию.
- Benefits или тезисы. Это уникальная история BestDoctor — часто рассказ о себе они оформляют списком тезисов. Мы сделали четыре варианта, как можно их упаковать.
- Функциональные блоки: форма заявки, таблица и другие.
Презентация и текстовая коммуникация: перевод с врачебного языка на человеческий
Презентация — самый коварный из стандартных носителей, его нельзя полностью шаблонизировать. Единственные предсказуемые секции в слайдах обширных презентаций — навигационная линейка, текстовые поля и фреймы для изображений или инфографики. Мы изучили старую презентацию BestDoctor и разбили слайды на категории по типу информации.
В сфере здравоохранения много сложных длинных терминов. В брендбуке мы прописали важный тезис — BestDoctor использует узкопорфилиованную лексику в исключтельных случаях, отдавая предпочтение живым речевым оборотам и наглядным примерам. Мы отталкивались от такой аналогии: есть тип врачей, которые перегружают пациента своими знаниями, а есть профессионалы с большим опытом, которые доходчиво объясняют запутанные вещи и тем самым располагают к себе пациентов.
Для презентации мы определили, где лучше использовать карточки, а где списки или чат-баблы. Всю работу вели рука об руку с контент-менеджером BestDoctor. Были взаимные компромиссы: где-то мы просили сократить текст и нам шли на уступки, а в другой раз отвечали, что в этом месте текст нельзя урезать, и мы искали новый способ его оформить.
Помимо сайта и презентаций, мы приземлили обновленные ценности бренда и визуальный язык на ключевые экраны мобильного приложения.
Обучение внутренней команды дизайнеров
Чтобы получить стиль, который будет жить и развиваться в дальнейшем, мы стали привлекать внутренних дизайнеров к совместной работе еще до создания брендбука: попросили переделать некоторые слайды презентации в новом стиле. Команде нужно было время, чтобы разобраться в макетах и понять наш образ мыслей.
После совместной работы собирать брендбук было гораздо проще: мы понимали, что нужно расписать подробно, а что можно опустить. И дизайнерам было легче: они не просто читали наши записи, а тренировались на практике и сразу получали обратную связь. Одновременно это ускорило работу: когда внутренние дизайнеры стали делать презентации, мы приступили к сайту.
Про взаимодействие внутренней и внешней команды дизайнеров рассказали в отдельной статье на Rusbase.
Фиксируем итоги проекта
- Мы определили позиционирование компании в ходе интервью с командой и с HR-директорами компаний-клиентов BestDoctor. Выяснили, что главные привлекательные черты сервиса — не только удобство, но также забота и вовлеченность. Это позволило определить ведущие метафоры для нового фирменного стиля.
- Разработали визуальную коммуникацию бренда, которая позволяет донести сложные темы доступным языком. Без иллюстраций и иконок, зато с фотографиями и паттерном.
- Создали носители, которые клиент может масштабировать, сохраняя консистеность бренда: блоки для сайта, сеты слайдов для презентаций, экраны приложения.
- Обучили внутренних дизайнеров и сделали подробный брендбук, по которому все отделы BestDoctor могут выстраивать релевантную коммуникацию с клиентами.
В результате получился стиль, нетипичный для индустрии medtech-продуктов в России: дружелюбный, доверительный, при этом современный и технологичный. А эта статья — самая длинная из всех в нашем блоге. Если вы дошли до конца, то нам кажется справедливым попросить вас поставить ее в закладки или поддержать стрелкой вверх.
Слизали да ещё и некачественно под копирку с американского Oscar Health Insurance... действительно зачем заморачиваться выдумывать своё. Нейминг у одних стащили, дизайн у других.
Компиляция из наворованного добра получилась 😂