Rivalry2

HTML Diff

1 added 1 removed

Original 2026-01-01

Modified 2026-02-21

1 <a>#статьи</a>

2 <ul><li>16 сен 2024</li>

3 <li>0</li>

4 </ul>Как создают интерфейсы, в которые люди возвращаются по любви.

5 Иллюстрация: Полина Честнова для Skillbox Media

6 Пишем про дизайн и искусство. Всё, что вы хотели знать о настоящем, прошлом и будущем визуальной культуры.

7 В UX/UI-дизайне есть два столпа: интерфейс должен быть понятным и хорошо читаемым. Но продуманное расположение инфоблоков, качественные шрифты и учёт контекста, в котором приложение или сайт будут работать, - не всё, что от него требуется.

8 Дизайн интерфейса должен побуждать пользователей вновь и вновь возвращаться к продукту, рекомендовать его другим и чувствовать к нему симпатию.

9 Мы попросили экспертов в digital-дизайне из "СберМаркетинга" объяснить, что именно помогает этого добиться.

10 Руководитель отдела реализации цифровых проектов

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

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

13 Как это делают: во флоу внедряют интерактивы и квизы с небольшими наградами (например, промокодом на скидку) или объёмные игровые механики, в которых пользователя ожидает значимый приз - социальное признание или крупный выигрыш.

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

15 - Игра "Разбуди соню" на сайте digital-агентстваИзображение:<a>Isadora Digital Agency</a>HR-кампания с игровым элементом - AI-симулятором, чтобы найти таланты в студенческой среде и привлечь их внимание к прог��амме оплачиваемых стажировок Sberseasons. Студенты самостоятельно в три шага могли обучить сверхмилую или сверхразумную нейросеть. Обучение давало доступ к секретному промокоду: тот, кто указывал его в анкете, пропускал первичный отбор и мог сразу приступить к тестированиюИзображение:<a>Sberseasons</a>Почему это важно: приложения и сервисы существуют в среде, где очень высокая конкуренция за внимание пользователей. Позитивные эмоции от взаимодействия с платформой - то, что помогает людям запоминать продукт, вовлекает их в коммуникацию и стимулирует возвращаться. Также маскоты работают на узнаваемость бренда и отлично существуют в другой среде: например, их легко выводить из цифрового пространства в реальное, если создавать мерч с этими образами.

15 + Игра "Разбуди соню" на сайте digital-агентстваИзображение:<a>Isadora Digital Agency</a>HR-кампания с игровым элементом - AI-симулятором, чтобы найти таланты в студенческой среде и привлечь их внимание к программе оплачиваемых стажировок Sberseasons. Студенты самостоятельно в три шага могли обучить сверхмилую или сверхразумную нейросеть. Обучение давало доступ к секретному промокоду: тот, кто указывал его в анкете, пропускал первичный отбор и мог сразу приступить к тестированиюИзображение:<a>Sberseasons</a>Почему это важно: приложения и сервисы существуют в среде, где очень высокая конкуренция за внимание пользователей. Позитивные эмоции от взаимодействия с платформой - то, что помогает людям запоминать продукт, вовлекает их в коммуникацию и стимулирует возвращаться. Также маскоты работают на узнаваемость бренда и отлично существуют в другой среде: например, их легко выводить из цифрового пространства в реальное, если создавать мерч с этими образами.

16 И, следовательно, это положительно влияет на бизнес-метрики.

17 Как это делают:

18 <ul><li>Дизайнеры аккуратно работают с палитрами и подбирают цвета, причём принимают во внимание культурные особенности и менталитет аудитории.</li>

19 <li>Используют в визуальных коммуникациях в интерфейсе маскотов.</li>

20 </ul>Эти графические персонажи - то, что помогает быстро создать эмоциональную связь с брендом и его продукцией.

21 Эмоциональная сова Duolingo - один из самых известных примеров маскотов, которые вовлекают в сервисСкриншот:<a>Duolingo</a>Интерактив "Идеальная пара" с механикой, напоминающей популярное приложение для знакомств. Участники просматривали привлекательные профили и описания инвестиционных продуктов, выбирая понравившиеся. После трёх взаимных мэтчей пользователь попадал на лендинг с подарочным мерчем и call-to-action-кнопкой, ведущей на сайт банка. Таким образом, сочетание геймификации с призами, яркими образами и цветовой палитрой клиента привлекли большое количество пользователей и позволили нативно прорекламировать продукт брендаСкриншот:<a>приложение "Идеальная пара" во "ВКонтакте"</a>Почему это важно: если пользователь получает от интерфейса разные сообщения, видит меняющиеся графические элементы, это создаёт эффект взаимного общения, а не просто взаимодействия "система - человек". Такое "общение" часто стимулирует возвращаться.

22 Как это делают:

23 <ul><li>С помощью ИИ генерируют широкий ряд иллюстраций, которые можно и комбинировать, и по отдельности использовать в разных пользовательских сценариях.</li>

24 <li>Прописывают текстовые элементы с эмоциональным оттенком, которые тоже можно использовать отдельно или составлять из них персонализированные сообщения.</li>

25 </ul>Например, "Спасибо! Вы великолепны" на экране подтверждения транзакции.

26 <ul><li>Интегрируют в интерфейс ИИ-помощников, которые "способны" вести коммуникацию.</li>

27 </ul>Слева простое, но эффективное для вовлечения пользователя сообщение интерфейса: заголовок "Вам как обычно?". Справа ИИ-ассистент в приложении СБОЛ, который подсказывает, будто хороший приятель, перевести деньги мамеСкриншот: Drinkit / СБОЛПочему это важно: человекоцентричность - это принцип ведения бизнеса, где ориентация на клиента - лишь базово необходимый̆ уровень, а конечная цель - благополучие человека и общества вообще. При этом ориентация компании "на человека" не превращает её в благотворительную организацию и не исключает получения прибыли. Это win-win-подход, при котором в выигрыше оказывается и компания, и потребитель, и общество.

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

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

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

31 Веб-продукт с концепцией "карта желаний". С помощью нейросетей создали иллюстрации для раздела "Держите мечты под рукой": пользователь может составить собственную карту желаний из подходящих визуализаций, а затем скачать её. Это одновременно помогает и бизнесу продвигать продукт, и человеку концентрироваться на его мечтах и стремленияхИзображение:<a>"СберБизнес Live"</a>В "Страховании по часам" можно самостоятельно выбрать время для страховой защиты и управлять им в зависимости от обстоятельств. На странице продукта между блоками много воздуха: это даёт паузы в чтении и зрительном восприятии, и человек не испытывает стресса от когнитивной нагрузки. Инструкции выполнены в формате историй с визуализацией, а ещё есть тест, чтобы пользователю было легче сориентироваться, когда полис страхования может ему действительно понадобитьсяСкриншот: "<a>Сбербанк Страхование Жизни</a>"Почему это важно: приложения и сайты конкурируют за пользователя не только друг с другом, а буквально со всеми объектами в мире. Наше внимание малоизбирательно, особенно в цифровой среде, и из-за этого люди часто испытывают перегруженность информацией.

32 Как следствие, выигрывают те "простые" интерфейсы, которые спроектированы по правилу "один экран - одна мысль".

33 Как это делают:

34 <ul><li>Выделяют крупным шрифтом или цветом главное.</li>

35 <li>Формулируют главную информацию в лаконичных текстах, которые не нужно скроллить.</li>

36 <li>Часть информации переводят в графические решения - образы пользователям воспринимать проще, чем тексты.</li>

37 </ul>Скриншот:<a>Intrepid Automation</a>Лендинг о сложном финансовом продукте - закрытых паевых инвестиционных фондах. Пользователю нужно сосредоточиться, чтобы получить необходимую информацию и принять решение, вкладываться ли в них. Здесь дизайнеры спроектировали отдельные блоки, каждый из которых работает как ответ на отдельный вопрос. Чтобы информация не смешивалась и смысл не размывался, блоки разграничили фоновым цветом, который не перетягивает внимание на себя, но позволяет сфокусироваться на смысловой части сообщенияСкриншот:<a>SberBank</a><a>Практический курс: "Профессия UX/UI-дизайнер + ИИ" Узнать о курсе</a>