OTTODesign System

FoundationsApp experience

Microinteractions and animations

Microinteractions are small, often subtle animations or visual feedback that follow a user action. They play an important role in making an app livelier, more appealing and easier to understand.

Information

Why

Feedback

Confirm actions (e.g. a button that shrinks slightly when pressed).

Status display

Visualise progress (e.g. a circle that fills up when uploading).

Guidance

Steers attention to important elements or changes.

Delight

Can put a smile on the user's face, emphasise the brand personality and appeal to users emotionally.

Improved usability

Make interaction smoother and easier to understand.

Principles

Subtlety and practicality

They should support the main function, not distract from it or impair performance.

Speed

Microinteractions should be fast and not blocking.

Consistency

Similar elements should have similar microinteractions.

Toggle

Updated 24 June 2025