Repolode
Innei

Innei/ryugi

A workflow plugin for coding agents that brainstorms with mockups, gets spec approval, then builds under TDD, with live visual artifacts.

Stars
367
Forks
15
Open issues
4
Last commit
yesterday

What is it?

Ryugi is a development workflow for coding agents. Instead of having an agent jump straight into code, it moves through stages: brainstorming, mockups, a spec the user approves, then implementation under test-driven development, and finally verification against the approved design.

The agent's output is shown as live artifacts rather than only text. These include an artboard for comparing several UI directions side by side with comments on specific pixels, a design document with diagrams and inline comments, an HTML test bench with real sliders, and a verify view that puts built screenshots next to the approved design so the user can pass or reject them.

Ryugi installs as a plugin for a range of agent harnesses, including Claude Code, Codex, Cursor, Gemini CLI and others. A local artifact library runs through npx ryugi-artifacts, and sharing links goes through Ryugi Cloud. It is a fork of Superpowers v7.0.0.

Key features

  • 01Brainstorms and produces mockups before any code is written
  • 02Requires user approval of a spec before implementation
  • 03Builds under test-driven development
  • 04Artboard for comparing UI options side by side with pixel comments
  • 05Design documents with diagrams and editable comments
  • 06Verify view compares built screenshots against the approved design

Use cases

  • Exploring several UI directions for a web or app feature before committing to one
  • Reviewing a design document with inline comments before implementation starts
  • Tuning animation or interaction parameters with live sliders in an HTML page
  • Checking that an agent's built UI matches the approved design

Quick start

  1. 1

    In Claude Code, add the Ryugi marketplace

    /plugin marketplace add Innei/ryugi
  2. 2

    Install the Ryugi plugin

    /plugin install ryugi@ryugi-dev
  3. 3

    Send your first request to start brainstorming before any code is written

Things to know

  • The artifacts application is AGPL-3.0-only, so a modified version run as a network service must offer its source to users.
  • The repository's license metadata is not cleanly detected, so licensing needs a manual check across its parts.

In collections

Topics

FAQ

What is ryugi?
A workflow plugin for coding agents that brainstorms with mockups, gets spec approval, then builds under TDD, with live visual artifacts. Ryugi is a development workflow for coding agents. Instead of having an agent jump straight into code, it moves through stages: brainstorming, mockups, a spec the user approves, then implementation under test-driven development, and finally verification against the approved design.
Is ryugi free to use? What license does it have?
ryugi is open source under the Other license. Check the license terms before using it in commercial products.
Is ryugi still maintained?
Actively maintained. The last commit to ryugi was on Nov 7, 2026.
What can I use ryugi for?
Exploring several UI directions for a web or app feature before committing to one Reviewing a design document with inline comments before implementation starts Tuning animation or interaction parameters with live sliders in an HTML page Checking that an agent's built UI matches the approved design
How do I install ryugi?
In Claude Code, add the Ryugi marketplace: /plugin marketplace add Innei/ryugi Install the Ryugi plugin: /plugin install ryugi@ryugi-dev Send your first request to start brainstorming before any code is written
Where can I get ryugi?
The source code and installation instructions are on GitHub: https://github.com/Innei/ryugi

Summary generated by AI from the project's README. GitHub stats refresh daily.

Related projects