UXPUB 🇺🇦 Дизайн-спільнота: Mike Hafin

Стати «світлим» не зробить тебе необанком

Mike Hafin — Fri, 19 Jun 2026 13:05:46 +0000

MiCA змушує кожну криптокомпанію в Європі виглядати надійно. І більшість зараз зробить ту саму помилку.

Останнім часом мені на стіл лягає той самий бриф, просто щоразу інакше сформульований: ми більше не хочемо виглядати як крипта.

Це приходить від платіжних компаній, бірж, стейблкоїн-стартапів — тих, хто роками виглядав як «майбутнє», а тепер хоче виглядати як банк. Точніше, не банк. Необанк. Швидкий, чистий, регульований, такий, якому не страшно віддати гроші. Перше, що просять прибити, — градієнт.

Це не смак нарешті дозрів. Це MiCA. Без ліцензії ти більше не працюєш у європейській крипті — а ліцензована компанія, яка досі виглядає як DeFi-протокол 2021 року, має проблему, яку її юристи не вирішать.

Тож уся індустрія тихо перемальовує себе під «надійність». Звучить як прогрес. І саме тут більшість робить ту саму помилку.

Аудиторія перевернулась

Щоб зрозуміти, чому це помилка, треба побачити, що насправді змінилось. А змінилась не технологія. Змінилась аудиторія.

П'ятнадцять років крипто-бренди робили для своїх — ранніх адоптерів, розробників, віруючих, які обрали крипту саме тому, що це не банк. Їх не треба було заспокоювати. Градієнт, темний дашборд, енергія «to the moon» — це були не поганий дизайн, а племінні сигнали. Вони казали: ми не вони. Для тієї аудиторії в цьому й був увесь пітч.

Та аудиторія більше не платить за рахунками.

Ліцензована компанія в Європі тепер відповідає перед тими, хто ніколи не був у племені: регулятор, що читає заявку; банк, що вирішує, чи відкривати рахунок; інституція, що вирішує, чи пускати обсяг; звичайна людина, що вирішує, чи переказати сюди зарплату. Ніхто з них не читає сяйливий градієнт як «інноваційно». Вони читають його як «нерегульовано». Той самий логотип, та сама компанія, той самий продукт — але аудиторія перевернулась, і бренд, що був активом, тихо став пасивом.

Стати «світлим» — це вибір, а не відповідь

Тож вони хапаються за очевидне: піти у світле, чисте, спокійне. Але «світле» — це не відповідь. Це одна з відповідей.

Поміняти градієнт на чистий шрифт і плаский колір здається прогресом, бо виглядає як ті, хто вже виграв — Stripe, Coinbase. Але ти не вони, і вдягнути поверхню довіреного бренду не означає успадкувати довіру. Це просто інша уніформа.

І градієнт, від якого всі тікають, уже замінюється новою одноманітністю — той самий офвайт, той самий стриманий шрифт, той самий спокій. Шлях для втечі перетворився на затор. Для челенджера, що заходить у ЄС, виглядати «чисто» тепер означає виглядати як усі, хто почистився. Стратегічний хід — не виглядати безпечніше. А виглядати безпомилково як ти сам, лишаючись беззаперечно надійним.

Довіра — це не колір

Це ніколи не було історією тільки про крипту. Це те, що робить будь-яка фронтир-технологія, дорослішаючи: перестає вдягатись як бунт і починає вдягатись як інституція. Подивись на AI зараз — та сама втеча від неонового «майбутнього» до стриманого, надійного, enterprise-дизайну. І рушій той самий: MiCA робить із криптою приблизно те, що EU AI Act робить з AI — тягне її з фронтиру в регульоване поле.

Але довіра — це не колір. Вона накопичується, і вона розмазана по кожній поверхні, якою ти володієш: як ти пишеш, твої соцмережі, сайт, платформа, застосунки. Полагодиш одну — можна вдати. Але проведи покупця через усі — і правда вилазить.

Чиста головна сторінка перед дашбордом 2021 року — це не прогрес. Це підказка. Маркетинг подорослішав, продукт — ні. Для регулятора чи інституції цей розрив читається саме тим, чим є: костюм, а не компанія.

Перепакування, яке працює, йде до самого низу. Та сама стриманість, та сама ясність, той самий голос — від холодного листа до онбордингу до деталі транзакції, про яку ніхто не думає. Це найважча частина. І єдина, що когось переконує.

У легітимності є вигляд — але вона ніколи не була тільки виглядом. Виглядати на роль можна за пів дня. Стати нею, до самого низу, — оце вся робота. Більшість зупиниться на поверхні. Ринок розбереться з ними доволі швидко.

Власна студія дизайну: як не закритися через пів року

Mike Hafin — Wed, 24 Sep 2025 07:11:31 +0000

Англійську версію цієї статті ви можете почитати за посиланням тут.

Цей текст — практичний гайд для тих, хто запускає студію або тільки замислюється над цим. Тут буде про плюси і мінуси, фінанси, команду, договори та клієнтів — усе те, що визначає, чи проживе студія більше ніж пів року.

Вступ

Запустити власну студію дизайну — звучить як мрія.

Власний бренд, свої правила гри, можливість вибирати клієнтів і будувати процеси так, як хочеш ти. Ніби це наступний логічний крок після фрилансу: вже не один у полі воїн, а команда, бізнес, масштаб.

Але дуже швидко виявляється, що реальність виглядає інакше. Там, де на фрилансі ви були лише дизайнером, у студії ви стаєте ще й сейлзом, юристом, бухгалтером, менеджером і HR-ом. І якщо цього не усвідомлювати — студія ризикує закритися ще до того, як з’являться перші великі кейси.

1. Чому всі хочуть власну студію

У більшості сценарії виглядає однаково:

Ілюзія свободи — “Я більше не залежу від клієнтів напряму, у мене буде свій бренд”.
Ілюзія доходу — “Якщо я беру $2–3k за проект, то з командою легко зроблю $20k на місяць”.
Потреба в масштабі — один дизайнер вже не встигає, треба людей, менеджера, розробника.

Здається, що студія — це лише формалізація того, що вже й так є. Насправді це перехід із фрилансу в бізнес, і саме тут більшість робить помилку: залишає мислення “заробляю руками”, замість того щоб будувати систему.

2. Реальність: що змінюється після запуску

Найбільший шок — це ролі.

На фрилансі ви робили все, але масштаби були маленькі. У студії масштаби зростають, і ваш день виглядає так:

30% часу — переговори з клієнтами, ліди, пітчі.
30% — менеджмент команди: задачі, дедлайни, синки.
20% — документи: договори, акти, NDA, платежі.
20% — дизайн (якщо пощастить).

Фактично ви стаєте менеджером, а не дизайнером. І саме це ламає багатьох, бо не всі готові віддати “роботу руками” заради побудови бізнесу.

3. Плюси студії

3.1. Бренд як актив

Найбільший плюс студії — ім’я.

Клієнт охочіше підпише контракт із Brandson Digital чи іншою студією, ніж із “Алексом-дизайнером”. Це психологічний фактор: компанія здається стабільнішою і надійнішою.

Бренд можна розвивати, масштабувати і навіть продати у майбутньому. Це довгострокова цінність, якої у фрилансера немає.

3.2. Масштаб і ріст

Фриланс обмежений вашим часом.

У студії можна взяти 3–5 проектів паралельно, бо є команда. Це вже бізнес-модель: $60/год множиться не тільки на вас, а й на дизайнерів, розробників, менеджерів. $60/год — це цілком адекватний стартовий рейт для нової студії у Східній Європі. Він дозволяє залишатися конкурентними на ринку ЄС та США, водночас пропонуючи високу якість.

3.3. Гнучкість у виборі ніш

SaaS, e-commerce, Web3, HealthTech, благодійні фонди. У студії можна пробувати різні напрями, розширювати портфоліо і дивитися, де більше відгукується клієнтам і команді.

4. Мінуси і ризики

4.1. Витрати

Софти, бухгалтерія, юристи, сайт, реклама, коворкінг, зарплати. Навіть маленька студія має фіксовані витрати у кілька тисяч доларів на місяць. І вони залишаються, навіть коли клієнтів немає.

4.2. Рутина

На дизайн залишається 20–30% часу. Решта — мітинги, документи, продажі. Якщо ви хочете “більше творити” — студія може стати розчаруванням.

4.3. Касові розриви

Класика: клієнт затримує оплату на місяць, а зарплату команді треба платити сьогодні. Без подушки це стає критичною проблемою.

Один із моїх перших проектів: закрив задачу на $7500, але поки клієнт тягнув із переказом, довелося власними грошима закривати оплату розробнику. Це швидко вчить, що подушка — не примха.

4.4. Подушка

Фінансовий запас на 3–6 місяців витрат — маст. Якщо його немає, будь-яка затримка чи втрата клієнта можуть стати фатальними.

5. Практика і цифри

5.1. Рейт: $60/год

Це базовий орієнтир для міжнародного ринку. Нижче складно виживати, вище — треба мати сильні кейси і репутацію.

5.2. Фултайм чи фрілансери

Порівняння трьох моделей роботи: фултайм, фрілансери, студія.

Оптимально мати маленьке ядро (1–2 ключові людини) + пул перевірених фрілансерів.

5.3. Мінімальний беклог

Завжди тримати 2–3 активні ліди у пайплайні. Якщо пайплайн пустий — через місяць у вас немає грошей.

6. Як не закритися через пів року

6.1. Продажі постійно

Найчастіша помилка: перестають продавати, коли багато роботи. Проекти закінчуються — і студія залишається без лідів. Продажі мають бути безперервним процесом.

6.2. Баланс команди

Мікс фултайму і фрілансу. Це дає стабільність, але дозволяє залишатись гнучкими.

6.3. Облік

Навіть проста Excel-таблиця з витратами і доходами вже дає інсайти. Кожен проект повинен мати свою маржу.

6.4. Бренд

Сайт, кейси, комунікація. Але правда в тому, що на власні соцмережі завжди бракує часу. Жарт: “Якщо у студії ідеально ведуть Instagram — значить, у них немає клієнтів.”

6.5. SEO та органіка

Соцмережі живуть день.
Статті, блог і кейси дають довгостроковий трафік.
Перші органічні ліди приходять через 6–12 місяців.
Інсайт: один кейс може дати більше продажів, ніж 100 постів у соцмережах.

6.6. Подушка

3–6 місяців витрат у резерві — ваш страховий поліс.

Або у вас є бабуся зі спадком 😉

7. Робота з клієнтами: кейси, договори і «відмови по-дизайнерськи»

7.1. Кейси — головна валюта студії

У B2B вас продають приклади, а не слова.
Один сильний кейс може привести більше лідів, ніж десятки постів у соцмережах.
І це не лише сайт:
- кейси мають бути у вашому пітч-деку,
- їх варто показувати прямо на дзвінку з клієнтом,
- навіть PDF із одним кейсом може закрити угоду.
Формула: проблема → рішення → результат. Це виправдовує ціну і створює довіру.
Продавайте цінність, а не картинку. Багато дизайнерів грішать тим, що показують лише візуал, забуваючи пояснити бізнес-результат. Це й блокує вихід на новий рівень клієнтів і продажів.

7.2. Договори і NDA

Контракт = страховка, а не бюрократія.
Завжди прописуйте: етапи, терміни, оплату, кількість ітерацій.
NDA — маст навіть для простих проектів, бо часто клієнти не хочуть розголошення деталей.
Приклад: провтикали закласти $200 на підписку для AI-генерації під конкретного клієнта. Дрібниця, але в мінусі залишилася студія. Урок: у договорах і кошторисах треба закладати навіть такі речі.

7.3. Як відшивати клієнтів красиво

Часто приходять замовники з малим бюджетом або токсичною комунікацією.
Грубо сказати “ні” — означає спалити міст.
Тактика витягнутої руки:
- подякувати за інтерес,
- пояснити, що зараз не можете працювати у таких рамках,
- залишити опцію на майбутнє.
Інсайт: іноді клієнт із маленьким бюджетом через рік повертається вже з інвестиціями.

8. Додаткові інсайти

8.1. Перший клієнт студії

Найважчий крок — переконати ринок, що ви тепер не просто фрилансер, а студія.

Є два шляхи:

Повернутися до старих клієнтів і запропонувати роботу за новим форматом (договір, процеси, рейт).
Шукати нових через LinkedIn, профільні чати, конференції чи ті ж самі Upwork/Dribbble, але з позиціюванням як «студія».

Порада: підготуйте пітч-дек, навіть якщо у вас поки 1–2 кейси. Хороша презентація створює ефект зрілої компанії, а не «фрилансера з друзями».

8.2. Інструменти для старту

Не обов’язково одразу купувати дорогі підписки.

Фінанси: на старті вистачить Google Sheets чи Excel. Згодом можна дивитися у бік QuickBooks або Xero.
Менеджмент: Trello, Notion, Asana. Оберіть один, але використовуйте системно.
CRM для продажів: навіть проста дошка в Notion з етапами “Lead → Call → Proposal → Contract” вже дисциплінує.

Головне — відразу будувати процеси, а не хаос у чатах.

8.3. Порівняння зі звичайною роботою

В агентстві ти виконуєш задачі, і хтось інший вирішує проблеми з клієнтом.
У студії ти тепер і сейлз, і бухгалтер, і пожежник.
Це дві різні реальності, і варто чесно відповісти собі: чи ти готовий стати підприємцем, а не тільки дизайнером.

8.4. Емоції і психологія

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

Це нормальний процес. І якщо розуміти, що ці емоції неминучі, переживати їх легше.

“Студія не робить вас вільним дизайнером. Вона робить вас підприємцем. І це зовсім інша гра.”

9. Висновок

Студія — це не “фриланс + друзі”. Це бізнес.

З витратами, ризиками, менеджментом і відповідальністю.

Перші пів року — найважчі: витрати ростуть, клієнтів може бракувати, рутина давить. Але якщо у вас є фінансова подушка, системні сейлз, беклог лідів, правильно оформлені кейси і здатність відшивати клієнтів “по-дизайнерськи” — студія починає працювати на вас.

У Brandson Digital ми самі пройшли цей шлях. І тепер допомагаємо SaaS, стартапам і технологічним компаніям вибудовувати брендинг і UX/UI так, щоб дизайн працював не тільки “на красу”, а на залучення клієнтів і інвестицій.

Тепер ваша черга

Я поділився своїм досвідом запуску дизайн-студії.

Тепер цікаво почути вас.

Для тих, хто вже запускав студію — що стало найбільшим сюрпризом?
А якщо ви тільки думаєте про це: яку одну пораду ви хотіли б отримати перед стартом?

Діліться своїми думками в коментарях.

Когнітивні викривлення, психотипи користувачів і дизайн інтерфейсів: як створити ефективний продукт

Mike Hafin — Tue, 31 Dec 2024 17:28:10 +0000

Англійську версію цієї статті ви можете почитати за посиланням тут.

Розуміння прихованих механізмів мислення користувачів є ключем до створення інтерфейсів, які не лише привабливі, але й інтуїтивно зрозумілі та ефективні. У цій статті ми детально розглянемо, як когнітивні викривлення, психотипи та візуальні ефекти впливають на взаємодію з вашим продуктом, і надамо практичні поради для вдосконалення дизайну.

Вступ: Чому навіть найкращий дизайн може не працювати?

Сучасні інтерфейси створюються з орієнтацією на простоту, інтуїтивність і зручність. Проте, навіть найгарніший та найфункціональніший дизайн може не досягти бажаного ефекту, якщо він не враховує психологічні аспекти поведінки користувачів.

Причини невдачі дизайну:

Недостатнє розуміння користувачів: Якщо дизайнери не знають, хто їхні користувачі, які їхні потреби та болі, то створений інтерфейс може не відповідати очікуванням аудиторії.
Ігнорування когнітивних процесів: Людський мозок обробляє інформацію не завжди раціонально. Ігнорування цього факту може призвести до перевантаження користувача або до непорозумінь.
Відсутність тестування: Без регулярного тестування з реальними користувачами важко визначити, що працює, а що ні.

Когнітивні викривлення — це природні механізми мозку, які спрощують обробку складної інформації, але можуть спотворювати реальність. Врахування цих викривлень у дизайні допомагає створювати більш ефективні та привабливі інтерфейси.

Приклад: Уявіть собі інтернет-магазин з безліччю товарів, але без чіткої структури та навігації. Навіть якщо окремі елементи дизайну виглядають гармонійно, користувачі можуть втратити інтерес через складність пошуку необхідного товару.

Кейс-стаді: Один з онлайн-сервісів успішно впровадив покращену навігацію, враховуючи когнітивні викривлення користувачів. Вони спростили меню та додали візуальні акценти на ключові функції, що призвело до збільшення конверсії на 25%.

Аналіз воронки конверсій: Покращена структура навігації зменшила рівень відтоку користувачів та збільшила конверсію між етапами — оптимізація елементів покращила користувацький досвід і загальну ефективність сайту.

Що таке когнітивні викривлення і чому вони важливі у дизайні?

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

Важливість у дизайні:

Підвищення ефективності взаємодії:

Розуміння когнітивних викривлень дозволяє дизайнерам створювати інтерфейси, які враховують природні тенденції користувачів, роблячи їх взаємодію з продуктом більш інтуїтивною.
Зменшення когнітивного навантаження:

Оптимізований дизайн допомагає користувачам швидше знаходити потрібну інформацію та виконувати завдання без зайвих зусиль.
Покращення користувацького досвіду:

Інтерфейси, що враховують психологічні аспекти, створюють більш приємний та задовольняючий досвід для користувачів.

Як вони проявляються у взаємодії з інтерфейсами?

Першість помітного: Користувачі звертають увагу на елементи, які виділяються візуально. Важливі функції можуть залишитися непоміченими, якщо вони не привертають увагу. Приклад: Якщо кнопка "Купити" зливається з фоном сайту, користувачам буде важче її знайти.

Цитата експерта: "Візуальні акценти можуть направити користувача до найважливіших елементів інтерфейсу, покращуючи загальну ефективність взаємодії." — Дон Норман, експерт з UX-дизайну.

Фокус на простоті: Люди обирають те, що здається зрозумілішим, навіть якщо це не оптимальний варіант. Приклад: Користувачі можуть обирати простіше, але менш функціональне меню, оскільки воно легше сприймається.

Контраст між складним і чистим дизайном картки товару. Зліва — перевантажена інформацією картка, де важко знайти ключові елементи. Справа — мінімалістичний дизайн, що підкреслює основне: зображення, ціну, характеристики та заклик до дії (CTA).

Звикання до шаблонів: Користувачі шукають знайомі патерни (наприклад, "лупу" для пошуку або "три лінії" для меню).
Приклад: Використання стандартних іконок полегшує розуміння функцій інтерфейсу.

Когнітивні викривлення у дизайні: розгорнуті приклади та рішення

1. Ефект приманки (Decoy Effect)

Як працює: Користувачі схильні обирати варіант, який здається "золотою серединою", якщо поруч є менш вигідна альтернатива, що підкреслює переваги іншого варіанту.
Приклад: На сторінці тарифів сервісу Whimsical пропонуються три основні плани:
- Free: Безкоштовний доступ із базовими функціями.
- Pro: $10/місяць за редактора, включає розширені функції (наприклад, необмежені спільні файли та преміум-підтримку).
- Org: $20/місяць за редактора, додає розширені функції безпеки та можливості для великих команд.

У цьому випадку план Org виступає як "приманка", що підштовхує користувачів до вибору середнього плану Pro, який здається найбільш збалансованим за ціною і функціями.

Рішення:
- Використовуйте дорожчий або менш привабливий план, щоб спрямувати користувачів до бажаного варіанту.
- Опис усіх тарифів має бути зрозумілим і чесним, щоб користувачі могли прийняти зважене рішення.

Кейс-стаді: Компанія Whimsical застосовує цей підхід у своїй тарифній політиці, збільшуючи кількість підписок на план Pro. Завдяки правильній структурі тарифів план Pro став найпопулярнішим серед користувачів.

Ефект приманки на прикладі тарифних планів Whimsical. Середній тариф виглядає найбільш вигідним через вдало побудовану візуальну ієрархію та розміщення додаткових функцій у найдорожчій опції.

2. Когнітивне перевантаження

Як працює: Коли користувач стикається з великою кількістю інформації або дій, його мозок не може впоратися, і він припиняє взаємодію.
Приклад: Реєстраційна форма з 20 полями для заповнення. Користувач просто залишає сторінку, бо процес здається надто складним.
Рішення:
- Розбиття процесу: Розбийте складні процеси на кілька етапів із прогрес-барами ("Крок 1 із 3").
- Мінімізація полів: Показуйте лише найнеобхідніші поля. Наприклад, запитайте адресу користувача тільки після підтвердження замовлення.
- Автоматичне заповнення: Додайте автоматичне заповнення там, де це можливо (наприклад, підказки адреси або номера телефону).
- Візуальна чистота: Використовуйте чистий та мінімалістичний дизайн, щоб не відволікати користувача.

Мультистеп-форма: розбиття довгого процесу реєстрації на кроки допомагає зменшити когнітивне навантаження, спрощуючи взаємодію користувача.

3. Ефект прив’язки (Anchoring Bias)

Як працює: Люди орієнтуються на перше значення, яке вони бачать, навіть якщо воно не оптимальне.
Приклад: Ви бачите першу пропозицію зі знижкою: "Лише $500 замість $1000". Навіть якщо інша пропозиція за $450 краща, перша здається більш вигідною через акцент на економії.
Рішення:
- Використовуйте "якорі": Показуйте вигоду (наприклад, "Раніше $50, зараз $35").
- Можливість порівняння: Надавайте користувачам можливість порівнювати варіанти, щоб ухвалити зважене рішення.

Цитата експерта: "Якорення — потужний інструмент, який може значно вплинути на сприйняття цінності продукту користувачем." — Річард Талер, лауреат Нобелівської премії з економіки.

4. Скруглені кути: візуальне полегшення для користувачів

Як працює: Округлі форми викликають у користувачів відчуття комфорту, знижуючи когнітивну напругу.
Приклад: Кнопка "Купити" із закругленими краями виглядає дружелюбніше, ніж кнопка з гострими кутами.
Рішення:
- Використовуйте скруглені кути для кнопок, полів введення й карток товарів.
- Поєднуйте округлі форми з теплими кольорами для створення "дружелюбного" інтерфейсу.

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

5. Ефект втрати (Loss Aversion)

Як працює: Люди бояться втратити більше, ніж хочуть здобути.
Приклад: "Залишилося лише 3 місця за цією ціною!" — таке повідомлення змушує користувача швидше діяти.
Рішення:
- Терміновість: Використовуйте обмеження часу або кількості.
- Чесність: Повідомлення мають бути чесними, щоб уникнути розчарування користувачів.

Кейс-стаді: Один з туристичних сайтів використовує повідомлення про кількість переглядів номерів, що створює відчуття терміновості та стимулює бронювання.

Ефект втрати на прикладі Booking. Повідомлення про обмежену кількість номерів викликає відчуття терміновості та стимулює швидке бронювання.

Психотипи користувачів і їхній вплив на дизайн

Користувачі відрізняються не лише за демографічними показниками, а й за стилем мислення. Розуміння різних психотипів допомагає створювати інтерфейси, які задовольняють різні потреби та вподобання.

Типи користувачів і рекомендації для дизайну

Аналітики

Характеристика:
- Люблять деталізацію, обирають варіанти після ретельного аналізу.
- Цінують точність і надійність інформації.
Рішення:
- Детальні описи: Надавайте доступ до детальних описів, таблиць і порівнянь.
- FAQ-розділи: Створюйте розгорнуті FAQ-розділи, де можна знайти відповіді на складні питання.
- Фільтри і сортування: Забезпечте можливість гнучкого фільтрування та сортування інформації.
- Додаткові ресурси: Пропонуйте посилання на докладні статті, аналітичні звіти або технічні характеристики.

Кейс-стаді: Один з професійних сервісів використовує детальні профілі користувачів та розширені фільтри пошуку, що дозволяє аналітичним користувачам швидко знаходити потрібну інформацію.

Інтуїти

Характеристика:
- Орієнтуються на перше враження, ухвалюють швидкі рішення.
- Цінують естетику та простоту.
Рішення:
- Простий дизайн: Використовуйте простий і яскравий дизайн з мінімумом елементів.
- Візуальні акценти: Виділяйте ключові кнопки й функції за допомогою кольору та розміру.
- Іконографіка: Використовуйте зрозумілі іконки, що полегшують сприйняття інформації.
- Швидкий доступ: Забезпечте легкий та швидкий доступ до основних функцій без зайвих кроків.

Цитата експерта: "Простота в дизайні дозволяє інтуїтивним користувачам швидко орієнтуватися та взаємодіяти з продуктом." — Стів Круг, автор книги "Don't Make Me Think".

Практики

Характеристика:
- Фокусуються на результаті, уникають зайвих кроків.
- Цінують ефективність та функціональність.
Рішення:
- Мінімум дій: Забезпечте мінімум дій для виконання завдань. Наприклад, використовуйте одноразові дії (наприклад, одноразове введення інформації).
- Прямолінійний UX: Використовуйте прямолінійний і чіткий UX, де кожен крок логічно слідує за попереднім.
- Автоматизація: Автоматизуйте рутинні процеси, щоб користувачі могли швидко досягати результату.
- Швидкий доступ до функцій: Розміщуйте основні функції на видимих місцях для швидкого доступу.

Емоційні користувачі

Характеристика:
- Реагують на кольори, форми й емоційні повідомлення.
- Цінують естетику та відчуття приємності від взаємодії з інтерфейсом.
Рішення:
- Позитивні підказки: Додавайте позитивні підказки (наприклад, "Ви майже там!").
- Яскраві кольори: Використовуйте яскраві кольори та зображення, які викликають довіру та позитивні емоції.
- Мікроанімації: Використовуйте мікроанімації для створення відчуття живого та інтерактивного інтерфейсу.
- Персоналізація: Надавайте можливість користувачам персоналізувати інтерфейс під свої вподобання.

Цитата експерта: "Емоційний дизайн створює глибший зв'язок між користувачем та продуктом, роблячи взаємодію більш приємною та запам'ятовуючою." — Білл Бейтсон, спеціаліст з емоційного дизайну.

Таблиця психотипів користувачів і їхній вплив на дизайн

Таблиця демонструє ключові характеристики різних психотипів користувачів, їхні мотивації, страхи та рекомендації для дизайну інтерфейсів. Вона дозволяє дизайнерам краще зрозуміти потреби аудиторії та адаптувати інтерфейси відповідно до стилів мислення користувачів.

Інфографіка: Карта когнітивних викривлень

Для глибшого розуміння того, як когнітивні викривлення впливають на поведінку користувачів, скористайтеся цією детальною інфографікою від Visual Capitalist. Ця карта ілюструє понад 180 когнітивних викривлень, класифікуючи їх за різними категоріями та демонструючи їхній вплив на процеси прийняття рішень.

Як це допоможе дизайнеру:

Поглиблене розуміння:
- Дизайнери можуть побачити, як упередження впливають на поведінку користувачів.
Практичне застосування:
- Використання цієї інформації дозволить створювати більш ефективні інтерфейси.
Покращення досвіду:
- Зниження когнітивного навантаження користувачів шляхом використання цих даних у практиці.

Інфографіка: Карта когнітивних викривлень.

Джерело: Visual Capitalist

Висновок: Як створити дизайн, що працює?

Когнітивні викривлення й психотипи користувачів можуть стати вашим найкращим союзником у створенні успішного продукту. Ось кілька ключових кроків для досягнення цієї мети:

Розуміння аудиторії:

Дослідження користувачів: Проведіть детальні дослідження поведінки користувачів, включаючи опитування, інтерв’ю та аналіз аналітики.
Створення персонажів: Розробіть персонажі (персони) користувачів, що відображають різні психотипи та потреби вашої аудиторії.

Тестування й оптимізація:

A/B тестування: Використовуйте A/B тестування для порівняння різних варіантів дизайну та визначення найбільш ефективного.
Юзабіліті-тестування: Проводьте юзабіліті-тестування, щоб виявити проблемні місця у взаємодії користувачів з інтерфейсом.
Зворотний зв'язок: Активно збирайте та аналізуйте зворотний зв'язок від користувачів для постійного вдосконалення продукту.

Застосування психологічних принципів:

Візуальні ефекти: Використовуйте візуальні ефекти, як-от скруглені кути, контрастність і акценти, щоб знизити когнітивне навантаження та підвищити зручність користування.
Емоційний дизайн: Створюйте емоційно привабливі інтерфейси, які викликають позитивні відчуття та довіру.

Безперервне навчання та адаптація:

Тренди та нововведення: Слідкуйте за останніми тенденціями у дизайні та психології користувачів.
Адаптація до змін: Будьте готові адаптувати дизайн відповідно до змін у поведінці та потребах користувачів.

Джерела для подальшого вивчення

Cognitive Bias Codex на Visual Capitalist.
Center for Humane Technology.
Книга: Thinking, Fast and Slow Даніеля Канемана.

Що б я порадив молодшим дизайнерам на початку їх кар’єри

Mike Hafin — Fri, 06 Jan 2023 13:37:02 +0000

Тут немає чарівних паличок, чеклистів та лайфхаків. Лише стислі зауваження для тих хто вирішив стати дизайнером і хоче засвоїти якомога більше інформації в короткий термін. Кілька місяців тому я став ментором на курсі web-дизайну від genuis.space. Я завжди повторюю студентам що заздрю їм, оскільки коли я почав займатися дизайном не було курсів, а інформації в мережі було мало. Зараз навпаки інформації дуже багато, але потрібно вміти її фільтрувати. Тому курси дають стислу програму без води, щоб економити час порівняно з самостійним вивченням.

Базові знання
Кожного разу з’являються запитання: “Як робити дизайн сайту?”, “З чого почати?” та “Де знайти роботу чи проект?”. Почнемо з веб-дизайну: елементи, стилі, композиція, типографія та адаптація до різних розмірів вікна браузера. Далі складаємо роадмап розвитку, щоб зрозуміти цілі та потрібні знання. Отримаємо відповідь: що потрібно мати в портфоліо, що потрібно ще вивчити та як отримати перший проект. Не починайте вчити все одразу. Додайте пріоритети та виберіть що за чим вам потрібно знати. Знаючи та розуміючи навички які вам потрібно розвивати, ви будете знати на чому сконцентруватись. Наприклад: анімація, створення логотипу, UX та UI. Як тільки всі пазли складуються в одну картину, отримані знання ви повинні застосувати на практиці.

Інструменти
Різниця між вектором та растром важливіша ніж різниця між фігмою та фотошопом. Спробуйте опанувати один інструмент, після чого ознайомтеся з іншими. Базові інструменти в редакторі зазвичай схожі. Важливіше вміти мислити та застосовувати інструменти для отримання результату. Наприклад, при створенні кнопки з шейпа та тексту, ми просто їх групуємо. Далі вивчаємо компоненти, автолейаути та варіанти для спрощення завдання. Але якщо ви не знаєте що таке кнопка та прочитаєте що всі кнопки потрібно робити з автолейаутом, то результат може бути трагічним, бо ви пропустили базові принципи. Прототип створюється для тестування взаємодії, а не з причини що так вчили на курсах або прочитали десь чи щоб продати замовнику це як важливе рішення.

“Хороший дизайн — це якомога менше дизайну”, — промисловий дизайнер Дітер Рамс.

Прокачувати надивленість
Кради як митець. Ніхто не каже про те щоб продавати чужий дизайн, але використовувати референси, збирати мудборди та відточувати стилістику потрібно. При перегляді будь-якого сайту звертайте увагу на деталі дизайну та задавайте собі питання: чому цей або інший елемент розміщений тут? Оцінюйте структуру та реалізацію верстки. Якщо побачили баг, спробуйте зрозуміти, що сталося з версткою та як можна було уникнути цього. Коли доходить до презентації замовнику, намагайтеся обгрунтувати усі свої рішення. Кожен блок повинен мати пояснення, чому ви прийняли таке рішення.

Іноді найкращим способом навчатися є просто дивитися та наслідувати професіоналів. Спробуйте почати працювати з досвідченими дизайнерами, щоб отримати більше знань та розуміння процесу дизайну. Менторство та конструктивний фідбек завжди кращі ніж закриватися в собі та намагатися працювати в власному вакуумі.

Візуальний досвід — це те, що ви бачите навколо себе. Для цього потрібно бажання та терпіння. Щодня виділяйте по годині часу на перегляд референсів. Уважно аналізуйте концепти, вчіться застосовувати побачені візуальні прийоми, систематизуйте знання та зберігайте цікаві приклади.

Завершення
Web-дизайн може бути поставлений перед вами як невизначений процес, але з правильним напрямком і досвідом ви можете дізнатися як працювати з дизайном ефективно та досягти своїх цілей. Дизайнери повинні розуміти те що дизайн — це не просто створення красивих зображень, а набагато більше. А значить вам потрібно розуміти архітектуру сайту, як його елементи взаємодіють і в якому порядку розміщувати їх для досягнення найкращого результату. Для початку вам може знадобитися просте завдання, яке дозволить зрозуміти принципи дизайну та навчитися працювати з професіоналами вцілому.

Завжди пам’ятайте, що наступний ваш проект буде кращим, ніж попередній.

Щоб покращити свої навички та знання з дизайну, рекомендую прочитати наступні книги:
• “100 головних принципів дизайну” Сюзан Уейншенк
• “Веб-дизайн” Якоб Нільсен
• “Не заставляйте мене думати” Стів Круг
• “Дизайн звичних речей” Дональд А. Норман