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

Иван Чирков

Бренд-директор Нетологии

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

Что такое брендинг и зачем он нужен

Брендинг — это процесс создания и поддержания образа компании.

Чаще всего результатом этой работы видят цветовую палитру, логотип и слоган. Но это далеко не всё. В основу образа бренда ложится миссия, ценности и преимущества, которые выделяют его среди конкурентов. Именно уникальный образ позволяет продуктам и сервисам компании закрепиться в сознании пользователя. Элементы айдентики делают бренд узнаваемым. Они помогают выразить его особенности в конкретной форме:

  • на уровне дизайна — логотип, шрифт, цвета, формы, иллюстрации и персонажи;
  • на уровне коммуникации — слоганы, креативные посылы и голос бренда;
  • на аудиальном уровне — звуки, музыка, джинглы и саунд-дизайн.

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

Как использовать элементы брендинга в продукте

Уникальный образ бренда позволяет привлекать клиентов, которым откликаются ценности компании, и удерживать их. Поэтому в цифровых продуктах элементы дизайна и коммуникации должны использоваться во всех точках контакта: не только на лендингах, в SMM и рекламе, но и внутри продукта. Так, после подписки на приложение или оплаты сервиса, человек видит уже знакомые элементы: те же цвета, формы и шрифты — интерфейс сразу кажется ему более простым и понятным. А понравившиеся персонажи и стиль общения подключают чувственное восприятие и эмоционально вовлекают в процесс использования продукта. Здесь брендинг тесно переплетается с UX- и UI-дизайном. Но если задача последнего — построить комфортный путь пользователей, то элементы айдентики делают этот опыт запоминающимся и интересным.

Как именно дизайн, коммуникация и звуки бренда помогают этого добиться — посмотрим на примерах разных цифровых продуктов.

Дизайн

Цвета, шрифты и формы помогают сделать навигацию более понятной и задают настроение. Так, ВКонтакте использует в своём интерфейсе собственный шрифт VK Sans, иконки и кнопки скруглены по углам, как и логотип бренда, и окрашены в фирменный синий. Но палитра не ограничивается одним цветом: ВКонтакте — развлекательный сервис, поэтому в нём много ярких акцентов. У каждого мини-приложения есть свой логотип с набором цветов, которые также используются и в его оформлении. Например, в VK Music — это неоновый розовый. В сочетании с фоновой графикой он создаёт танцевальное настроение.

При этом во всех приложениях есть одинаковые базовые элементы. Это делает дизайн продуктов единообразным и поэтому узнаваемым. Так что пользователю ВКонтакте проще попробовать новые сервисы — они выглядят уже знакомыми, и навигация в них сразу понятна.
Фотографии и иллюстрации помогают привлечь внимание и передать отношение к пользователям. Например, Циан стремится сделать процесс выбора жилья более простым и добавить в него позитивных эмоций. Внутри сервиса можно встретить узнаваемые фирменные силуэты и фотографии интерьеров в сочетании с минималистичными персонажами и смайликами. Во-первых, это позволяет сделать дизайн узнаваемым, а предложения привлекательными, но при этом не перегружать карточки. Во-вторых, делает коммуникацию менее формальной и более доброжелательной.
Авиасейлс в своём дизайне, помимо фотографий, активно использует эмодзи и мемы. Эмодзи можно встретить как на баннерах, так и в интерфейсе. Мемы и шутки — в справочных статьях. Они помогают поддерживать тот же неформальный стиль общения с пользователями, которым компания известна во внешней коммуникации.
Подходящая цветовая палитра, акценты и повторяющиеся элементы снижают когнитивную нагрузку и позволяют лучше запомнить информацию. Особенно это полезно в образовательных сервисах. Так, в Нетологии цвета бренда подобраны с учётом того, как они будут использоваться в процессе обучения. Минималистичный дизайн с использованием чёрного и белого помогает не отвлекать внимание от контента. В программе обучения на платформе фирменным зелёным отмечены успешно пройденные шаги и прогресс, розовым — пропущенные задания и уведомления, а синим — акценты.
Спокойные цвета помогают настроить на обучение, но при этом не создавать беспокойства. Нам важно, чтобы студент чувствовал себя комфортно и не боялся ошибаться. Поэтому мы не используем кричащие цвета и угловатые формы. Разные оттенки зелёного помогают показать успешность прохождения шагов, а оттенки синего — незавершённые и невыполненные задания.
Повторяющиеся элементы задают структуру занятия и облегчают процесс восприятия информации. Так, в каждой презентации есть слайды с целями и итогами и набор форматов для визуализации ключевых мыслей. Студенту проще запомнить, что он изучил, а благодаря айдентике создаётся единый опыт.

Коммуникация

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

В Нетологии мы стремимся обеспечить поддержку и при этом сохранять спокойный тон коммуникации. У нас взрослая аудитория, и нам важно показать, что выбор всегда остаётся за пользователем. Поэтому мы не используем ультимативных выражений, обосновываем условия и объясняем, чем могут быть полезны те или иные функции и предложения. Чтобы студент не терял мотивацию, чаще хвалим его и отмечаем достижения: например, подчёркиваем, сколько сил вложено в обучение, и показываем небольшие победы.
У Авиасейлс свободный стиль общения. Бренд говорит с пользователями на простом разговорном языке и выстраивает открытую коммуникацию. В справке используются фразы вроде «всё ок» и короткие предложения, как в устной речи. Кроме того, компания честно говорит о возможных сложностях: в карточках билета есть плашки с уточнениями о том, какие риски и траты стоит учесть.
Функции и разделы помогают отразить ценности бренда. Так, в карточках товаров Яндекс Лавки есть графы с калорийностью и кодами переработки. Пользователи, которые следят за питанием и заботятся об экологии, могут не только воспользоваться полезной для них функцией, но и понять, что компания разделяет с ними одни ценности. Это укрепляет доверие к компании и напоминает клиенту, почему он пользуется именно этим сервисом.
Образность и сторителлинг делают использование продукта увлекательным и запоминающимся. Так, Яндекс Лавка хочет обратить внимание покупателей на приятные моменты в жизни и помочь им вынырнуть из рутины. Поэтому в сервисе можно найти разделы с названиями «Вечернее чаепитие», «Отдых на диване» или «Весенняя уборка» — они создают привлекательные образы ситуаций, в которых хочется оказаться. Игривые заголовки карточек от редакции и тексты на кнопках показывают привычные продукты в необычном контексте, пробуждают интерес и желание попробовать что-то новое.
Авиасейлс тоже использует множество образов. Компания старается сделать коммуникацию нескучной и увлекает пользователей в путешествия. Поэтому в карточках путеводителя описаны не просто архитектурные и исторические факты, а «мистические интерьеры» и «эхо капающей воды», которые обещают острые ощущения или как минимум красивые фото для соцсетей. Заголовки в подборках направлений создают точные образы будущих поездок, чтобы пользователь захотел увидеть Байкал из вагона поезда или посёрфить на Шри-Ланке.
В образовательном процессе часто используется сторителлинг. Так студентам проще погрузиться в контекст и визуализировать информацию. Например, в кейсах и интерактивных заданиях Нетологии можно встретить уже знакомых персонажей. Вместе с ними студенты могут разобраться в предстоящих рабочих задачах и справиться со сложностями в процессе обучения.

Звуки

Фоновая музыка в видеоряде создаёт нужное настроение и задаёт темп. В каждом видео Нетологии есть брендированные перебивки с музыкальной вставкой. Они дают время, чтобы переключить внимание и настроиться на восприятие информации. Также они помогают студентам, которые занимаются в дороге: пользователь, не глядя на экран, может понять, что один тематический блок закончился и начинается новый.
Звуки в интерфейсе привлекают внимание и мотивируют. Многие узнают звук сообщения ВКонтакте благодаря тому, что компания использует уникальный сигнал.

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

Как брендинг встраивается в продукт

У нас есть общий гайдлайн бренда, которым мы руководствуемся при разработке образовательного продукта.

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

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

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

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

В правой части экрана фон для робота создают яркие пятна цвета — всполохи

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

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

Резюмируем

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

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

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

Выберете свою траекторию развития: перфоманс-маркетолог или продакт-менеджер

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

Выберете свою траекторию развития: перфоманс-маркетолог или продакт-менеджер

Добавите готовый кейс в портфолио
А если ещё не готовы учиться платно, узнайте о профессии больше ↓
Пройдёте основные этапы построения бренда продукта и оформите мини-проект
Разберёте приёмы создания успешных брендов и поймёте, как повысить узнаваемость компании на рынке
Разберётесь, что есть общего в брендинге у лидеров рынка, и как адаптировать сработавшие стратегии к своему бизнесу
Читать также
Мнение автора и редакции может не совпадать. Хотите написать колонку для Нетологии? Читайте наши условия публикации. Чтобы быть в курсе всех новостей и читать новые статьи, присоединяйтесь к Телеграм-каналу Нетологии.
Иван Чирков
Бренд-директор Нетологии
Оцените статью