5 уровней ИИ-кодинга. От бота без кода до сайта и игры за минуты

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

Что получится на каждом уровне

Уровень 0. Трекер расходов в n8n без кода

n8n строится из блоков: больше 500 готовых интеграций, а любой другой сервис подключается вручную. Под капотом код, но вы управляете им визуально. Плюс библиотека примерно на 8 тысяч шаблонов, которые можно взять и адаптировать.

Вместо ручной сборки кубиков открываем AI Builder и описываем задачу.

1. Дайте билдеру задачу

   Нажмите Enter: n8n сам нарисует схему из узлов Telegram, OpenAI и Google Таблицы.

2. Раздайте ключи

   В Telegram откройте BotFather, создайте бота и вставьте токен в узел Telegram. В узел OpenAI вставьте API-ключ. В Google Таблицах просто войдите через свой аккаунт и выберите таблицу и лист.

3. Сопоставьте колонки вручную

   В настройках таблицы включите режим сопоставления вручную (Map Column Manually): дата в колонку А, сумма в колонку Б.

4. Сделайте тестовый прогон

   Запустите тест, пришлите боту фото реального чека. Когда данные появятся в узле, перетащите их в нужные поля таблицы.

5. Исправьте то, что сломалось

   В ролике ушло три прогона: сначала режим записи в таблицу стоял «добавлять и заменять» вместо «добавлять», потом в сообщении были пустые поля из-за регистра имени переменной (данные пришли с заглавной буквы, а узел ждал строчную).

Результат: сервис с компьютерным зрением за пару минут. Идеальным с первого раза он не вышел, настройки пришлось поправить руками, но раньше за такую интеграцию студии брали десятки тысяч рублей. Если хотите разобрать n8n с базы, смотрите первого ИИ-агента за 20 минут.

Уровень 1. Telegram-бот на Python в Cursor

Идея: бот-нутрициолог, который по фото еды считает калории и БЖУ. В американском App Store на таких трекерах зарабатывают миллионы, но здесь цель проще: собрать MVP за пять минут.

1. Создайте проект и включите агентский режим

   В Cursor откройте новый проект Calories Bot, перейдите в режим агента. В ролике выбрана модель Composer с Max Mode: это собственная модель Cursor, она стоит средне и пишет хорошо. Топовые модели других компаний там тоже есть.

2. Разделите роли моделей

   Код пишет Cursor, а «мозгами» бота будет Gemini 3 Flash: она дешёвая и хорошо видит картинки. Один запрос стоит копейки, поэтому у платного сервиса по подписке маржинальность остаётся высокой.

3. Укажите, как подключаться к ИИ

   В промпте пропишите прокси, через который бот ходит к зарубежным моделям: он принимает оплату в рублях и работает на российских серверах без VPN.

4. Получите два токена

   Токен бота выдаёт BotFather. Ключ для ИИ берёте в личном кабинете прокси и вставляете в файл настроек.

5. Примите правки и проверьте

   Cursor сам создаёт структуру: main.py, файл зависимостей, файл настроек. Нажмите Keep all. Кидайте боту фото ужина: он вернёт калории, белки, жиры и углеводы.

Первый ответ бота верный, но читать его неудобно из-за форматирования. Не объясняйте это словами: сделайте скриншот, вернитесь в Cursor и напишите как живому человеку: «Мне не нравится форматирование». Cursor правит нужные куски и не ломает логику. После перезапуска ответ с калориями выглядит аккуратно, бот отработал и на второй фотографии, снятой со вспышкой.

Как оплачивать зарубежные сервисы

Подписки на Cursor, ChatGPT, Claude и Google из России оплачиваются непросто. В ролике два способа, ссылки на проверенные сервисы я оставил в описании под видео.

• Маркетплейс цифровых товаров: там продают готовые аккаунты и ключи. Есть гарантии возврата и обмена: когда у части продавцов подписка Perplexity перестала работать после смены активации, выручали именно они.
• Виртуальная карта: выпускаете, пополняете через свой банк и привязываете к Cursor, Google, OpenAI и другим сервисам.

Подробный разбор доступов смотрите в материале как получить доступ к ИИ из России.

Уровень 2. Вёрстка из Figma через MCP

Задача посложнее: вёрстка по готовому макету. Берём шаблон фитнес-зала из Figma Community: графики, сетки, картинки.

1. Сделайте копию макета в свой аккаунт

   Нейросеть видит только те макеты, которые лежат у вас. Продублируйте файл и перенесите нужные фреймы в обычный проект: так откроется доступ к слоям и стилям, а не к картинкам.

2. Подключите Figma к Cursor

   На сайте документации Cursor откройте раздел MCP и нажмите Add new. Разрешите авторизацию, дождитесь зелёного индикатора: редактор подружился с Figma.

3. Дайте инженерный промпт

   Пустая папка, режим агента, роль, стек, задача и прямая ссылка на фрейм десктопной версии.

4. Запустите сервер

   Откройте localhost:3000. Картинки подтягиваются сами, шрифты, радиусы кнопок, отступы и цвета взяты из файла.

5. Поправьте косяки скриншотом

   Заголовок Life Better переносился неверно. Выделите область, киньте скриншот в чат и напишите: «Поставь перенос, как в макете».

По моей оценке, это не 100%, а уверенные 90% работы за пару минут: готовый React-компонент, который можно и нужно развивать. Версия получилась только десктопная: если сжать окно, вёрстка поплывёт. Для планшета и телефона скопируйте ссылки на соответствующие фреймы и повторите.

Честно про Cursor: на 11.01.2026 у него жёсткие лимиты на быстрые запросы к топовым моделям, тарифы платные, а конкуренция сильная. Есть VS Code, Windsurf, Claude Code, Gemini CLI, ChatGPT Codex. Пробуйте и выбирайте то, что ускоряет именно вашу работу.

Уровень 3. Google Stitch, сайт без макета

Задача: лендинг компании модульных домов. В настройках выбрана Gemini 3 Pro и формат веб-интерфейса. Главное правило: не просить «сделай красиво», а задавать структуру. На экране в ролике виден такой промпт (начало блока на кадре обрезано).

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

Самое ценное в экспорте. Нажмите Export, затем Download: придёт не скриншот, а чистый HTML и CSS по файлам. Распакуйте архив, откройте index.html в браузере, и всё работает локально. Перед продакшеном код нужно проверить и подключить бэкенд.

Stitch это лишь представитель класса Generative UI, где этап рисования макета пропускают и сразу получают код. Альтернативы, названные в ролике:

Заодно загляните в Google Labs: там десятки экспериментальных инструментов, от музыки до 3D.

Уровень 4. Вайб-кодинг. Арканоид в ChatGPT и Gemini

Вайб-кодинг это код в потоке, ради быстрого результата здесь и сейчас. Задача: игра Арканоид в одном HTML-файле, соревнуются Gemini 3 Pro и ChatGPT 5.2. Для ChatGPT взята обычная думающая модель, а не та, что размышляет по полчаса.

Итоги раунда: ChatGPT сразу прописал нормальную физику отскока, управление мышью и жизни, играть можно было сразу, и выглядело это заметно лучше. Gemini выдал неоновый стиль, кнопку «Играть» и интерфейс, но визуально проиграл.

Вайб-кодинг как минное поле

Код может работать и при этом внутри быть кашей. Для прототипа это супер: вы показываете программисту рабочую штуку вместо описания на бумаге. Для реального бизнеса нужна проверка или переписывание: нормальный программист упакует проект так, чтобы он был стабильным и его нельзя было, например, задедосить. В IT уже говорят о новой роли «чистильщика» кода после нейросетей.

Вопросы из ролика

Главы ролика

10 глав, весь ролик 21 минута. Нажмите на главу, и ролик начнётся с неё

1. 0:00Вступление, зачем серия про кодинг1 минута
2. 1:00О чём выпуск, пять уровней эволюции кодингаменьше минуты
3. 1:35Уровень 0, трекер расходов в n8n за 5 минут3 минуты
4. 4:38Уровень 1. Telegram-бот на Python в Cursor и Gemini Flash3 минуты
5. 7:37Как оплачивать зарубежные сервисы из Россиименьше минуты
6. 8:30Уровень 2. Figma и MCP, код на Next.js и Tailwind4 минуты
7. 12:55Уровень 3. Google Stitch, сайт без макета4 минуты
8. 17:09Уровень 4. ChatGPT Canvas против Gemini Canvas1 минута
9. 18:09Почему вайб-кодинг минное поле для бизнеса1 минута
10. 19:11Итоги, порог вхождения рухнул2 минуты

Не открывается плеер? Смотреть на YouTube