Vibe Coding Академия: уеб дизайн и програмиране с AI за ученици
- Начало: 26 септември
- 23 седмици
- Подходящ за: Начинаещи
Помогнете на детето си да надгради знанията си и да премине от любопитство към реални умения с пълна програма по уеб програмиране.
КАКВО ЩЕ НАУЧИ УЧЕНИКЪТ
HTML и CSS - азбуката на уеб разработката
Четири занятия са посветени на HTML и CSS за ученици: тагове и семантична структура, селектори, цветове и типография, Flexbox и адаптивен дизайн. Ученикът се научава да чете кода на всяка страница, да намира в него всеки елемент и да го променя на ръка. Това е основата, без която работата с AI е сляпо натискане на бутон.
Уеб дизайн за ученици: сайт, който изглежда добре и се използва лесно
Структура на уеб страница, визуална йерархия, цветови палитри, типография, UI компоненти и потребителско изживяване. Ученикът се научава защо един сайт изглежда професионално, а друг — аматьорски, и как се проверява дали посетителят се справя с това, което сте му дали.
Vibe Coding: създаване на сайтове с AI, което ученикът разбира
Vibe Coding е подход за създаване на софтуер, при който описваш с думи какво искаш, а AI генерира код и предлага реализация. В курса използваме този подход образователно: ученикът преглежда, тества, коригира и трябва да разбира как работи резултатът. AI ускорява работата, но решенията взема ученикът.
Създаване на сайтове от идея до публикуван адрес
Курсът е изграден около шест практически проекта. Пет от тях завършват с публикуван сайт на реален адрес, а един е UI kit и макет, който остава част от дизайн портфолиото. Ученикът минава целия път на създаване на уеб страници: идея, дизайн, съдържание, код, тестване и публикуване.
МОДУЛИ В КУРСА
Започваме с резултат, а не с теория: още на първото занятие всеки ученик генерира своята първа страница с AI и я публикува на реален адрес. След това идват основите - как работи уеб, какво е адрес, хостинг и сървър, и каква е разликата между идея, дизайн и код. Ученикът се учи да пише промпт като техническо задание: за кого е сайтът, какво трябва да прави посетителят, какъв е стилът и как ще познаем, че е готов. Тук се въвеждат и правилата на залата, които важат цялата година - нищо лично в сайта и нищо публикувано, което не можем да обясним. Модулът завършва със собствена концепция за сайт и първа публикувана страница.
От какво е съставена една модерна уеб страница - header, навигация, hero секция, съдържание, карти, призив за действие и footer - и защо първият екран решава дали посетителят ще остане. Ученикът се учи да работи с цвят и контраст, да избира шрифтове и да изгражда типографска система, да разпознава четирите неща, които издават аматьорския сайт. Следва UI дизайн за начинаещи: бутони, карти, менюта, форми, полета и състояния на елементите. Модулът завършва със собствен UI kit и макет на началната страница - визуалната посока, по която ще се работи до края на курса.
Най-техничният модул и основата на целия курс. HTML: тагове, заглавия, параграфи, изображения, връзки, бутони и семантични секции - и как се чете кодът, който AI е генерирал. CSS: селектори, цветове, фонове, шрифтове, рамки, padding и margin, CSS променливи. След това подреждането с Flexbox - редове, колони, подравняване, карти, галерии и навигационни менюта. Модулът завършва с responsive дизайн: как един сайт работи на телефон, таблет и компютър, media queries и mobile-first мислене. Изходът е адаптивен сайт, проверен на реален телефон, и ученик, който може да посочи в кода откъде идва всяко нещо на екрана.
Сайтът не е само оформление. Ученикът създава с AI цялото съдържание на проекта си - заглавия, кратки описания, текстове за призив към действие и страница „за нас“ и се учи да редактира генерирания текст, вместо да го приема наготово. След това идват изображенията: как се пише промпт за изображение, как се държи един визуален стил последователен през целия сайт и защо тежката снимка убива страницата. Говорим и за правата, какво може и какво не може да се използва, защо работим с измислени марки и защо генерираното съдържание се обозначава. Модулът завършва с цялостна landing page, изградена чрез Vibe Coding.
Тук сайтът започва да прави неща. Първи стъпки в JavaScript, какво е събитие, клик върху бутон, показване и скриване на съдържание и как се чете кодът, който AI генерира за такава функция. Следват интерактивните компоненти: мобилно меню, модален прозорец, акордеон, галерия, табове. После формите и работата с потребителя: полета, проверка на въведеното, съобщения и какво ученически сайт няма право да събира като лични данни. Модулът затваря с UX и как посетителят разглежда сайт, какво го обърква и как AI може да се използва като дизайнерски критик. Изходът е версия 2.0 на собствения сайт, направена след тест с реален човек.
Пет занятия за самостоятелна работа. Първо репетиция, цял сайт по чужда идея в рамките на едно занятие, след това занятие по дебъгване с AI: как се разпознава проблем, как се описва на AI и как се връщаш към работеща версия, когато нещо се счупи. Следва собственият проект: ясна цел, аудитория, визуална концепция, няколко секции, навигация, адаптивен дизайн, собствено съдържание и поне една интерактивна функционалност. Завършваме с проверка по чеклист, публикуване и представяне пред родители и гости като всеки ученик показва сайта си на живо от адреса му и обяснява как е използвал AI.
ЗА КОГО Е ПОДХОДЯЩ
Ученици от 6. до 11. клас, които искат собствен сайт
Курсът е за ученици, които искат да направят нещо свое и да го покажат като например сайт за игра, за клуб, за група, портфолио или собствена идея. Практически курс по създаване на сайтове за ученици, в който всеки модул завършва с конкретен проект, публикуван сайт или дизайн артефакт, а не само с упражнение.
Начинаещи без предишен опит в програмирането
Не се изисква нищо предварително. HTML и CSS се учат от нулата, а AI помага на ученика да види резултат от първото занятие, вместо да чака седмици. Подходящ първи курс по уеб дизайн и уеб програмиране за начинаещи ученици, включително за деца, които не са се занимавали с код.
Ученици, които вече използват AI и искат да го използват по-умело
Много ученици вече използват AI за текст, изображения и код, но не винаги проверяват какво получават. Тук се учат да четат генерирания код, да разпознават кога AI греши уверено и да поправят резултата сами. Целта е ученикът да управлява инструмента уверено, вместо да зависи от него.
Ученици с интерес към дизайн и творчество
Курсът е и за деца, които не се виждат като „програмисти“, но обичат да рисуват, снимат, оформят и създават. Уеб дизайнът е мястото, където визуалното мислене среща технологията. Естествено продължение е и за ученици, минали Scratch, Minecraft или Roblox Академия.
ЧЕСТО ЗАДАВАНИ ВЪПРОСИ
Vibe Coding (вайб кодинг) е подход за създаване на софтуер, при който човек описва с думи какво иска, а AI генерира код и предлага реализация. Терминът се появява през 2025 г. като име за този нов начин на работа с генеративен AI. В този курс използваме идеята в образователен вариант: ученикът не приема резултата наготово, а го чете, тества, променя и трябва да разбира как работи. Ученикът остава авторът, който възлага, оценява и решава.
Ще научи. Цял модул от четири занятия е посветен на HTML и CSS за ученици - структура, семантични тагове, селектори, цветове, типография, Flexbox и адаптивен дизайн, а през останалите модули ученикът постоянно чете и редактира код. Правилото на курса е ясно: нищо не се публикува, ако ученикът не може да покаже в кода откъде идва всеки елемент на екрана. HTML и CSS са азбуката на уеб разработката и курсът не ги прескача.
Да. Това е входен курс, не се изискват предишни знания по програмиране или дизайн. HTML и CSS започват от нулата, а AI позволява на ученика да види работещ сайт още на първото занятие, което прави първите стъпки в уеб разработката значително по-леки от класическия път.
Адаптивният дизайн е начинът един сайт да изглежда и работи добре на телефон, таблет и компютър. Голяма част от уеб трафика идва от мобилни устройства, затова съвременният сайт трябва да работи добре и на малък екран. В курса ученикът се научава да прави responsive сайтове с media queries и mobile-first мислене и да ги проверява на реално устройство.
Редактор на код за работа с HTML и CSS, браузър с инструменти за разработчици, AI билдър за генериране на сайтове, AI асистент за код и текст и генератор на изображения. Достъпът до AI услугите, използвани по време на занятията, се осигурява от академията; условията за самостоятелно използване на външни AI услуги у дома може да са различни.
Работата е под надзор на преподавател и по ясни правила, които въвеждаме на първото занятие: в проектите не влизат лични данни като адрес, телефон, име на училище или снимки на хора; не се използват чужди снимки, лога и текстове; генерираното съдържание се обозначава. Акаунтите се управляват от академията, а не се създават от учениците в час.
Уеб дизайнът присъства в профилираната подготовка по информационни технологии в 12. клас, модул „Уеб дизайн“. Ученик, минал този курс, среща тези теми вече с практически опит, готови проекти и увереност при работа с HTML, CSS и уеб дизайн. Сайтовете, които е направил, могат да се използват и при училищни проекти, състезания и представяния.
Шест завършени проекта: първа лична страница, UI kit и макет, адаптивен сайт, landing page, интерактивна версия 2.0 на собствения сайт и финален проект. Пет от тях са публикувани на реални адреси, а UI kit и макетът остават част от дизайн портфолиото. Така ученикът завършва с реални линкове и визуални материали, които може да отвори и покаже.
Не. Всеки ученик работи на компютър в залата на академията. Ако има компютър вкъщи, може да продължи проектите си и там — основните инструменти за уеб разработка са безплатни и работят в браузър.
Да, курсистите ще имат кратки домашни, с които да упражнят наученото. Също така ще имат и проекти, които са препоръчителни, защото носят точки в нашата система за награди.
Всички проекти, направени по време на курса, носят точки в нашата система. Тези точки могат да бъдат разменени за наличните награди.
Да. Всеки ученик, който завърши курса, получава сертификат от Advance Academy. Връчваме ги на последното занятие, пред родителите, заедно с представянето на финалните проекти.
Курсът се провежда присъствено в залите на Advance Academy във Варна, веднъж седмично по 2 учебни часа, в продължение на 23 седмици.
Естественото продължение е JavaScript и Full Stack Академия, където ученикът пише кода си сам и добавя сървър и база данни. Подходящо продължение е и Python Академия за ученици, които искат текстово програмиране извън уеба. Пътеката в академията е последователна: Scratch и Minecraft, после Roblox, след това Vibe Coding и уеб дизайн, Python и накрая Full Stack.
Натиснете бутона „ЗАПАЗИ МЯСТО“ на страницата на курса и попълнете формуляра с вашите данни. След това ще се свържем с вас за потвърждение и подробности. Ако имате въпроси, винаги можете да се свържете с нас.
Таксата за целогодишния курс се разсрочва на 6 равни вноски по 89 евро, без оскъпяване. Първата вноска се заплаща при записване, а следващите - в средата на всеки следващ месец от курса. В цената влизат всички 23 занятия, учебните материали, теорията, достъпът до онлайн платформата на Адванс Академи, сертификатът при завършване и всички допълнителни материали.
СЕРТИФИКАТИ
Advance Academy издава сертификат за всеки ученик, който успешно завърши курса. Заедно със сертификата ученикът завършва с практическо портфолио от шест проекта, включително пет публикувани сайта на реални адреси — адаптивен сайт, landing page и собствен финален проект.