Guiding the way

Designing transitions to keep your users from getting lost

Tom Frew
Tom Frew
Aug 4, 2015 · 2 min read

Animated transitions between screens are omnipresent across digital apps, and they’re a great way to create a smoother user experience beyond the separate web pages of yesteryear. But it’s easy to throw transitions around without thinking about why they provide a nicer experience:

Transitions guide the user through the app without having to explicitly tell them the way.

Humans are used to orienting themselves in a space. If you walk through a building you know where you came from and which direction to go back; in digital experiences we need to provide this reference point for users. Transitions allow users to know where they are in your app, and how to move around.

For example, this is a simple transition example where the user moves through screens in a different direction depending on the context.

This is how the user sees your app. But it’s important for us as designers to look at the screens as a larger connected canvas. Think of your screens in 3D space and treat your current screen as a window into a certain area of that canvas.

When a user moves through your app, they remember where they came from, and therefore know how to navigate back.

By keeping this large canvas in mind you can tap into your users’ innate spacial understanding, and provide directions on their journey through your app.

[30 Second Design] is a series of quick and easy visual and UX designs tips to help you craft better experience.

Man & Moon

Tom Frew

Written by

Tom Frew

Founder/Creative Director @ Co-creator of . I also made @flintsapp and

Man & Moon

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade