Fabric

Can you search for what you forgot?

• We write notes, save bookmarks, start brainstorming sessions, build moodboards, and capture ideas that feel important in the moment. Some eventually become finished projects, but many are simply paused as our attention shifts toward the next challenge, conversation, or curiosity.

• Those ideas rarely disappear. More often, they remain carefully preserved and organized. Over time, they drift beneath the surface until months or even years later we stumble across an old document, forgotten sketch, or half-finished thought and wonder why we ever stopped thinking about it in the first place.

• Modern software has become remarkably good at helping us capture, organize, find, and share information. Rediscovery, however, remains something we mostly leave to chance.

If your knowledge has a place then what is your perspective?

• Fabric approached this challenge from a different angle. Rather than treating information as a collection of isolated documents, it modeled notes, links, groups, and ideas as an interconnected graph of relationships. Folders, lists, and search provided different paths through information, but they were all similar perspectives over the same underlying data.

• Around that time, I had the opportunity to work alongside Fabric’s founder, Jonathan Bree, who was already exploring what another perspective might look like. Early prototypes experimented with spatial navigation, using depth and parallax to hint at a more playful way of exploring a world of interconnected pieces. My role was to interpret that vision into a production-ready interaction system while balancing the creative ambition of the concept with the practical realities of integrating that experience into a mature web application. Over time, those early prototypes evolved into what would eventually become Fabric’s Explore Mode.

How do we design a space where navigation becomes exploration?

• Traditional interfaces naturally encourage movement between pages or panes. They provided a window into information, but rarely a sense of place. Explore Mode began with a different premise. If information could exist within an unbounded space, perhaps moving through it could feel less like navigating an application and more like wandering through a landscape. Rather than revealing information one page at a time, the canvas could invite curiosity by keeping the surrounding collection visible and encouraging people to look beyond their immediate focus.

• Creating that feeling required more than placing cards on an infinite plane. Subtle camera movement, depth, and parallax gave the canvas a sense of presence that a flat two-dimensional interface struggled to achieve. As the camera moved, nearby ideas drifted across the screen at different rates, gently reminding us there was always more to discover just beyond our current focus. These details were not decorative. They encouraged movement and made the surrounding space feel alive rather than static.

• Exploration also needed a rhythm. Selecting an item on the canvas begins a journey in which the chosen item becomes an anchor that reveals another layer of relationships. From there a natural loop forms between familiarity and discovery, with each interaction becoming an invitation to continue exploring through the similarities between pieces of information. And when we don’t know where to begin, we can harness spontaneity by allowing the interface to randomly choose an item, leading to the rediscovery of forgotten ideas and a renewed perspective.

• Supporting that experience required a collection of interconnected systems working together. Spatial layouts, camera controls, animation, state management, graph traversal, and gesture handling all contributed to the experience of a cohesive space. The engineering challenge was not simply rendering thousands of elements efficiently, but creating an environment where each technical decision reinforced the feeling that information was something you could explore rather than merely navigate.

How do we craft the illusion of depth and space on the web?

• As the interaction principles were beginning to take shape, we realized that bringing them into a production application introduced an entirely new set of constraints. Fabric already had a mature library of React components that represented years of product iteration. Rebuilding every card, menu, and interaction as layers rendered onto a WebGL canvas would have duplicated that work, introduced a second UI framework to maintain, and made everyday product development considerably more difficult. Instead, we began exploring whether the illusion of a spatial environment could be achieved while preserving the existing DOM-based interface.

• That decision ultimately led to a hybrid rendering architecture. React Three Fiber became responsible for the camera, scene orchestration, and spatial calculations, while React continued rendering the interface itself. Rather than drawing the cards inside a canvas, the scene manipulated familiar DOM elements through synchronized transforms, allowing them to exist simultaneously within a three-dimensional world and a traditional web application. It became less about rendering 3D objects and more about coordinating two rendering systems that each excelled at different responsibilities.

• Supporting that bridge required a shared understanding of space. The renderer evolved around several coordinate systems, translating between world positions, screen positions, and the layout of individual tiles as the camera moved throughout the scene. Animation systems orchestrated both the camera and interface elements, while custom gesture handling unified panning, zooming, box selection, and other interactions into a cohesive input system. Individually these systems solved small technical problems, but together they created the illusion of a living, interactive environment.

• Many of those implementation details deserve a deeper discussion than this article allows. Topics such as pointer event routing between canvas overlays, animation orchestration using CSS variables, on-demand rendering techniques, and performance profiling of large scenes with parallax effects each have their own set of interesting engineering problems. Though more importantly, their solutions supported the development of an interface where the technology quietly disappeared behind the scenes.

Reflections

• Looking back, I’ve come to appreciate the design of this interactive system, where the interface does more than present information. It shapes how we perceive it. The same collection of notes, links, and ideas can feel completely different depending on the perspective through which they’re seen. And sometimes the most meaningful contribution is helping people rediscover what they already have instead of adding more to their collection.

• This project reminded me that ambitious ideas rarely emerge from a single discipline. Explore Mode grew through an ongoing conversation between product vision, interaction design, and engineering. The early concepts established a compelling direction that would be translated into systems that could evolve through iteration, refinement, and real-world feedback. That collaborative process remains one of the most rewarding aspects of this experience.

• Although many of today’s engineering workflows are increasingly accelerated by AI, I think the heart of projects like this remains remarkably consistent. Tools can help us prototype, scaffold, and iterate more quickly, but they don’t replace the careful decisions that determine whether an interaction feels intuitive, playful, or worth returning to. Those qualities still emerge through collaboration, experimentation, and a willingness to refine the smallest details.

• In essence, I’m drawn to this form of product engineering, because the work isn’t simply about implementing features or choosing technologies. It’s about designing systems that allow ideas to evolve, creating experiences that invite curiosity, and quietly crafting interfaces that help people see familiar things from a different perspective.

Learn More

• If you’d like to learn more, the following resources dive deeper into Fabric, Explore Mode, and some of the technical ideas that made the experience possible.

• Explore Mode Announcement

  • The original product announcement introducing the feature, its goals, and the experience it was designed to create.

• Explore Mode Documentation

  • A practical guide covering the interactions, controls, and capabilities available within Explore Mode.

• Technical Deep Dive (Coming Soon)

  • A behind-the-scenes look at the hybrid rendering architecture, including the React Three Fiber bridge, coordinated layout systems, animation pipeline, gesture handling, and performance considerations that shaped the outcomes.