Коротко: UI — те, що людина бачить на екрані, UX — те, що вона відчуває, коли ним користується. Дизайнер інтерфейсів більшу частину часу не малює, а вирішує, як зробити зрозуміло.

UI (User Interface) — це те, що людина бачить: кнопки, кольори, шрифти, розташування елементів на екрані. UX (User Experience) — це те, що людина відчуває, користуючись продуктом: чи легко знайти потрібну функцію, чи зрозуміло, що робити далі. Курс починається саме з цієї різниці — вона здається очевидною, поки не спробуєш пояснити її словами.

Це не курс малювання

UI/UX дизайнер значно більше часу проводить не за красивими картинками, а за дослідженням: інтерв'ю з користувачами, побудова user flow (шлях користувача через застосунок), аналіз конкурентів, тестування гіпотез. Курс прямо відображає цю пропорцію — окрема велика тема «Основи UX. Методи дослідження» йде до того, як дитина взагалі відкриває Figma.

Що дитина реально спроєктує за 12 місяців

Курс триває 12 місяців, 96 занять, групи до 5 дітей. У програмі — повноцінний дизайн сайту від макета до фірмового стилю, дизайн мобільного застосунку під Android та iOS з урахуванням особливостей кожної платформи, і фінальний іспит — захист власного портфоліо, зібраного з практичних і курсових робіт за весь час навчання.

Чому це командна професія, а не самотня творчість

Окрема тема курсу — «Дизайн-процеси і основи роботи з інтерфейсами»: спринти, дедлайни, робочі процеси в команді дизайнерів. UI/UX — рідко робота наодинці з комп'ютером, частіше — постійна взаємодія з розробниками, замовником і іншими дизайнерами. Курс готує саме до цього, а не тільки до відкриття Figma і малювання екранів.

Кому цей напрямок підійде

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

Часті питання про курс UI/UX дизайну

Чи потрібно вміти малювати для UI/UX?

Ні, на відміну від курсу графіки та анімації. UI/UX працює з готовими блоками, сітками й компонентами в Figma, а не з малюванням від руки.

Скільки коштує курс і скільки триває?

3800 ₴ на місяць, 12 місяців, 96 занять, групи до 5 дітей — найменші групи серед усіх курсів школи.

Чим цей курс відрізняється від курсу графіки та анімації?

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

Про сам інструмент Figma — Як створити портфоліо дизайнера на Behance, Dribbble та Pinterest, а про напрямки дизайну загалом — Які види дизайну існують.

Найпростіше пояснення різниці між UI і UX

Дорослим цю пару зазвичай пояснюють схемами, а дітям працює побутовий приклад. Двері в магазині: UI — це те, як вони виглядають, ручка, скло, напис. UX — те, що ви штовхаєте двері, на яких написано «на себе», і б'єтеся об них плечем.

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

Як минає одне заняття

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

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

Дослідження у виконанні п'ятнадцятирічного

Слово «UX-дослідження» звучить як щось із університету, а на практиці виглядає простіше. Завдання: знайти трьох людей, які користуються застосунком схожого типу, і поставити кожному п'ять питань. Не «чи подобається тобі дизайн» — на це всі відповідають «нормально», — а «покажи, як ти замовляєш каву», «де ти застряг минулого разу».

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

Помилки, які роблять у перших макетах майже всі

  • Дрібний шрифт. На великому моніторі виглядає елегантно, на телефоні не читається. Перевірка — відкрити макет з власної кишені.
  • Чотири шрифти на екрані. Працює правило двох: один для заголовків, один для тексту, решта — розміром і насиченістю.
  • Кнопка в одному стані. У реальному інтерфейсі їх щонайменше три: звичайний, наведення, натиснуто. Без них екран здається зламаним.
  • Відступи «на око». Набір кратних значень — 8, 16, 24, 32 — робить макет охайним швидше за будь-який талант.
  • Немає порожніх станів. Екран, на якому ще немає даних, малюють одиниці, а бачить його кожен новий користувач.

Що дитина забирає з курсу, навіть якщо не піде в дизайн

Найпомітніше — уміння пояснювати свої рішення. У дизайні не можна сказати «мені так подобається»: доводиться називати причину, і причина має бути перевіряємою. Ця звичка переїжджає в шкільні проєкти й у розмови з дорослими швидше, ніж будь-яка технічна навичка.

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

Чи потрібно вміти малювати

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

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

Що справді потрібно — помічати незручності. Дитина, яка каже «тут кнопку не видно» про чужий застосунок, має задатки, яких не замінить жодна художня школа.

Куди веде цей напрямок далі

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

Вибирати заздалегідь не потрібно. Що конкретно складає портфоліо підлітка й у якому віці це реально, розібрано окремо: «Портфоліо і резюме дизайнера у 16–17 років». А порівняння напрямків дизайну між собою — «Які види дизайну існують».

Детальніше про курс, розклад і запис на пробне заняття — на сторінці курсу «UI/UX дизайн у Figma».