Menu

Contact

hello@aveny.co

All posts
3 min read

Designing with Liquid Glass: onboarding lessons

Apple's newest material looks great in a keynote. Putting it in front of a first-time user is a different exercise entirely.

Apple's Liquid Glass material is easy to fall in love with on a slide. It catches light, refracts what is behind it, moves with a kind of physical weight that flat interfaces never had. We wanted Voisary's first few minutes — the onboarding, the very first thing a new user sees — to feel like it belonged next to the best of what Apple ships, not like a third party guessing at the aesthetic.

That was the goal going in. Getting there took a few wrong turns worth writing down.

Why we reached for it

Onboarding is the one place in an app where a slightly heavier, more tactile visual language earns its keep. You are not asking someone to read a spreadsheet or scan a list — you are asking for thirty seconds of attention before they trust you with something personal, in Voisary's case their own voice and their own half-formed thoughts. A material that feels premium and considered does real work there: it is a small, wordless signal that the rest of the product was built with the same care.

Where it went wrong first

The first pass over-used it. Every card, every button, every transition got the glass treatment, and the result was the opposite of premium — it was noisy. Text sitting on top of a refractive surface loses contrast depending on what is moving behind it, and on a bright background or a busy screenshot underneath, body copy became genuinely hard to read. We had built something that photographed well and functioned poorly, which for an onboarding flow is close to the worst possible trade.

The second problem was pacing. Liquid Glass has motion built into its nature — it responds to touch, it shifts with the device. Stack enough of it on one screen and the eye does not know what to track. An onboarding flow is supposed to lower cognitive load, not add to it, and our first draft was doing the opposite.

How we pulled it back

The fix was mostly subtraction. We set a hard rule: the material only appears on one element per screen, and never behind body text that needs to stay legible in every lighting condition. Everything else — labels, primary copy, the actual instructions — sits on a flat, high-contrast surface. Glass earns its place as an accent, not a base layer.

We also capped the flow itself at three screens. Liquid Glass makes every individual screen feel a little more substantial, which made it tempting to spread the flow across more of them just because each one now "felt" worth a moment on its own. That is exactly the wrong instinct — a material that adds weight to a screen should make you want fewer of them, not more. Three screens forced us to cut anything that was not doing real work: one for what Voisary does, one for the recording permission, one for a single first action.

The before-and-after is not subtle once you see it side by side. The early version looked like a materials showcase. The current one looks like an app that happens to use a beautiful material where it counts, and gets out of the way everywhere else.

What we would tell ourselves earlier

Treat a material like this as a spice, not a base. It should show up where attention is meant to slow down for a second — a hero moment, a single focal card — and disappear everywhere legibility or speed matters more than atmosphere. The instinct to use a new toy everywhere it is available is normal and almost always wrong. The version of Voisary's onboarding that shipped uses Liquid Glass in exactly one place per screen, and it reads better for it.