skills.rest
AskTinNguyen
AskTinNguyenCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

flowy-flowchart

Generate Flowy JSON diagrams from natural language descriptions.

1|Updated Jan 26, 2026
Search Tags:#workflow#json#flowchart#diagram#visual-design#state-machine#flowy
One-click install
npx skills add https://github.com/AskTinNguyen/vesper-team-skills --skill flowy-flowchart
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: flowy-flowchart
Source: https://github.com/AskTinNguyen/vesper-team-skills/tree/main/flowy-flowchart
Command: npx skills add https://github.com/AskTinNguyen/vesper-team-skills --skill flowy-flowchart

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Flowy flowcharts enable designers and developers to design and share visual diagrams (flowcharts, state machines, and processes) directly from conversations, without switching tools.

Core Features & Use Cases

  • Generate and edit diagrams in Flowy JSON format for quick visualization and collaboration
  • Support node types (rect, circle, diamond) and edge types to model flows and decisions
  • Use Case: Illustrate a login flow, onboarding flow, or feature rollout plan for design reviews and documentation.

Quick Start

Create a Flowy diagram for a user registration flow.

Frequently Asked Questions about flowy-flowchart

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

FAQPage Schema
How do I generate a flowchart from a natural language description?▼

To generate a flowchart from natural language, describe your process, navigation flow, or conditional logic. The system parses your text and outputs a structured JSON diagram file with proper versioning metadata, ready for visual rendering and validator compatibility.

What node types are supported when building state machines visually?▼

When building state machines visually, the supported node types include rect, circle, and diamond. These shapes allow you to model different stages, states, and decision points within your process diagrams using valid JSON schema.

Can I create process diagrams for design reviews without switching tools?▼

You can create process diagrams for design reviews directly from your conversation without switching tools. It generates Flowy JSON files in a designated directory, enabling quick visualization, collaboration, and sharing for documentation.

Does the generated flowchart JSON output support validator compatibility?▼

The generated flowchart JSON output supports validator compatibility by adhering to a valid JSON schema. It includes proper versioning metadata and supports defined edge types to ensure structural integrity and correct rendering.

What is the best way to model conditional logic in a user onboarding flow?▼

The best way to model conditional logic in a user onboarding flow is to use diamond node types for decisions and define specific edge types. This maps out branching processes and decision paths in the JSON schema for accurate process visualization.

Related Skills

Explore More Design & Creative Skills→
jaimedhenriquesjaimedhenriques

excalidraw-diagram-generator

Generate Excalidraw diagrams from natural language descriptions.

Community
Advanced
giadaf-booshagiadaf-boosha
10

flowy-visual

Generate JSON-based flowcharts and iOS component mockups for UI/UX design.

Community
Intermediate
viktorbezdekviktorbezdek
10

visual-communication

Generate Mermaid and C4 diagram code from textual system descriptions.

Community
Intermediate
haitao2016haitao2016

diagram-generator

Convert natural language game system descriptions into Mermaid diagrams.

Community
Intermediate