Figma Design System Builder
warpdotdev/warp
Builds or updates a design system in Figma from a codebase in ordered phases: discovery, variables and tokens, components, theming and documentation, with checkpoints.
Создаёт несколько вариантов дизайна 2D-поверхности (лендинг, герой, обложка, слайды): свой визуальный референс и автор на вариант, полный design.md с UTC/SHA-256 до кода, проверка в браузере…
$ npx skills add serejaris/personal-corp-os --skill make-landing -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install serejaris/personal-corp-os make-landing --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/serejaris/personal-corp-os.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/make-landing .claude/skills/make-landing && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "make-landing" agent skill from https://github.com/serejaris/personal-corp-os/tree/main/skills/make-landing into .claude/skills/make-landing/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "make-landing", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/serejaris/personal-corp-os/tree/main/skills/make-landingType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add serejaris/personal-corp-os --skill make-landing -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install serejaris/personal-corp-os make-landing --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/serejaris/personal-corp-os.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/make-landing .agents/skills/make-landing && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "make-landing" agent skill from https://github.com/serejaris/personal-corp-os/tree/main/skills/make-landing into .agents/skills/make-landing/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "make-landing", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add serejaris/personal-corp-os --skill make-landing -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install serejaris/personal-corp-os make-landing --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/serejaris/personal-corp-os.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/make-landing .cursor/skills/make-landing && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "make-landing" agent skill from https://github.com/serejaris/personal-corp-os/tree/main/skills/make-landing into .cursor/skills/make-landing/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "make-landing", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/serejaris/personal-corp-os.git --path skills/make-landing--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add serejaris/personal-corp-os --skill make-landing -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install serejaris/personal-corp-os make-landing --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/serejaris/personal-corp-os.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/make-landing .gemini/skills/make-landing && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "make-landing" agent skill from https://github.com/serejaris/personal-corp-os/tree/main/skills/make-landing into .gemini/skills/make-landing/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "make-landing", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install serejaris/personal-corp-os make-landingInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add serejaris/personal-corp-os --skill make-landing -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/serejaris/personal-corp-os.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/make-landing .github/skills/make-landing && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "make-landing" agent skill from https://github.com/serejaris/personal-corp-os/tree/main/skills/make-landing into .github/skills/make-landing/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "make-landing", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add serejaris/personal-corp-os --skill make-landing -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install serejaris/personal-corp-os make-landing --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/serejaris/personal-corp-os.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/make-landing .opencode/skills/make-landing && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "make-landing" agent skill from https://github.com/serejaris/personal-corp-os/tree/main/skills/make-landing into .opencode/skills/make-landing/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "make-landing", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
make-landingСоздаёт несколько вариантов дизайна 2D-поверхности (лендинг, герой, обложка, слайды): свой визуальный референс и автор на вариант, полный design.md с UTC/SHA-256 до кода, проверка в браузере…
Make Landing is an agent skill from serejaris/personal-corp-os. Создаёт несколько вариантов дизайна 2D-поверхности (лендинг, герой, обложка, слайды): свой визуальный референс и автор на вариант, полный design.md с UTC/SHA-256 до кода, проверка в браузере, галерея, картинки в чат, выбор человека и второй раунд смешения победителей. Применять по /make-landing, «варианты дизайна», «несколько вариантов лендинга на выбор», «редизайн».
Its SKILL.md is about 2.1k tokens, which your agent loads only when the skill is triggered. The skill folder holds 7 other files, including scripts and reference files (for example `README.md`, `README.ru.md` and `references/author.md`).
It sits in Frontend & Design, covering Design tokens. The repository describes itself as: Personal Corp OS — управление личной компанией через AI-агентов: задачи вне головы, отделы вместо памяти, недельное ретро. Открытые скиллы для Claude Code и Codex. The licence is MIT.
7 steps, taken from the step headings in SKILL.md.
Read from SKILL.md and the folder at commit 95e36c3. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Ships 1 file in scripts/ (Python), which the agent can run.
Shell commands in SKILL.md call:
python3codexFrom the folder's file list and the shell code blocks in SKILL.md.
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Make Landing loads about 2.1k tokens when it runs, and up to ~3.9k if it reads all its reference files. Until then it costs about 96 tokens; SKILL.md has 936 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.
The full file from serejaris/personal-corp-os at commit 95e36c3, republished under its MIT licence (© serejaris). 936 words, ~2,135 tokens.
.claude/skills/make-landing/SKILL.md (or your agent's skills folder). This skill also uses 5 other files; get the full folder from GitHub.Вариант — самостоятельное направление с визуальным референсом, полным контрактом и рабочим preview. Канон — исходная поверхность проекта, куда после выбора переезжает результат. До выбора авторы работают в своих папках.
Подходит для лендинга, героя, обложки и слайдов. Размеры и формат результата берутся из задачи. Если направление уже выбрано, выполняй обычную реализацию по его контракту.
Найди исходник, текущую страницу, команду запуска и правила проекта. При редизайне сними исходную страницу и покажи картинкой в чате. Сохрани brief.md: аудитория, задача поверхности, проверенные тексты/оффер/CTA, обязательные секции, доступные ассеты, формат результата, ограничения и критерии готовности. При существенном пробеле проверь публичные первоисточники; приватный контекст остаётся локально. Источники фактов у всех авторов общие.
Число вариантов N возьми из запроса. Если его нет, уточни; предложи 6–10 для широкого поиска. Решение человека определяет N. При лимите исполнителей запускай волнами с полным scope до готового preview.
При запрете менять текст сохрани текстовый канон и список разрешённых фактических корректировок. Каждый автор использует его дословно. Композицию и порядок можно менять; полноту исходных смысловых секций проверяй отдельно. Дизайнерские заметки остаются в документах процесса.
Привяжи каждый вариант к отдельному визуальному референсу: ссылка или локальный файл и конкретные приёмы сетки, типографики, композиции, медиа и навигации. Например: газетная полоса, швейцарская сетка, терминал, журнальный разворот, фотокопированный зин. Референс задаёт визуальное направление; права на чужие тексты, фотографии и бренд проверяются отдельно.
В directions.md запиши N строк:
| slug | Референс и приёмы | composition | storytelling | type | media/proof | navigation | Гипотеза и компромисс |
|---|
Каждая пара должна заметно различаться минимум по трём осям — рабочая эвристика для отбора. Дай каждому автору свою строку и общий бриф. Авторы самостоятельно проектируют свою версию; координатор сверяет матрицу и фиксированные концепции. Дополнительные референсы человека создают новые направления: сохраняй готовые варианты, обновляй матрицу и галерею, добавляй авторов.
Заведи постоянную папку результата в проекте, например:
redesign/
├── brief.md
├── directions.md
├── index.html # галерея всех готовых вариантов
├── round-1/<slug>/
│ ├── author-brief.md
│ ├── design.md
│ ├── concept-freeze.json
│ ├── design-amendments.md # создаётся при корректировках после freeze
│ ├── index.html # или исходник в формате задачи
│ ├── assets/
│ ├── screenshots/
│ └── result.md
└── round-2/<slug>/У каждого автора своя папка, порт и кеш сборщика. При работе с существующим приложением дай отдельную копию или worktree и его обычную команду сборки. Для самостоятельного HTML-preview достаточно HTML/CSS/JS и локального сервера. Галерея открывается рядом с вариантами. Канон, общие данные, установленные скиллы и чужие папки авторы не меняют; останавливают только свои процессы по PID. Каждый автор знает, что рядом работают другие, и сохраняет их правки.
Бриф автора включает общий brief, референс, строку матрицы, пути, границы владения, формат результата и роль references/author.md. Дай автору фактический путь установленной папки скилла для запуска скрипта; пути scripts/ и references/ ниже считаются от неё.
По умолчанию один исполнитель на вариант — Codex CLI, параллельно в фоне:
codex exec -C <папка> --skip-git-repo-check -m <модель> -o <итог.md> - < <бриф.md>Модель — выбранная человеком либо самая сильная из доступных Codex. При «model not supported» проверь и обнови CLI или используй более новую установленную версию. Если Codex CLI недоступен, передай тот же бриф субагенту-исполнителю. Число одновременных авторов соответствует возможностям среды; каждый доводит свою версию до проверки и отчёта.
Автор читает references/design-template.md и создаёт полный design.md: гипотеза, видимый эффект, компромисс, сценарий чтения, первый экран, сетка, адаптив, типографика и токены, компоненты и состояния, медиа, Do’s and Don’ts, критерии check. Концепция должна позволять восстановить композицию и поведение без догадок.
Перед HTML/CSS/компонентами зафиксируй концепцию. Команды выполняются из папки скилла; папка варианта — фактический путь:
python3 scripts/freeze_concept.py freeze <папка-варианта>
python3 scripts/freeze_concept.py verify <папка-варианта>concept-freeze.json содержит UTC, SHA-256 и этап before_implementation. Автор сообщает координатору пути концепции и freeze, затем реализует вариант. Сверка направлений внутри процесса не требует нового согласования человека. Timestamp подтверждает запись; порядок «концепция → freeze → код» обеспечивается последовательностью работы.
design.md и freeze остаются неизменными. Коллизии направлений и необходимые изменения запиши перед изменением кода в design-amendments.md: исходный hash, причина, изменённые решения и затронутые проверки. Проверяй freeze после реализации.
Если поручена генерация изображений, каждый автор создаёт полезные ассеты внутри своей концепции доступным инструментом генерации. Назначение фиксируется до freeze или в amendment перед генерацией; сохраняются промпт и итоговый файл. Читаемый текст и интерактивные связи реализуй средствами поверхности. Реальные продуктовые доказательства берутся из брифа.
Автор сдаёт готовую поверхность со всеми необходимыми ассетами. Для веба проверь реальные CTA, якоря, меню/FAQ, клавиатуру, focus, reduced motion, шрифты и загрузку изображений. Для обложки или слайдов проверь заданный размер, читаемость и экспорт. Зафиксируй результаты check, полноту контента и ограничения в result.md.
Открой фактический рендер всей поверхности, исправь видимые дефекты и пересними затронутые кадры. Веб-скриншоты у всех вариантов в одном масштабе: desktop viewport минимум 1200 px, по умолчанию 1440×900; длинная страница — последовательность таких кадров. Явно заданный человеком размер обложки или слайда имеет приоритет. На узких ширинах отдельно проверь DOM, overflow и порядок блоков. После исправлений повторяй затронутые проверки.
Координатор собирает redesign/index.html рядом с вариантами. На первом экране — визуальные карточки в одинаковом масштабе: имя, референс, гипотеза, компромисс, фактический screenshot, ссылки на preview и design.md. Подписывай происхождение визуала: референс, эскиз или рендер реализации. Ссылки на процесс и файлы идут после сравнения. Список и счётчик вариантов строятся по текущей матрице. Для командного выбора можно добавить согласованное голосование.
Картинки каждого варианта отправляй в чат по готовности, не дожидаясь остальных. Когда готовы все: сравнение в 2–4 строки и рекомендация — что читается сильнее, что ближе к смыслу, где риск. Выбирает человек. Визуальный QA подтверждает качество реализации; конверсия требует отдельного измерения.
После выбора 1–3 победителей предложи 1–2 направления второго раунда, смешивающие сильные элементы выбранных вариантов: например, сетка одного и типографика другого. Запиши происхождение решений и компромиссы. У каждого нового варианта своя папка, автор, полный design.md, freeze, проверка и картинки. Первый раунд сохраняется. Выбор итоговой версии остаётся за человеком; если он просит сразу перенести победителя, переходи к канону.
Выбранную версию перенеси в исходник проекта с настоящими данными и рабочими CTA. Убери демонстрационную обвязку из продукта. Выполни сборку и проверки проекта, открой живую страницу и сверь её с финальными кадрами; при старой версии обнови с обходом кеша. Финальные картинки покажи в чате. В коммит входят только свои пути. Внешняя публикация выполняется в пределах разрешения человека.
© serejaris, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
SKILL.md and 5 other files (scripts, references) in skills/make-landing of serejaris/personal-corp-os.
Open the folder on GitHubat commit 95e36c3
Make Landing next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Make Landing this skillserejaris/personal-corp-os | 229 | — | ~2.1k | Automated safety check: Pass | MIT | |
| Figma Design System Builderwarpdotdev/warp | 65k | 2 repos | ~4.4k | Automated safety check: Pass | AGPL-3.0 | |
| Figma use_figma Plugin API Ruleswarpdotdev/warp | 65k | 4 repos | ~4.4k | Automated safety check: Pass | AGPL-3.0 | |
| MCP Developmentcoollabsio/coolify | 63k | 1 repos | ~949 | Automated safety check: Pass | MIT | |
| Design SystemOhh-889/skyroc | 795 | 11 repos | ~1.7k | Automated safety check: Pass | MIT | |
| Design Dnazanwei/design-dna | 1.9k | 1 repos | ~2.1k | Automated safety check: Pass | MIT |
warpdotdev/warp
Builds or updates a design system in Figma from a codebase in ordered phases: discovery, variables and tokens, components, theming and documentation, with checkpoints.
warpdotdev/warp
Required groundwork before any use_figma call: the rules and reference files for running JavaScript in a Figma file through the Plugin API without common failures.
coollabsio/coolify
A skill your agent uses for Laravel MCP development. An agent skill from coollabsio/coolify.
Ohh-889/skyroc
Token architecture, component specifications, and slide generation.
zanwei/design-dna
Extract, define, and apply design DNA across three dimensions: design system (tokens), design style (qualitative feel), and visual effects (Canvas, WebGL, 3D, particles, shaders, scroll effects…
warpdotdev/warp
Turns a Figma frame or component into production code that matches the design, using the Figma MCP server and the project's own design system.
serejaris/personal-corp-os
A skill your agent uses when the user is transitioning from a completed retro into a weekly plan, choosing weekly outcomes, scheduling a full ISO week, or asking for "план на неделю", "weekly…
serejaris/personal-corp-os
A skill your agent uses when creating, searching, updating, or managing GitHub issues via CLI.
serejaris/personal-corp-os
A skill your agent uses when auditing a product, business, or project ecosystem — analyzing data sources, decision loops, bottlenecks, and implementation contours.
serejaris/personal-corp-os
A skill your agent uses when operating, debugging, deploying, or monitoring a Telegram bot or Telegram-to-agent gateway.
serejaris/personal-corp-os
Audits the agent rules in the current folder (AGENTS.md, nested AGENTS.md files) and the skill descriptions the agent sees at start, then reports what to cut, move or rewrite and edits only after…
serejaris/personal-corp-os
A skill your agent uses when publishing, open-sourcing, exporting, sanitizing, or moving code, agent skills, prompts, templates, fixtures, datasets, workshop assets, or other artifacts from a…
Categories
Создаёт несколько вариантов дизайна 2D-поверхности (лендинг, герой, обложка, слайды): свой визуальный референс и автор на вариант, полный design.md с UTC/SHA-256 до кода, проверка в браузере…. Make Landing is an agent skill from serejaris/personal-corp-os.md с UTC/SHA-256 до кода, проверка в браузере, галерея, картинки в чат, выбор человека и второй раунд смешения победителей.
Make Landing fits situations like: tasks that involve Design tokens.
Run `npx skills add serejaris/personal-corp-os --skill make-landing -a claude-code`. Or copy the skill folder (skills/make-landing in serejaris/personal-corp-os) into .claude/skills/make-landing in your project. Claude Code loads it when a task matches its description.
Run `npx skills add serejaris/personal-corp-os --skill make-landing -a codex`. Or copy the skill folder (skills/make-landing in serejaris/personal-corp-os) into .agents/skills/make-landing in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add serejaris/personal-corp-os --skill make-landing -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/make-landing, .gemini/skills/make-landing, .github/skills/make-landing and .opencode/skills/make-landing in your project.
Going by SKILL.md and its folder, Make Landing needs Python for the scripts in its folder and the command-line tools its instructions call (python3 and codex). Our summary lists: Python 3.
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.
Make Landing is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
About 2.1k tokens (SKILL.md is roughly 8.5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 1.8k tokens, read only when the agent opens those files.
Skills that share tags, products or a category with Make Landing: Figma Design System Builder (warpdotdev/warp, 65k stars), Figma use_figma Plugin API Rules (warpdotdev/warp, 65k stars), MCP Development (coollabsio/coolify, 63k stars) and Design System (Ohh-889/skyroc, 795 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
serejaris (a GitHub user) maintains it in serejaris/personal-corp-os, which has 229 GitHub stars. The repository holds 36 skills in this directory. The repository was last updated on October 7, 2026.
Source: serejaris/personal-corp-os on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.