NASEBANAL Growth Mobile, and Dark Mode on the Web — AI-Coded from Figma Designs and an OpenAPI Spec

At the end of my last post I said the next step would be mobile — and I'm now building it. NASEBANAL Growth Mobile bundles the Target, Recorder, and Stopwatch apps into a single client, built by taking the existing Web UI as the baseline, designing the screens with Figma MCP from inside Claude Code, fine-tuning the Figma stills by hand, and then auto-generating the app from those screens plus the OpenAPI Spec. Along the way, dark mode — which came almost for free on mobile — gave me the nudge to bring Light / Dark / System to the Web apps too; because a shared component package (bundling the UI foundation and the color palette as design tokens) and the API spec are factored out as shared packages, that stayed a light change. To close, I lay out why this whole flow is exactly the approach I've been shaping for in-house-development support.

Read More

NASEBANAL API Specs: The Motivation Behind It, Visibility Through Metrics, and Our Move Toward Contract-Driven Development

Alongside the launch of our developer-facing site [NASEBANAL API Specs](https://api-specs.nasebanal.com/en), I'd like to share the concern behind it and the work it has prompted. AI coding accelerates feature implementation, but our understanding of that implementation struggles to keep up, making it hard to see what state the code is in after each PR and Merge. This post lays out two efforts aimed at that challenge of 'making the state of development visible' — laying the groundwork for Contract-Driven Development (CDD), starting with splitting the API reference into its own site, and making development visible through DORA / Code metrics and token consumption — and reflects on the role of the OpenAPI spec in a future where in-house, outsourced, and agent development coexist.

Read More

NASEBANAL Target Beta Launch — Decompose Goals as a Tree, Track Progress with Real Recorder Data

We are launching the beta of NASEBANAL Target, a new app that decomposes goals as a tree and visualizes progress with real data from NASEBANAL Recorder. Target accommodates both Mandala-Chart-style top-down decomposition and mind-map-style organic branching, and surfaces the time-series chart of each node's linked Recorder tag right where the goal lives. Sharing a tree shares not just the structure, but the data behind it — so you exchange the *reason* you were tracking those numbers, not only the numbers.

Read More