Bolt Hackathon: A Zettlekasten-Inspired Browser NoteTaking Tool

Context —

AI-coding, PKM (Personal Knowledge Management) Tool, B2C

Team —

Me, 1 Developer

Duration —

July 2025, 1 weekend

Challenge

HMW simplify the note-taking experience and make every note automatically findable and contextually connected without user effort?

This is my first hackathon experience as a designer. I created this prototype in 1 weekend.

The Zettelkasten method

Zettelkasten is German for “slip box”, which refers to a box containing many slips of paper (Ahrens, 2017).

Atomic Notes: Each note contains a single, self-contained idea or piece of information.

Linking: Notes are linked together through keywords, tags, or other metadata, creating a network of related ideas.

v.s. Obsidian, Notion, and Other Note-Taking Apps

Why this app Wins Across All Dimensions

Zero Decision Fatigue

AI automatically handles tagging, categorization, and linking while you browse. No manual organization, no folder decisions - just instant knowledge capture.

Instant Productivity

No learning curve, no setup, no plugins. Start building your knowledge base immediately with browser-based capture and AI-powered connections.

Organic but Findable

Knowledge emerges naturally through AI-generated contextual links, while smart search ensures everything remains discoverable as your collection grows.

The Best of Both Worlds (Notion, Obsidian)

Zettle breaks the traditional trade-off by using AI to deliver Obsidian's power with Notion's simplicity - something neither competitor can achieve.

Explorations, Mid-fidelity Prototypes

After settled on the initial direction, I play-around with the high-fidelities in Figma. Then imported them to Bolt.

Full Prototype : Obsidian-style, but simpler

Everything is vibe-coded by me in Bolt.new. The front-end is functional and interaction-friendly.

Resume

Updated April 5, 2026 🫧

Made with Framer & Claude Code