Обзор модуля
Граница между дизайнером и разработчиком стёрлась. Vibe coding — «Слово года» по версии Collins Dictionary — превратился из хайпа в рабочий метод. Cursor, Lovable, Bolt, v0 позволяют дизайнеру создавать работающие интерфейсы через описание на естественном языке.
За 1.5 часа вы разберётесь в новой реальности веб-дизайна, составите личную карту инструментов и поймёте, что из этого доступно из России.
Уровень: Для начинающих (программирование не требуется) Время: ~1.5 часа Предварительные знания: Базовое понимание веб-дизайна
Чему вы научитесь
[+] Понимать концепцию vibe coding и почему она изменила индустрию [+] Видеть роль design engineer и как к ней двигаться [+] Ориентироваться в экосистеме AI-инструментов для веб-дизайна [+] Знать, какие инструменты работают из России без VPN [+] Использовать arckep.ru для доступа к AI-моделям за рубли [+] Выбирать бесплатные альтернативы платным инструментам
Содержание модуля
Модуль состоит из 3 уроков: от концепции к практической карте инструментов.
Урок 1: Vibe coding и дизайнер нового типа
25 мин | Открыть урок
Что такое vibe coding, как он эволюционировал от поста Карпати до «Слова года». Новая роль design engineer — дизайнер, который создаёт работающие интерфейсы через AI.
Ключевые темы:
- Vibe coding — от термина Карпати (2025) до зрелого метода (2026)
- Три уровня: прототип, продакшен, сложная система
- Design engineer: дизайн + код + AI в одном человеке
- Cursor, Lovable, Bolt, v0 — как они работают
Урок 2: Инструменты веб-дизайнера
20 мин | Открыть урок
Обзор экосистемы: дизайн-системы с AI, генераторы сайтов, UX-инструменты. Что бесплатно, что платно, что лучше для какой задачи.
Ключевые темы:
- Figma AI, Framer, Webflow — классика с AI-функциями
- v0, Bolt, Lovable, Cursor — генерация сайтов из промпта
- UX-инструменты: Attention Insight, Hotjar, Maze AI
- Наборы инструментов: фрилансер, студия, продуктовая команда
Урок 3: Доступность из России
20 мин | Открыть урок
Практический гайд: что работает без VPN, как платить за зарубежные сервисы. arckep.ru — конкретные модели и цены в рублях.
Ключевые темы:
- Карта доступности: работает / нужна карта / заблокировано
- arckep.ru — модели для дизайнера: изображения, видео, 3D
- Конкретные модели и цены в рублях
- Бесплатные альтернативы для каждой категории
Практика модуля
После прохождения всех 3 уроков:
- Первый vibe coding — сгенерируйте простую страницу через Bolt или Lovable
- Личная карта инструментов — отметьте, какие инструменты доступны вам прямо сейчас
- Тест arckep.ru — сгенерируйте изображение через Nano Banana Pro на стартовый баланс
Часто задаваемые вопросы
Vibe coding заменит традиционную разработку? Нет. Vibe coding отлично работает для прототипов, лендингов и простых приложений. Сложные системы по-прежнему требуют инженерного подхода. Но для 80% задач дизайнера этого достаточно.
Нужно ли дизайнеру учить код? Не обязательно. Vibe coding позволяет создавать интерфейсы через описание на естественном языке. Но базовое понимание HTML/CSS поможет точнее формулировать запросы и проверять результат.
Что делать, если нужный инструмент заблокирован? Три варианта: VPN, arckep.ru для AI-моделей, или бесплатная альтернатива. Подробная карта — в уроке 3.