Урок 3 · 15 мая 2026 · финал интенсива

Третье занятие — дизайн, скилы, MCP и полярная звезда

2 часа 04 минуты · русский · 22 главы · 6 ⚠ обязательных · 1 ★ ключевой тезис
youtube.com/watch?v=TLqs7eF2Ajo ↗
Финал интенсива · одним взглядом

Не просто дизайн.
Финал и доктрина.

Третье занятие задумывалось как «дизайн через Claude». В эфире оно превратилось в финальный сбор всей системы: CLAUDE.md, дизайн-инструменты, скилы vs MCP, North Star, workspace на проект, и закрытие тремя пятиступенчатыми рефлексиями участников.

6
обязательных пунктов, которые Рустам прямо попросил вынести в конспект
1
★ ключевой тезис, который Рустам потребовал вынести отдельным блоком
5
фаз построения первого AI-проекта по доктрине Полярной звезды
АКТ I · ЧАС ПЕРВЫЙ

Фундамент:
CLAUDE.md и дизайн

CLAUDE.md шаблон (с исправлением до 100 строк), 10 инструментов для дизайна, живое демо Claude Design с Юлей, Superpowers для SVG-схем и лендингов — включая эти самые recap-страницы.

00:00

CLAUDE.md — шаблон на всё занятие

Рустам открывает третье занятие с уже сделанного для участников шаблона CLAUDE.md. Идея простая: один промт, который ты отдашь любому своему агенту, и он усилится. Шаблон задаёт правильную структуру памяти агента, заставляет его задавать тебе 5–10 уточняющих вопросов о тебе и сохраняет ответы навсегда.

в конспекте обязательно · поправка
CLAUDE.md держи до 100 строк, не 500

Рустам на прошлом занятии оговорился про 500 строк — это много, агент начинает путаться. Правильный размер CLAUDE.md — до 100 строк. Раз в неделю заходи, проверяй количество строк, и если разрослось — отдай агенту прямую команду:

⌨ Промпт для сжатия CLAUDE.md · вербатим «Дорогой мой, у нас в CLAUDE.md сейчас 250 строк. Нам важно, чтобы было 100 строк или меньше. Пожалуйста, сожми, убери лишнее, убери повторы, оптимизируй объём так, чтобы хватило 100 строк.»
готовый шаблон
CLAUDE.md для твоего личного ассистента
Открываешь у себя в VS Code → отдаёшь агенту → он задаёт тебе 5–10 уточняющих вопросов → CLAUDE.md сохранится навсегда.
Открыть шаблон ↗
03:13

10 инструментов для дизайна — обзор на май 2026

Рустам показывает экран: рабочая страница с десятью самыми актуальными решениями на сегодня. Список не для прочтения вживую — он для того, чтобы ты отдал его своему Claude Code как материал и попросил выбрать 3–4 под твой проект.

«Это вам кушать не нужно. Вам нужно это загрузить вашему агенту в Claude Code. Это сильно упрощает и ускоряет процесс».
— Рустам, как пользоваться списком инструментов · 00:04:41

Лента из 10 карточек идёт ниже, после Акта I — каждая показывает реальный мок выхода. Фиолетовым «★ DEMOED» помечены те, что Рустам и Юля разбирали в эфире вживую.

04:59

Главное про дизайн через AI — плохо с фотографиями

Прежде чем перейти к Claude Design, Рустам и Юля (как штатный дизайнер проекта) фиксируют главное ограничение всех нынешних AI-дизайнеров: они плохо работают с реальными фотографиями. Голову спикеру обрежет, лицо в произвольное место поставит, пропорции исказит.

Правильная стратегия: не ждать от нейросети «дизайнерского чутья», а дать ей жёсткие шаблоны, где конкретное место — для лица, конкретное — для текста. Папка из 15–100 шаблонных фотографий спикера. Дальше она просто подставляет, а не «придумывает композицию».

опыт штатного дизайнера · Юля
«Я около недели с ним боролась. У меня не получилось с тысячами правок добиться корректной работы от него с изображениями. С текстами он отлично работает».
Практический вывод: в презентациях проси не вставлять фотографии вообще, а оставлять место под изображение — потом за два клика вставишь вручную нужное. Со схемами, типографикой, таблицами Claude Design отлично работает.
09:00

Claude Design — живое демо с Юлей

Юля включает демонстрацию экрана, открывает десктопное приложение Claude. Внутри — claude design. Это пока единственное место, откуда он запускается (через ссылку из чата). У части пользователей кнопка уже есть в меню — у Рустама пока нет.

Первое, что делается при первом заходе — дизайн-система. Это «стилистика под задачу». У них в проекте сделано две: одна для PDF-конспектов (которые они рассылают участникам клуба здоровья «Баланс»), другая для презентаций вебинаров. Дизайн-система = преднастроенный промт для AI-дизайнера, который содержит примеры, цвета, шрифты, логотипы — и Claude применяет их при каждой новой задаче.

⌨ Как Юля делает дизайн-систему · вербатим «Так, мне нужно создать Claude Design дизайн-систему для моего проекта для того, чтобы он делал мне крутые презентации для вебинаров. Напиши, пожалуйста, промт для этого.» [агент задаёт уточняющие вопросы → ответы] Дальше в Claude Design: Link from your computer / Upload a Figma file + Add fonts, logos, assets + Дополнительные заметки («ещё раз обрати внимание — это для слайдов, для вебинара») → Continue to generation
14:15

PDF-конспекты — $1,5 за полностью свёрстанный лист

Юля показывает результат: красивые PDF-листы со схемами, типографикой, в их фирменной стилистике клуба. Все картинки — кроме одной — добавлены ей сама. Всё остальное — вёрстка, схемы, цвета — сделал Claude Design.

Себестоимость такого PDF на API: ~$1,5 (≈150₽) за готовую страницу. В рамках Claude Max подписки есть какой-то ограниченный лимит токенов на Claude Design, но он быстро сгорает — большие проекты идут по API.

«Очень круто делает разные схемы. С картинками у него проблемы — со схемами это прямо кайф».
— Юля, штатный дизайнер проекта · 00:18:08
18:00

100 слайдов презентации — за 20 минут

Юля открывает презентацию вебинара (100+ слайдов). Рустам признаётся: «не сполукавлю — на 99,9% тексты и прототип остались неизменными, ровно как нейросеть сделала». Прототип был построен из материалов курса спикера и атомарных заметок (методика из второго занятия).

Слайды в их стилистике, со схемами, заголовками, чек-листами. Картинки подбирала Юля (через Pinterest — об этом ниже). Всё остальное — Claude Design в рамках их дизайн-системы. От идеи до 100 слайдов — 20 минут после того, как был создан скилл.

лайфхак · откуда брать изображения
«Картинки — это AI генерирует или откуда?» (вопрос из зала)
Юля: «Это не AI. Все картинки в нашей стилистике я ищу в Pinterest. AI — дополнительный расход на токены. В Pinterest вбиваешь "сладкая эстетика" и первые три картинки уже подходят к слайду. Поиск не занимает ничего». На вопрос «а как с авторскими правами?» — Юля: «никогда не беру фотографии с лицами людей. Бренды известные — замазываю либо в Nano Banana Pro прошу убрать надписи».
Это рабочая привычка штатного дизайнера, проверенная в реальных проектах. Не использовать AI там, где можно не использовать — экономия токенов и времени.
22:00

Claude Design — без длинной памяти, на свой страх и риск

Настя задаёт хороший вопрос про продакшн: «у Claude Design нет своей длинной базы знаний, как у Claude Code. Если аккаунт заблокируют — что?». Рустам признаёт прямо: «мы им пользуемся, на свой страх и риск того, что Claude может нас заблокировать. Это правда».

Митигация: сохраняй у себя все ТЗ и весь путь, как ты создавал дизайн-систему. Если аккаунт упадёт — повторить весь процесс на новом аккаунте займёт ~30 минут. Полная KB, как в Claude Code, тут не нужна.

27:25

Superpowers — визуализируй любую идею за минуту

Параллельно с Claude Design у тебя уже стоит скилл superpowers (с первого занятия). У него есть отдельный приём — визуализация любой схемы в три варианта прямо в VS Code, без перехода в десктопное приложение. Это то, чем Рустам собирает свои оргсхемы и диаграммы в стилистике интенсива.

⌨ Промпт через Superpowers · вербатим «Используй навык superpowers и визуализируй мне несколько вариантов карты моей системы, чтобы я по ней шёл послойно, степ-бай-степ. Дай три варианта.» → Получаешь три SVG-варианта, выбираешь нравящийся, докручиваешь. → Можешь попросить экспорт в Figma — дизайнер докрутит до финального.

То же работает и для лендингов: «сделай первый экран лендинга в трёх стилистиках» → три HTML-варианта → выбираешь Б → «давай докрутим стилистику + экспорт в Figma» → готово.

38:00

Эти конспект-страницы — собраны на Superpowers

Настя задаёт вопрос напрямую: «а сайт, на котором наши уроки размещены — это тоже он сделал?». Рустам подтверждает и раскрывает рецепт:

  • Не Claude Design, а Superpowers skill прямо в Claude Code.
  • Кидаешь агенту ссылку на YouTube-ролик урока, говоришь «свёрстай конспект, полностью мобильную и десктопную версию».
  • ~15 минут — лендинг готов в стилистике Claude. Без референсов, просто фразой «у меня интенсив про Claude Code, можешь просто в стилистике Claude это делать».

Деплой: у агента есть отдельный доступ выкладывать лендинги на домен. Рустам сам не помнит, как это настроил — «я просто сказал ему: мне нужно, чтобы ты это выложил на домене. Он сам сказал, что нажать». На сегодня всё работает: один промпт — новая страница на сайте.

«Мне не надо было ему никаких референсов давать или что-либо ещё объяснять с дизайном».
— Рустам, про вёрстку конспектов через Superpowers · 00:40:10
Каталог · 10 инструментов на май 2026

Слева — инструмент.
Справа — что получаешь.

Список, который Рустам передал участникам как материал для отправки в Claude Code. Фиолетовая метка ★ DEMOED — то, что разбирали в эфире вживую. Mock-визуализация — не реальный скриншот, а схематический образ выхода.

01
Anthropic · флагман · разобран в эфире

Claude Design

PDF, презентации, слайды — голосом из дизайн-системы.

Нативный продукт Anthropic. Запускается из десктопного приложения Claude. Создаёт дизайн-системы под задачу (PDF, презентации, лендинги), внутри каждой — преднастроенный промт со шрифтами, цветами, примерами слайдов. Себестоимость ~$1,5 за полностью свёрстанный PDF. Слабое место — фотографии (плохо размещает лица); сильное — схемы, типографика, чек-листы.

★ DEMOED Claude Max подписка ~$1,5/PDF на API
anthropic.com/news/claude-design
Структура занятия
Атомарные заметки
Баланс · PDF #14
02
skill в Claude Code · obra/superpowers · разобран в эфире

Superpowers skill

Лендинги, SVG-схемы, оргструктуры — прямо в VS Code.

Этот же скилл, который ты ставил на первом занятии. У него есть отдельная функция: визуализировать любую идею в 2–3 вариантах. Так Рустам собирает свои карты систем, оргсхемы, и — этими самыми recap-страницами, на которой ты сейчас находишься. От YouTube-ссылки до полностью свёрстанного лендинга (мобильная + десктопная) — 15 минут.

★ DEMOED Free · в подписке Claude SVG · HTML · Figma export
github.com/obra/superpowers
// промпт в Claude Code > используй superpowers и визуализируй оргструктуру в трёх вариантах // → 3 SVG-варианта в 60 сек // → выбрал → docrutil → done
03
Canva · MCP · упомянут Рустамом отдельно

Canva MCP

10 постов в Brand Kit одним промптом.

Прямой доступ к API Canva из Claude Code — генерация, edit, поиск по Brand Kit, экспорт в PDF/PNG/PPTX/MP4. С 2026 — Canva Design Model, foundation-модель с пониманием иерархии дизайна. Output — fully-layered editable файлы. У Canva прямая связка с Claude Design.

★ DEMOED MCP Canva Pro $14.99/мес
canva.dev/docs/mcp
claude → canva-mcp
> «сделай 10 stories в нашем Brand Kit на тему AI-Интенсив»
✓ 10 файлов готовы
→ canva.com/.../folder/intensive-may
04
Google · Gemini · пример MCP в эфире

Nano Banana 2

Генерация картинок через MCP — пример «розетки».

Native image gen в Gemini. Рустам разбирает его в эфире как канонический пример MCP-сервиса: ты сидишь в Claude Code, говоришь «сгенери картинку, вот ТЗ», Claude через MCP-провод идёт в Nano Banana, она генерит, результат возвращается тебе в окно Claude. Юля использует его, когда нужно убрать чужие надписи с фотографий из Pinterest.

★ DEMOED MCP API $0.04/img
deepmind.google/gemini
// MCP-связка в эфире [Claude Code] — твоё окно │ │ MCP-провод ▼ [Nano Banana Pro] ↳ генерит картинку │ ▼ возвращает [Claude Code] показывает результат
05
Figma · MCP-сервер · официальный

Figma Dev Mode MCP

Макет → React за 30 секунд.

Claude видит структуру Figma-файла — слои, auto-layout, варианты, токены. Не «угадывает по скриншоту», а читает реальные данные. С марта 2026 — двусторонний поток: код возвращается обратно в Figma слоями. В эфире Рустам подтверждает: для дизайна сайта достаточно загрузить скриншоты в Figma — этого хватит для работы.

MCP Figma Pro $15/мес Code Connect
help.figma.com
▾ Frame Header ▾ Pricing card Title Price CTA

→ read by MCP
→ output: React + Tailwind
06
Google Chrome · MCP · GA в Chrome 146

Chrome DevTools MCP

«Глаза» агента в браузере.

Claude открывает свой HTML в живом Chrome, видит DOM, console, network, screenshot. Замечает что кнопка плывёт → правит CSS → проверяет → итерирует сам. Главный unlock 2026 для AI-first frontend.

MCP Free · Open Source Auto-debug loop
github.com/ChromeDevTools/chrome-devtools-mcp
localhost:3000
→ DOM, Console, Network, Screenshot
⚠ position: absolute → overflow
→ правлю на flex...
✓ работает
07
shadcn · MCP · v4 (март 2026)

shadcn/ui MCP

«Добавь Dialog и Table» — голосом.

Прямой доступ к экосистеме shadcn. «Сделай dashboard с sidebar и data table» — за минуту готово, из официального registry. Built for you and your coding agents. 6000+ премиум-блоков в shadcn.io Pro.

MCP Free · MIT React / Next.js
ui.shadcn.com/docs/mcp
> claude: «dashboard с sidebar и data table» ✓ npx shadcn add sidebar +2 files ✓ npx shadcn add data-table +3 files ✓ npx shadcn add card button +2 files → Dashboard готов · 38s
08
Vercel · Standalone · лучший на рынке (9.5/10)

v0 by Vercel

«Pricing-page как у Stripe» → 30 сек.

Production-ready React + shadcn/ui + Tailwind из одного промпта. С 2026 — sandbox runtime, Git panel прямо в чате, DB-интеграции. Токен-billing: $0.30–2 за генерацию.

Free $5 кредитов Premium $20/мес React · Next.js
v0.app
v0.app
you
«pricing page как у Stripe, тёмная»
v0 →
генерирую… 3 components, 0.4 tok
✓ live preview готов
09
Google Labs · Standalone · бесплатно

Google Stitch 2.0

5 экранов мобилки за 3 минуты.

Преемник Galileo AI. Multi-screen generation (до 5 экранов сразу), AI-native infinite canvas, interactive prototyping. DESIGN.md natural language format — портируешь дизайн-систему как код. Выбор моделей Gemini 3.0/2.5.

БЕСПЛАТНО · 12 450 кред/мес DESIGN.md Multi-screen
stitch.withgoogle.com
Preview
10
21st.dev · MCP · «v0 в IDE»

Magic MCP

Команда /ui — компонент в проекте.

Сидит прямо в IDE (Cursor, Claude Code, VS Code). Команда /ui marquee из логотипов — 4 варианта, выбираешь лучший, файл встал в проект. Доступ к SVGL (тысячи логотипов брендов).

MCP Free tier Pro $20–30/мес
21st.dev/magic
> /ui marquee из логотипов клиентов → 4 варианта · выбери → [v1 ✓] · [v2] · [v3] · [v4] → marquee.tsx добавлен
АКТ II · ЧАС ВТОРОЙ

Доктрина:
скилы, MCP, мир скоро поменяется

Самый важный концептуальный блок интенсива. Разница между скилами и MCP. Главный тезис, который Рустам прямо попросил вынести отдельным блоком. Карта того, как ты сам будешь находить новое после интенсива.

41:00

Прежде чем уйти в философию — что такое скилы

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

Дальше — раскрытие, в чём фундаментальная разница со следующей концепцией (MCP).

42:00

Скилы vs MCP — фундаментальная разница

Это, по словам Рустама, «самое важное, что вы должны застолбить». Без этой разницы дальше путаница.

SKILL
Проторенная дорожка внутри твоей экосистемы

Это повторяющееся действие, которое агент знает, как делать у тебя в проекте. Запромчено заранее, лежит в ~/.claude/skills/. Скил живёт внутри твоего Claude.

  • Копирайтер пишет посты в твоём ToV
  • Superpowers — паттерны разработки
  • «Проверить мир на новости» — раз в неделю
MCP
Розетка к совершенно другой экосистеме

Это подключение к чужому сервису. У сервиса своя инфраструктура, свой кошелёк, свои возможности. MCP — это провод между твоим Claude Code и этой внешней системой.

  • Nano Banana Pro генерит картинки
  • Canva делает посты в Brand Kit
  • Figma отдаёт макет с токенами
«Скил — это просто то, что вы внутри своей экосистемы повторно выполняете. MCP — это вы подключились к совершенно другой экосистеме».
— Рустам, ключевое разграничение урока · 00:54:15
★ ключевой тезис · Рустам прямо попросил вынести

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

Самая частая ошибка после интенсива: пытаться построить новую систему «из головы». Рустам прямо в эфире сказал, что его Claude Code, который будет делать конспект из этого видео, «обязательно это выделит в отдельный тезис». Вот он.

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

Дальше — он возвращается со списком, ты выбираешь 3–5 скилов под установку, и только тогда начинаешь строить. Так ты строишь не «с нуля», а «на плечах сообщества». Это и есть остриё.

— Рустам, 01:37:22 · «обязательно выделит в отдельный тезис»
52:00

MCP как розетка — пример Nano Banana

Рустам берёт самый понятный пример. Nano Banana Pro — это большая AI-компания, отдельный сервис, генерирующий картинки и видео. У них своя инфраструктура, своя ценовая модель, свой роадмап. Через MCP ты, сидя в Claude Code, «подключаешься, как к розетке».

Ты пишешь Claude: «может, Nano Banana Pro сгенерировать мне картинку по такому-то ТЗ?». Claude по проводу идёт в Nano Banana, она выполняет внутри своего аккаунта (в рамках твоего кошелька там), возвращает результат тебе в окно Claude Code.

Это и есть отличие от скила: скил выполняет действие внутри твоей системы. MCP — это выход наружу и подключение чужого мозга к твоему процессу.

57:30

Любая сложная идея = правильная комбинация скилов и MCP

Рустам адресуется лично каждому участнику с примером, который раскрывает их потенциальные проекты.

  • Станиславу: «у тебя на домене — охренительно свизуализированная супердетальная аналитика, прошедшая через фильтры лучших AI-аналитиков. Главная страница: инсайты дня / недели / месяца». Это скилы для анализа + MCP-подключение к твоему GetCourse.
  • Насте: «контент-отдел, где Claude пишет посты И параллельно через MCP к Nano Banana генерит к ним картинки в нужных размерах для всех соцсетей, по себестоимости MCP-сервиса». Это скилы копирайтера + MCP к Nano Banana.
  • Ивану (YouTube-ниша): кейс с YouTuber'ом — он бросает исходник видео в папочку, и у него запускается цепочка из 6 агентов: монтаж, обложки, описания, SEO, загрузка на YouTube через MCP. Один человек, простой продакшн, готовый ролик с ссылкой на YouTube — всё автоматизировано.
«Любая ваша сложная идея — она реализуется в правильной комбинации скилов и MCP-сервисов. Моя задача — поселить вам в голову, что нужно искать».
— Рустам, формула финала · 00:56:31
1:01:00

Создай скилл «проверка мира» — раз в неделю

Самая прикладная рекомендация финала. Один раз прошёл с агентом процесс поиска новых MCP и скилов под твой проект — и сразу скрутил это в скилл.

в конспекте обязательно · автоматизация
Скилл: «Проверка мира на новые MCP и скилы»

Назови его, например, weekly-tools-scan. Один раз с агентом пройди процесс — какие источники, какие критерии релевантности, как глубоко копать. Дальше раз в неделю одна фраза:

«Посмотри, что новое пришло, и поделись со мной».

Агент идёт в интернет мультиагентно, возвращается с подборкой, ты прочитываешь, что-то ставишь, что-то игнорируешь. Регулярная проверка мира поставлена на автомат.

1:02:00

YouTube — где Рустам ищет новые скилы

Рустам делится своей привычкой: он смотрит англоязычные YouTube-каналы про Claude и регулярно ловит новые инструменты. Триггер — на обложках типа «новый инструмент, который убивает Nano Banana Pro в плане визуализации». Он не разбирается ручками. Он копирует ссылку, кидает своему Claude Code:

⌨ Как Рустам пробует новые инструменты с YouTube · вербатим «Посмотри это видео. Стоит ли нам попробовать этот инструмент? Проанализируй, посмотри в интернете, почитай отзывы и так далее.» → Claude возвращается через 1–3 минуты с вердиктом: «Рустам, разъёб Nano Banana Pro по простоте. Давай менять.» → или: «Это маркетинг — нам не подходит, есть лучше: X».
«Это таким образом эти новые штуки нахожу постоянно. Я вам как людям, которые Claude Code пользуются, очень сильно рекомендую эту привычку себе внедрить».
— Рустам, как остаться «на острие» после интенсива · 01:03:30

Стартовая подборка англоязычных каналов про Claude / AI-coding (финальный список Рустам докрутит — пока 5 проверенных направлений):

  • Matthew Berman — обзоры новых моделей и инструментов, ежедневно
  • AI Jason — глубокие воркфлоу с агентами и MCP
  • IndyDevDan — продакшн-сетапы Claude Code, скилы и хуки
  • Cole Medin — AI-инженерия от практика, MCP-сервера
  • AI Foundations — практические разборы инструментов
Стартовая установка

5 MCP, которые ставим сегодня

Каждый — одна команда в Claude Code. Скопировал → вставил → перезапустил Claude → готово. Это ядерный набор. С этими пятью ты уже можешь делать 80% задач из урока. Остальные доустановишь, когда конкретный кейс возникнет.

Chrome DevTools MCP

«Глаза» агента в браузере. Claude увидит свою вёрстку и сам её починит.

claude mcp add chrome-devtools \
  npx -- chrome-devtools-mcp@latest

shadcn/ui MCP

1000+ компонентов и блоков голосом. Если пишешь на React / Next.js — обязательно.

npx shadcn@latest mcp init \
  --client claude

Figma Dev Mode MCP

Figma → код через структуру файла. Авторизация через OAuth в Claude.

/mcp в Claude Code →
  выбрать figma → authenticate

Magic MCP (21st.dev)

«v0 прямо в IDE». Команда /ui генерит компонент за секунды.

claude mcp add magic \
  npx -- @21st-dev/magic@latest

Canva MCP

Финальный экспорт в брендовые материалы. 10 постов в Brand Kit одним промптом. Рустам отметил отдельно.

/mcp в Claude Code →
  Canva AI Connector → connect

Excalidraw MCP (бонус)

Архитектурные диаграммы прямо из чата. Альтернатива — Mermaid через Claude Code.

claude mcp add excalidraw \
  npx -- mcp-excalidraw@latest
Готовые сценарии

8 типичных запросов — 8 стеков

«Хочу X» → какие инструменты комбинировать → сколько это стоит. Бери карточку, повторяй у себя. Это и есть ответ на вопрос Насти «какой инструмент мне нужен».

📱
Пост для Instagram в брендовых цветах
Claude Code + Canva MCP → 10 постов в Brand Kit одним промптом
~ $35 / мес
🌐
Лендинг продукта
Superpowers в Claude Code → HTML + deploy. Или: v0 → Next.js. Или: Stitch 2.0 бесплатно.
$0 – 20 / мес
🎨
Дизайн-система для команды
Claude Design → DS-конфиг. Figma MCP + shadcn MCP для разработки.
~ $115 / мес
▶️
Превью YouTube видео
Claude → «hook». Nano Banana 2 → фон. Гипотезы обложек серией по 25.
~ $30 / мес
🎤
Слайды презентации
Claude Design → дизайн-система → 100 слайдов за 20 мин. Это сегодняшнее демо.
$20 / мес
📲
Прототип мобильного приложения
Stitch 2.0 бесплатно → 5 экранов → DESIGN.md → Claude Code → код.
$0 – 20 / мес
📄
PDF-материалы для клиентов
Claude Design → дизайн-система «PDF-конспекты» → ~$1,5 за лист.
$1,5 / лист
🏗️
Архитектурная схема системы
Superpowers в Claude Code → 3 SVG-варианта. Или Excalidraw MCP.
$0
Полный каталог · 20+ инструментов

Остальные инструменты,
которые заслуживают внимания

Это полный набор того, что Рустам собрал в подборку. В топ-10 не попало — значит, нишевое. Сортировка по категории. Бери таблицу, отдавай своему Claude Code, проси выбрать релевантные под твой проект.

Инструмент Категория Цена Free tier Ссылка
Bolt.newFull-stack AI$0 – $30да · 1M tok/деньbolt.new
Lovable.devFull-stack AI$0 – $100даlovable.dev
Cursor 3 (Design Mode)IDE-агент$0 – $40даcursor.com
Magic PatternsReact UI genот $19/месдаmagicpatterns.com
WonderAI canvas + MCPalpha · free creditsдаwonder.design
IdeogramImage · текст$0 – $42да · 10/деньideogram.ai
Recraft AIИллюстрации · иконки$0 – $80даrecraft.ai
Midjourney V7 / V8.1Image · концепт$10 – $120нетmidjourney.com
Flux 2 Pro / KontextImage · API$0.03–0.08/imgAPI onlybfl.ai
Krea AIRealtime sketch → render$0 – $35даkrea.ai
UizardWireframes$0 – $12+даuizard.io
Banani / VisilyUI gen для не-дизайнеровот $12/месдаbanani.co
GammaПрезентации AI$0 – $20даgamma.app
Framelink Figma MCPMCP · Figma altfree · MITдаframelink.ai
Penpot MCPMCP · open-source designfree · betaдаgithub.com/penpot
Builder.io MCPMCP · production codeот ~$24/месдаbuilder.io
Design Systems MCPMCP · DS rulesfree · OSSдаgithub.com/southleft
Replicate MCP / FAL MCPMCP · image gen APIpay-per-imageнетreplicate.com
Excalidraw MCP / MermaidMCP · диаграммыfreeдаgithub.com/yctimlin
tldraw Make RealWhiteboard + AIfree · MITдаmakereal.tldraw.com
Claude ArtifactsВстроено в Claude$0 – $20даclaude.ai
shadcn.io / ReUI / TailGridsБесплатные блокиfree / $99 lifetimeда · MITshadcn.io
Что выбрать тебе

Три стека · разные бюджеты

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

Минимум
$20/мес
  • Claude Pro $20 (Code, Artifacts, Design preview)
  • Chrome DevTools MCP · free
  • shadcn/ui MCP · free
  • Excalidraw MCP · free
  • Stitch 2.0 · free
Лендинги, дашборды, прототипы, диаграммы, мобильные мокапы.
Средний
~$100/мес
  • Минимум +
  • Figma Pro $15 + Dev Mode MCP
  • Canva Pro $14.99 + MCP
  • v0 Premium $20
  • Ideogram Plus $15 или Midjourney $30
  • Recraft Basic $12
+ Бренд-системы, рекламные баннеры, фотореалистичные ассеты, профессиональная типографика, презентации.
Профи
$300+/мес
  • Средний +
  • Claude Max $100 / $200
  • Cursor Business $40
  • Krea Pro $35
  • Lovable Launch $50
  • Builder.io ~$40
Всё. Production-pipeline, агентская студия, multi-screen apps, live-rendering, видеогенерация.
АКТ III · ЧАС ТРЕТИЙ · ФИНАЛ

Полярная звезда,
и как тебе с ней жить

После перерыва — самый философский, но самый прикладной блок. Компакт + commit (не теряй память). Decision Log (летопись решений). Полярная звезда — описать идеальный финал. Workspace на проект. И — закрытие пятиступенчатыми рефлексиями участников.

1:22:50

Компакт + commit — не теряй память

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

в конспекте обязательно · ⚠⚠⚠ критично
Перед компактом — всегда зафиксируй контекст в файлах

Если ты позволишь Claude сделать автокомпакт без фиксации — он сожмёт свой контекст и потеряет тот кусок памяти, который сократил. Вечная память не обновится. Дальше ты обнаруживаешь, что важные решения, ТЗ, обсуждения — забыты.

Правильный порядок: увидел кружочек > 50% → отправил промт ниже → дождался подтверждения от Claude → только потом нажал на компакт.

⌨ Промпт перед компактом · вербатим «Закомить то, что мы с тобой обсудили во всех деталях. Зафиксируй это в наших файлах. После чего я сделаю компакт.»

Claude всё, что было в диалоге — решения, задачи, контекст — сохранит в постоянные файлы. Подтвердит, что зафиксировал. Тогда жмёшь компакт. Память сохранена.

1:26:00

Decision Log — летопись решений в проекте

Если ты разрабатываешь что-то большое — LMS, мобильное приложение, торгового бота — простой CLAUDE.md не покрывает всё. Нужна летопись принятых решений с обоснованиями.

в конспекте обязательно · для кодовых проектов
Добавь Decision Log в CLAUDE.md

Скажи агенту: «фиксируй все наши принятые решения всегда — хронологически, почему было принято и когда». Спустя 2 недели ты уже не вспомнишь, почему выбрал именно этот MCP-сервис или почему отказался от той гипотезы. Система — вспомнит.

Когда ты захочешь совершить действие, противоречащее предыдущему решению — Claude тебя предупредит. Это твоя страховка от хождения по кругу.

«Вы спустя две недели абсолютно уже не помните об этом решении и об этом действии — а система будет помнить».
— Рустам, про Decision Log в разработке · 01:27:05
★ закрывающая доктрина · North Star

Полярная звезда —
опиши идеальный финал своего проекта.

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

У Рустама это звучит так: «в нашей компании весь ручной труд больше не делается людьми. Только топ-команды, использующие нейросети в каждом отделе. Нет необходимости нанимать сотрудников — мы домасштабируем процесс нейросетями. У меня есть доступ ко всем материалам каждого. Система стабильна — Firewall, SSL, ограниченный whitelist. Контент делается из стартового YouTube-ролика. По кнопке "спланировать следующий месяц" — система собирает гипотезу запуска и обоснование».

Это не описание грёзы. Это файл «полярная звезда» в проекте, на который ты сверяешься каждую неделю. Дальше — пять шагов по этому файлу к жизни. См. чертёж ниже.

— Рустам, 01:27:30 → 01:35:00 · доктрина North Star
1:35:00

Смелость завайбкодить, характер довести до конца

Самая ёмкая формула финала. Рустам приводит её на собственном опыте торгового бота — он 2 месяца ничего не вайпкодил, кроме него. Всё, что вы за интенсив узнали (GitHub, Obsidian, VPS, Superpowers, MCP), он сам узнавал на пути к одной конкретной цели — рабочему боту на криптовалютном рынке.

«Чтобы начать вайпкодить и внедрять в свой бизнес — нужна смелость. Но чтобы то, что ты вайпкодишь, внедрилось — нужен характер. Характер закончить до конца и не переступать на другие идеи».
— Рустам, формула финала · 01:33:08

Параллельность убивает результат. Если ты одновременно подключаешь GetCourse, делаешь сценарий YouTube, чинишь Bitrix, строишь систему аналитики — ни один процесс не доводится. Лучше хронология: один проект до конца → следующий.

Гипотезы и параллельные идеи — не выбрасывай. Сделай отдельный VS Code пространство только для экспериментов. Там играешься. К проекту это никакого отношения не имеет. Раз в месяц с командой пересматриваешь — что докрутить в основной маршрут, что отпустить.

1:36:40

Workspace на проект — Settings → Profiles

Станислав задаёт ключевой архитектурный вопрос: «как у тебя инфраструктурно организовано в VS Code?». Рустам показывает живьём.

в конспекте обязательно · архитектура
Отдельный VS Code workspace на каждый проект

В VS Code: Settings → Profiles → Create. Каждый workspace = отдельная папка проекта на компьютере, со своим CLAUDE.md, своими настройками, своими правилами, своим Decision Log.

У Рустама три рабочих пространства:

  • Личный ассистент — здесь все гипотезы, мысли, идеи, которые не связаны с конкретным проектом. Это «думалка».
  • Торговый бот (ECHO) — отдельный CLAUDE.md, отдельные правила, отдельная цель.
  • Школа здоровья «Баланс» — то же самое для второго бизнеса.

Каждый чат внутри workspace — отдельная тема разговора. Создавать их можно бесконечно. Каждый автоматически подгружает CLAUDE.md этого пространства.

Когда гипотеза в «личном ассистенте» превращается в проект — делается отдельная папочка, отдельный CLAUDE.md, отдельный workspace. «Отпочковываешь» проект от ассистента и работаешь с ним только в выделенном пространстве.

вопрос Ивана · вкладки vs workspace
«Это как в браузере — открываешь новую вкладку под тему и обсуждаешь?»
Рустам: «Абсолютно верно. Чат в Claude Code = вкладка в браузере. Workspace = отдельный браузер для отдельного бизнеса».
1:43:00

Делиться проектом с командой — через GitHub

Иван спрашивает: «как делиться проектом с сотрудниками — не через свою учётку, а в рамках проекта?». Рустам разворачивает: информация в папке проекта должна быть в облаке (GitHub) и синхронизироваться с локальными папками у каждого члена команды.

Архитектурно:

  • У тебя — локальная папочка с проектом + GitHub-репозиторий (private).
  • У каждого члена команды — локальная папочка с тем же репозиторием на их компьютере.
  • В CLAUDE.md инструкция агенту: «если в папке что-то меняется — push на GitHub».
  • Все три (или больше) локальные копии всегда синхронизированы через облако.

Рустам честно говорит: «у меня на практике этой необходимости не было — гипотеза. Возможно, можно сделать лучше. Обсуди со своим агентом». Это и есть рабочий приём: не знаешь точно — отдай агенту найти оптимальный способ.

1:44:00

Бот-логи и интеграция Claude с GPT через MCP

Два коротких прикладных вопроса:

вопрос · бот-логи
«Где смотрим, что вписывают другие люди в наш бот?»
Рустам: «Это же твой бот. В Claude Code своему агенту скажи: "пришли, пожалуйста, что писали боту за сегодня". Или: "конкретный пользователь — дай id". Он выгрузит и отдаст».
вопрос · кросс-AI интеграция
«Можно сказать Claude: пойди в GPT, сгенери картинку и пришли? Они дружат?»
Рустам: «GPT в данном случае будет MCP-сервисом, если у них есть прямая интеграция. Скажи Claude напрямую: "я с GPT генерирую картинку вот так, я хочу делать это через тебя. Как мы можем это сделать?" Он предложит варианты».

⚠ Важно: «обязательно добавь, чтобы он пошёл в интернет искать это решение, а не сам тебе из шаблона выдавал — он отстаёт на полгода». Это та же история, что и с поиском скилов.
На сегодня (2026) у Claude нет официального MCP для OpenAI image-gen — выход через сторонние мосты типа Replicate/FAL.
Чертёж · по доктрине Полярной звезды

Как ты строишь свой первый
AI-проект

Пять фаз. От пустого пространства в VS Code до работающей системы. Это компас, по которому Рустам собирал свой торговый бот ECHO. По этой же дороге ты собираешь свой первый проект после интенсива.

5 фаз один проект до конца одно действие в неделю на роль 1 ★ ключевой тезис
Фаза 1

Опиши Полярную звезду

~1 вечер · с агентом в личном workspace
01
~1 час

Опиши идеальный финал — максимально детально

Открываешь свой личный workspace (не workspace проекта — там пока ничего нет). Говоришь Claude: «помоги мне описать идеальное состояние моего бизнеса после внедрения AI». Он задаёт уточняющие вопросы. Ты отвечаешь подробно: что делает система, как ты в ней участвуешь, что больше не делается руками, какая нет необходимости в наёмных людях, какие риски закрыты, какие отчёты ты видишь.

⌨ Стартовый промпт «Помоги мне описать Полярную звезду моего проекта. Это самый идеальный финал — состояние, при котором операционно мне в системе участвовать уже не нужно. Задавай уточняющие вопросы. По итогу сохрани файл polar-star.md в этом workspace.»

Зачем: дальше каждое решение в проекте сверяется с этим файлом. Без него ты будешь брать новые идеи, которые шире, чем нужно. С ним — режешь лишнее.

Фаза 2

Поручи Клоду найти скилы и MCP ★

~1 вечер · в новом workspace проекта
02
~30 мин

Создай отдельный workspace под проект

VS Code → Settings → Profiles → Create. Назови по бизнесу (например, echo-trading-bot). Здесь будет только этот проект. Никакого личного ассистента. Никаких параллельных гипотез.

03
~30 мин

★ Мультиагентный поиск скилов и MCP

Главный тезис всего урока — буквально. Не строй ничего, пока агент не вернётся со списком готовых скилов и MCP под твою задачу.

⌨ Промпт для мультиагентного поиска · вербатим «Твоя задача — прежде чем приступать к этому проекту, пойти в интернет мультиагентно. Создай несколько агентов, которые будут искать публичные, проверенные, крутые скилы и MCP-сервисы, которые помогут нам в выполнении нашей задачи. Расскажи мне, что ты нашёл — мы вместе выберем, какие установим.»

Зачем: ты строишь не «с нуля», а на плечах сообщества. Готовые скилы могут сэкономить тебе 2–4 недели работы. Без этого шага ты изобретаешь велосипед.

Фаза 3

CLAUDE.md (≤100 строк) + Decision Log

~30 минут · фундамент проекта
04
~15 мин

Создай CLAUDE.md из шаблона

Возьми шаблон CLAUDE.md из этой страницы. Отдай агенту. Ответь на 5–10 уточняющих вопросов. Получишь готовый CLAUDE.md.

Контроль: ≤ 100 строк. Раз в неделю проверяй размер; если разрослось — отдай команду на сжатие.

05
~5 мин

Добавь Decision Log

В CLAUDE.md укажи: «фиксируй в decision-log.md все принятые решения хронологически — с обоснованием почему и когда». Дальше каждое значимое решение (выбор MCP-сервиса, отказ от гипотезы, замена компонента) попадает туда автоматически.

Через 2 недели ты не вспомнишь — а летопись вспомнит. И Claude предупредит, если ты собираешься нарушить предыдущее решение.

Фаза 4

Иди степ-бай-степ · один проект до конца

недели – месяцы · смелость и характер
06
еженедельно

Раздели Полярную звезду на роли + одно действие в неделю

Каждая роль в твоей системе (контент, продажи, аналитика, поддержка) = ответственный агент или функция. На каждую роль — одно ключевое действие в неделю в рамках её трека. Параллельность убивает.

Если у тебя одновременно идёт 5–10 хедерских задач — не закончится ни одна. Лучше: «сегодня вся неделя посвящена контент-роли», следующая — продажи.

07
по факту

Доводи до конца. Параллельные идеи — в отдельный песочный workspace

Когда возникает новая идея, не связанная с текущей задачей — не лезь в проектный workspace. Заведи себе отдельный «песочный» VS Code только для экспериментов. Там играешься без последствий. Раз в месяц с командой пересматриваешь — что докрутить в основной маршрут.

формула на каждый день Смелость завайбкодить. Характер довести до конца.
Фаза 5

Раз в неделю — Compact + ревизия + проверка мира

~30 минут / неделя · ритуал
08
по чату

Compact + commit — каждый раз, как кружочек > половины

Промпт «закомить, зафиксируй в файлах, после чего я сделаю компакт». Дождись подтверждения. Тогда жми. Иначе теряешь память.

09
~10 мин/нед

Скилл «проверка мира на новые MCP и скилы»

Один раз настроил → дальше раз в неделю: «посмотри, что новое пришло, и поделись со мной». Подборка приходит сама. Ставишь то, что релевантно.

10
раз в 2 недели

Ревизия гипотез из песочного workspace

Раз в две недели с командой садись и пересматривай эксперименты. Что можно докрутить в основной маршрут? Что отпустить? Полярную звезду — пересмотреть не чаще раза в месяц-два.

Итог чертежа
Полярная звезда сверху. Скилы и MCP — с плеч сообщества. CLAUDE.md ≤100 строк. Decision Log как страховка. Workspace на проект. Один проект до конца. Раз в неделю — проверка мира и компакт.
Вопросы, не привязанные к практике

Общие вопросы
из зала

Эти вопросы участники задавали в эфире, и они полезны как самостоятельные ответы — для тех, кто будет смотреть запись.

0:23Чем Claude Design лучше GPT, который генерирует изображения?

Рустам честно говорит, что не сравнивал в лоб. Сильные стороны Claude Design: стилистическая консистентность на большом объёме (100 слайдов в одном стиле, 20 PDF подряд) и дизайн-системы как переиспользуемый артефакт. В рамках Claude Max часть токенов даётся бесплатно.

GPT сильнее в одиночных «придумай красивую картинку», но не держит цельный визуальный язык на большой объём материалов. Если тебе нужна школа выпускать 50 единиц контента в стилистике бренда — Claude Design. Если одна обложка — GPT/Nano Banana.

0:24Какие исходники Claude Design принимает? И что с авторскими правами?

Принимает: Figma-файлы, PDF, PPTX. Для дизайна сайта — достаточно загрузить скриншоты в Figma, ему этого хватит для работы.

Про права (от Юли): «никогда не беру фотографии с лицами людей». Бренды известные — замазываю либо иду в Nano Banana Pro и прошу убрать надписи с этой картинки. Это рабочая привычка штатного дизайнера, проверенная в реальных проектах.

1:04Можно сделать паузу на 2 недели и встретиться снова с вопросами?

Идея Ивана и Станислава: после интенсива дать 1–2 недели на вайпкодинг руками, потом встретиться отдельно. К этому моменту у участников будут конкретные грабли, на которых они застряли. Рустам соглашается: «прикольный трек».

Станислав уточняет формат: «мне не хватает двух типов задач — must-do (обязательные интеграции, бот, инициация) и навыки второго порядка (Superpowers, MCP, кроны регулярных действий для культуры работы)». Рустам берёт это в работу.

1:46Как устроены многоагентные команды? Кто-то главный?

Да, это называется оркестратор (orchestrator). Это агент, который видит все направления и распределяет задачи между специализированными агентами. Под ним: маркетинг, контент, продажи, аналитика. Сбоку: ревьюверы, которые проверяют качество.

Это не «один большой Claude всё умеет». Это структура реальной команды — каждый узкий специалист, оркестратор дирижирует. Так масштабируется туда, куда штатной командой не дотянуться.

1:50Как делиться проектом с командой? Доступ через что?

Через приватный GitHub-репозиторий. Каждый член команды клонит репозиторий на свой компьютер, и в CLAUDE.md инструкция агенту: «если в папке что-то меняется — push на GitHub». Все локальные копии синкаются через облако.

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

0:51Google-инструменты — сложно интегрировать?

Да, у Google интеграции прямые — но «я сам не сразу разобрался. Это всё решаемо. Возможно, я отдельно видео запишу инструкцию, как с любыми Google-инструментами связываться. Cden... консоль Google — прямо сложно».

Если у тебя задача с Google API (Sheets, Drive, Calendar) — отдай Claude в первую очередь именно это: «найди мне MCP-сервис или скилл для подключения Google X». Через сторонние MCP-провайдеры (Composio, Pipedream) подключение проще, чем напрямую через Google Cloud Console.

2:03Финальная инициация — это первая платная программа Рустама про AI?

Да. Рустам открыто фиксирует: «это была моя первая программа платная по этому вопросу. Я очень рад, что мы её завершили успешно. Нужна была смелость, чтобы её придумать. Нужен был характер, чтобы её закончить до конца».

Дальше будут новые офферы, новые форматы. Сейчас идея — собрать всё в виде готового курса с чек-листами и ответами на все вопросы. Этот интенсив для Рустама — процесс «вытаскивания контента из головы», как было с YouTube-интенсивами в прошлом.

Закрытие · рефлексия участников

5 стадий принятия AI

Станислав в финале сформулировал свою траекторию входа в нейросетевой мир за полтора месяца. Получились пять стадий, которые повторяются у всех. Это закрывающий каркас интенсива — как стадии Кюблер-Росс, но для AI.

01 · Инициация
Это вообще возможно
«У меня была AI как потенция, как мечта. И тут раз — я вижу, что это не просто возможно, а уже реализовано в моей жизни. Событие, которое разделяет жизнь до и после».
02 · Техника
Я с этим справлюсь
«Преодоление выученной беспомощности — убеждения, что технически я в этом слаб. Это не для других людей. Я тоже могу руками собрать и запустить».
03 · Возможности
Можно мечтать крупно
«Расширение представления о возможном. AI — это джинн. Ставишь ему задачу — он её решает. Можно мечтать по-крупному и крепко мечтать».
04 · Язык
Меняется речь
«Сильно меняется язык и коммуникация с окружающими. Я обнаружил, что нейросеть меня газлайтит так же, как люди — и понял, что надо менять свой язык. Изменение языка под AI = изменение мышления».
05 · Структура
Полярная звезда — чтобы не утонуть
«Эта система за меня всё равно не примет решения. Только мои решения и выстраивание структуры этой полярной звезды позволяет не утонуть в процессах».

«Мы не прощаемся в рамках темы нейросетей. Я тут далеко с этой штуки топаю. Точно будут новые офферы, новые форматы. Вы были инициаторами меня в рамках моей ролевой модели как человека, который обучает нейросетям. Это была моя первая программа платная по этому вопросу. Нужна была смелость, чтобы её придумать, нужен был характер, чтобы её завершить до конца. Как будто бы получилось. Спасибо всем.» — Рустам, подпись финала · 02:03:14