flow-next-visual

Restate specs, tasks, diffs, or topics as compact markdown visual digests.

692|55|Updated Dec 26, 2025
One-click install
npx skills add https://github.com/gmickel/gmickel-claude-marketplace --skill flow-next-visual
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: flow-next-visual
Source: https://github.com/gmickel/gmickel-claude-marketplace/tree/main/plugins/flow-next/codex/skills/flow-next-visual
Command: npx skills add https://github.com/gmickel/gmickel-claude-marketplace --skill flow-next-visual

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Long specs, task lists, and diffs force reviewers to read everything to find what matters. This Skill restates one thing visually as a compact markdown digest on a single screen, so the reader scans the shape, spots the wrong thing, and drills into only that file.

Core Features & Use Cases

  • Spec digests: Renders a thesis, task tree, planned file-layout diff, shape sketch, R-ID coverage line, and boundaries from flow-next spec and task files via flowctl.
  • Diff digests: Builds rename-aware file-layout diffs from git ranges with churn stats and call-tree sketches of load-bearing structural changes.
  • Ad-hoc restates: Restates the current conversation topic or pointed-at text using a shape vocabulary (pseudocode, call trees, component trees, diff-fenced sketches, type signatures, tables) with strict grounding rules against hallucination.
  • Use Case: After planning a feature, ask for a visual walkthrough of the spec to see the task dependency tree, which files each task owns, and which requirements are uncovered — all on one screen.

Quick Start

Ask the assistant to walk you through the current spec or diff visually as a compact markdown digest.

Frequently Asked Questions about flow-next-visual

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I visualize a spec or plan as a markdown digest?

Invoke the visual digest with a spec id to get a thesis, task tree in dependency order, planned file-layout diff, shape sketch, R-ID coverage line, and boundaries on one screen. It reads the spec and task files through flowctl and renders fenced markdown blocks in chat.

How do I summarize a git diff before reviewing it?

Pass a git range like main..HEAD or the word diff to get a diff digest with rename-aware file paths from git diff --name-status, churn from --stat, and a call-tree sketch of the load-bearing structural change. On a branch with no range, it defaults to the merge base with the default branch.

Does the visual digest work without flow-next installed?

Yes, it degrades gracefully. Without flowctl, a flow install, or a git repo, it falls back to an ad-hoc restate of the current topic or supplied text, with a one-line notice of what was unavailable.

Can the digest write files or export HTML reports?

No, the skill is strictly read-only and chat-only. It never writes files, mutates flow state, commits, or emits images and HTML; output is compact markdown with fenced text, diff, and code blocks rendered natively in chat.

When does the digest use mermaid diagrams?

Mermaid is a last resort, used only when interaction or sequence genuinely needs it, such as sequence or state diagrams. A text shape that carries the same point always wins, and emitted mermaid follows the make-pr mermaid rules.