vista

Vista

A Claude Code plugin for visual feature planning, architecture diagramming, and autonomous development loops.

Vista adds MCP tools to Claude Code that let you plan features visually, generate architecture diagrams, and run autonomous "Ralph" loops that execute multi-step development tasks with progress tracking via a built-in web dashboard.

The problem

As codebases and projects grow, maintaining them and adding new features becomes complex. There are many dependencies for new features and understanding data flows can be difficult.

How Vista solves this

• Sharable docs — Export feature docs as self-contained HTML files that teammates can open in a browser.
• Engaging and interactive spec review — Use visual planning and browser-based review flows to collaborate on specs.
• Clearer code understanding — Generate architecture and flow visualizations that make dependencies and system behavior easier to follow.

Features

• Feature Planning — Structure features with jobs-to-be-done, specs, and review gates before implementation.
• Feature Sharing — Export feature documentation as a self-contained HTML file that can be shared with other users and viewed in any browser without installing the plugin.
• Architecture Diagrams — Generate and work with technical visualizations including Mermaid (.mmd), PlantUML (.puml), D2 (.d2), Graphviz (.dot), and Draw.io (.drawio), markdown (.md) for architecture maps, API flows, database schemas, and state/process flows. Especially useful when codebases grow or new features require complex ERD diagrams.
• Ralph Loops — Autonomous development loops that plan and build features iteratively, with real-time progress on a local dashboard.
• The Companion — Browser-based web UI for running Claude Code sessions with streaming and tool call visibility. Used for editing diagrams right inside the app.
• Skills — Extensible skill system for planning, TDD, specs, and more
• Multi-Provider — Works with Claude Code and OpenCode

Installation

Requirements

• Claude Code CLI
• Python 3.10+
• Bun runtime (only needed for The Companion web UI)

Install

# Clone the repository
git clone https://github.com/ribeec20/vista-marketplace.git

# Install Python dependencies
pip install -r vista-marketplace/vista/requirements.txt

# Install as a Claude Code plugin
claude plugin add /path/to/vista-marketplace/vista

Getting Started

Once installed, Vista's MCP server starts automatically when Claude Code launches. The web dashboard opens at http://localhost:3456 and serves as a central hub for monitoring loops, viewing diagrams, and managing features.

Using Vista

Vista works through slash commands (skills) that you type directly in Claude Code. Each command triggers an interactive workflow:

/vista            # Open the dashboard and register a project
/plan my-feature  # Plan a new feature with guided questions
/diagrams         # Generate architecture diagrams for your codebase
/ralph            # Launch an autonomous development loop

A typical workflow looks like:

1. Open Vista — Run /vista to launch the dashboard and register your project.
2. Plan a feature — Run /plan <feature-name> to walk through requirements, jobs-to-be-done, and architecture decisions. Vista creates structured artifacts in .vista/features/.
3. Generate diagrams — Run /diagrams to produce Mermaid, PlantUML, D2, Graphviz, or Draw.io visualizations of your system.
4. Write specs — Run /specs <feature-name> to generate topic-based specifications from your plan.
5. Build with Ralph — Run /ralph to start an autonomous loop that iteratively plans or builds a feature, with live progress on the dashboard.
6. Share — Export feature docs as self-contained HTML files to share with your team.

The Dashboard

The Vista dashboard at localhost:3456 provides:

• Ralph monitor — Real-time progress for running autonomous loops, with logs, iteration tracking, and stop controls.
• Feature browser — View and manage feature plans, specs, and diagrams.
• Diagram viewer — Rendered previews of architecture diagrams with expand and raw-source options.

Architecture

Vista is a two-component system: a Python MCP server (the plugin) and an optional Bun/React web UI (The Companion).

Plugin (Python MCP Server)

MCP Server (mcp_server.py, stdio transport)
  |-- FastMCP 3.0 tools: ralph_start, ralph_stop, ralph_status, ralph_summary, ralph_providers
  |-- Launches FastAPI dashboard as daemon thread on port 3456
  |-- Detects client type (Claude Code vs OpenCode)