The Problem
Short story time! I was researching embodied interfaces for my thesis when I found a paper called Emoto — AI Sidekick. The work was compelling, so I did what any researcher does: I looked up the authors. Three were from CMU, and out of which two from the School of Design! That was interesting. I kept digging.
I discovered that two of those authors continued working together and joined Experiments with Google. Four years later, they started their own company. A third author moved to Apple as a prototyper. The fourth, a professor, relocated to Northumbria University and started a lab and worked on “Spooky Technology”—a project I recognized because I’d worked with one of its collaborators, Daragh Byrne, at CMU’s School of Architecture.
This web of connections—people, projects, companies, labs—told a story. If I ever encountered someone else who worked at Experiments with Google, I’d want to connect them to this thread.
But here’s the problem: bookmarks don’t preserve these connections.
With traditional bookmarking, I’d save all these profiles in folders: “People,” “Companies,” “Labs,” “Projects.” The folders grow. Three months later, I’d have no idea how these things connected. The story would be lost.
I needed a way to see the story behind my rabbit holes later, not just store them.
Validating the Problem
To see if there is a broader pattern with this problem, I got to survey 25 people across 3 CMU departments (Architecture, HCI, Design) using an AI conversational research assistant ↗ for these sessions—letting people describe their actual bookmarking behavior instead of forcing multiple-choice answers.
The insight: Bookmarking systems break at scale. As the list keeps growing, people either abandon the system or can’t remember where they filed things—which defeats the whole point of saving things for future use. Sharing bookmarks adds another layer of complexity, forcing people to use other tools like Are.na, OneTab, or Notion. This fragments their workflow across multiple tools, breaking the flow they were already in.
Approach
MEMEX as Framework
In 1945, Vannevar Bush proposed MEMEX—a desk-sized machine for saving information through associative trails instead of categories. The idea: record links between ideas the way thinking actually happens, not the way filing systems force organization. This concept later inspired the creation of hyperlinks.
Bush outlined five fundamentals: recording, storing, displaying, selecting, and sharing trails of thought.
MEMEX provided a structure for breaking down the bookmarking problem into actionable components. Two of Bush’s fundamentals particularly shaped the direction:
Displaying Bush wrote about making connections visible through spatial positioning—“trails” that show how things are associated and how one idea leads to another. This resonated with what users described: folders hide how things relate. The challenge became: how to make relationships visible without overwhelming the interface.
Sharing trails Bush emphasized sharing entire paths of thought, not isolated items. This aligned with the user study finding—people struggled to share specific bookmarks scattered across lists. But sharing raised an immediate question: where should the data live? Cloud storage enables sharing but creates dependency. This tension pushed toward local-first architecture as a core constraint.
These two aspects—visible relationships and data ownership—became the organizing principles for the design process.
Prototyping the Parallels
Entering How to capture links without breaking browsing flow? Right-click context menu integration—save any link instantly from the browser’s native menu.
Web of info How to show relationships spatially? Canvas layout where proximity indicates relatedness. Clicking any node reorganizes the view around it—making that node the “hero” of its own neighborhood.
Cataloguing How to preserve context when saving? Tag input and connection suggestions appear immediately during save, capturing why something mattered before the moment passes.
Browsing How to navigate without hierarchies? Direct exploration—click a node to see its connections, hover to preview, zoom to adjust detail level.
Sharing How to export threads without cloud dependency? Local export as portable files—threads package as self-contained data that can be shared directly.
Core Components of the Product
Most recent section in world view Quick access list showing the last viewed dots. Provides linear navigation when the spatial canvas feels too open-ended.
Clickable hero image of website Screenshot preview generated via Microlink API. Clicking opens the original URL. Provides visual memory cue beyond just text titles.
Markdown supported notes Expandable notes field with markdown formatting. Captures context about why something was saved before that context fades.
Right-click pop up for quick saving and associating Browser context menu integration. Shows existing dots as connection suggestions. Allows type assignment during capture to minimize friction.
Edit menu for customizing and cataloguing Modal interface for modifying saved dots. Includes title editing, type reassignment with color picker, and connection management through searchable dropdown.
Physics-based organic visuals with depth through connection opacity D3.js force simulation positions nodes naturally. Connection lines fade by depth—primary bold, secondary medium, tertiary faint—creating visual hierarchy without hiding information.
Traditional list access when spatial navigation feels overwhelming Right sidebar organizes connections linearly by depth (primary, secondary, tertiary). Text-based list with hover effects for users who prefer hierarchical browsing.
Know where your dot lives World map in bottom-right shows miniature of full graph. Current position highlighted. Updates as you navigate to maintain orientation.
Sharing dot threads with JSON export Export button packages selected threads as portable JSON files. Import button merges shared threads into existing graph.
Technical Architecture
Chrome extension stores data locally using browser storage API. Web application reads this data through message bridge and visualizes using D3.js force-directed graph. Development mode includes local filesystem persistence. When extension not installed, app loads static demo data. Microlink API handles screenshot generation.
Outcome
Shipped Product
Dot Threads launched on Chrome Web Store in September 2024 and has been actively maintained through January 2026. Currently at version 1.3.3 with 10 active users.
User Feedback
The design is very effective and intuitive once the user gets used to it.
"It's visually clear and thoughtfully crafted, with a strong focus on making bookmarking more engaging and intuitive. The idea of using thumbnails and interactive elements adds personalization to the experience.
"Iterations Based on Feedback
The reviews surfaced two key areas for improvement:
Connection clarity: Users found the lines between colored nodes unclear. Added visual hierarchy (bold/medium/faint opacity) to distinguish connection depths and updated the trails sidebar to explicitly label primary/secondary/tertiary relationships.
Multi-bookmark workflows: Request for connected bookmarks to open together. This validated the export/import feature—users can now share entire research threads as portable JSON files rather than individual links.
Project Demo
A walkthrough of the live product experience, highlighting core flows and the spatial browsing interactions.