Ще 10 років тому хороший цифровий продукт мав бути передусім зручним і майже непомітним. Зараз цього вже недостатньо, щоб його запам’ятали. Duolingo жартує й святкує успіхи, Spotify перетворює статистику на персональну історію, monobank використовує котів і неформальні повідомлення, а Headspace створює відчуття спокою через м’який візуал.
Цю тенденцію часто називають дофаміновим дизайном, хоча насправді вона значно ширша за яскраві кольори й анімації. У статті розберемо, чим дофаміновий дизайн відрізняється від емоційного UX і як бренди проєктують не лише інтерфейси, а й відчуття від взаємодії.
Чому зручності в дизайні вже недостатньо
Тривалий час у цифровому дизайні переважала функціональна логіка: хороший продукт допомагає людині швидко й без зайвих зусиль виконати потрібну дію. Зрозуміла навігація, передбачувані кнопки, короткий шлях до результату та відсутність візуального шуму залишаються основою якісного UX і сьогодні. Проте функціональність не пояснює, чому два однаково зручні продукти можуть залишати різні враження.
Ще у 2004 році дослідник і дизайнер Дональд Норман у книзі про емоційний дизайн описав три рівні, на яких людина сприймає продукт:
- вісцеральний — відповідає за перше враження від зовнішнього вигляду;
- поведінковий — пов’язаний зі зручністю та якістю використання;
- рефлексивний — охоплює значення, асоціації та спогади, які залишаються після взаємодії.
Ця модель показує, що люди оцінюють продукт не лише раціонально. Інтерфейс може бути зручним, але холодним і безликим. А може створити відчуття підтримки, винагороди або приналежності, яке змусить користувача повертатися.
Схожу закономірність описує ефект естетичної зручності (aesthetic usability effect). Він полягає в тому, що люди схильні сприймати візуально привабливі продукти як зручніші. Приємний дизайн не виправляє серйозних проблем із навігацією чи функціональністю, але може зробити користувача терплячішим до незначних недоліків і сформувати позитивне перше враження.
У міру того як цифрові продукти стають функціонально схожими, емоційна складова набуває більшої ваги. Банківські застосунки дають змогу переказувати кошти, музичні сервіси відкривають доступ до мільйонів треків, а таскменеджери допомагають організовувати роботу. Коли базовий сценарій уже працює у всіх, відмінність створює те, як почувається людина під час взаємодії.
Саме тому сучасні дизайн-системи описують не лише кольори, сітки й типографіку. Вони також визначають характер руху, тон повідомлень, принципи ілюстрацій і способи реагування продукту на дії користувача.
Чому «дофаміновий дизайн» не зовсім точний термін
Термін dopamine design виник не в наукових публікаціях. Він розвинувся поруч із трендом dopamine dressing, яким описували яскравий одяг, сміливі поєднання кольорів і речі, що можуть покращувати настрій через особисті асоціації та самовираження. Згодом цю логіку перенесли в інтер’єри, брендинг і цифрові продукти. Дофаміновими почали називати насичені палітри, великі округлі елементи, грайливі ілюстрації, персонажів і анімації.
Однак колір не запускає передбачувану нейрохімічну реакцію сам по собі. Не існує відтінку, який однаково впливав би на всіх людей і автоматично підвищував рівень дофаміну. Психологія кольору описує складніший механізм. Відповідно до Color-in-Context Theory, значення кольору залежить від контексту, у якому людина його бачить. На сприйняття впливають ситуація, культура, попередній досвід і завдання, яке людина виконує в цей момент.
Експериментальні дослідження підтверджують, що реакція залежить не лише від відтінку, а від психологічного контексту. Тому популярні формули на кшталт «синій викликає довіру», «зелений продає» або «червона кнопка підвищує конверсію» не можна вважати універсальними. Один і той самий колір може працювати по-різному залежно від категорії продукту, аудиторії, сусідніх елементів і попереднього досвіду користувача.
Які кольори зазвичай називають дофаміновими
Попри відсутність такого поняття в науці, у дизайні та маркетингу вже сформувалося умовне розуміння дофамінової палітри. До неї зазвичай відносять насичені, чисті й контрастні відтінки, які асоціюються з енергією, грою, святом і візуальною сміливістю.
У цьому стилі важливі не лише окремі відтінки, а й контрастні поєднання. Дизайнери можуть комбінувати рожевий із помаранчевим, лаймовий із фіолетовим, жовтий із кобальтовим синім або бірюзовий із рожевим. Такі палітри часто можна помітити в рекламних кампаніях, айдентиці, соцмережах, пакованні та спеціальних диджитал-проєктах. Вони допомагають швидко привернути увагу й створити відчуття енергії, новизни чи свята. Проте називати ці асоціації фіксованими значеннями кольорів було б некоректно. Те, що для однієї людини свіжо й життєрадісно, для іншої може здаватися різким, дитячим або втомливим.
Якщо справа не лише в кольорі, то в чому
Коли говорять про дофаміновий дизайн, найчастіше згадують Duolingo або Spotify Wrapped. Обидва продукти справді використовують яскраві палітри, але їхній емоційний ефект не можна пояснити лише кольором.
Duolingo складно уявити без фірмового зеленого, який компанія називає основним кольором бренду. Проте його характер створюють також персонажі, гумор, анімації, система серій занять і реакції на правильні та неправильні відповіді. У брендгайді компанії ілюстрації названі основним візуальним стилем, а Duo та інші персонажі визначені як важлива частина історії бренду.
Spotify Wrapped також запам’ятовується не лише кислотними градієнтами. Його сила в тому, що сервіс перетворює дані на персональну історію, де головним героєм стає користувач. Візуал допомагає оформити цю історію як подію, але саме персоналізація створює бажання пройти її до кінця й поділитися результатом.
Як бренди проєктують емоції
Якщо прибрати з Duolingo зелений колір, а зі Spotify Wrapped яскраві градієнти, обидва продукти все одно залишаться впізнаваними. Причина проста — їхня емоційність не зводиться до палітри.
Сучасний цифровий дизайн працює за іншим принципом. Він поєднує кілька інструментів, які підсилюють одне одного. Саме тому користувач пам’ятає не окремий колір чи ілюстрацію, а загальне відчуття від взаємодії. Розглянемо, як це працює на практиці.
1. Колір задає настрій, але не створює емоцію
Колір залишається одним із найсильніших інструментів дизайнера. Саме він найчастіше формує перше враження від продукту. Але його задача полягає не в тому, щоб викликати конкретну емоцію, а в тому, щоб підтримати характер бренду.
Spotify поводиться інакше. Основний застосунок залишається стриманим, тоді як Wrapped щороку вибухає неоновими градієнтами. Це показує, що навіть один бренд використовує різні палітри залежно від сценарію взаємодії. Якщо основний продукт має бути зручним для щоденного використання, то підсумки року повинні нагадувати свято.
Ще цікавіший приклад демонструє Headspace. Попри те що сервіс теж працює з позитивними емоціями, він майже повністю відмовляється від яскравих кольорів. Пастельні відтінки, м’які контрасти й великі площини спокійних кольорів допомагають створити зовсім інший настрій. Завдання Headspace не підбадьорити користувача, а навпаки, уповільнити його.
Ці приклади показують, що колір не має універсального значення. Він працює лише тоді, коли відповідає емоції, яку бренд хоче передати.
2. Продукт починає «розмовляти» ще до першого повідомлення
Одна з найпомітніших змін останніх років полягає в тому, що цифрові продукти дедалі частіше отримують власний характер.
Подібний підхід використовує Mailchimp. Його маскот Freddie супроводжує користувача під час створення розсилок і святкує успішне відправлення кампанії. У продукті, який працює з технічними задачами, персонаж допомагає зробити взаємодію менш формальною.
Навіть monobank, який не має одного офіційного героя, регулярно використовує котів, меми та дружні ілюстрації. Завдяки цьому застосунок сприймається не як безособовий фінансовий інструмент, а як сервіс із власним стилем спілкування.
Персонажі працюють не тому, що вони кумедні. Вони допомагають бренду сформувати впізнаваний образ. Люди можуть не пам’ятати точний відтінок зеленого Duolingo чи шрифт Mailchimp, але легко впізнають їхніх героїв.
3. Маленькі анімації створюють відчуття живого продукту
Одне з найважливіших правил сучасного UX звучить просто: система має відповідати на дії користувача. Раніше це означало лише те, що після натискання кнопки відкривається новий екран. Зараз взаємодія стала набагато багатшою.
Після правильної відповіді в Duolingo персонажі стрибають від радості. Spotify плавно перегортає картки Wrapped, ніби розповідаючи історію. Apple використовує короткі анімації під час переходів між екранами, щоб пояснити логіку інтерфейсу. Google додає мікроанімації навіть до завантаження сторінок і виконання простих дій. Такі деталі тривають лише частки секунди, але саме вони створюють відчуття, що продукт реагує на людину, а не просто виконує команди.
Nielsen Norman Group рекомендує використовувати анімації насамперед для пояснення змін в інтерфейсі та взаємозв’язку між діями користувача й реакцією системи. Окремі дослідження в межах теорії когнітивного навантаження також показують, що правильно спроєктовані анімації можуть полегшувати сприйняття динамічної інформації, якщо не перевантажують увагу користувача.
Чому ми хочемо повертатися до одних продуктів знову й знову
На перший погляд може здатися, що секрет Duolingo чи Spotify полягає в яскравому дизайні. Але варто прибрати кольори, і стане очевидно, що людей утримують не вони.
Усі успішні цифрові продукти працюють із набагато глибшим механізмом. Вони регулярно створюють ситуації, у яких користувач відчуває, що рухається вперед. Саме тому після завершення тренування Nike Run Club не просто показує дистанцію, а вітає з новим рекордом. GitHub відзначає серії днів із комітами. Apple Fitness святкує закриття кілець активності. monobank показує, скільки вже вдалося накопичити в банці, а Duolingo нагадує, що зараз можна продовжити свою серію занять. Усі ці продукти використовують різні механіки, але працюють за схожим принципом: вони роблять прогрес видимим.
Дофамін народжується не від кольору, а від очікування винагороди
Дофамін часто називають гормоном задоволення. Насправді сучасна нейронаука описує його роль значно складніше: дофамінова система активується не лише тоді, коли людина отримує винагороду, а ще сильніше тоді, коли очікує її або помічає, що наближається до мети. Саме цей механізм допомагає формувати звички та підтримувати мотивацію. Це добре пояснює, чому streak у Duolingo працює настільки ефективно. Сам по собі він нічого не дає. Користувач не отримує грошей чи нових функцій. Проте щодня бачить підтвердження того, що не перервав власний прогрес.
Так само працюють кільця активності в Apple Watch, бейджі Nike Run Club або зелений квадрат внеску в GitHub. Їхня цінність полягає не у винагороді як такій, а в тому, що вони перетворюють абстрактний процес на послідовність маленьких перемог.
Найкраща винагорода робить героєм самого користувача
Є ще одна закономірність, яка об’єднує багато сучасних цифрових продуктів. Вони дедалі рідше ставлять у центр себе. Натомість головним героєм стає користувач. Spotify Wrapped не розповідає, який чудовий Spotify. Він розповідає історію про те, якою була музика людини цього року.
Apple Music Replay показує не каталог сервісу, а персональні музичні звички.
GitHub демонструє не можливості платформи, а внесок конкретного розробника. Навіть банка в monobank фокусується не на фінансовому продукті, а на тому, скільки людина вже змогла накопичити. Це дуже важлива зміна.
Бренди дедалі менше говорять про себе й дедалі більше допомагають користувачу побачити власний прогрес, досягнення або індивідуальність. Саме тому Spotify Wrapped щороку стає вірусним. Люди поширюють його не тому, що хочуть рекламувати сервіс. Вони хочуть розповісти щось про себе.
Емоція має відповідати продукту
Після всіх цих прикладів легко зробити хибний висновок, що будь-якому бренду варто додати більше кольорів, анімацій і бейджів. Але успішні продукти показують інше.
Тому головне запитання для маркетолога не про те, які кольори зараз у тренді, а яку емоцію має відчути людина після взаємодії з продуктом. Лише після відповіді на це запитання варто обирати палітру, стиль ілюстрацій, анімації, персонажів чи tone of voice.
Як українські бренди працюють з емоційним UX
Емоційний дизайн часто асоціюють із великими міжнародними продуктами на кшталт Duolingo чи Spotify. Проте цей підхід давно використовують і українські цифрові сервіси. Причому не завжди через масштабні редизайни чи складні анімації. Найчастіше вони працюють із дрібними деталями, які змінюють загальне враження від взаємодії.
monobank: фінансовий сервіс, який дозволив собі бути людяним
Коли monobank вийшов на ринок, більшість банківських застосунків майже однакові. Стриманий дизайн, офіційні повідомлення, мінімум емоцій. monobank запропонував інший підхід.
Продукт почав говорити з користувачами простою мовою, використовувати меми, жартувати в push-повідомленнях, додавати святкові екрани й іронічні ілюстрації.
Навіть така функція, як банка, перетворила накопичення грошей із технічної операції на процес із власною метою, візуальним прогресом і відчуттям досягнення.
Жоден із цих елементів окремо не робить застосунок кращим банком. Але разом вони формують враження, що сервіс спілкується з людиною, а не лише обробляє фінансові операції.
Дія — державний сервіс, який відмовився від бюрократичного тону
Ще кілька років тому державні цифрові сервіси переважно асоціювалися зі складними формами, офіційною мовою та великою кількістю інструкцій. «Дія» показала, що державний продукт також може бути зрозумілим і людяним.
У застосунку використовують прості тексти без канцеляризмів, плавні анімації, чітку візуальну ієрархію та мінімалістичний дизайн. Тут майже немає декоративних елементів, але багато уваги приділено тому, щоб людина почувалася впевнено на кожному етапі взаємодії. У цьому випадку емоційний UX працює не через яскраві кольори, а через відчуття контролю та зрозумілості.
Uklon: коли турбота проявляється в деталях
Сервіси виклику авто конкурують не лише швидкістю подачі машини чи ціною поїздки. Не менш важливо, наскільки комфортно людина почувається під час використання застосунку.
Uklon працює з цим через спокійний дизайн, зрозумілі сценарії, лаконічні повідомлення та передбачувану навігацію. Користувач рідко замислюється над цими деталями, але саме вони знижують рівень напруги в ситуаціях, коли потрібно швидко замовити авто або знайти водія.
Тут емоційний UX проявляється не в розважальних елементах, а у відсутності зайвого стресу.
Емоційний UX не означає «яскравий»
Після всіх цих прикладів можна помітити цікаву закономірність. Найуспішніші продукти дуже різні між собою.
Усі ці бренди працюють із різними емоціями, але керуються однаковим принципом: дизайн має підсилювати характер продукту, а не існувати окремо від нього. Саме тому емоційний UX не можна звести до яскравої палітри чи трендових ілюстрацій. Він починається із запитання, яке бренд ставить ще до створення першого макета. Зокрема, про те, що має відчути людина після взаємодії з нашим продуктом. Лише після відповіді на нього з’являються кольори, форми, анімації, тексти, персонажі та всі інші елементи інтерфейсу.
Ключові поради для бізнесу
- Починайте не з кольору, а з емоції. Перш ніж обирати палітру, анімації чи стиль ілюстрацій, варто відповісти на запитання: що має відчути людина після взаємодії з продуктом? Саме ця відповідь визначатиме всі подальші дизайнерські рішення.
- Думайте про досвід, а не про окремі елементи. Яскрава кнопка або незвична ілюстрація не зроблять продукт емоційним самі по собі. Враження формується з десятків дрібних деталей: мови інтерфейсу, реакції на дії користувача, повідомлень про помилки, анімацій, швидкості роботи й навіть моменту, коли сервіс дякує за виконану дію.
- Робіть прогрес видимим. Люди охочіше повертаються до продуктів, у яких можуть побачити власний розвиток. Це не обов’язково мають бути бейджі чи рейтинги. Іноді достатньо показати, скільки вже зроблено, скільки залишилося до мети або як змінилися результати за певний період.
- Перевіряйте не лише конверсію, а й емоції. Традиційні UX-метрики показують, чи змогла людина виконати потрібну дію. Але дедалі частіше варто оцінювати й інше: чи було їй зрозуміло, комфортно, чи захоче вона повернутися та рекомендувати продукт іншим. Саме ці відчуття нерідко стають довгостроковою конкурентною перевагою.
