← Руководства Предпросмотр: Claude Design — всё... ЛУЧШАЯ БЕСПЛАТНАЯ альтернатива Claude Design (без ограничений и с открытым кодом)
Руководства

Claude Design — всё... ЛУЧШАЯ БЕСПЛАТНАЯ альтернатива Claude Design (без ограничений и с открытым кодом)

Настройте Open Design и управляйте им через Gemini CLI, чтобы высокоточная генерация дизайна с помощью ИИ работала на бесплатном тарифе Gemini — рабочее пространство с открытым кодом и приоритетом локальной работы, которым можно пользоваться, не платя за агента.

Sandeep Singh 11 мая 2026 г. 11:04 YouTube ↗

Это руководство показывает, как запустить Open Design с Gemini CLI в роли агента, управляющего генерацией, — чтобы прототипы, лендинги и интерфейсы выходили из одного рабочего пространства, опираясь при этом на щедрый бесплатный тариф Gemini. Оно повторяет путь, который проходит Sandeep Singh в своём практическом разборе, переписанный и обновлённый под текущий релиз. Посмотрите видео выше для живой версии или читайте дальше.

Главное здесь — вопрос стоимости. Сам Open Design бесплатен и имеет открытый код; единственное, за что вы «платите», — это агент и модель, которые вы приносите с собой. Подключите Gemini CLI, авторизуйтесь через аккаунт Google, и этот счёт фактически обнуляется.

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

Что такое Open Design?

Open Design — это платформа для дизайна с открытым кодом и приоритетом локальной работы, которая работает поверх агента для написания кода, которым вы уже пользуетесь, а не привязывает вас к одному поставщику моделей. Это подход «приноси своего агента»: Claude Code, Codex, Cursor, Gemini, GitHub Copilot, OpenCode и более 21 других — каждый может управлять генерацией. Вы выбираете агента, а Open Design берёт на себя поверхность дизайна.

Несколько вещей, ради которых на него стоит взглянуть:

  • Открытый код, Apache-2.0 — клонируйте его, разверните у себя, прочитайте каждую строчку.
  • Работает локально — ваши проекты живут в папках на вашей собственной машине, а не в чужом облаке.
  • Подключаемые агенты — поддерживается более 21 агента для написания кода, включая Gemini CLI; вы выбираете, какой из них управляет генерацией.
  • Больше, чем прототипы — прототипы, живые артефакты, презентации, журнальные макеты, генерация изображений и даже видео — всё из одного рабочего пространства.
  • Встроенные точки старта — фирменные дизайн-системы и шаблоны идут в комплекте, так что вы никогда не остаётесь перед пустым холстом.

Он хорош сам по себе: локальное рабочее пространство для дизайна, не зависящее от конкретной модели. А то, что он идеально сочетается с бесплатным агентом вроде Gemini CLI, — это бонус, который делает его по-настоящему бесплатным в использовании.

Перед началом

Установить Open Design можно тремя способами. Выберите тот, что подходит вам:

СпособКому подходитТребования
Десктопное приложениеБольшинству — ноль настроекНикаких. Просто скачайте и откройте.
Запуск из исходниковРазработчикам, которые хотят читать или менять кодNode ~24, pnpm 10.33.x
Установка в вашего агентаТем, кто живёт в терминалеУже установленная CLI агента для написания кода

Десктопное приложение — рекомендуемый путь на сегодня: ни Node, ни pnpm, ни клонирования. Sandeep скачивает установщик под свою платформу (.dmg на macOS, setup.exe на Windows) прямо из последнего релиза.

Шаг 1 — Установить Open Design

Зайдите на open-design.ai и нажмите Download desktop. Сборки доступны для macOS (Apple Silicon и Intel), Windows (x64) и Linux (AppImage). После установки приложение автоматически обнаруживает все CLI агентов для написания кода, уже имеющиеся в вашем PATH, и подгружает за вас встроенные скиллы и дизайн-системы. При первом запуске вы попадаете на экран подключения, где выбираете локальную CLI или вставляете свой собственный ключ API.

Вариант B — Запуск из исходников

Если вы предпочитаете запускать его из репозитория, вам понадобится лишь несколько команд:

git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable && pnpm install
pnpm tools-dev run web

Затем откройте локальный URL, который он выведет, — порт назначается динамически, поэтому используйте тот адрес, что появится в вашем терминале, а не фиксированный. Вам понадобятся Node ~24 и pnpm 10.33.x; Corepack сам выберет для вас закреплённую версию pnpm.

Вариант C — Установка в вашего агента для написания кода

Чтобы использовать Open Design, ни разу не открывая графический интерфейс — вызывая его как скилл или MCP-сервер внутри вашего агента, — выполните:

od mcp install <agent>
# <agent> = gemini | claude | codex | cursor | copilot | opencode | …

Затем внутри агента просто попросите: Use open-design to generate a landing page with a modern minimal design system.

Подключение Gemini CLI в качестве агента

Это тот самый шаг, который делает рабочий процесс бесплатным. Open Design не поставляется с собственной моделью — он управляет той CLI, на которую вы его направите, — так что вы приносите Gemini CLI и даёте его бесплатному тарифу делать работу.

Почему Gemini CLI? Две причины, как формулирует Sandeep: модели Gemini держат уровень на фоне остальных, а бесплатный тариф щедрый. Войдите через аккаунт Google — и получите большой лимит ежедневных запросов бесплатно; у ключа API Gemini бесплатный лимит меньше. Для устойчивой работы над дизайном стоит выбирать вход через аккаунт Google.

  1. Установите Gemini CLI. Следуйте команде установки на домашней странице Gemini CLI (Homebrew на macOS и Linux или документированный установщик в остальных случаях). Подойдёт любой терминал.
  2. Запустите gemini и авторизуйтесь. Запустите его, при запросе доверьте рабочую папку, затем выберите Sign in with Google. Откроется браузер для входа в Google в два клика и сообщит об успехе. Перезапустите Gemini CLI; вы должны увидеть активную модель и 0% использованной квоты.
  3. Направьте Open Design на него. Перезапустите Open Design и откройте Settings. Gemini CLI теперь отображается как доступный агент — выберите его, нажмите Test the connection, и в ответ вы должны получить OK. Сохраните — и можно приступать к дизайну.

Здесь же вы можете вставить собственный ключ API вместо использования локальной CLI и добавить отдельные ключи для моделей изображений, видео и аудио, если позже захотите генерировать медиа. Однако для бесплатной работы над дизайном с ощущением безлимита достаточно входа через Gemini CLI. Всё в Settings можно изменить позже, так что в первый раз держите всё простым.

Знакомство с рабочим пространством

Open Design организует вашу работу по проектам: каждый проект живёт в собственной папке, и смена папки означает смену проекта. Внутри проекта можно создавать прототипы, живые артефакты, презентации, изображения и даже видео и аудио — не только интерфейсы.

Встроенная библиотека дизайн-систем. Библиотека дизайн-систем — фирменные точки старта, которые можно просмотреть и встроить в любой проект.

Встроенная библиотека дизайн-систем даёт вам фирменные точки старта для предпросмотра и повторного использования, так что вы не застреваете на определении токенов, прежде чем сможете начать. Вы также можете принести собственную дизайн-систему, импортировать существующий проект Claude Design или начать с нуля и позволить Open Design вывести разумные значения по умолчанию.

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

Библиотека шаблонов выходит за рамки фирменных систем — к прототипам, презентациям и генерации как изображений, так и видео. Фильтруйте по типу и форкните любой как точку старта. Прежде чем что-либо устанавливать, вы можете просмотреть полную библиотеку плагинов в вебе по адресу open-design.ai/plugins.

Создайте что-нибудь

С подключённым Gemini CLI процесс создания тот же, что Sandeep показывает в видео:

  1. Создайте проект. Назовите его, выберите дизайн-систему, подходящую под нужный вид, и выберите High fidelity, чтобы видеть реальный результат, а не вайрфрейм.
  2. Напишите бриф. Вместо одного из предложенных промптов опишите, чего вы хотите, — Sandeep просит лендинг. Вы также можете прикрепить скриншот понравившегося макета и попросить Open Design следовать этой теме.
  3. Ответьте на уточняющие вопросы. Агент задаёт толковые встречные вопросы: один лендинг или лендинг плюс страница тарифов, адаптивная поверхность, для кого это, визуальный тон (Sandeep выбирает современную, минималистичную атмосферу в духе Linear/Vercel) и любые фирменные цвета или шрифты. Поля можно оставить пустыми или позволить ему выбрать направление за вас.
  4. Выберите визуальное направление и сгенерируйте. Выберите одно из предложенных направлений, отправьте — и спустя несколько секунд появляется стилизованный лендинг с теми секциями, что вы запросили.
  5. Итерируйте промптами. Хотите заменить логотип, добавить недостающую иконку или расширить FAQ? Просто опишите изменение и отправьте. Если правка что-то сбивает, следующий промпт возвращает всё на место.

Когда результат вас устроит, откройте файлы дизайна, изучите исходный код, при желании отредактируйте слои вручную, а затем экспортируйте — в PDF, PPTX, сжатый пакет или с деплоем на Vercel.

Бесплатность здесь настоящая: Sandeep строит два прототипа с несколькими итерациями и, проверяя затем своё потребление Gemini, тратит лишь около 2% своего дневного лимита. С большим дневным лимитом, обновляющимся каждый день, вы можете заниматься дизайном почти непрерывно, не следя за счётчиком.

Советы

  • Входите в Gemini CLI через аккаунт Google, а не по ключу API — ежедневный бесплатный лимит значительно больше, и именно это делает этот рабочий процесс по-настоящему бесплатным.
  • Начинайте с высокой точности (high fidelity), когда хотите оценить реальный дизайн; переходите к вайрфрейму только для быстрого наброска структуры.
  • Проверяйте своё потребление командой stats в Gemini CLI, чтобы увидеть, насколько мало на самом деле стоит работа над дизайном по сравнению с вашим дневным лимитом.
  • Ваши дизайны остаются вместе с папкой проекта — организуйте работу, запуская Open Design в нужной директории.
  • Чтобы начать, дизайн-система не нужна. Начните со встроенной, импортируйте проект Claude Design или позвольте Open Design вывести значения по умолчанию.

Частые вопросы

Это действительно бесплатно? По сути, да. Open Design имеет открытый код под лицензией Apache-2.0, поэтому само программное обеспечение ничего не стоит. Единственные расходы — это агент и модель, которые вы приносите с собой, а с Gemini CLI, авторизованным через аккаунт Google, вы черпаете из большого ежедневного бесплатного лимита. В видео два прототипа плюс итерации израсходовали примерно 2% дневной квоты, которая обновляется ежедневно.

Какие агенты для написания кода он поддерживает? Более 21 агента, включая Gemini, Claude Code, Codex, Cursor, GitHub Copilot и OpenCode. Open Design обнаруживает уже установленные на вашей машине CLI и позволяет выбрать одну из них в качестве агента по умолчанию.

Обязательно ли использовать Gemini CLI? Нет. Gemini CLI — это путь к бесплатной настройке с высокой квотой, но вы можете подключить любого поддерживаемого агента или вставить собственный ключ API для агента либо для моделей изображений, видео и аудио.

Нужна ли мне дизайн-система, прежде чем я смогу начать? Нет. Open Design поставляется с фирменными дизайн-системами и шаблонами в качестве точек старта, а вы можете импортировать существующую дизайн-систему или позволить ему вывести разумные значения по умолчанию.


Это письменное руководство основано на практическом разборе Sandeep Singh. Посмотрите полное видео выше и подпишитесь на Sandeep Singh, чтобы получать больше практических руководств по ИИ-инструментам.