Skip to content

docs: turn intro-video visuals into a Taskplane Overview microsite #583

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
HenryLach merged 1 commit into from
May 18, 2026
Merged

docs: turn intro-video visuals into a Taskplane Overview microsite #583

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 3 additions & 12 deletions docs/video/visuals/01-origin-timeline.html → ...askplane-overview/01-origin-timeline.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V1 — Origin timeline</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
/* V1-only: faint grid pattern behind the timeline */
body {
Expand Down Expand Up @@ -100,6 +100,7 @@
<div class="frame">
<div class="eyebrow">
<span>1 · Origin</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<span class="disabled" aria-label="Previous (none)">&larr;</span>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down Expand Up @@ -146,14 +147,4 @@ <h1>The road to Taskplane</h1>
<div class="card-title">Taskplane</div>
<div class="card-meta">today · deterministic orchestration</div>
<div class="card-desc">Four agents. Verbose packets. File-backed state. Worktree isolation. Cross-model reviews. Semantic merges. A web-based dashboard to drive observability.</div>
<div class="lesson"><span class="lk">rule →</span> <span class="lv">Autonomy is fine. Inspectable autonomy is the goal.</span></div>
</div>
</div>
</div>

<div class="footer-tag">
vibe → ralph → parallel ralph → <span class="hl">taskplane</span> · ~1M lines of AI-generated code along the way
</div>
</div>
</body>
</html>
<div class="lesson"><span class="lk">rule →</span> <
16 changes: 3 additions & 13 deletions ...deo/visuals/02-light-factory-vs-dark.html → ...ne-overview/02-light-factory-vs-dark.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V2 — Light factory vs dark factory</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
.split {
display: grid;
Expand Down Expand Up @@ -96,6 +96,7 @@
<div class="frame">
<div class="eyebrow">
<span>2 · Philosophy</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<a href="01-origin-timeline.html" aria-label="Previous">&larr;</a>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down Expand Up @@ -129,15 +130,4 @@ <h1>Light factory vs dark factory</h1>
<li class="trait"><div class="glyph">✓</div><div class="trait-text">File-backed state. <span class="dim">.DONE, STATUS.md, batch-state.json. Resume from any crash.</span></div></li>
<li class="trait"><div class="glyph">✓</div><div class="trait-text">Worktree isolation. <span class="dim">Every lane is its own checkout. No collisions, ever.</span></div></li>
<li class="trait"><div class="glyph">✓</div><div class="trait-text">Cross-model reviews. <span class="dim">Different family on the other side. Independent quality gate.</span></div></li>
<li class="trait"><div class="glyph">✓</div><div class="trait-text">Dashboard reads disk. <span class="dim">SSE-streamed truth. Cannot lie. Doesn't decide.</span></div></li>
</ul>
<div class="floor-banner">visibility → full · recoverability → atomic · operator clarity → first-class</div>
</div>
</div>

<div class="footer-note">
autonomy is fine — <span class="hl">inspectable autonomy is the goal</span>
</div>
</div>
</body>
</html>
<li class="trait"><div class="glyph">✓</div><div class="trait-text">Dashboard reads disk. <span class="dim">SSE-streamed truth. Cannot lie. Doesn't decide.</
9 changes: 3 additions & 6 deletions docs/video/visuals/03-agent-quartet.html → .../taskplane-overview/03-agent-quartet.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V3 — Agent quartet</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
.grid {
display: grid;
Expand Down Expand Up @@ -112,6 +112,7 @@
<div class="frame">
<div class="eyebrow">
<span>3 · Roster</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<a href="02-light-factory-vs-dark.html" aria-label="Previous">&larr;</a>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down Expand Up @@ -188,8 +189,4 @@ <h1>The agent quartet</h1>
</div>

<div class="flow-band">
<span class="hl-p">supervisor</span> <span class="arrow">→</span> spawns <span class="hl-g">worker</span> per lane <span class="arrow">→</span> worker calls <span class="hl-a">reviewer</span> at step boundaries <span class="arrow">→</span> wave completes <span class="arrow">→</span> <span class="hl-b">merger</span> combines lanes <span class="arrow">→</span> next wave
</div>
</div>
</body>
</html>
<span class="hl-p">supervisor</span> <span class="arrow">→</span> spawns <span class="hl-g">worker</span
4 changes: 3 additions & 1 deletion ...video/visuals/04-task-packet-anatomy.html → ...lane-overview/04-task-packet-anatomy.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V4 — Anatomy of a task packet</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
.split {
display: grid;
Expand Down Expand Up @@ -98,6 +98,7 @@
<div class="frame">
<div class="eyebrow">
<span>4 · The contract</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<a href="03-agent-quartet.html" aria-label="Previous">&larr;</a>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down Expand Up @@ -189,3 +190,4 @@ <h1>Anatomy of a Taskplane task packet</h1>
</div>
</body>
</html>
16 changes: 3 additions & 13 deletions ...ideo/visuals/05-determinism-spectrum.html → ...ane-overview/05-determinism-spectrum.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V5 — Determinism spectrum</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
.bar-wrap { padding: 0 8px; margin-bottom: 86px; }
.bar-labels {
Expand Down Expand Up @@ -125,6 +125,7 @@
<div class="frame">
<div class="eyebrow">
<span>5 · Design philosophy</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<a href="04-task-packet-anatomy.html" aria-label="Previous">&larr;</a>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down Expand Up @@ -175,15 +176,4 @@ <h1>Where Taskplane sits on the determinism spectrum</h1>
<li class="item">Supervisor steering<span class="sub">when / what to inject</span></li>
<li class="item">Discovery hydration<span class="sub">checkbox expansion at runtime</span></li>
<li class="item">Verify-then-fix<span class="sub">test failures post-merge</span></li>
<li class="item">Exit interception<span class="sub">supervisor re-steer up to 2×</span></li>
</ul>
</div>
</div>

<div class="principle">
Two runs of the same batch produce the same waves, the same lanes, the same branch names —<br>
<span class="hl">only the contents of the model's tokens differ.</span>
</div>
</div>
</body>
</html>
<li class="item">Exit inter
16 changes: 3 additions & 13 deletions .../video/visuals/06-cross-model-review.html → ...plane-overview/06-cross-model-review.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V6 — Cross-model review flow</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
.flow {
display: grid;
Expand Down Expand Up @@ -189,6 +189,7 @@
<div class="frame">
<div class="eyebrow">
<span>6 · The independent gate</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<a href="05-determinism-spectrum.html" aria-label="Previous">&larr;</a>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down Expand Up @@ -257,15 +258,4 @@ <h1>Cross-model reviews</h1>
</div>
<div class="verdict unavail">
<div class="verdict-name">UNAVAILABLE</div>
<div class="verdict-desc">Reviewer crashed / timed out. Worker proceeds cautiously. Logged for the operator.</div>
</div>
</div>

<div class="footer-line">
review levels per task → <span class="hl-g">0</span> none · <span class="hl-g">1</span> plan · <span class="hl-a">2</span> plan + code · <span class="hl-a">3</span> plan + code + test
<br />step 0 (preflight) and the final step (docs) always skip
</div>

</div>
</body>
</html>
<div class="verdict-desc">Reviewer crashed / timed out. Worker proceeds cautiously. Logged for the operator.</div
14 changes: 3 additions & 11 deletions docs/video/visuals/07-mailbox-protocol.html → ...skplane-overview/07-mailbox-protocol.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V7 — Mailbox protocol</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
.topology {
display: grid;
Expand Down Expand Up @@ -136,6 +136,7 @@
<div class="frame">
<div class="eyebrow">
<span>7 · Steering</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<a href="06-cross-model-review.html" aria-label="Previous">&larr;</a>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down Expand Up @@ -202,13 +203,4 @@ <h1>The file-based mailbox</h1>
</div>
<div class="prop">
<div class="prop-name">bidirectional</div>
<div class="prop-desc">agents reply into outbox/ — the engine polls and surfaces alerts to the supervisor.</div>
</div>
<div class="prop">
<div class="prop-name">portable</div>
<div class="prop-desc">windows, macOS, linux — same protocol. no sockets, no named pipes, no daemon.</div>
</div>
</div>
</div>
</body>
</html>
<div class="prop-desc">agents reply into
14 changes: 3 additions & 11 deletions ...deo/visuals/08-waves-lanes-worktrees.html → ...ne-overview/08-waves-lanes-worktrees.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V8 — Waves, lanes, worktrees</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
.legend {
display: flex;
Expand Down Expand Up @@ -172,6 +172,7 @@
<div class="frame">
<div class="eyebrow">
<span>8 · Execution hierarchy</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<a href="07-mailbox-protocol.html" aria-label="Previous">&larr;</a>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down Expand Up @@ -296,13 +297,4 @@ <h1>Batch, waves, lanes, worktrees, tasks</h1>
</div>
<div class="rule r2">
<div class="rule-name">Lanes are parallel</div>
<div class="rule-desc">Up to <code>max_lanes</code> within a wave. Each lane is one subprocess worker against one worktree against one branch.</div>
</div>
<div class="rule r3">
<div class="rule-name">Tasks share lanes when scopes overlap</div>
<div class="rule-desc">Affinity-first assignment. Overlapping <code>## File Scope</code> entries collapse onto the same lane and run serially.</div>
</div>
</div>
</div>
</body>
</html>
<div class="rule-desc">Up to <code>max_lanes</code> within a
22 changes: 3 additions & 19 deletions ...video/visuals/09-branching-lifecycle.html → ...lane-overview/09-branching-lifecycle.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V9 — Branching lifecycle</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
.graph-card {
background: var(--surface);
Expand Down Expand Up @@ -120,6 +120,7 @@
<div class="frame">
<div class="eyebrow">
<span>9 · Git topology</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<a href="08-waves-lanes-worktrees.html" aria-label="Previous">&larr;</a>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down Expand Up @@ -243,21 +244,4 @@ <h1>How Taskplane uses branches</h1>
<div class="step-title">wave merge</div>
<div class="step-desc">After each wave, a merge agent combines lane branches back into orch. Next wave sees the previous wave's merged changes.</div>
</div>
<div class="step s4">
<div class="step-num">4</div>
<div class="step-title">all waves complete</div>
<div class="step-desc">Orch branch now holds the full batch result. Your working branch is still untouched.</div>
</div>
<div class="step s5">
<div class="step-num">5</div>
<div class="step-title">/orch-integrate</div>
<div class="step-desc">Fast-forward, merge commit, or open a PR. Your choice. Always an explicit step.</div>
</div>
</div>

<div class="rule">
your <span class="pink">working branch</span> is sacred — <span class="hl">never touched</span> until <code style="font-family:var(--mono); color:var(--green); background:var(--bg); padding:1px 5px; border-radius:3px;">/orch-integrate</code>
</div>
</div>
</body>
</html>
<div class="step
15 changes: 3 additions & 12 deletions docs/video/visuals/10-semantic-merge.html → ...taskplane-overview/10-semantic-merge.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V10 — Semantic merge vs git merge</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
.split {
display: grid;
Expand Down Expand Up @@ -130,6 +130,7 @@
<div class="frame">
<div class="eyebrow">
<span>10 · The merge agent</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<a href="09-branching-lifecycle.html" aria-label="Previous">&larr;</a>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down Expand Up @@ -199,14 +200,4 @@ <h1>Semantic merge vs git merge</h1>
<div class="ms">
<div class="ms-num">5</div>
<div class="ms-name">result.json</div>
<div class="ms-desc">Engine polls. Counters update. Next wave provisions.</div>
</div>
</div>
</div>

<div class="monitor">
merge health monitor polls every 2 min · <span class="hl-a">stale at 10</span> · <span class="hl-r">stuck at 20</span> · emits events, never kills autonomously
</div>
</div>
</body>
</html>
<div class="ms-desc">Engine polls. Counters u
13 changes: 3 additions & 10 deletions docs/video/visuals/11-polyrepo-segments.html → ...kplane-overview/11-polyrepo-segments.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V11 — Polyrepo segments</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
.workspace {
background: var(--surface);
Expand Down Expand Up @@ -194,6 +194,7 @@
<div class="frame">
<div class="eyebrow">
<span>11 · The hard case</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<a href="10-semantic-merge.html" aria-label="Previous">&larr;</a>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down Expand Up @@ -273,12 +274,4 @@ <h1>Polyrepo: tasks decompose into segments</h1>
<div class="rule k2">
<div class="rule-name">Segment isolation</div>
<div class="rule-desc">Workers <em>read</em> across all repos for planning. They <em>write</em> only to the active segment repo + the packet home.</div>
</div>
<div class="rule k3">
<div class="rule-name">Per-repo orch branches</div>
<div class="rule-desc">An <code>orch/…</code> branch is created in <em>every</em> repo with work. <code>/orch-integrate</code> loops over all of them.</div>
</div>
</div>
</div>
</body>
</html>
</div>
Binary file renamed ...ideo/visuals/12-dashboard-visibility.html → ...ane-overview/12-dashboard-visibility.html
View file
Open in desktop
Binary file not shown.
3 changes: 2 additions & 1 deletion docs/video/visuals/13-why-pi.html → docs/taskplane-overview/13-why-pi.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V13 — Why pi</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
.reasons {
display: grid;
Expand Down Expand Up @@ -90,6 +90,7 @@
<div class="frame">
<div class="eyebrow">
<span>13 · The foundation</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<a href="12-dashboard-visibility.html" aria-label="Previous">&larr;</a>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down
3 changes: 2 additions & 1 deletion docs/video/visuals/14-pi-capabilities.html → ...askplane-overview/14-pi-capabilities.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<title>V14 — Pi capabilities</title>
<link rel="stylesheet" href="_shared.css">
<link rel="stylesheet" href="shared.css">
<style>
.capabilities {
display: grid;
Expand Down Expand Up @@ -90,6 +90,7 @@
<div class="frame">
<div class="eyebrow">
<span>14 · The engineering surface</span>
<img class="eyebrow-logo" src="taskplane-word-white.svg" alt="Taskplane">
<nav class="page-nav" aria-label="Page navigation">
<a href="13-why-pi.html" aria-label="Previous">&larr;</a>
<a href="index.html" aria-label="Index">&#9675;</a>
Expand Down
Loading