Aaron Hong
All work

Personal project · Software

n.ot.e

A real-time collaborative editor for rhythm-game levels. It runs in the browser and natively on five platforms, and it is built with an agent-driven workflow.

Open n.ot.e Take the tour Idea triage demo

Role
Solo. Product, architecture and review; the code is written by AI agents under my direction
When
July 2026 to now
Stack
TypeScript, React, Next.js, Yjs and WebRTC, Pixi.js on WebGPU, Web Audio, Rust and Tauri
Platforms
Web, Windows, macOS, Linux, Android, iOS
Size
About 200,000 lines of TypeScript and 10,000 of Rust, with more than 2,700 tests

What it is

osu! is a rhythm game whose levels, called beatmaps, are made by its players. n.ot.e is an editor for the levels of its drum mode, osu!taiko: a full authoring tool with a timeline, playback, in-editor testplay, and its own tools for the mode's scroll-speed effects.

It is collaborative in the way Google Docs or Figma are. Several people edit one map at the same time, in the browser with nothing to install, or in native apps for Windows, macOS, Linux, Android and iOS. I started it in July 2026 and release it under my osu! name, Nostril.

The guided tour at note.nostril.io/info shows what it does, one feature at a time. Every demo there is a live editor driven by a script, not a video, and the clips on this page are recorded from it.

Take the tour Open the editor
The n.ot.e editor: a dense run of red and blue notes on the note band, the SV strip below it with speed curves and linear() Transform brackets, then the toolbar and the song's details.

How it's built

n.ot.e is built with an agent-driven workflow. I run several Claude Code sessions at once, and they write the code. I decide what gets built and how it should behave, and I review what comes back.

An agent starts every session knowing nothing about the project, and it cannot see the screen or hear the audio. The project's rules and decisions are written into the repository for it, and more than 2,700 tests hold it to them.

That leaves two slow steps: getting an idea clear enough to hand over, and checking that what comes back matches the real game. I built a tool for each, with the same workflow. It is AI development used to speed up AI development.

  • The idea triageTakes a rough idea to one that is ready to hand to an agent.
  • OsuTaikoCompareMeasures n.ot.e against the real game, frame by frame, so an agent can check its own work.

The idea triage: from a napkin to a merged branch

Some of my best ideas start on a napkin during lunch. When one is ready to hand to an agent as it stands, I do that from wherever I am: I use the Claude Code mobile app heavily when I am away from my desk.

The idea triage, at note.nostril.io/develop, is for the ideas that are not there yet. It is a different interface to Claude that I built for low-stakes brainstorming, and its job is to take a rough idea to one that is ready to prompt.

I jot notes on its napkin, as in a notes app. Claude reads the code and turns each note into a card: how it read the note, what the code already does, what it would build, and how ready the idea is. What it needs from me arrives as multiple-choice questions, so working an idea through takes a few taps.

From there a card can start a Claude Code session on a branch of its own, and it follows that branch through to merge and release. A read-only demo with sample cards is public.

Open the demo
The idea triage showing a card titled Translate modding posts in the extension: on the left, the original note, Claude's reading of it, what the app does today and what it would build; on the right, a conversation with multiple-choice questions such as Which translator? and Which languages first?; along the bottom, the phase pipeline at Brainstorming.
A card while brainstorming. Claude's reading of the note is on the left; its questions arrive as choices on the right.
The top of the idea triage: a search bar, a strip counting cards in each phase, a napkin with two rough notes and a Turn these 2 into cards button, and folded cards below with their pipelines at Merged and Shipped.
The napkin and the pipeline. Every card shows its phase, from Brainstorming to Shipped.

OsuTaikoCompare: how I matched it with the real game

An editor is only useful if what it shows is what the game will do. n.ot.e's Full Testplay reproduces the original client's gameplay screen, down to the health bar, the mascot and the map's storyboard. Whether it really matches is a question an agent cannot answer by looking, and one I can only answer slowly.

OsuTaikoCompare is a harness I built to answer it by measurement. It plays one map in the real clients, osu!stable and osu!lazer, and in n.ot.e, and compares their frames at identical moments of the map: side by side, stacked, or as a per-pixel difference.

The trick is the clock. The harness adds a small machine-readable timecode to the test map, so every frame captured from a real client says which moment of the map it shows. n.ot.e is then driven to render exactly those moments, and its own timecode is read back to prove that it did.

It is made for agents as much as for me. Every command ends with one JSON object holding the facts of the run, the moments that differ most and their images, so a session can change the code, run the comparison and read the result on its own. And it had to be fast, because a slow experiment does not get run: rebuilding the pipeline took a standard run from 17 min 52 s to 1 min 21 s.

Full Testplay in n.ot.e, running on Autoplay. This is the screen being matched.
  1. A test mapAny map, with a timecode strip injected into its storyboard.
  2. The real clientsosu!stable and osu!lazer play it in real time, sandboxed and offline. Their frames are captured losslessly.
  3. LabellingEvery captured frame is tagged with the map time decoded from its timecode.
  4. n.ot.e, drivenn.ot.e renders exactly those map times, frame by frame, and proves it with its own timecode.
  5. ComparisonFrames from the same instant are paired: side by side, stacked, or as a per-pixel difference.
  6. ReportThe facts, the most different moments and their images, as JSON for a person or an agent.