FlowForge · Case studyDemo build · fictional business, simulated data

Watch the workflow run. Watch the spreadsheet fill itself.

Marketing automation on a node canvas — triggers, enrichment, email, SMS, and Canva wired together, with runs you can watch execute step by step.

Workflow orchestrationNode canvas (SVG)Sheets syncEmail + SMS stepsRun observabilityReact + TypeScript

Live demos are password-gated — request access via the contact page and the password comes back in minutes.

Team reviewing an operations process
Demo business: Ember & Oak (fictional DTC brand)
The problem

Small marketing teams live in sheets and inboxes, re-running the same cart-rescue and welcome flows by hand — busywork that a trigger should own.

What was built

A dark-mode workflow studio: build flows as typed nodes on a canvas, fire a test run and watch nodes ignite in sequence while the connected Google Sheet appends its row on screen.

The demo shows
  • A six-node cart-rescue flow executing live, node by node
  • The Google Sheet visibly gaining row 2,487 as the run completes
  • A run log with per-node timings, payloads, and one honest failure

The challenge

Automation tools sell a feeling: the moment work happens without you. A static screenshot of a node graph doesn’t deliver it — the run has to be watchable.

Buyers coming from n8n/Zapier searches judge fast: the canvas has to read as a real editor, and the run history as production telemetry, in the first five seconds.

The solution — three decisions

01

The canvas is the first impression

Typed nodes (trigger, enrich, email, SMS, Sheets, Canva) with curved wires on a dot grid — laid out by hand for the signature flow, auto-laid for the rest.

02

Execution you can see

Test run ignites nodes in sequence — heat ring, then green check — while the wire carrying the run brightens. The Sheet panel opens itself and appends the row with a flash.

03

Honest telemetry

Six months of lumpy trend data, a run-weighted success rate, and a failed run in the log with a retry note — real systems have bad days, and showing one builds trust.

How it works

In
Triggerscart events, cron, thresholds
Enrichmentcustomer + order lookups
FlowForge orchestrator
Node graphtyped steps, wired on canvas
Run enginesequenced, logged, retried
Out
Email relaycampaign sends
SMS gatewaynudges + confirmations
Google Sheetsrows appended live
Canvarendered assets

The demo implements this shape end to end with a simulated service layer — the “extend for production” section lists what swaps in for live deployment.

Product tour

FlowForge canvas with completed run and Google Sheets panelFlowForge canvas with completed run and Google Sheets panelSix typed nodes, each ignited in sequenceThe Sheet appends row 2,487 on screen
Run complete: every node checked, and the Sheet showing the row the workflow just wrote.
Canvas mid-run with heat ring on active nodeCanvas mid-run with heat ring on active node
Mid-run: the active node pulses with a heat ring while upstream steps hold their checks.
Campaign dashboard with trend and funnelCampaign dashboard with trend and funnel
The ops view: 1,203 simulated runs in 30 days, a six-month trend, and a campaign funnel that adds up.
Run detail with per-node logRun detail with per-node log
One execution, step by step — durations, logs, and payload snippets per node.

What the demo shows

  • A repeatable on-camera run: reset, ignite, sheet update, success toast
  • Eight workflows whose run counts sum exactly to the dashboard total
  • Integrations with one honest “attention” state (an expiring Canva token)
  • A template gallery wired to real actions, not dead buttons

Under the hood

  • Canvas is hand-rolled SVG: typed nodes, bezier edges, run-order animation — no graph library
  • The run engine and the Sheet panel share state, so the row append lands mid-run, not after
  • Node identity is never color-alone: icon + label + validated dark-palette color per type
  • The portfolio’s only dark app — forge orange strictly reserved for “executing right now”
Built as a demonstration — on purpose

Ember & Oak is fictional and labeled as a demo on every screen. Nothing here is presented as client work: no client names, no outcome metrics, no testimonials. The proof is the running product — open the live demo above and check every claim.

What we’d extend for production

  • A real executor (queue + retries) behind the same run model
  • Drag-to-wire canvas editing with schema-checked node configs
  • Live Google Sheets/ESP/SMS connectors replacing the simulators
Next step

Build something like this.

Fixed scope in writing before any money moves, demos during the build, and full code ownership at handover.

1%