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/eryajf-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: not checked yet.
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.13 · based_on: Cocoon-AI/architecture-diagram-generator (MIT, v1.0)
- Instructions
- 96 lines in SKILL.md · view on GitHub
Before installing
- Ships executable scripts
Files (140)
- LICENSE
- SKILL.md
- template.html · assets/
- archify.mjs · bin/
- open-artifact.mjs · bin/
- preview.mjs · bin/
- architecture-delta.mjs · delta/
- agent-run.lifecycle.json · examples/
- agent-tool-call.workflow.json · examples/
- async-job-roundtrip.sequence.json · examples/
- cache-miss-request.sequence.json · examples/
- checkout-platform.base.architecture.json · examples/
- checkout-platform.head.architecture.json · examples/
- dataflow-product-analytics.html · examples/
- deployment-release.lifecycle.json · examples/
- event-stream.dataflow.json · examples/
- incident-response.workflow.json · examples/
- lifecycle-agent-run.html · examples/
- product-analytics.dataflow.json · examples/
- production-deployment.architecture.json · examples/
- release-delivery.workflow.json · examples/
- sequence-cache-miss-request.html · examples/
- web-app-rendered.html · examples/
- web-app.architecture.json · examples/
- workflow-agent-tool-call-rendered.html · examples/
- package-lock.json
- package.json
- scenarios.mjs · recipes/
- authoring-contract.md · references/
- delivery-contract.md · references/
- viewer-runtime.md · references/
- grid.mjs · renderers/architecture/
- render-architecture.mjs · renderers/architecture/
- README.md · renderers/dataflow/
- render-dataflow.mjs · renderers/dataflow/
- README.md · renderers/lifecycle/
- render-lifecycle.mjs · renderers/lifecycle/
- README.md · renderers/sequence/
- render-sequence.mjs · renderers/sequence/
- cli.mjs · renderers/shared/
- diagnostics.mjs · renderers/shared/
- engineering-profiles.mjs · renderers/shared/
- generated-validators.mjs · renderers/shared/
- geometry.mjs · renderers/shared/
- layout-report.mjs · renderers/shared/
- legend.mjs · renderers/shared/
- output-path.mjs · renderers/shared/
- repository-evidence.mjs · renderers/shared/
- text-fit.mjs · renderers/shared/
- utils.mjs · renderers/shared/
- validator.mjs · renderers/shared/
- README.md · renderers/workflow/
- render-workflow.mjs · renderers/workflow/
- README.md · schemas/
- architecture.schema.json · schemas/
- common.schema.json · schemas/
- dataflow.schema.json · schemas/
- lifecycle.schema.json · schemas/
- sequence.schema.json · schemas/
- workflow.schema.json · schemas/
- …and 80 more
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. 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. 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. 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. 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. Lifecycle note: phase columns `0..4` occupy the main rail; event/outcome columns `0..2` align beneath later phases. 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.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. - Component types are `frontend`, `backend`, `database`, `cloud`, `security`, `messagebus`, and `external`; variants are `default`, `emphasis`, `security`, and `dashed`. - Spacing means clear gap, not center distance. For a relationship label, clear gap must exceed its measured mask width; otherwise omit the label or move it deliberately. - 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. - 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. 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> ``` When shell access is unavailable, hand-place architecture SVG into `assets/template.html`, use CSS semantic classes rather than inline colors, and follow the visual review contract in `references/delivery-contract.md`. ## Output Return the checked HTML path, diagram type, validation summary, specification/artifact receipt, and truthful visual-review status. Do not claim success for a non-zero command or claim visual inspection you did not perform.
From eryajf/eryajf-used-skills, MIT.
More from eryajf/eryajf-used-skills
- 0.524score
agent-skill-stack
eryajf
Find, evaluate, and assemble the smallest compatible set of AI Agent Skills for an end-to-end natural-language goal.
SkillBFreshness: BClaude Code +9 - 0.524score
ai-team-orchestration
eryajf
Bootstrap and run a lightweight multi-agent development team.
SkillBFreshness: BClaude Code +9 - 0.519score
ai-ready
eryajf
Make any repo AI-ready — analyzes your codebase and generates AGENTS.md, copilot-instructions.md, CI workflows, issue templates, and more.
SkillBFreshness: BClaude Code +9 - 0.516score
anti-ui-slop
eryajf
Stop Codex, GitHub Copilot, Claude Code, and Cursor from shipping generic UI.
SkillBFreshness: BClaude Code +9 - 0.471score
article-metaphor-illustrator
eryajf
为文章规划并生成可读性强的极简强线条手绘配图。先建立文章地图,识别段落适合流程图、架构图、对比图、关系图、结构图还是概念插图,再通过构思卡组织单一命题、原文指纹、信息单位、阅读顺序和固定橙白圆猫角色。构思通过可读性测试后默认直接生成。用户说配图、手绘配图、给文章配图、文章插图、技术文章插图、流程图、架构图、关系图或…
SkillCFreshness: CClaude Code +9
Signals
- Stars
- 0
- Forks
- 1
- Open issues
- 0
- Last commit (this folder)
- Aug 6, 2026 (2 months ago)
From GitHub (fetched Oct 24, 2026).
Details
- Version
- 2.13
- License
- MIT
- Repository
- github.com/eryajf/eryajf-used-skills
- 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.628score
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★ 8.6KClaude 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.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
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/eryajf-archify (last updated 2026-10-24)