WunderGraph's Brand Refresh
Engineering leads land on your site before they land in your product.
Before picking a lane, I explored three.
Rather than presenting one polished direction and hoping it landed, I designed three full visual identities, each answering the same question differently: how much should WunderGraph stand out versus fit in?
A pure black and grayscale palette with Neue Montreal as the typeface. No colour competing for attention, just fluid silk-like textures and clean geometry. This direction let the product and the copy do all the talking. It felt closest to something like Vercel or Linear, confident enough not to need colour to prove a point.
WunderGraph is a technical product, but it's also an ambitious one, trying to carve out a distinct identity in a sea of dark-mode developer tool sites that all start to blur together. Blue would have been the safe choice, but safe wasn't the goal. Purple gave WunderGraph a visual identity that actually stands out in a crowded market, while FK Grotesk added an edge that felt more considered than a typical enterprise SaaS site.
Blue would have blended in with every other infrastructure tool out there. Monochrome would have played it too safe. Purple was the direction that gave WunderGraph a personality worth remembering, while still reading as sophisticated enough to hold its own in front of an enterprise buyer.
From token to full page.
Once the direction was locked, I built out the full system, colour tokens, type scale, spacing and the fluid background textures that show up across the site. FK Grotesk gave the site more character than a typical Inter-based dev tool site.
Live cursors as a design element
WunderHub lets teams build APIs together in real time, which was one the USPs. Showing live cursors on the site immediately tells people that, no explaining needed.
Other design patterns
Used subtle glows, gradients and flowing background textures. It gives the site the energy and movement we wanted, keeping it from feeling like a flat, static dev tool page.
The thin line patterns running through the background add another layer of detail. They keep things feeling structured and precise, which fits a product that's fundamentally about connecting and organising data.
Presenting three directions instead of one was the right call. It gave the team something real to react to instead of just approving or rejecting a single idea.
We had 4 co-founders plus a handful of stakeholders, and getting everyone to the same page was hard at the start. Everyone had a slightly different read on where the brand should go. What actually helped was over-communicating. Sharing progress daily in a shared Slack channel instead of siloed DMs kept every decision visible to the whole group as it happened.
It meant fewer stakeholders showing up later wanting to change something that had already been agreed on, since everyone had seen it evolve in real time instead of being handed a finished decision.
We also tested the 3 options with customers, so it was helpful to validate a change this size with real users before committing. It made the final call feel even more solid.
Draft version. Ship early and validate fast.
Use data. Let real user feedback shape the next iteration.
Adapt. This works great for new features, but for redesigns, where the goal is improving UX, you sometimes need to slow down and refine the details before shipping. There’s no one-size-fits-all workflow - you just adapt to what makes sense for each unique project.