Your First 15 Minutes with Fabriq
A fast, guided walkthrough — from launch to your first approved agent change.
This is the fastest path from "just installed Fabriq" to "I just shipped an AI-assisted change with full visibility." Follow these 7 steps.
Before starting, make sure you have Fabriq installed and an AI agent available — OpenCode or Claude Code.
Step 1: Launch Fabriq and create a workspace (2 min)
When you first launch Fabriq, you'll see the launcher screen:
┌──────────────────────────────────────────────────────┐
│ Welcome to Fabriq │
│ │
│ [Open Existing Workspace] [Create New Workspace] │
└──────────────────────────────────────────────────────┘Click Create New Workspace and point Fabriq at a directory that contains a git repository you want to work with. This could be an existing project or a new empty project — either works.
Fabriq will scan the directory and create the workspace structure:
my-project/
├── .dapei/ ← Fabriq runtime data
├── docs/ ← Product knowledge (empty for now)
├── repos/ ← Your base repositories
└── features/ ← Where agent work happensStep 2: Register a repository (1 min)
From the Workspace Browser, click the Repos tab. You'll see it's empty.
Click Add Repository → point to the git repo inside your project directory → Fabriq clones it into repos/<name>/.
Workspace Browser
┌─ Workspace Assets ───────────────────────────────────┐
│ 📁 docs/ │
│ 📁 repos/ │
│ └── my-app/ ← Your registered repo │
│ │
│ [Add Repository] │
└──────────────────────────────────────────────────────┘Step 3: Connect an agent (1 min)
Go to Settings → Agent.
If you have OpenCode installed, select it from the dropdown. Same for Claude Code.
Fabriq starts the agent as a subprocess via ACP (Agent Communication Protocol). You'll see:
Agent: OpenCode v2.1.0 ● ConnectedIf the agent doesn't appear, check that it's installed and in your PATH.
Step 4: Create a feature (2 min)
Back in the Workspace Browser, click + New Feature. You'll see:
| Field | What to enter |
|---|---|
| Name | add-dark-mode-toggle |
| Description | Add a dark mode toggle to the Settings page. Use the existing Button component. Store the preference in localStorage. Must work on both desktop and mobile. |
Click Create. Fabriq:
- Creates a git worktree from your base repo — physically isolated from your main code
- Opens the Feature Workbench — your cockpit for this feature
- Starts the Analysis stage — the agent reads your project structure
Step 5: Watch the agent work (5 min)
The Feature Workbench shows you everything in real time:
┌──────────────────────────────────────────────────────────┐
│ Feature: add-dark-mode-toggle │
│ Status: Implementing (45%) │
│ │
│ Pipeline: │
│ [Design]──[Implement ●●●●●○○○○○]──[Review]──[Close] │
│ │
│ ┌─ Activity Log ────────────────────────────────────┐ │
│ │ ✓ Created worktree from main │ │
│ │ ✓ Read project structure (48 files) │ │
│ │ ✓ Found existing Button component │ │
│ │ ✓ Found Settings page at /pages/settings.tsx │ │
│ │ ⏳ Writing src/components/DarkModeToggle.tsx │ │
│ │ ! Confirm: Write 65 lines to DarkModeToggle.tsx? │ │
│ └────────────────────────────────────────────────────┘ │
│ │
│ ┌─ Changes ─────────────────────────────────────────┐ │
│ │ + src/components/DarkModeToggle.tsx (new) │ │
│ │ ± src/pages/Settings.tsx (+8) │ │
│ │ ± src/styles/theme.css (+15) │ │
│ └────────────────────────────────────────────────────┘ │
│ │
│ ┌─ Confirmation Queue ──────────────────────────────┐ │
│ │ ⏳ Write 65 lines to DarkModeToggle.tsx │ │
│ │ [Approve] [Reject] [Skip] │ │
│ └────────────────────────────────────────────────────┘ │
└──────────────────────────────────────────────────────────┘Key areas:
| Area | What it shows |
|---|---|
| Pipeline | Current stage and progress bar |
| Activity Log | Every agent action, streamed in real time |
| Changes panel | All files created or modified so far |
| Confirmation Queue | Actions waiting for your approval |
You can switch away from Fabriq while the agent works. It continues independently.
Step 6: Review and approve (2 min)
When the agent finishes implementing, it enters the Review stage. Now it's your turn.
Click on the confirmation prompt to expand it:
Action: Write file
Target: repos/my-app/src/components/DarkModeToggle.tsx
Dimension: Feature (add-dark-mode-toggle)
Lines: +65 lines (new file)
┌─ Preview ──────────────────────────────────────────┐
│ export function DarkModeToggle() { │
│ const [isDark, setIsDark] = useState(false); │
│ ... │
│ } │
└────────────────────────────────────────────────────┘
[Approve] [Reject] [Skip]Check the preview. Does the logic look right? Is it using the Button component as you requested?
If yes → click Approve. Fabriq writes the file to the worktree.
Continue reviewing each change. When you're satisfied with all of them:
- Click Approve All on the review screen
- Fabriq archives the worktree
- A feature report is saved
Step 7: See what happened (1 min)
Congratulations — you just completed a full Fabriq cycle. Let's see what was recorded:
- Feature History: The close summary is saved in
features/add-dark-mode-toggle/reports/close-summary.md - Audit Trail: Every action you approved is logged in
.dapei/runtime/audit/capability.log - Worktree: The feature worktree still exists in
features/add-dark-mode-toggle/repos/— you can inspect it or clean it up
What you've learned
In 15 minutes, you:
- ✅ Created a structured workspace
- ✅ Registered a repository
- ✅ Connected an AI agent
- ✅ Created an isolated feature worktree
- ✅ Watched the agent work in real time
- ✅ Reviewed and approved changes before they hit disk
- ✅ Completed a full feature lifecycle
This is the core loop of Fabriq: Create → Observe → Confirm → Review → Close. Everything else — validation, CDR, stage gates — builds on this foundation.
Next steps
- Feature Lifecycle: Stage by Stage — deeper dive into each stage
- Working with the Agent — guide the agent, inject context, intervene
- Key Concepts — understand the mental model behind the UI
Last updated on