Analyzing the effect of animated transitions on the user experience of mobile interfaces

Animations in interfaces, when designed correctly, are shown to be beneficial for usability and user experience (UX). However, most designers create their animations from personal preference without knowledge of how their animated transitions affect the user experience, which increases the risk of them becoming distracting and ruining the experience. Current studies on the topic focus mostly on the usability aspects of animations while the research regarding the emotional impact and aesthetics remain sparse. By understanding how the properties of transitions impact the whole user experience of a user interface, well thought out design choices can be made for improving the experience. The aim of this thesis was to investigate how three transforms and five easing types in animated transitions affect user emotions and perceived user experience. These properties were examined and compared using the mixed method approach of semi-structured interviews, Think-Aloud and the shortened version of AttrakDiff. The results of this thesis indicate that both easings and transforms can affect the perceptions of speed, and that faster perceived transitions are generally more preferred. Also, that the transforms can be more or less suitable for communicating certain changes, and that easings can convey certain impressions suiting different contexts in mobile UIs. The insights of this study can be used for guidance in designing or choosing transitions for specific affective purposes for an improved user experience. Animationer i gränssnitt sägs gynna användbarhet och användarupplevelse när de är utformade korrekt. De flesta designers skapar dock sina animationer utifrån personliga preferenser utan kunskap om hur deras animerade övergångar påverkar användarupplevelsen, vilket ökar risken för att distraherande animationer som kan förstöra upplevelsen istället. I dagsläget fokuserar studier inom detta område främst på användbarhet av animationer medan forskningen kring emotionell påverkan och estetik är begränsad. Genom att förstå hur egenskaperna för animerade övergångar påverkar hela användarupplevelsen för ett användargränssnitt kan mer genomtänkta designval göras för att förbättra upplevelsen. Syftet med denna avhandling var att undersöka hur tre transformationer och fem olika accelerationer i animerade övergångar påverkar användarnas känslor och användarupplevelse när de används i ett mobilt gränssnitt. Dessa egenskaper undersöktes och jämfördes med genom semi-strukturerade intervjuer, Think-Aloud metoden och den förkortade versionen av AttrakDiff. Resultaten tyder på att både accelerationer och transformationer kan påverka uppfattningen av animationens hastighet, och att snabbare upplevda övergångar i allmänhet är mer föredragna. Dessutom kan transformationerna kan vara mer eller mindre lämpliga för att kommunicera vissa förändringar i gränssnittet, och olika accelerationer kan förmedla vissa intryck som passar i olika sammanhang i mobila användargränssnitt. Resultaten av denna studie kan användas som vägledning vid utformning av övergångar för specifika affektiva ändamål och för en förbättrad användarupplevelse