Animation: Prevalant In Enhancement Of UX
Animations are illusions formed when sequence of images are being rapidly displayed. They not only enhance the user experience but also reveals flow of mobile apps much better than static text. There are limitless possibilities when we look at uses of animations in slew of areas. In this paper, my interest is to explore roles of animation to intensify the UX. In addition to that, I aim to focus on how these animations can be applied to different objects such as texts, images etc. and how it influences the User Experience in user interface.
Introduction: animations and UX
Animation is art of manipulating objects to appear them as moving. We use the broad definition of animation by Betrancourt and Tversky: "computer animation refers to any application which generates a series of frames, so that each frame appears as an alteration of the previous one, and where the sequence of frames is determined either by the designer or the user". Animation is called functional when it has logical and definite purpose with its incorporation at right time and right place. Such animations play a vital role in enriching UX. Studies investigating the influence of animation on user acceptance were conducted and more than 20 years later animation has become a standard design element in UIs and figure in design guidelines of leading software companies such as Google, Apple and Microsoft.
Functional Animation, Key Element In Enrichment Of UX: Possess Potential To Solve Many Purposes
- Keeps User Engaged: For example, while waiting for response of network call in some app, user can be kept engaged with presenting animated loading indicator on screen. It indicates to user that some processing is happening at back-end and user has to wait till it ends.
- To overcome space and time issues: Even a simple app usually has lots of content to display. It is not feasible to put all the content in one screen which degrades UI. In this case animated transitions are helpful. Animated transitions guide the user’s attention between different states of the UI and help explain change and hence are a common design solution in order to deal with limited space in mobile devices.
- To reveal/hide a content: Content may not be visible at all times, but made visible through hovering or clicking, and animations are used to reveal or hide content in a transient manner. For example, when user clicks on hamburger menu button displayed at top left corner of screen in some app, hamburger menu transits in from left of screen and tapping again on same button, menu transits out from right to left. In this case, use of transitions to show or hide a content makes app flow smooth and more appealing to user.
- To provide feedback on user actions: Feedback helps users with the confirmation of actions i. e(accepted or denied). It provides acknowledgement to users. For example, Parallax effects, often seen in phones, respond to the orientation of the input device, captured by accelerometers and Touch devices sometimes also use a ripple animation to confirm input.
- To predict next movement: Anticipation can guide the used to prepare user for next action. For example, a user could trigger an action that causes an interface element to leave the screen. To guide his/her attention to this element, it would undertake a small backward movement before disappearing.
Different forms of animations: enhancing user experience
Simulations
Simulations are used where real life training is difficult. Many research attempts to explore and explain that simulations are utilized in learning areas to predict outcome of activities. They have been used widely in teaching and education through effectively utilizing animations and achieving better user experience which results in improving the tendency of reception of learners. For instance an experimental study was conducted to identify the effects of learning differential equations through interactive simulations. Findings of these studies proved that these simulations helped the student to better understand the equations as they got to know the influence of parameters on the system’s Figure transitions. Also it provides additional insight for concepts that need a lot of resources and time.
Animated Images
Animated images bring lots of creativity when one wants to portray moods, events or life stories. It enhances visual impact. Widely used in multimedia, many research attempts have been made to bring out remarkable concepts using animated images. They have not only been used to elevate the user experience but are also used sometimes to overcome temporal and spatial limitations in mobile environment. In 2016, Kyuyeong Jeon, Jinhong Yang, Sooji Jeon and Sungkwan Jung proposed a video conversion scheme using animated images in which they brought out a unique concept of replacing the videos with series of images which overcame the limitations of videos as it helped the users to read the video contents which means that the user did not need to prepare an earphone to listen and could just read it in shorter minutes than whole duration time of the video and also videos had a lot of meaningful script such as news, documentary and education, hence was very effective. Also, most of advertisements are based on this concept. To promote company’s products in profitable way, advertisements include creative visuals to attract consumers. Animated images are used broadly to develop creative advertisement animations. Also a study conducted on "The Importance Of Animation As a Visual Method In Advertising" proved that animated flashing item is able to attract user’s attention. Since human mental resource is limited, not all the information can be stored for a longer duration and animations allow for easy processing of information without having to deal with the technical jargon and strain their minds.
Animated Texts
Lyrical videos are most common examples where animated texts are widely used. Animated texts engages the users and add more liveliness to videos compared to still texts and hence are preferred by users. It can be also used where sound is not accessible. A research conducted on "Visualizing Video Sounds With Sound Word Animation to Enrich User Experience" in which they added sound words to videos and represented the dynamics of sounds by means of text animation and the results showed that the animated words can effectively and naturally visualize the dynamics of sound while clarifying the position of the sound source as well as contribute to making video-watching more enjoyable and therefore increasing the visual impact of videos. Text animations has power to convey feelings. It not only portrays convincing characters but also grabs attention of users. This concept is also prominently used in domain of learning and education as presence of animated elements grabs student’s attention and helps them memorize concepts easily. In the research carried out on "Animated texts application in visualizing speech features for Foreign language learning", a method was presented that enabled to visualize speech detailed features such as pitch, intensity and duration into the animated text forms, which showcased that animated texts can be used as the representative for speech visualization and by viewing the speech features in the rich text forms like the animated texts, the learners could easily spot their mispronounced parts and correct them.
Conclusion
After research, it has been found that animations are extensively used in different areas such as education, learning, simulations, creative arts and much more. While interacting with system, it plays the role of core element in ameliorating the user experience.