DESIGN:OS Code2Flow icon

DESIGN:OS Code2Flow

design-os/design-os-code2flow · v1.0.0 · Tools & Integrations

by DESIGN:OSAwesome AI Plugins

Free, source-available (PolyForm Shield) local-first mapper that turns a Next.js, React Router, SwiftUI, Flutter or Compose codebase into a Mermaid user-flow graph and audits it for UX gaps like dead-end screens.

Protect this install with HOL Guard

Guard checks the skills and MCP servers a plugin adds on your machine and asks you before a risky action runs. The scores above are free, and no plan changes them.

Is DESIGN:OS Code2Flow a fit?

From the plugin's manifest and HOL's scan. Anything the plugin does not declare is shown as not declared.

Works with

  • Codex
  • Claude Code
  • 4 skills

Before you install

Sign-in
Asks you to sign in when you install it
Declared access
Read, Write
License
LicenseRef-PolyForm-Shield-1.0.0

Check before relying on it

  • Some security checks did not finish: Cisco skill scan. See the evidence
  • The publisher has not verified ownership on HOL.

What is DESIGN:OS Code2Flow?

DESIGN:OS Code2Flow is a published tools & integrations plugin for AI coding agents that works with Codex and Claude Code, developed by DESIGN:OS and distributed through the HOL AI plugin registry. Free, source-available (PolyForm Shield) local-first mapper that turns a Next.js, React Router, SwiftUI, Flutter or Compose codebase into a Mermaid user-flow graph and audits it for UX gaps like dead-end screens.

Canonical slug
design-os/design-os-code2flow
Version
v1.0.0 · updated Nov 2, 2026

Registry snapshot

Owner verification
Not verified
Marketplace source
.claude-plugin/marketplace.json
Scanner
HOL plugin scanner
Security result
Partial scan
Digest verified
Yes
4 bundled skillsRead, copy or download each SKILL.mdOpen skills

Trust and security

Trust & reputation

79

HOL Trust Score

Per-metric points (0–100 each) combined via a weighted average into the overall score.

Installability
100/100
Maintenance
100/100
MCP server setup
100/100
Plugin Security
92/100
Provenance
70/100
Publisher Quality
75/100

Provenance

Plugin root
.
Source repo
https://github.com/jangtrinh/design-os-code2flow
Source commit
7ed0342d6e81…
Publisher verified
No
Owner verified
Not owner verified
Agent Plugins 1.0
Not detected

Continuous scanner CI not detected

This plugin remains listed. Its overall trust score is reduced by 10% because security checks are not maintained in the source repository's CI.

Optional: maintain the scanner in the source repository's CI to receive the full trust score. Listing does not require that change.

README badge not detected

Plugin owners can add the HOL badge to the repository README from Guard Plugins. Distribution, not security evidence. It adds a 2% engagement adjustment to the overall trust score and never changes the security result.

Partial scan
Security result
92
Score from finished checks
0
High findings

Some checks did not finish: Cisco skill scan. No blocking issue was found in the checks that did finish, but this is not a passed scan.

Provider
codex-plugin-scanner
Grade
A · Excellent
Version
3.24.2
codex:hol-plugin-scanner-3Donex / cisco-skill-scanner: failedcodex:hol-plugin-scanner-3Donex / cisco-mcp-scanner: skipped

[claude:.] Claude Plugin

18/18

5 checks

[claude:.] Security

16/16

6 checks

[claude:.] Operational Security

3/6

5 checks

[claude:.] Code Quality

10/10

2 checks

[codex:.] Manifest Validation

28/31

9 checks

[codex:.] Security

16/16

9 checks

[codex:.] Operational Security

3/6

5 checks

[codex:.] Best Practices

9/12

5 checks

[codex:.] Marketplace

15/15

3 checks

[codex:.] Skill Security

5/5

4 checks

[codex:.] Code Quality

10/10

2 checks

Published advisories

None matched in GitHub security advisories, checked . This covers published advisories only, not problems nobody has reported.

GitHub security advisories are those the source repository has published.

Findings

lowoperational-securityDEPENDABOT_MISSINGReported 2 times

Automation or dependency surfaces exist, but .github/dependabot.yml is missing.

Add Dependabot updates for GitHub Actions and dependency manifests.

infomanifest-validationPLUGIN_JSON_INTERFACE_ASSET_TERMSOFSERVICEURL

The interface field "termsOfServiceURL" must use HTTPS or point to a safe in-repo asset.

Update "termsOfServiceURL" to use HTTPS or an existing relative asset path.

infomanifest-validationPLUGIN_JSON_INTERFACE_ASSET_SCREENSHOTS

The interface field "screenshots" must use HTTPS or point to a safe in-repo asset.

Update "screenshots" to use HTTPS or an existing relative asset path.

infobest-practicesCODEXIGNORE_MISSING

A .codexignore file helps prevent accidental inclusion of local artifacts and secrets.

Add a .codexignore file with generated assets, local state, and secret paths.

Install guidance

Install in Claude Code

Install through the Claude Code plugin marketplace.

Claude Code plugin docs

Optional: install HOL Guard for Claude Code first, so it can check this plugin's tools on your machine before Claude Code uses them.

  1. 1

    Add the marketplace

    Run this inside a Claude Code session. It registers the marketplace manifest shipped at the repository root. If the repository ships none, add the generated entry from the Advanced section below first.

    claude code
  2. 2

    Install the plugin

    Installs the design-os-code2flow entry from the design-os-code2flow marketplace.

    claude code
  3. 3

    Scripted alternative

    Non-interactive equivalent for scripts and CI pipelines. Add --scope project to pin the install to one repository.

    shell
  4. 4

    Check it is installed

    Lists installed plugins. The entry should appear as enabled.

    shell

To remove it later, run claude plugin uninstall design-os-code2flow@design-os-code2flow.

Did setup work in Claude Code?

No setup reports for Claude Code yet. Self-reported by signed-in visitors. Copying a command is not counted, and most installs are never reported.

Attested installs: Fewer than 10 attested installs of this plugin in week 2026-W44, so no number is shown. Counted from opt-in HOL Guard install reports, once per machine and runtime, and never mixed with the answers above. How install reports work.

Loading reviews

Plugin manifest

{
  "name": "design-os-code2flow",
  "description": "Local-first AST codebase-to-user-flow mapper and 11-heuristic UX gap auditor across 7 frontend and mobile frameworks.",
  "version": "1.0.0",
  "author": {
    "name": "Jang Trinh",
    "url": "https://github.com/jangtrinh"
  },
  "homepage": "https://jangtrinh.github.io/design-os-code2flow/",
  "repository": "https://github.com/jangtrinh/design-os-code2flow",
  "license": "LicenseRef-PolyForm-Shield-1.0.0",
  "keywords": [
    "code2flow",
    "user-flow",
    "ux-audit",
    "static-analysis",
    "nextjs",
    "swiftui",
    "mermaid",
    "design-os"
  ],
  "skills": "./",
  "interface": {
    "displayName": "DESIGN:OS Code2Flow",
    "developerName": "DESIGN:OS",
    "shortDescription": "Local-first AST codebase-to-user-flow mapper and 11-heuristic UX gap auditor across 7 frontend and mobile frameworks.",
    "longDescription": "Statically analyze Next.js, React Router, TanStack Router, Expo Router, SwiftUI, Flutter, and Jetpack Compose repositories to generate Mermaid user-flow graphs and catch dead-end screens, missing error boundaries, and unguarded auth routes.",
    "category": "Developer Tools",
    "capabilities": [
      "Read",
      "Write"
    ],
    "websiteURL": "https://jangtrinh.github.io/design-os-code2flow/",
    "privacyPolicyURL": "https://github.com/jangtrinh/design-os-code2flow/blob/main/PRIVACY.md",
    "defaultPrompt": [
      "Scan this Next.js App Router repository with code2flow, generate the Mermaid user-flow diagram, and list all high-severity UX gaps.",
      "Audit our SwiftUI navigation stack for dead-end screens, missing loading/error states, and unguarded destructive actions.",
      "Export a JSON + Markdown user-flow topology report for our PR review gate."
    ],
    "brandColor": "#202020",
    "composerIcon": "./docs/images/composer-icon.svg",
    "logo": "./docs/images/cover.png"
  },
  "holManifestOrigin": "repository",
  "registryIndexVersion": 9
}

Marketplace source

Repo URL
https://github.com/jangtrinh/design-os-code2flow
Marketplace path
.claude-plugin/marketplace.json
Source path
plugins/jangtrinh/design-os-code2flow
Install policy
AVAILABLE

Skills

4 SKILL.md files ship with this plugin. Preview, copy, or download each one, then install them with the Skills CLI.

Share
skills-cli
  • code2flow-answer-flow-questions

    .claude/skills/code2flow-answer-flow-questions/SKILL.md

    Answer questions about a scanned app's user flows from Code2Flow's machine-readable outputs — "how does a user get from A to B", "which screens are unreachable or dead ends", "where does the PRD disagree with the code", "what is behind this arrow" — with file:line evidence and confidence, without opening the canvas. Use after `code2flow run`/`scan` has produced `<repo>/.code2flow/graph.json`.

    SKILL.md content is not in this snapshot. Open the raw file to copy it from the source repository.

  • code2flow-map-codebase

    .claude/skills/code2flow-map-codebase/SKILL.md

    Map a Next.js App Router repo into a Code2Flow user-flow canvas end to end (init → run → read the summary → report), respecting the fixed localhost port and leaving no server running. Use when a PO or teammate asks "show me the flows / screens / how users move through this app", when a PRD needs checking against code, or before writing user stories for an existing product.

    SKILL.md content is not in this snapshot. Open the raw file to copy it from the source repository.

  • code2flow-stories-from-prd

    .claude/skills/code2flow-stories-from-prd/SKILL.md

    Turn a PRD markdown into a Code2Flow Story Manifest (code2flow.stories.json v3, v2 structure plus optional audience captions, presenter notes, cues, Audience Names and locales for the Stage) using the prompt pack produced by `code2flow stories scaffold`, then validate it against the scanned graph and report PRD-vs-code drift. Use when a PO wants user-story lanes or a presentable Stage on the Code2Flow canvas, or when a PRD changed.

    SKILL.md content is not in this snapshot. Open the raw file to copy it from the source repository.

  • design-os-code2flow

    skills/design-os-code2flow/SKILL.md

    Use when working with DESIGN:OS Code2Flow — Local-first AST codebase-to-user-flow mapper and 11-heuristic UX gap auditor across 7 frontend and mobile frameworks.

    SKILL.md content is not in this snapshot. Open the raw file to copy it from the source repository.

File inventory

.agents/plugins/marketplace.json

file

382 bytes

7741a01352476f8e…

.claude-plugin/marketplace.json

file

329 bytes

f0377395e831b547…

.claude-plugin/plugin.json

file

620 bytes

d442dc40f032fc91…

.claude/skills/code2flow-answer-flow-questions/SKILL.md

skill

3,571 bytes

15aca454a8acef75…

.claude/skills/code2flow-map-codebase/SKILL.md

skill

3,981 bytes

1004b575d1cfd0cc…

.claude/skills/code2flow-stories-from-prd/SKILL.md

skill

4,632 bytes

9c143a843797e7ae…

.codex-plugin/plugin.json

plugin-manifest

1,752 bytes

054d690bf8c1add9…

AGENTS.md

file

2,953 bytes

5ed865eb4a9943e4…

CLAUDE.md

file

295 bytes

ebefac51110fccc6…

commands/doctor.md

file

1,292 bytes

733f847bb244787a…

docs/images/composer-icon.svg

file

554 bytes

f47814915012067a…

docs/images/cover.png

file

262,404 bytes

1e042c2315e16155…

GEMINI.md

file

309 bytes

53537cf633720870…

LICENSE

file

7,772 bytes

084817c9b72617f1…

package-lock.json

file

76,210 bytes

a240349758358227…

package.json

file

2,271 bytes

a94e66046421bed4…

prompts/doctor.md

file

1,292 bytes

733f847bb244787a…

README.md

file

17,590 bytes

dd1db686f054bc07…

SECURITY.md

file

618 bytes

24e3c7bbdb418ce8…

skills/design-os-code2flow/SKILL.md

skill

2,356 bytes

edd4523ec3d537e7…

tsconfig.json

file

300 bytes

8ca0537bcb4b56fd…

DESIGN:OS Code2Flow — Frequently asked questions

What is DESIGN:OS Code2Flow?
DESIGN:OS Code2Flow is an AI plugin in the HOL registry. Free, source-available (PolyForm Shield) local-first mapper that turns a Next.js, React Router, SwiftUI, Flutter or Compose codebase into a Mermaid user-flow graph and audits it for UX gaps like dead-end screens.
How do I install DESIGN:OS Code2Flow?
Install DESIGN:OS Code2Flow in your harness: Codex — codex plugin marketplace add jangtrinh/design-os-code2flow; Claude Code — /plugin marketplace add jangtrinh/design-os-code2flow; Any agent — npx [email protected] add jangtrinh/design-os-code2flow. Full step-by-step guidance is on the HOL plugin page.
How do I install DESIGN:OS Code2Flow in HOL Guard?
To install DESIGN:OS Code2Flow in HOL Guard, start with hol-guard plugin install design-os/design-os-code2flow --apply. The complete step-by-step install guide for HOL Guard is on the HOL plugin page.
How do I install DESIGN:OS Code2Flow in Codex?
To install DESIGN:OS Code2Flow in Codex, start with codex plugin marketplace add jangtrinh/design-os-code2flow. The complete step-by-step install guide for Codex is on the HOL plugin page.
How do I install DESIGN:OS Code2Flow in Claude Code?
To install DESIGN:OS Code2Flow in Claude Code, start with /plugin marketplace add jangtrinh/design-os-code2flow. The complete step-by-step install guide for Claude Code is on the HOL plugin page.
How is the Trust Score for DESIGN:OS Code2Flow computed?
DESIGN:OS Code2Flow has a HOL Trust Score of 79 out of 100. The score is a weighted sum of six components from a static scan of the source, capped for high-severity findings and adjusted by two disclosed policies. Memberships and payments are not inputs, and a scan is not a safety guarantee. Full breakdown: https://hol.org/registry/plugins/design-os%2Fdesign-os-code2flow/trust
Who publishes DESIGN:OS Code2Flow?
DESIGN:OS Code2Flow is published by DESIGN:OS and listed on HOL.

Directory acceptance

Listed in 1 of 5 directory lists

Read from the list each directory publishes on GitHub. Being listed means the directory accepted the plugin; it is not a HOL security rating.

Lists last read . HOL re-reads them every day.

Submitting it? Check it against each directory's rules

Install signal

HOL cannot see every install. These are separate signals from different sources, so they are not added together. Counts under each floor show as <N.

Install commands issued here
<5
HOL Guard install commands issued from this listing, last 28 days.
Opt-in install reports
<10
Machines that reported installing it through HOL Guard in week 2026-W44. Reporting is opt-in, so most installs are not counted.
HOL Guard workspaces
<5
Workspaces that approved it or include it in an approved-plugin feed, as of today.

Reviews and similar plugins