Use animation to
convey relationships
Many people are captivated by animation effects, especially in today's relatively static interfaces. But animation has a important functional role as well. It provides a way of showing relationships between components, such as the tray that slides out from the RealPhone.
![]() |
![]() |
![]() |
![]() |
The relationship between the tray and the phone is unambiguous. It's clear that the tray is contained within the phone. It doesn't just suddenly appear and does not exist independent of the phone.
It's important not to over use animation. Too many animations at the same time or an animation that continues on longer than useful becomes an annoyance.