top of page

Toasts animation design

Project  : Individual
Role : UI/UX Design, Interaction design, Sketch explorations, Principle explorations
Summary

These toast animations were part of design explorations for the Autodesk Design System. There are 3 primary ways of surfacing toasts. 

Toasts which surface the bottom of the screen can slide on to the screen horizontally or vertically. But for toasts located at top right corner of the screen, the horizontal animation is not a good design choice. 

 

The mockups were created in Sketch and the interactive prototype was generated using Principle.

Fig 1. Toasts sliding horizontally

Fig 2. Toasts popping vertically (spring)

Fig 3. Toasts at the top (spring)

bottom of page