Сайт може працювати ідеально «під капотом», але якщо кнопку не видно — користувач піде. UX/UI — це мова між людиною і технологією. І підлітки часто мають чудове «чуття» на тренди та естетику.

UX vs UI — простими словами

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

Практика для початківців

Скопіюйте улюблений сайт у Figma «на око» — навчіться бачити сітку.
Зробіть 3 варіанти кнопки — різний контраст, розмір, текст.
Попросіть трьох друзів пройти ваш сайт — де «застрягли»?

На курсі Web-розробки в Craftkid ми проходимо і код, і базовий дизайн — щоб проекти виглядали професійно, а не «як з 2005 року».

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

Figma безкоштовна для навчання. Почніть з wireframe — сірих блоків без краси, лише структура. Потім типографіка, кольори, відступи за сіткою 8px. Підлітки часто стрибають одразу до «красивого», пропускаючи логіку — ми вчимо послідовності.

Доступність (a11y)

Контраст тексту, розмір кнопок для пальця на телефоні, зрозумілі підписи — це UX, який відрізняє amateurs від pros. Навіть простий чеклист з 5 пунктів різко покращує проекти на захисті.

Зв’язок дизайну і коду

Дизайнер у Figma і розробник у VS Code мають говорити однією мовою: відступи, стани кнопки, hover, mobile-first. Підлітки, які вміють і те, і те, незамінні в маленьких командах на хакатонах.

На курсі Web ми здаємо макет перед версткою — як у студіях. Це дисципліна, яку рідко дають самі туторіали з YouTube.

Натхнення без копіювання

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

Підлітки часто мають сильний смак — дайте йому вихід у Figma, а не лише в TikTok-редакторах відео.

Наступні кроки з Craftkid

У школі програмування Craftkid на Позняках у Києві ми допомагаємо підліткам 10–16 років перетворювати інтерес на технологіях на реальні проекти: ігри, сайти, боти, командні роботи для хакатонів. Заняття офлайн у малих групах, українською мовою, з ментором, який пояснює без снобізму й підтримує, коли «не працює».

Не обов’язково знати все заздалегідь. Достатньо цікавості і готовності спробувати. Запишіться на безкоштовне пробне заняття — разом оцінимо рівень, підберемо курс і покажемо, як виглядає навчання наживо. Батьки отримують чесну відповідь: чи готові до Python, Web, Roblox чи варто почати з Scratch.

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

IT — це марафон. Ми поруч на старті й на поворотах: від першого print() до портфоліо, яким не соромно йти на стажування. До зустрічі в класі на Позняках!

UX/UI для підлітків: чому дизайн не менш важливий за код