Vincent RodriguezDesigner

Context

Until now, building them took real front-end expert knowledge, so much so that even AIs struggle to go that far. Now, in a few clicks, you can create beautiful shaders.

Challenge

Simon had a working prototype and a few visual directions, but he needed a thinking partner. Nothing on the market did what the tool does; there was no established pattern to borrow, only somewhat related graphics tools like Figma or Photoshop. So the work was closer to R&D than to interface design: figuring out the best possible experience for this product before it even shipped.

The core problem was hierarchy. Effects apply to elements, but elements carry effects of their own, and those effects can stack, mask, and blend. If the interface doesn't make that boundary obvious at a glance, users lose track of what they're editing and everything turns into guesswork.

Approach

Visual editors have already solved part of these questions. Group management, content editing flows, and layer logic have become standards users know by heart. The real challenge was taking that foundation and adapting it to fold in the shader-specific layer. After years of using these tools every day, designing one myself felt pretty thrilling.

On the visual side, I built a complete component design system, with the level of polish you'd expect from a tool aimed at developers.

Outcome

The work helped the team enormously in finalizing the user experience before the product launched, and it then went from zero to several thousand users in a few months. Teams from Vercel, Shopify, Adobe, Microsoft, and Framer are among them.