Glance — A Calendar‑Axis News Dashboard Built with Claude Code

Why I Built This

I built Glance because I was spending too much time every day checking news sites and losing attention inside feeds. There were still things I needed to know, but the process of finding them had become noisier than the information itself. Glance started as a way to reduce that cost: one place, a smaller surface, only the stories worth knowing. The six stories in the demo were a presentation device, not a product limit. In the actual model, Glance pulls up to three stories from each of six fixed sources, for a maximum of eighteen items. Those items are grouped into tabs by content category rather than by publication. That matters because source and topic do not map cleanly. A business outlet like CNBC will still carry political news, so the organizing logic has to follow the story, not the publisher.

Scope and Constraint

Most AI-assisted design stops at "it compiles." I wanted to push further: use Claude Code as a pairing engineer, not a generator, and document where that stops working. The editorial scope was narrow, which helped. Fixed sources, equal weight per story, terminal density. The self-imposed mandate: a working Next.js prototype in two days, with every ambiguous decision still mine.

How the Work Was Split

Four roles, one loop. I write prompts that encode intent and constraint. Claude Code generates the Next.js and Tailwind implementation. Figma MCP returns the rendered state as a frame. I QA against reference spec, then sign off or write the next prompt. Keeping the four roles separate matters because each one needs different judgment, and collapsing them pushes the wrong decisions onto the wrong surface.

Five Rounds in Two Days

I wrote prompts that encoded spec, not intent alone. "Lock source logo height to 16px with object-fit contain" instead of "make logos consistent." Figma MCP returned each rendered state as a frame, which made QA a visual comparison rather than a code review. The work AI couldn't own stayed mine: calendar baseline, toggle alignment, logo rhythm across six publications.

Round 1 (Dashboard). One prompt produced a working list layout with eight event-driven sources. I accepted it as a critique target. Round 2 (v2 Demo). I enlarged the sidebar and its type scale. News decays by the hour, so the time signals need to read first. Tabs got icons, the calendar got pagination, the header got taller. Round 3 (v3 Demo). Structural pivot to a 2×3 card grid. Six equal cards beat a ranked list when no algorithm is doing the ranking. The SOURCES list left the sidebar; badges already carried that signal. Round 4 (v3.3 Final). Source canon locked to six publications across politics, economy, and academia. Bilingual toggle added with independently generated summaries rather than machine translation. Calendar date-dot rule re-normalized. Round 5 (v3.7 Padding Unified). GLANCE lockup, 16px logo baseline, 24px padding across cards. The product started reading as an editor rather than a container.

What Transfers

Glance isn't shipped. It's a tab I open every morning, and the transferable output of the two days was the loop, not the product.

• The workflow generalizes. Prompt → Claude Code → Figma MCP QA applies to any dashboard-shaped problem I'll work on next.
• Prompt patterns became templates. "Lock element X to Y regardless of Z" is a reusable shape that I now reach for before describing intent.
• Manual overrides mark the boundary. Where I had to leave the prompt and fix layout in Figma is the current line of what AI can deliver without a designer in the room.