← Back to writing

On UI craft

7 July 20266 min readUI · craft · AI

Some of my greatest lessons in UI craft have come through genuine curiosity and exploration. Whenever I start a design, one of my biggest blockers is finding inspiration for ideas. So I explore well-designed apps and websites, paying attention to the interactions most people overlook while using them, and asking how I might make something more intuitive, more memorable, easier, and more unique.

I get designer's block all the time. What breaks it, more often than not, is sparring on ideas with my team or with the end users themselves. We all have the capacity for genuinely great ideas, and perspective — deliberately borrowing someone else's — is the thing that has helped me most.

When a designer asks me how they could get good at UI, I tend to break it into modules.

1. Typography

Most good UI comes from visually balanced type. Play with letter-spacing, line-height, and weight. When something feels off-balance, this is almost always the first place I spend my time.

Typography balance study — letter-spacing, line-height and weight adjustments

2. Shadows

I see this done wrong almost everywhere. Maybe that's my personal taste, but I don't think a drop shadow should be used to depict the directionality of light. It should be a tool for expressing Gestalt principles — for defining grouping. Use it to group not only on the 2D plane but on the 3D plane, creating separation between foreground and background.

The great UI challenge is designing a pure-white interface that still has clear foreground and background. Every element sits on white, and drop shadows alone give the interface depth, grouping, contrast, and visual clarity. So many products feel an obsessive need to add far too much colour. In the end it just looks like a clown farted out an AI prompt for their dream tool.

Drop shadows used for grouping — foreground and background separation on white
Pure-white interface using only shadows for depth and grouping

3. Widths

The clearest example is the distinction between the line width of your type and the line width of your icons. This is the level of detail that creates — or breaks — the parent-child relationship between visual layers. If the child is imbalanced, so is the parent. Even border radius isn't just applied to the border itself; it shapes the whitespace it leaves behind. Zander explains this well — a great illustration of why it matters.

Bringing brand into the UI

The rarest designers are the ones who can build UI that both serves the product and brings out its unique brand. Website designers know this ask all too well. The ability to carry a brand's personality through into the interface is exactly where I believe AI will struggle to connect.

Oğuz Yağız Kara does this exceptionally well. Look through their sites and you can see the clear line from brand into the design — typography, motion, illustration, movement.

Interestingly, this is where I've started to struggle to find good design on Dribbble. I find the better examples on Instagram and Threads now. Dribbble is saturated with UI trends. Yes, glass is cool — but glassmorphism has been around a long time, and I think it works extraordinarily well for VR, where you're trying to merge a physical background with an interactive foreground. It's important to find your own UI voice. folk.app does this with sharp lines and a strong focus on table layouts. Finding real variation in brand concepts is hard; zed.dev pulls it off, as do plenty of others.

This is where I think AI has a genuinely great use in UI: exploring brand identity more deeply than we could before — generating one concept in glassmorphism and another in sharp lines, and everything between.

Interface detail study — padding, letter-spacing and icon-to-type alignment

The judgment AI still can't make

Where AI x UI is today, a designer is still required. Someone who can look at the screen and know the left padding shouldn't be 24px but 12px, that the letter-spacing should tighten by -0.04px, that the icon width needs to align more consistently with the type beside it.

Because as designers we should be able to see the potential in a concept — working through edge cases and the unusual interactions that show up at different breakpoints — to judge whether an idea is even worth pursuing.

A great mentor of mine, Natalia Volgina, taught me that the difference between a good designer and a great one is the ability to explore more than one solution to a problem. Think of as many as you can, and design each of them out. Only then do you really open yourself to the possibilities. And you'll often find that none of them work on their own — that the right answer is Direction A combined with Direction D.

I share the fear a lot of people working in technology feel right now: are we designing ourselves out of a job?

And yet I can't help feeling a kind of relief. Building accurate coded prototypes of hard-to-prototype interactions used to be brutal — hours and hours wiring up every unique interaction and flow in InVision, and later Figma, just to capture more honest user feedback. Now we have the potential to iterate faster and more accurately, and to explore far more of the problem-solution space with real users.

Only once I've found something that truly fits do I obsess over the details — not because some compulsion is driving me to fix every UI mistake, but because I care. I care that the product doesn't end up looking like every other AI-generated interface.

References & inspiration

The apps that most consistently inspire me are Are.na and Amie — both worth sitting with slowly. For reference reading, Jakub's details that make interfaces feel better and MercuryOS reward repeat visits.

Dann Petty captures a style of craft I keep coming back to, and if you want to see what good craft simply looks like, spend time with Jason Yuan and Oğuz Yağız Kara.

Two tools I'm curious about but haven't tried yet: make.design and noon.design.