Creating Usability with Motion: The UX in Motion Manifesto - Deepstash
Leading in Product Management

Learn more about product with this collection

How to align stakeholders

Best practices in product management leadership

How to create value together

Leading in Product Management

Discover 68 similar ideas in

It takes just

9 mins to read

Motion Usability is not UI Animation

Motion Usability is not UI Animation

‘UI Animation’ is typically thought of by designers as something that makes the user experience more delightful, but overall doesn’t add much value. Thus, UI Animation is often treated like the red-headed stepchild of UX.

What most designers think of as ‘UI Animation’ is in fact the execution of a higher modality of design: the temporal behavior of interface objects during realtime and non-realtime events.

57

564 reads

Realtime vs non-realtime interactions

Realtime vs non-realtime interactions

It is important to distinguish between ‘state’ and ‘act.’ The state of something in UX is fundamentally static, like a design comp. The act of something in UX is fundamentally temporal, and motion based.

An object can be in the state of being masked or it can be in the act of being masked. 

All temporal aspects of interaction can be thought of as happening in realtime or non-realtime. Realtime means that the user is directly interacting with the objects in the user interface. Non-realtime means that the object behavior is post-interactive: it occurs after a user action, and is transitional.

58

299 reads

Motion supports usability in four ways

These four pillars represent the four ways where the temporal behavior of user experiences supports usability.

  • Expectation: how users perceive what an object is, and how it behaves
  • Continuity speaks both to the user flow and to the ‘consistency’ of the user experience. 
  • Narrative is the linear progression of events in the user experience that results in a temporal/spatial framework. 
  • Relationship refers to the spatial, temporal, and hierarchal representations between interface objects that guide user understanding and decision making.

59

243 reads

Principles, Techniques, Properties, and Values

Principles are the underlying premises and rules of function giving rise to any number of techniques. From there, we can imagine a hierarchy:

  • principles at the top,
  • techniques further down,
  • properties below that, and
  • values at the bottom.

Properties are the specific object parameters that are being animated to create the technique. Values are the actual numeric property values that vary over time to create what we call ‘ animation'.

51

197 reads

The 12 Principles of UX in Motion

The 12 Principles of UX in Motion

  • Easing and Offset & Delay relate to timing
  • Parenting relates to object relationship.
  • Transformation, Value Change, Masking, Overlay, and Cloning all relate to object continuity.
  • Parallax relate to temporal hierarchy.
  • Obscuration, Dimensionality and Dolly & Zoom both relate to spatial continuity.

56

244 reads

CURATED BY

apron

Recruitment consultant

stash-superman-illustration

Explore the World’s

Best Ideas

200,000+ ideas on pretty much any topic. Created by the smartest people around & well-organized so you can explore at will.

An Idea for Everything

Explore the biggest library of insights. And we've infused it with powerful filtering tools so you can easily find what you need.

Knowledge Library

Powerful Saving & Organizational Tools

Save ideas for later reading, for personalized stashes, or for remembering it later.

# Personal Growth

Take Your Ideas

Anywhere

Organize your ideas & listen on the go. And with Pro, there are no limits.

Listen on the go

Just press play and we take care of the words.

Never worry about spotty connections

No Internet access? No problem. Within the mobile app, all your ideas are available, even when offline.

Get Organized with Stashes

Ideas for your next work project? Quotes that inspire you? Put them in the right place so you never lose them.

Join

2 Million Stashers

4.8

5,740 Reviews

App Store

4.7

72,690 Reviews

Google Play

Sean Green

Great interesting short snippets of informative articles. Highly recommended to anyone who loves information and lacks patience.

Ashley Anthony

This app is LOADED with RELEVANT, HELPFUL, AND EDUCATIONAL material. It is creatively intellectual, yet minimal enough to not overstimulate and create a learning block. I am exceptionally impressed with this app!

Shankul Varada

Best app ever! You heard it right. This app has helped me get back on my quest to get things done while equipping myself with knowledge everyday.

samz905

Don’t look further if you love learning new things. A refreshing concept that provides quick ideas for busy thought leaders.

Giovanna Scalzone

Brilliant. It feels fresh and encouraging. So many interesting pieces of information that are just enough to absorb and apply. So happy I found this.

Laetitia Berton

I have only been using it for a few days now, but I have found answers to questions I had never consciously formulated, or to problems I face everyday at work or at home. I wish I had found this earlier, highly recommended!

Ghazala Begum

Even five minutes a day will improve your thinking. I've come across new ideas and learnt to improve existing ways to become more motivated, confident and happier.

Jamyson Haug

Great for quick bits of information and interesting ideas around whatever topics you are interested in. Visually, it looks great as well.

Read & Learn

20x Faster

without
deepstash

with
deepstash

with

deepstash

Access to 200,000+ ideas

Access to the mobile app

Unlimited idea saving & library

Unlimited history

Unlimited listening to ideas

Downloading & offline access

Personalized recommendations

Supercharge your mind with one idea per day

Enter your email and spend 1 minute every day to learn something new.

Email

I agree to receive email updates