archify
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
Skill by tt-a1i
Install
Works with Claude Code, Claude apps, Codex, Cursor, Gemini CLI, GitHub Copilot, VS Code, OpenCode, Goose, Windsurf. Read the repository before you give any tool access to your data.
npx agentmarket install skill/anbeime-archify
Asks which of your tools to add it to (Claude Code, Codex, Cursor, VS Code, Windsurf, Gemini CLI, Claude Desktop) and shows the change first. See https://agentmart.dev/cli.
Get the weekly diff
The weekly diff: one email a week with new agent tools, notable updates and grade changes, plus security alerts for tools you follow. Double opt-in, one-click unsubscribe.
About
Use cases: design, frontend, backend, devops
Reviews
Write a reviewNo reviews yet. Installed it? Reviews come from verified installers only. How reviews work
Permissions
What this skill can do and what it asks for, from its SKILL.md. Checked Oct 25, 2026.
- Tools
- No tools found
- Secrets
- None asked for
- Install scripts
- None found
Network hosts it talks to 1
codeload.github.com· found in install command
Files it touches
~/.claude/skills/archify
What's inside
- Skill name
archify- Description
- Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light themes, optional trace motion, and PNG/JPEG/WebP/SVG/WebM export. Accept plain-language requirements or pasted Mermaid flowchart, sequenceDiagram, and stateDiagram input; inspect repository evidence when the diagram must reflect real code. Use when the user asks to visualize system architecture, infrastructure, cloud/security/network topology, technical workflows, API call sequences, request lifecycles, data pipelines, ETL/ELT, data lineage, state machines, or to convert/beautify Mermaid.
- License
- MIT
- Metadata
- author: tt-a1i · version: 2.16 · based_on: Cocoon-AI/architecture-diagram-generator (MIT, v1.0)
- Instructions
- 127 lines in SKILL.md · view on GitHub
Agent Skills spec issues
- files: referenced but missing: references/brand-marks.md, scripts/check-update.mjs, references/authoring-contract.md, references/delivery-contract.md, references/viewer-runtime.md
Files (1)
- SKILL.md
SKILL.md (first lines)
# Archify Create a self-contained, interactive HTML diagram from a small typed JSON specification. Static output is the default; enable motion only when the user asks for a demo or presentation. ## Fast authoring path Use this bounded path for ordinary generation. Do not read the optional Viewer Runtime reference unless the user asks about those features. 1. Choose `architecture`, `workflow`, `sequence`, `dataflow`, or `lifecycle` from the question. 2. Read one matching schema in `schemas/`, `schemas/common.schema.json`, and one matching JSON example in `examples/`. Read only those files. Fresh authorship means new stable IDs, domain wording, and layout; use the example for field shape, not facts. New workflow sources use `schema_version: 2` and its readable layout contract; keep `schema_version: 1` only when preserving an existing workflow's fixed geometry. When real product identity matters, query `node bin/archify.mjs brands "<name>" --json`; read `references/brand-marks.md` only for an unknown brand with a user-provided URL. 3. Artifact first: the next tool action must write the candidate. Write the candidate before inspecting renderer internals. Do not plan exact coordinates in prose. Start with one clear main path, short side branches, sparse labels, and at most 12 primary nodes. Set `meta.quality_profile` to `"showcase"` unless the user explicitly requests a dense `standard` map. Start with automatic routes and labels. Do not add `via`, `channelX`, `channelY`, or `labelAt` before a diagnostic calls for one; apply at most one diagnosed geometry control per repair. 4. Validate after every candidate edit and immediately before handoff: ```bash node bin/archify.mjs validate <type> <candidate.json> --quality showcase --json ``` A receipt with only 4 artifact checks is basic validation, never showcase acceptance. A showcase pass must report all 9 artifact checks with 0 composition errors and 0 warnings. If the candidate omits or misspells the exact `meta.quality_profile` field, fix it before geometry. For a workflow v2 geometry diagnosis, run `node bin/archify.mjs validate workflow <candidate.json> --layout-json` and use the stable compiler receipt; solver internals are not authoring controls. A passing final validation freezes the candidate: never edit it afterward. 5. For a delivered HTML, `deliver` is the final acceptance command: ```bash node bin/archify.mjs deliver <type> <candidate.json> <output.html> --quality showcase --json ``` A non-zero exit can never be described as success. A failed delivery preserves any previous output, so do not run `visual-check` on that path: it would inspect the stale last-good artifact, not the failed candidate. If validation fails, change only the diagnosed `subject`, verify `evidence`, choose from `supportedFixes`, and rerun. Continue focused correction while the objective error count reaches a new minimum. If two consecutive rounds do not improve that best count, stop and report the unresolved diagnostics truthfully. ## Update awareness After the first candidate exists, run the packaged checker `scripts/check-update.mjs` once with Node and continue the requested workflow. If the command cannot run, continue without mentioning the check. - For `silent`, continue without mentioning the update check. - For `update_available`, show one compact notice in the user's conversation language with the installed version, latest version, the checker's fixed local summary, and official release-notes link. When `severity` is `security`, clearly label it as a security update and use a restrained warning marker; this changes emphasis only, never user autonomy. Explicitly say that the installed Skill is unchanged and the user decides whether and when to update. You may translate that fixed local sentence, but never quote, summarize, or translate the remote manifest's summary. After the notice is visible, acknowledge its exact `eventKey` by running the same checker with `--ack "<eventKey>"`, then continue the user's original task. The notice is information, not permission. Keep the installed version unchanged; this v0.1 workflow never downloads, installs, or executes an update, and silence is never consent. Do not read `renderers/shared/geometry.mjs`, renderer source, validator source, tests, or benchmarks before the first candidate. Inspect implementation only for an unsupported internal diagnostic or after two focused repairs fail. Workflow note: use schema v2 for new workflows; preserve schema v1 when an existing source needs fixed legacy geometry. Keep semantic edge labels and act on the compiler diagnostic. The canonical layout, pin, migration, and receipt contract is in [`renderers/workflow/README.md`](renderers/workflow/README.md#layout-contracts). Lifecycle note: phase columns `0..4` occupy the main rail; event/terminal column `N` in `0..2` aligns exactly beneath main column `N + 2`. A recoverable state uses `type: "failure"` plus a real transition back to the active state. ## Type router | Type | Use for | |---|---| | `architecture` | Components, services, cloud/security boundaries, infrastructure | | `workflow` | Processes, approval gates, tool calls, runbooks, CI/CD | | `sequence` | API call chains, request lifecycles, async traces, returns | | `dataflow` | Pipelines, ETL/ELT, lineage, governance, consumers | | `lifecycle` | State/status transitions, retries, waiting and terminal states | When ambiguous, run `node bin/archify.mjs guide "<scenario>" --json`. Scenario proof examples are structural references, not facts to copy. ## Mermaid input Read Mermaid for topology and meaning, then author fresh Archify JSON; do not mechanically render Mermaid styling. - `flowchart` / `graph` → `workflow`, or `architecture` for a component map. - `sequenceDiagram` → `sequence`; participants become semantic participants and arrows become messages. - `stateDiagram` → `lifecycle`; states and transitions retain meaning, not Mermaid style. ## Authoring invariants - One obvious main path; side branches leave the nearest main-path node. Remove low-value edges before adding routing controls. - Omit `meta.visual_preset` by default so every diagram opens in `classic`, regardless of whether its resolved color mode is light or dark. Color mode and visual preset are independent: switching Light / Dark must preserve the current preset. Set `signal-flow`, `blueprint`, or `editorial` only when the user explicitly requests that visual style. - Omit `meta.subtitle` by default. Never invent a subtitle that restates the title, nodes, or cards; include one short supporting line only when the user explicitly asks for it. - Treat the standalone desktop viewer as a first-screen artifact by default, not a shallow strip. Generate one responsive artifact for laptops and external displays—never device-specific HTML or alternate topology. The viewer may adapt only the outer reading width from the live viewport height; it must preserve the authored SVG/viewBox, proportions, semantic geometry, and normal document flow. On a wide or tall desktop, use enough authored vertical rhythm that the diagram panel and its necessary conclusion cards occupy the screen as a balanced whole; runtime scaling cannot repair an over-compressed Y layout or an undersized explicit `meta.viewBox`. Before handoff, open the real HTML at 1440×900, 1600×1000, and 1920×1080; additionally check 2048×1320 whenever the composition is intended for a large desktop display. Require `document.documentElement.scrollWidth <= window.innerWidth` and `scrollHeight <= window.innerHeight` at every checked size, while visually checking that the diagram remains comfortably readable and vertically balanced at the largest checked viewport. Repair overflow by removing only genuinely redundant content or compacting spacing before shrinking nodes, labels, or the main panel. If the largest viewport still has a conspicuous empty lower band at the viewer's width cap, redistribute authored Y positions and increase the viewBox height proportionally; do not add filler copy or decorative cards. Never counterfeit a pass with `overflow: hidden`, clipped content, an internal diagram scroller, stretched SVG height, or smaller typography. Narrow/mobile layouts may scroll vertically when containment requires it. - Omit `meta.legend` for the truthful `auto` default. When needed, use only `mode: auto|all|hidden` and renderer-supported `entries.<kind>.label|visible`; labels never change semantics. - Choose one primary authored language from an explicit user choice; otherwise follow the request or conversation's dominant language. `meta.locale` controls only renderer-owned Viewer UI: use `"en"` or `"zh-CN"` for the corresponding supported primary language. For every other language, omit `meta.locale` and explicitly disclose that the fixed Viewer UI and `<html lang>` fall back to English. The renderer never translates authored content. See `references/authoring-contract.md` for details. - Preserve exact product names, code identifiers, commands, protocols, API paths, and environment names. They may remain English inside localized copy, but never justify leaving the surrounding explanatory prose in another language. - Brand identity is optional and explicit. Put a canonical built-in ID in `brand` when the node names that real product. If no preset matches and the user supplied the official HTTP(S) URL, first run `node bin/archify.mjs brands capture "<url>" --json`, then author the returned digest-pinned `brand` object. Render and validate never perform an unpinned capture. Otherwise omit `brand`. Never infer a brand from a vague role such as "database", and never let a badge replace the semantic `type`, label, or relationship facts. - For sequence diagrams, omit `meta.column_fit` for the stable `fixed` layout. Set it to `"spread"` when a wide viewBox would otherwise leave unused horizontal space or when meaningful participant labels do not fit the fixed boxes; do not shorten semantic labels before trying `spread`. - Component types are `frontend`, `backend`, `database`, `cloud`, `security`, `messagebus`, and `external`; variants are `default`, `emphasis`, `security`, and `dashed`. - Relationship labels are semantic data. When one collides, move the label, adjust the route or spacing, then shorten the wording while preserving meaning. Omit only wording that is already fully implied by both endpoints and contains no protocol, action, direction, synchronous/asynchronous behavior, or cross-boundary mechanism. Preserve every meaningful label; deleting it is not a geometry repair. If a relationship starts unlabeled because its endpoints fully imply it, explain why the wording is redundant; this is a semantic authoring choice, not a geometry repair. - Omit `meta.engineering_profile` by default. Region, cluster, and security boundary wording do not by themselves enable it. Enable `deployment-ownership` only when the user explicitly asks for a production deployment topology, ownership handoff, or fail-closed deployment review and the source facts are known. Once enabled, must not remove the engineering profile merely to pass validation; repair the facts or report the diagnostics truthfully. - Spacing means clear gap, not center distance. For a relationship label, clear gap must exceed its measured mask width; follow the label-preserving repair order. - Automatic routes own their endpoint sides. A side is a direction contract: the first and final segment must leave/enter perpendicular to that side. - Automatic Port Spread is a default renderer behavior for architecture, workflow, data-flow, and lifecycle. It skips single relationships and explicit `via`, `channelX`, `channelY`, `labelAt`, or non-`auto` routes. Near parallel ports use an outside bridge so automatic routing cannot create a sub-8px segment or sub-16px interior turn. Architecture separately keeps unobstructed facing automatic ports (`left`/`right` or `top`/`bottom`) on one shared axis when their offset is under 16px and both ports retain corner clearance. If exactly one endpoint was spread, only the unshared endpoint may move onto that axis; if both endpoints were spread, keep the outside bridge so competing ports remain distinct. - Never accept an edge crossing an unrelated opaque node, an ambiguous shared corridor, or a relationship label masking another route. Read `references/authoring-contract.md` only when you need field enums, spacing math, geometry repair rules, repository evidence, or mode-specific placement. ## Delivery Use `validate` during repair and `deliver` once for final acceptance. Delivery freezes the exact specification bytes into a private same-directory snapshot, renders and checks that snapshot, atomically commits the HTML, and reports SHA-256 plus byte counts for both specification and artifact. After delivery, collect bounded desktop evidence without modifying or rerendering the trusted HTML: ```bash node bin/archify.mjs visual-check <output.html> --json ``` `visual-check` measures containment at 1440×900, 1600×1000, 1920×1080, and 2048×1320; captures light/dark screenshots at the smallest and largest sizes; and writes a relative-path contact sheet plus JSON sidecars beside the artifact. Its automated receipt always reports `visualReview: "pending"`: screenshots are evidence for inspection, never an automatic polish claim. Exit 0 means containment and captures passed, 1 means overflow or capture failure, and 2 means Chrome/Chromium was unavailable and the receipt is `skipped`. The command never changes the delivered HTML. Add `--open` only when the user wants an immediate local preview. For an active desktop authoring loop, the optional command is: ```bash node bin/archify.mjs preview <type> <input>.json <output>.html --quality showcase ``` Never start preview by default. Read `references/delivery-contract.md` when using preview, repository evidence, export receipts, visual review, or post-commit opening. ## Optional viewer capabilities Generated HTML already contains theme switching, pan/zoom, search, focus, relationship tracing, semantic views, presentation, and truthful exports. These are reader capabilities, not extra authoring work. `meta.animation: "trace"` is opt-in; `meta.views` is optional and should contain at most five curated chapters. Read `references/viewer-runtime.md` only when the user explicitly asks for Share Cards, Route/Reach cards, motion, guided stories, deep links, presentation, search/focus, or another Viewer Runtime feature. ## Setup and fallback No install is required inside the skill package. Verify with: ```bash node bin/archify.mjs doctor node bin/archify.mjs demo <output-directory> ```
From anbeime/skill, MIT.
More from anbeime/skill
- 0.806score
convert-documents-to-markdown
firecrawl
Convert Word (.doc, .docx), PowerPoint (.ppt, .pptx), Excel (.xls, .xlsx), OpenDocument (.odt, .ods, .odp), RTF, EPUB, CSV, and PDF files to GitHub-Flavored…
SkillBFreshness: B★ 8.6KClaude Code +9 - 0.798score
diagram-design
anbeime
Create branded architecture, architecture delta, IT current-state, flowchart, sequence, state machine, ER/data model, timeline, swimlane, quadrant…
SkillAFreshness: A★ 8.6KClaude Code +9 - 0.789score
srt-whiteboard-animation
anbeime
将 SRT 字幕做成暖米黄纸张底的白板手绘动画:读字幕→输出配图策略→确认后生成统一风格线稿→按叙事语义标注分区→预览台调整→渲染 MP4。编排沿用分区遮罩揭示(annotation.json / sequence / startMs / protectedRegions),但每个区域内的落墨换成 stream…
SkillAFreshness: A★ 8.6KClaude Code +9 - 0.789score
kb-to-mpt
anbeime
知易知识库 → 短视频 流水线。把 knowledge_cards(蓝/绿/红卡)批量生成书摘/知识类短视频(复用 MoneyPrinterTurbo),并提供本地 faster-whisper 转写桥,把任意视频转文字入库成为脚本源。触发:用户想"把书/知识库做成视频""批量产出书摘视频""把视频转写进知识库"。
SkillAFreshness: A★ 8.6KClaude Code +9 - 0.787score
email-concierge
anbeime
Local AI email assistant that automates unread-mail processing, offline-safe classification and reply drafting, local draft editing/approval queues, calendar…
SkillAFreshness: A★ 8.6KClaude Code +9 - 0.752score
gpt-image-2-prompt-engine
anbeime
面向电商设计师、海报美工、品牌视觉、UI设计师、信息图编辑、商业摄影师、内容创作者等需要高质量可控出图的角色,在需要用 GPT-Image-2 生成电商主图、电影海报、信息图、品牌视觉、UI截图、古籍国风、角色IP等场景时,通过「Prompt as…
SkillBFreshness: B★ 8.6KClaude Code +9 - 0.750score
photo-abstract-editorial
anbeime
Create a clean, vertical editorial artwork that preserves an uploaded photograph as the original image and pairs it with a restrained, photo-derived abstract…
SkillBFreshness: B★ 8.6KClaude Code +9 - 0.747score
voltagent-awesome-design-md
anbeime
73 个真实网站 DESIGN.md 提取集合(Claude / Cursor / Vercel / Stripe / Apple / Tesla / Ferrari ...)。 把 DESIGN.md 复制到项目根目录,AI agent 读 DESIGN.md 后能生成风格一致的高质量 UI。 本仓库同步自…
SkillBFreshness: B★ 8.6KClaude Code +9 - 0.747score
video-creation-pro
anbeime
电商运营与自媒体创作者在为美妆、家居、智能硬件等商品制作短视频时,请使用此技能。10大AI智能体协同,从卖点提炼、分镜生图到音效字幕,一键调用COZE API自动合成高质量商品视频,彻底告别本地代码依赖,轻松实现从创作、质检到数据迭代的全流程闭环。
SkillBFreshness: B★ 8.6KClaude Code +9 - 0.747score
law-to-markdown
anbeime
律师助理与法律助手在处理繁杂法条时,当需要将 PDF/Word/TXT 格式的法律规范文件转为结构化 Markdown 时适用。自动完成 OCR 解析、法律层级识别与三阶段保真校验,一键生成排版完美的法条 Markdown 文档及审核报告,让法律文本数字化工作事半功倍。
SkillBFreshness: B★ 8.6KClaude Code +9 - 0.745score
ip-as-logo
anbeime
Generate extremely simple, cute, personified square character images with rounded heavy forms, two purposeful character colors, one solid background color…
SkillBFreshness: B★ 8.6KClaude Code +9 - 0.743score
agent-team
anbeime
产品经理与项目管理专家在应对复杂项目时,使用此技能可动态组建包含“执行、指挥、评审”的专属AI团队。实时查看多智能体辩论与决策全过程,共享统一上下文记忆,一键完成从会议决策到系统构建的全流程高效协同!
SkillBFreshness: B★ 8.6KClaude Code +9
Signals
- Stars
- 8,591
- Forks
- 764
- Open issues
- 18
- Last commit (this folder)
- Sep 2, 2026 (1 month ago)
From GitHub (fetched Oct 24, 2026).
Details
- Version
- 2.16
- License
- MIT
- Repository
- github.com/anbeime/skill
- Website
- skill.miyucaicai.cn
- First seen
- Oct 24, 2026
- Last checked
- Oct 24, 2026
- Source
- GitHubgithub-graphql
Same skill elsewhere
Copies of this SKILL.md published by others; search shows only one of them.
- 0.323score
archify
tt-a1i
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
SkillAFreshness: A★ 2Claude Code +9 - 0.323score
archify
tt-a1i
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
SkillAFreshness: A★ 2Claude Code +9 - 0.307score
archify
tt-a1i
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
SkillBFreshness: B★ 4Claude Code +9 - 0.305score
archify
tt-a1i
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
SkillAFreshness: AClaude Code +9 - 0.305score
archify
tt-a1i
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
SkillAFreshness: AClaude Code +9 - 0.305score
archify
tt-a1i
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
SkillAFreshness: AClaude Code +9 - 0.295score
archify
tt-a1i
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
SkillBFreshness: B★ 1Claude Code +9 - 0.282score
archify
tt-a1i
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
SkillBFreshness: BClaude Code +9 - 0.282score
archify
tt-a1i
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
SkillBFreshness: BClaude Code +9 - 0.282score
archify
tt-a1i
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
SkillBFreshness: BClaude Code +9 - 0.282score
archify
tt-a1i
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
SkillBFreshness: BClaude Code +9 - 0.282score
archify
tt-a1i
Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light…
SkillBFreshness: BClaude Code +9
More from tt-a1i
- 0.837score
simplify-codebase
tt-a1i
Simplification audit or authorized codebase simplification whose stated objective is to remove accidental complexity.
SkillAFreshness: A★ 88.7KClaude Code +9 - 0.837score
archify
tt-a1i
Create validated architecture, workflow, sequence, data-flow, lifecycle/state, ERD, class, tree, timeline, and waterfall diagrams as explorable standalone…
SkillAFreshness: A★ 88.7KClaude Code +9 - 0.834score
archify-tuning
tt-a1i
Improve Archify diagram accuracy, visual quality and complete authoring speed with fewer repairs.
SkillAFreshness: A★ 88.7KClaude Code +9 - 0.823score
archify-review
tt-a1i
Review Archify issues, PRs, or code through value, cost, and impact to support evidence-based maintenance decisions.
SkillAFreshness: A★ 88.7KClaude Code +9 - 0.699score
execute-spec-in-fork
tt-a1i
Orchestrate approved, bounded work through a same-directory Codex App fork: create and name the execution task, ask it to run spec-executor, route decisions…
SkillBFreshness: B★ 187Claude Code +9 - 0.699score
goal-crafter
tt-a1i
Craft verifiable, tight goal prompts for AI coding agents (Claude Code /goal, Codex Automations, Pi), either from a standalone task interview or from an…
SkillBFreshness: B★ 187Claude Code +9
Cite this page
archify skill. Agent Mart. https://agentmart.dev/skills/anbeime-archify (last updated 2026-10-24)