---
slug: "pi-visual-plan"
source_type: "readme"
source_url: "https://cdn.jsdelivr.net/gh/OliverHeffernan/umlPiPlanAgent@main/README.md"
repo: "https://github.com/OliverHeffernan/umlPiPlanAgent"
source_file: "README.md"
branch: "main"
---
# Pi Visual Plan

This project contains [`Pi Visual Plan`](https://github.com/OliverHeffernan/umlPiPlanAgent/blob/HEAD/.pi/extensions/visual-plan/README.md), a pi extension for staged planning with live Mermaid UML diagrams.

## Installation
See the [extension README](https://github.com/OliverHeffernan/umlPiPlanAgent/blob/HEAD/.pi/extensions/visual-plan/README.md) for installation instructions.

## Quick start

```bash
cd .pi/extensions/visual-plan
npm install
cd ../../..
pi
```

In pi, run:

```text
/visual-plan on
```

Discuss the idea first. Once implementation design begins, pi writes Mermaid class/state UML into `.pi/plans/plan.md`. Run `/visual-plan open` for the live localhost view and `/visual-plan execute` after approval.