mermaid-creator

Translate PRD concepts and architectural notes into Mermaid diagrams.

1|Updated Jan 14, 2026
One-click install
npx skills add https://github.com/CyanAutomation/motioninocean --skill mermaid-creator-cyanautomation
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: mermaid-creator
Source: https://github.com/CyanAutomation/motioninocean/tree/main/.github/skills/mermaid-creator
Command: npx skills add https://github.com/CyanAutomation/motioninocean --skill mermaid-creator-cyanautomation

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Helps engineers and technical writers convert complex motion-in-ocean documentation into clear, standardized Mermaid diagrams for architecture, workflows, and state machines.

Core Features & Use Cases

  • Generate health/readiness diagrams to explain probe semantics (health always 200 vs readiness dependent on recording and frame freshness).
  • Produce architecture graphs for multi-host deployments and hub-and-spoke models.
  • Visualize data flows such as frame capture pipelines (Picamera2 → JpegEncoder → FrameBuffer → /stream.mjpg) to improve onboarding and troubleshooting.

Quick Start

Describe the diagram you want in one sentence, and this skill will generate a Mermaid diagram ready for embedding.

Frequently Asked Questions about mermaid-creator

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

FAQPage Schema
How do I generate Mermaid diagrams from markdown documentation?

To generate Mermaid diagrams from markdown documentation, describe the architectural concepts or data flows in a single sentence. The skill translates PRD concepts and technical notes into Mermaid syntax, outputting blocks ready for direct Markdown embedding.

How do I visualize state machines for health and readiness probes?

Visualizing state machines for health and readiness probes involves mapping probe semantics to Mermaid state diagrams. This skill translates health status logic, such as always returning 200 versus checking frame freshness, into validated Mermaid state-machine syntax.

What is the best way to document multi-host deployment architecture?

The best way to document multi-host deployment architecture is by generating Mermaid architecture graphs. This skill converts hub-and-spoke models and multi-host deployment notes into standardized Mermaid diagrams for clear technical visualization.

Can I visualize data flow pipelines like frame capture processes in Mermaid?

Yes, you can visualize data flow pipelines like frame capture processes in Mermaid. This skill translates pipeline sequences, such as Picamera2 to JpegEncoder to FrameBuffer, into Mermaid diagrams to improve onboarding and troubleshooting.

Does the generated Mermaid syntax get validated before embedding in markdown?

Generated Mermaid syntax is strictly validated before embedding in markdown. The skill enforces diagram-type correctness and validates Mermaid syntax to ensure the output blocks render properly without errors in your documentation.