Case Study
Arrowgrid Arrowgrid Blast from the past,
result of manual labor.
AG16 AG16 Skip the story,
join the fun.

Backlogs Are a Gold Mine

How AI turned a 10-year-old pet project into the app I always imagined.

Skip ahead to my automated distribution experiment

The Origins

Arrowgrid started as a simple idea in 2014 — a musical toy where you draw arrows on a grid and they generate melodies. No training needed. Just draw, listen, and discover. I built a scrappy prototype and it worked, but the vision was always bigger than what I could execute alone in spare time.

Over the years, a backlog grew. Feature ideas, UI sketches, sound engine improvements, mobile layouts, pixel art themes, MIDI export, shareable compositions… the list expanded every time I opened the project. Each idea was good. None of them shipped.

Based on Otomata by Earslap — https://earslap.com/page/otomata.html

A backlog isn't a graveyard — it's a gold mine waiting for the right tool.
AG16 live demo showing color-coded arrows and multi-voice patterns in motion
AG16 in motion — multi-voice patterns, color-coded arrows, and real-time musical flow.

Before & After

Compare the original Arrowgrid with the AI-rebuilt AG16.

Before — Arrowgrid
Arrowgrid original desktop interface
After — AG16
AG16 rebuilt desktop interface

Mobile Experience

Before
Arrowgrid original mobile interface
After
AG16 rebuilt mobile interface

The Backlog, Realized

Every feature marked with was built with AI assistance.

Improved

  • Completely rebuilt UI — pixel-art themed, vibrant colors
  • Responsive layout — mobile-first, works on any screen
  • Enhanced sound engine — richer tones, better timing
  • Performance optimized — buttery smooth on low-end devices

Added

  • 16-channel MIDI support — each channel can carry its own voice
  • Multiple instrument presets & sound packs
  • Visual feedback — animated cells, glow effects
  • Modern React + Vite stack — fast builds, hot reload

Always Wanted

  • Save and load patterns instantly
  • Pixel art aesthetic — the look I always envisioned
  • Walls for controlled routing and composition constraints
  • Color-coded arrows for multiple voices

The Process

From dusty backlog to shipped product in record time.

1

Excavate the Backlog

Gathered every feature idea, sketch, and note from 10 years of dreaming. Organized them by priority and feasibility.

2

Define the Vision

Wrote a clear spec: 16-channel MIDI support, color-coded multi-voice arrows, save/load, walls, pixel art theme, and a modern responsive stack. Every backlog item became a prompt.

3

Build with AI

Used AI coding assistants to scaffold, iterate, and refine. The backlog that would've taken years was executed in weeks.

4

Ship It

Deployed as a modern web app. Mobile-first. Fast. The app I always wanted to build — finally real.

Tech Stack

React
Vite
Web Audio API
AI-Assisted
Mobile-First
Pixel Art CSS

Try AG16

Draw arrows. Make music. See what 10 years of ideas sound like.

Launch AG16 See the Original The Pipeline Experiment