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/pedrosatin-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: 3.0 · based_on: Cocoon-AI/architecture-diagram-generator (MIT, v1.0)
- Instructions
- 99 lines in SKILL.md · view on GitHub
Before installing
- Ships executable scripts
Files (106)
- LICENSE
- SKILL.md
- THIRD_PARTY_NOTICES.md
- JetBrainsMono-OFL.txt · assets/
- template.html · assets/
- archify.mjs · bin/
- delivery-update.mjs · bin/
- finalize.mjs · bin/
- open-artifact.mjs · bin/
- preview.mjs · bin/
- recover-output.mjs · bin/
- visual-check.mjs · bin/
- README.md · brand-marks/
- catalog.json · brand-marks/
- architecture-delta.mjs · delta/
- agent-run.lifecycle.json · examples/
- agent-tool-call.workflow.json · examples/
- async-job-roundtrip.sequence.json · examples/
- brand-aware-delivery.architecture.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/
- holiday-planning.workflow.json · examples/
- incident-response.workflow.json · examples/
- lifecycle-agent-run.html · examples/
- de.json · examples/locales/
- es.json · examples/locales/
- fr.json · examples/locales/
- fr.partial.json · examples/locales/
- it.json · examples/locales/
- ja.json · examples/locales/
- ko.json · examples/locales/
- pt.json · examples/locales/
- ru.json · examples/locales/
- 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/
- workflow-v2.mjs · migrations/
- package.json
- scenarios.mjs · recipes/
- architecture-layout-repair.md · references/
- authoring-contract.md · references/
- authoring-defaults.md · references/
- brand-marks.md · references/
- delivery-contract.md · references/
- repository-authoring.md · references/
- update-awareness.md · references/
- viewer-runtime.md · references/
- grid.mjs · renderers/architecture/
- labels.mjs · renderers/architecture/
- render-architecture.mjs · renderers/architecture/
- routing.mjs · renderers/architecture/
- README.md · renderers/dataflow/
- …and 46 more
SKILL.md (first lines)
# Archify Create an interactive HTML diagram from typed JSON. Static output is the default; enable motion only when requested. Run commands from your working directory. Unless the user names another location, give each new diagram request its own folder `.archify/<type>-<slug>-<YYYYMMDD-HHMMSS>/` there (local time, chosen once when the request starts): keep `candidate.json` and `<slug>.html` in it, set `meta.output` to that relative HTML path, and reuse the folder for every repair rerun. A later request gets a new folder, so earlier versions stay intact. Replace `bin/archify.mjs` in the commands below with the installed package's absolute path, or its path relative to your working directory; input and output paths resolve from that working directory. For a real codebase, read [Repository authoring](references/repository-authoring.md) while tracing the requested behavior. A system description uses the steps below; an existing JSON uses the handoff path. ## Existing candidate handoff When the user supplies a frozen candidate, run `finalize` first as one CLI invocation. Its passing receipt completes the automated gates; follow any visual review recommendation under Delivery before claiming visual quality. For repair, follow step 5. `finalize` includes a bounded update check in its delivery receipt; see Update awareness. ## Fast authoring path Use this path for ordinary generation. Read branch references only when their stated trigger applies. 1. Choose `architecture`, `workflow`, `sequence`, `dataflow`, or `lifecycle` from the question. 2. Use the exact schema and example paths in the Type router without listing their directories. Read [Authoring defaults](references/authoring-defaults.md) and the mode's example in a bounded batch separate from project documents and complete schemas so neither is truncated; recover any missing section before writing. For Architecture, use the matching showcase example. For Sequence, Dataflow, and Lifecycle, also read the mode and common schemas. Read the relevant schema definition before choosing any new field, enum, or constrained text, especially boundary kinds. Examples teach shape, not facts. Use fresh IDs, wording, and layout. Go directly to the candidate without preliminary help, doctor, starter validation, temporary diagrams, or output-path listing. Query brands only for an explicitly requested mark; read [Brand marks](references/brand-marks.md) for an unknown mark with a user-provided URL. 3. Once the requested scope and, for a real codebase, [source evidence](references/repository-authoring.md) are covered, write the complete candidate directly without planning coordinates in prose. Choose Architecture abstraction and connected placement using Authoring defaults before coordinates: show the main user journey and necessary branches, preserve control roles and behavior-changing conditions, and leave enough room for actual relationship labels. No node, relationship, source, view, card, or boundary count is a target or ceiling. Use automatic routes first; add explicit routing only for necessary branch, return, supplied geometry, or measured repair. Set `meta.quality_profile` to `"showcase"` unless the user requests dense `standard`. 4. Once the complete first candidate is written, run `finalize` directly. Its first gate is showcase validation; successful first drafts need no separate pre-validation. Keep the candidate unchanged while the command runs: ```bash node bin/archify.mjs finalize <type> <candidate.json> <output.html> --quality showcase --json ``` For a repository-backed candidate, include evidence on the first draft and use the complete first command: `node bin/archify.mjs finalize <type> <candidate.json> <output.html> --repo-root <repo-root> --quality showcase --json`. A passing receipt proves the included `validate`, `deliver`, strict `check`, and real-browser `browser-check` gates passed. Use its compact summary; run standalone commands only for a separate request or focused failure diagnosis. 5. A non-zero exit is never success. Read compact stdout or `evidence.summaryReceipt`, then [repair the failed gate](references/delivery-contract.md#failed-finalize-and-candidate-repair), including its repair limit. Preserve requested meaning and source evidence. For several tangled Architecture routes, read [Architecture layout repair](references/architecture-layout-repair.md); for measured field or geometry failures, read [Authoring contract](references/authoring-contract.md). Edit the connected neighborhood and rerun the complete `finalize` command from step 4. ## Update awareness `finalize` and standalone `deliver` include `update` in their receipts. Do not run a separate check for the same delivery. If `update.noticeRequired` is true, read `references/update-awareness.md` and keep one update line in your final response to the user, even after a quality gate fails. For a task with several diagrams, mention the update once in the final response. Snooze or ignore a reminder only when the user explicitly asks; never install or update on your own initiative. Before the first candidate, use the authoring references and relevant repository source, not Archify implementation or tests. Inspect Archify implementation if diagnostics remain unactionable after focused repairs. ## Type router | Type | Use for | Schema | Example | |---|---|---|---| | `architecture` | Components, services, cloud/security boundaries, infrastructure | `schemas/architecture.schema.json` | System descriptions, services, libraries, and CLI repos: `examples/web-app.architecture.json`; deployment repos: `examples/production-deployment.architecture.json` | | `workflow` | Processes, approval gates, tool calls, runbooks, CI/CD | `schemas/workflow.schema.json` | `examples/agent-tool-call.workflow.json` | | `sequence` | API call chains, request lifecycles, async traces, returns | `schemas/sequence.schema.json` | `examples/cache-miss-request.sequence.json` | | `dataflow` | Pipelines, ETL/ELT, lineage, governance, consumers | `schemas/dataflow.schema.json` | `examples/product-analytics.dataflow.json` | | `lifecycle` | State/status transitions, retries, waiting and terminal states | `schemas/lifecycle.schema.json` | `examples/deployment-release.lifecycle.json` | 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. ## Delivery Use the `finalize` command above for the first candidate and after a repair. `finalize` stops at the first non-passing gate. Its compact stdout and `<output-stem>.finalize-summary.json` are ordinary evidence. A passing run creates no screenshots and reports `visualReview: "not-requested"`. When a passing Architecture receipt reports `visualReviewRecommendation.signals.resolvedCrossovers`, copy the candidate aside and apply the hints in one edit that changes only node positions and sizes: every node, relationship (including its `from` and `to`), label, and source stays as it was. Rerun the complete `finalize` once with `--out-dir <folder>/review-2`, because the previous HTML already owns its browser evidence. If that run fails or reports more crossings, restore the copy and finalize it with `--out-dir <folder>/review-3`. Do not start a second placement round. Hints about extra bends alone are optional. When `layoutReviewRecommendation.action` is `inspect-sequence-width`, follow [Sequence width review](references/delivery-contract.md#sequence-width-review) before handing off a newly authored Sequence. Perceptual review is optional for ordinary generation, including a newly positioned Architecture. Use [Optional capture evidence](references/delivery-contract.md#optional-capture-evidence), with `--out-dir <folder>/visual-check`, when the user requests visual review, during development audits, or for a concrete route/browser concern. `visualReviewRecommendation` is advisory. Inspect captures before claiming visual quality; otherwise report automated checks only. Read [Delivery contract](references/delivery-contract.md) for failed gates, standalone commands, provenance/recovery, repeated delivery, exports, or opening. Recovery follows `deliver` → strict provenance `check` → `browser-check`; captures require strict provenance. For workflow viewport overflow, read [Workflow viewport repair](references/authoring-contract.md#workflow-viewport-repair) before the next layout edit. Report artifact checks, browser evidence, captures, and actual perceptual review as distinct results. For an explicitly requested immediate preview or active desktop loop, see [Optional opening](references/delivery-contract.md#optional-opening). ## Optional viewer capabilities `meta.animation: "trace"` is opt-in. Read `references/viewer-runtime.md` only when the user explicitly asks for Share Cards, Route/Reach cards, motion, deep links, presentation, search/focus, or another Viewer Runtime feature. ## Setup and fallback No install is required inside the skill package. For setup diagnosis, 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 as an absolute path, diagram type, validation summary, specification/artifact receipt, browser-evidence status, and truthful visual-review status. Do not claim success for a non-zero command or claim visual inspection you did not perform.
From pedrosatin/skills, MIT.
More from pedrosatin/skills
- 0.570score
clean-crap
pedrosatin
Measure JavaScript and TypeScript function complexity, join LCOV test coverage, compute CRAP scores, and gate delivery on a threshold.
SkillAFreshness: AClaude Code +9 - 0.570score
validate-agent-config
pedrosatin
Validate the machine's agent configuration: instruction files (CONTEXT.md, AGENTS.md, CLAUDE.md, GEMINI.md), symlinks, @ imports, skill frontmatter, and…
SkillAFreshness: AClaude Code +9 - 0.570score
humanizer
pedrosatin
Rewrite AI-sounding English prose so it reads like the writer without changing what it says.
SkillAFreshness: AClaude Code +9 - 0.567score
setup
pedrosatin
Initialize a project for local specs and tickets: scaffolds .scratch/, domain docs, and AGENTS.md, checks graphify, and generates the HTML Project Hub.
SkillAFreshness: AClaude Code +9 - 0.567score
board
pedrosatin
Open the project board (Project Hub at .scratch/index.html) in the default browser.
SkillAFreshness: AClaude Code +9 - 0.565score
pr-description
pedrosatin
Draft a local PR body from the diff and observed validation, or create/edit the remote PR with evidence attachments.
SkillAFreshness: AClaude Code +9 - 0.561score
unslop-br
pedrosatin
Remove vícios de linguagem de IA (AI slop), clichês, gerundismos e estruturas artificiais em Português Brasileiro (PT-BR).
SkillAFreshness: AClaude Code +9 - 0.561score
pr-loop
pedrosatin
Deliver one backlog item through /pr-loop: implement, clean, verify, review, correct, then publish and merge with authorization.
SkillAFreshness: AClaude Code +9 - 0.560score
graphify
pedrosatin
Use when exploring or asking questions about a codebase, its architecture, file relationships, or project content — especially when graphify-out/ exists…
SkillAFreshness: AClaude Code +9 - 0.558score
babysit-prs
pedrosatin
Review open PRs in the current repository, merge the safe ones, and leave a draft comment on the rest.
SkillAFreshness: AClaude Code +9 - 0.539score
publication-hygiene
pedrosatin
Validate Git commits, pushes, and GitHub pull-request activity before publishing, removing agent provenance and operational WIP while preserving product…
SkillAFreshness: AClaude Code +9 - 0.539score
grilling
pedrosatin
Grill the user relentlessly about a plan, decision, or idea.
SkillAFreshness: AClaude Code +9
Signals
- Stars
- 0
- Forks
- 0
- Open issues
- 0
- Last commit (this folder)
- Oct 3, 2026 (26 days ago)
From GitHub (fetched Oct 24, 2026).
Details
- Version
- 3.0
- License
- MIT
- Repository
- github.com/pedrosatin/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.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/pedrosatin-archify (last updated 2026-10-24)