Puffin

A GUI for Claude Code to help cloders collaborate on new projects.

Why Puffin?

Claude Code is extraordinary out of the box. It can take you to production for projects in the 10k-100k LoC range. But as projects grow, maintaining context, traceability, and structured collaboration becomes critical.

Puffin helps you get there faster, in a more maintainable way, with full traceability.

The key insight: prompts alone create confusion. Claude responds much better to a backlog-driven workflow:

1. Prompts generate user stories - Your specifications become structured, reviewable stories
2. Stories live in a backlog - A clear queue of work, not scattered across conversation threads
3. Pull stories into implementation threads - Focused context for each piece of work
4. Mark complete when done - Clear progress tracking and history

This history, captured outside of Claude's context window, lets you charge ahead and grow your project without losing track of what was built, why, and how.

Overview

Puffin is an Electron-based application that provides a visual interface for Claude Code, Anthropic's official CLI for Claude. Rather than replacing the terminal, Puffin wraps it—giving you full agentic capabilities (file read/write, bash execution, tool use) with a structured workflow for managing cloding projects.

Puffin's philosophy is to provide a hierarchical view of the tasks being performed by Claude with traceability to architecture and user stories so that it becomes easier to work collaboratively with Claude and other cloders, rather than just being a passive tester.

You can't "prompt along" a coding agent, just like you can't "prompt along" a developer—there are good reasons why we came up with processes and methodologies to build complex solutions. Processes and methodologies for cloding are yet to be built, but they are coming. Puffin serves as a foundation for structured collaboration between humans and AI coding agents.

Key Features:

• Project Configuration: Define your project's description, assumptions, technical architecture, and data model
• Claude Guidance Options: Set preferences for programming style (OOP, FP, Temporal Logic), testing approach, documentation level, and more
• Branched Conversations: Organize prompts into branches (Specifications, Architecture, UI, Backend, Deployment) with tree-based history navigation
• Real-time Activity Tracking: Monitor Claude's tool execution in real-time, showing current tools, file operations, and processing status
• User Story Derivation Workflow: Extract user stories from project specifications, review and refine them, then generate implementation prompts
• GUI Designer: Visual drag-and-drop interface for designing UI layouts that can be described to Claude
• User Stories Management: Full CRUD lifecycle for user stories with intelligent derivation from specifications using Claude
• Architecture Document: Living documentation that evolves with Claude reviews
• Intelligent Title Generation: Automatic prompt title generation using Claude API with smart fallback mechanisms
• CLI Output View: Real-time streaming of Claude's raw JSON output for debugging and transparency

Watch the introduction

Have Questions?

Ask in our Q&A Discussions and get AI-powered answers! Our bot uses Claude to respond to questions about Puffin, its features, and how to use it.

How It Works

Puffin opens a project directory (like VS Code) and stores its state in a .puffin/ folder within that directory. When you submit a prompt, Puffin spawns the Claude Code CLI as a subprocess, streams the response in real-time, and persists the conversation history.

Your Project/
├── .puffin/
│   ├── config.json      # Project configuration & Claude options
│   ├── history.json     # Branched conversation history
│   ├── puffin.db        # SQLite database (user stories, sprints, etc.)
│   ├── architecture.md  # Architecture document
│   └── plugins/         # Claude Code plugins/skills
├── src/
└── ...your project files

Technology Stack

• Platform: Electron 33+
• Frontend: Vanilla JavaScript (ES6+ modules)
• State Management: SAM Pattern (sam-pattern + sam-fsm)
• Database: SQLite via better-sqlite3 for persistent storage
• AI Integration: Claude Code CLI (spawned as subprocess with JSON stream

...