Addressing Animated Transitions already in Mobile App Storyboards

Animated transitions are key elements that contribute to the user experience (UX) of mobile Apps. Unfortunately, animated transitions are usually addressed too late in software development. We recommend to consider animated transitions already during user interface (UI) storyboarding. Typically, UI storyboards do not address the kind of transition, they focus on the screens and visualize a transition just with a simple arrow. Therefore, we investigated the leading mobile phone operating systems iOS 5, Windows Phone 7.5 and Android 4 with respect to their utilization of animated transitions. We developed a catalog consisting of 21 different types of animated transitions. Based on this catalog of 21 different types of animated transition we developed a vocabulary of 66 simple icons. These icons enhance the abilities of storyboards to the extent that they are now able to illustrate animated transitions.