Як створити гру зі ШІ та взяти участь у Вайб-джемі
Твоя перша браузерна гра може початися з однієї цікавої дії: ухилитися, влучити, знайти пару або вчасно натиснути кнопку. Тут — маршрут від задуму до готового HTML-файлу, який можна завантажити на конкурс і дати спільноті пограти.
Участь безкоштовна. Приймаємо прості 2D-ігри, весь власний код яких написав і виправив ШІ. Автор обирає ідею, дає завдання, тестує результат і готує роботу до показу.
Ігри, поточні терміни та участь →
Точний дедлайн і стан конкурсу завжди дивись на сторінці ігор. Гайд залишається корисним і після завершення цього набору.
Що таке геймджем і чи потрібен досвід програмування
Геймджем, або game jam, — подія, на якій учасники створюють і показують ігри за обмежений час. Вайб-джем проводить українська спільнота Вайб-Кодинг. Це окремий онлайн-конкурс із власними правилами, не етап Global Game Jam.
У нашому форматі можна почати без навички написання коду. Потрібно вміти пояснити, як має працювати гра, помітити помилку та перевірити виправлення. «Без програмування вручну» не означає «без перевірки»: ШІ може видати гру, яка красиво виглядає, але не запускається або має незручне керування. Якщо підхід новий, почни з пояснення що таке вайб-кодинг.
Хочеш порівняти інструменти й пройти розробку докладніше? Відкрий мінікурс із вайбкодингу ігор: ChatGPT, Claude, Gemini та Cursor — із п’ятьма промптами, графікою, тестуванням і маршрутом для досвідчених.
Яку 2D-гру зробити першою: п’ять маленьких задумів
Для першої роботи обери одну основну механіку й коротку спробу. Запиши три речі: що робить гравець, як він розуміє успіх і чому захоче спробувати ще раз.
| Задум | Основна дія | Що робить повтор цікавим |
|---|---|---|
| Кур’єр на велосипеді | Об’їжджати перешкоди | Ризикований короткий шлях або безпечний об’їзд |
| Паперовий літак | Керувати висотою польоту | Бонуси в місцях, куди складніше дістатися |
| Кіт і полиця | Стрибати між платформами | Вибір моменту стрибка |
| Пазл із кольором і символами | Знаходити правильні пари | Новий порядок і поступове ускладнення |
| Космічний двірник | Збирати сміття й берегти енергію | Вибір між дальнім бонусом і поверненням на базу |
Це навчальні ідеї, а не роботи учасників. Не починай одразу з мультиплеєра, акаунтів чи величезного відкритого світу. Для нашого конкурсу гра має бути автономною: без окремого сервера, зовнішніх API та встановлення програм гравцем.
Готовий промпт: створи браузерну гру одним HTML-файлом
Передай цей запит доступному тобі ШІ-помічнику для коду. Заміни задум і керування під свою гру. Це підготовлений шаблон завдання, а не гарантія працездатного результату з першої відповіді. Варіанти інструментів є в гайді про ШІ для програмування.
Створи просту 2D-гру для браузера «Космічний двірник».
Гравець керує кораблем, збирає космічне сміття й уникає
астероїдів. За сміття — 1 очко, за зіткнення — мінус 1 життя.
Початково 3 життя. Раунд триває 60 секунд.
На комп’ютері — стрілки або WASD, на телефоні — великі
екранні кнопки. Покажи керування до початку гри.
Потрібні екран старту, видимі життя й рахунок,
зрозуміле завершення та кнопка «Спробувати ще».
Використай просту оригінальну графіку Canvas.
Не розрізняй небезпеки тільки кольором: додай різні форми.
Звук запускай лише після натискання «Почати»;
додай кнопку вимкнення звуку.
Віддай готовий index.html: HTML, CSS і JavaScript усередині,
до 2 МіБ. Без CDN, зовнішніх зображень, API, ключів, сервера,
логіну, платежів і встановлення залежностей гравцем.
Гра працюватиме в iframe sandbox без allow-same-origin.
Не використовуй cookies, localStorage, IndexedDB,
service workers або web workers. Стан тримай у пам’яті.
Перезапуск не має дублювати таймери й обробники клавіш.
Увесь код пиши й виправляй сам; я описую зміни словами.
Дай файл для завантаження й перелік перевірок перед поданням.Чому HTML + JavaScript? Для такого невеликого проєкту можна зібрати розмітку, оформлення й логіку в одному файлі. Базовий приклад 2D-гри на Canvas описаний у навчальному матеріалі MDN. У конкурсі власний код усе одно має писати ШІ; документація допомагає зрозуміти результат.
Як просити ШІ виправити гру, щоб не зламати решту
Замість «все погано, перероби» опиши конкретну дію, очікування та те, що сталося. Додай скриншот або текст помилки без особистих даних. Зберігай попередню робочу версію файлу, щоб мати до чого повернутися.
Проблема: після натискання «Спробувати ще» корабель рухається
удвічі швидше. Очікую ту саму швидкість, що в першому раунді.
Перевір повторне створення таймерів і обробників подій.
Виправ тільки цю проблему. Збережи графіку, правила,
керування, рахунок і формат одного автономного HTML.
Поверни оновлений готовий файл та поясни, як перевірити правку.Повторна генерація всієї гри через одну помилку може змінити механіку, яку ти вже налаштував. Більше прикладів — у матеріалі що робити, коли ШІ ламає код.
Чекліст: чи готова гра до конкурсу
Пройди ці кроки саме у вікні перевірки на сайті. Локальний запуск файлу ще не доводить, що гра працює в конкурсному середовищі.
- Старт. Одразу видно мету та кнопку початку; гравець не програє, поки читає правила.
- Керування. Клавіші або сенсорні кнопки реагують; після відпускання дія припиняється. Перевір кожен пристрій, який вказуєш у заявці.
- Зрозумілість. Життя, рахунок і перешкоди легко відрізнити. Колір дублюється формою, символом або текстом.
- Завершення. Перемога чи програш пояснені, підсумковий рахунок видно.
- Повтор. Три перезапуски поспіль не прискорюють гру й не накладають музику.
- Автономність. Немає зовнішніх бібліотек або ресурсів, які блокуються під час запуску на сайті.
- Права. Графіка, музика та інші ресурси власні або використовуються з дозволом. Не подавай чужу готову гру.
- Прев’ю. На картці справжній кадр із твоєї гри, який зрозуміло показує ігровий процес.
Як завантажити гру на Вайб-джем
Можна подати кілька різних ігор із одного акаунта. У вкладці додавання відкрий «Мої ігри» та натисни «Додати ще гру». Кожна має окремі файл, прев’ю, заявку й перевірку. Голос залишається один на акаунт за тур; за жодну свою гру голосувати не можна.
На сторінці додавання гри увійди через email із кодом підтвердження або ChatGPT і перетягни файл у вікно завантаження або обери його з пристрою. Сайт приймає один HTML до 2 МіБ або ZIP до 20 МіБ. У ZIP потрібні index.html та всі ресурси: не вихідний репозиторій, не node_modules і не файл .exe.
Якщо ШІ зробив проєкт із кількох файлів, попроси готову автономну вебзбірку: до 200 файлів і до 40 МіБ після розпакування. Усі шляхи до ресурсів мають бути відносними. Повні вимоги та запит для пакування є у вкладці «Правила» на сторінці конкурсу.
Запусти гру, перевір її, збережи кадр для прев’ю. Якщо автоматичне захоплення не працює, додай скриншот. Заповни назву, нік, опис, керування, використані AI-інструменти та контакти. Email і Telegram бачать лише ти й організатор. Після подання робота проходить перевірку; у публічній галереї вона з’явиться після схвалення.
Як працюють голосування та приз 500 грн
Спочатку тривають прийом і перевірка робіт. Організатор окремо відкриває голосування на три доби, коли є щонайменше дві схвалені гри та всі подані заявки перевірено.
Грати можна без входу. Для голосу потрібен вхід через підтверджений email або ChatGPT: спробуй дві різні чужі гри по 30 секунд і обери одну. Якщо автору доступна лише одна чужа робота, достатньо її. На акаунт зараховується один голос за тур; вибір можна змінити до закриття. Самоголосування заборонене.
Підрахунок спочатку бачить лише організатор. Він вирішує, коли опублікувати результати. Якщо показ увімкнений до завершення, це проміжні результати, а не оголошення переможця. Переможець за голосами отримує 500 грн від організатора; за нічиєї з голосами передбачено додатковий тур на добу. Повні умови — у правилах конкурсу.
Поширені запитання
Чи можна створити гру зі ШІ безкоштовно?
Участь у Вайб-джемі та гра на сайті безкоштовні. Витрати на створення залежать від обраного ШІ-сервісу та його лімітів. Платна підписка не є умовою конкурсу, але ми не обіцяємо необмежену безкоштовну генерацію в сторонніх сервісах.
Чи треба писати код самому?
За правилами цього конкурсу — ні. Весь власний код генерує й виправляє ШІ. Ти можеш придумувати ідею, давати запити, копіювати згенерований код, користуватися редактором і запускати збірку. Ручні правки коду не допускаються.
Чи підійде гра, створена в іншому AI-конструкторі?
Лише якщо можеш отримати готову автономну HTML/ZIP-вебзбірку, яка відповідає правилам і запускається у вікні перевірки. Посилання на чужу платформу або красиве демо без потрібного експорту не замінює файл гри.
Чи можна грати з телефона?
Це залежить від конкретної гри. Автор позначає підтримувані пристрої. Якщо додаєш сенсорне керування, перевір його на телефоні, а не лише у зменшеному вікні комп’ютера.
Що робити, якщо гра не запускається після завантаження?
Попроси ШІ перевірити зовнішні CDN, абсолютні шляхи, браузерні сховища та залежність від сервера. Передай точний опис помилки й вимоги конкурсу. До завершення прийому можна відкликати свою заявку для виправлення та подати її знову.
Твоя наступна дія — одна маленька гра
Обери механіку, скопіюй промпт, перевір першу спробу. Коли гра працює — покажи її спільноті.
Джерела й межі цього гайда
- Вайб-джем: чинні правила, формати й терміни — першоджерело умов нашого конкурсу.
- MDN: 2D-гра на JavaScript і Canvas — технічний навчальний приклад.
- Global Game Jam — окрема міжнародна подія, наведена для контексту поняття game jam.
Промпт, ідеї та чекліст підготовлені редакцією для формату нашого майданчика. Конкретний результат генерації залежить від інструмента й тестування. Ця стаття не обіцяє приз, гарантований строк розробки або автоматичне схвалення заявки.