Anytype, a platform for creating and organizing knowledge, wanted a way for users to collect information from the internet seamlessly. They approached Madebymad with a simple but ambitious idea: a browser widget that could capture and structure content effortlessly.

With just two weeks to take the project from research to final design, we had to move fast, balancing flexibility, usability, and the technical constraints of browser extensions. This project was a lesson in rapid iteration, prioritization, and collaboration—each phase brought new insights that shaped the final product.

Understanding the challenge

Anytype knew they wanted a browser widget, but the specifics were undefined. Our first challenge was understanding why users needed it and how they currently saved information. We analyzed competitors like Notion Web Clipper, Evernote, and Pinterest, breaking down their strengths and weaknesses.

One insight stood out: most existing tools were either too rigid or too complex. Some forced users into predefined content structures, while others required too many steps to save simple information. We needed to strike a balance—offering structure without restricting flexibility.

At this stage, I learned the importance of challenging assumptions. Instead of jumping straight into UI design, we reframed the problem: What’s the fastest way for users to save and structure information without breaking their flow?

Designing for flexibility: three concepts, three lessons

With a tight deadline, we explored multiple approaches in parallel, quickly testing different interaction models:

• AI-Driven Recognition — Highlighted different content types (text, images, videos) directly on the webpage. Felt intuitive but lacked flexibility—users needed control over what they saved.
• Categorized “Types” — Grouped saved content into predefined types (articles, images, links). Too restrictive—users wanted to mix and match content freely.
• Freeform Capturing (The Final approach). Allowed users to clip entire pages, select elements, or create structured notes within the widget. Mirrored how users naturally collect information, aligning with Anytype’s open-ended philosophy.

Iterate, Test, Adapt—Fast

With no direct access to users (since Anytype was still in beta), we had to get creative. We ran internal “hallway” usability tests with colleagues, refining the widget’s flow based on quick feedback loops.

One major insight: users often needed to tweak content before saving it. This led us to introduce a lightweight editing layer, allowing adjustments before content was sent to Anytype. Small additions like this made a huge difference in usability.

This phase reinforced a critical design lesson: early testing doesn’t need to be perfect—it just needs to happen. Waiting for real users wasn’t an option, so we made the most of what we had.

Finalizing the design & handoff

As the two-week sprint came to an end, we packaged the final designs, UI kit, and documentation. Unlike many projects where design and development happen in silos, we worked closely with Anytype’s engineers throughout. Their feedback on technical feasibility helped us refine interactions and avoid last-minute redesigns.

The final widget was lightweight, intuitive, and aligned with Anytype’s design language. Users could clip content in a way that felt natural—whether capturing an entire page, highlighting key sections, or composing quick notes.

What I took away