| 研究生: |
余至軒 Yu, Chih-Hsuan |
|---|---|
| 論文名稱: |
智慧型手機翻頁過場動畫之魅力評價 Evaluation for Attractiveness of Animated Page Transitions on Smartphones |
| 指導教授: |
何俊亨
Ho, Chun-Heng |
| 學位類別: |
碩士 Master |
| 系所名稱: |
規劃與設計學院 - 工業設計學系 Department of Industrial Design |
| 論文出版年: | 2014 |
| 畢業學年度: | 102 |
| 語文別: | 英文 |
| 論文頁數: | 62 |
| 中文關鍵詞: | 翻頁過場動畫 、使用者介面 、魅力工學 、數量化I類 、評價構造法 |
| 外文關鍵詞: | Animated Page Transitions, User Interface, Miryoku Engineering, Quantification Theory Type I, EGM |
| 相關次數: | 點閱:147 下載:11 |
| 分享至: |
| 查詢本校圖書館目錄 查詢臺灣博碩士論文知識加值系統 勘誤回報 |
今日之智慧型手機多具備高效能晶片及高解析螢幕,使用者介面上繁雜資訊量早已超越了使用者感官的負載及解析的能力。有鑒於此,過場動畫在使用者介面中扮演極為重要的角色。過場動畫不僅能幫助使用者有效率地解讀及理解使用者介面上的資訊,同時也可以使資訊的呈現更為順暢、自然,具有吸引力。
一般而言,由於智慧型手機相較於平板或是電腦,螢幕顯得偏小,而造成呈現資訊上的限制。因此,翻頁過場動畫很頻繁的被使用在智慧型手機當中,因為使用者必須頻繁的在頁面間切換來尋找所需要的資訊。有鑒於此,翻頁過場動畫的形式不僅關鍵地影響了使用者閱讀及操作的體驗,同時也可以使得使用者介面看起來更獨特且具有吸引力。本研究從訪談中汲取了翻頁過場動畫之具體及抽象之魅力因子,並分析釐清不同因子與使用者偏好間之關係。
本研究之目標為建立智慧型手機之翻頁過場動畫在使用者介面上之設計準則,提供軟體開發者及使用者介面設計師選擇或設計符合使用者情感之翻頁過場動畫。此研究應用了魅力工學中之評價構造法及數量化I類來蒐集質性及量化資料,並進行分析討論,得到智慧型手機翻頁過場動畫之魅力因子及評價。根據分析結果,整理成五個向度的魅力因子:「介面操控感」、「流暢度」、「空間延伸感」、「閱讀成就感」、「自然直覺感」。而研究結果顯示,智慧型手機上的翻頁過場動畫與使用者的手勢互動、視覺動線、新資訊進入的方式與邏輯性具有高度相關性。
Nowadays, advances in technology have made smartphones equipped with high performance chips and high resolution displays. The overloaded data displays are increasingly complex in user interface and exceed human perceptual capacity to efficiently interpret them. Consequently, animated transitions in user interface play a fundamental role of supporting the user in integrating and relating information across displays and representations. In fact, judiciously applying animated transitions can make the user interface easier to understand, feel smoother, more natural, and be more appealing.
In general, animated page transitions are frequently and broadly applied in reader applications on smartphones, because the screen size of smartphones is limited so that users have to frequently switch different contents and categories between screens. In this way, the form of animated page transitions crucially affects the reading experience, and helps to create the uniqueness and appealing of reader applications. This paper describes how the constituent elements of animated page transitions affect user emotions, and clarifies the relationships between different types of page transitions and users reactions.
The aim of this paper is to build an interface design principle of animated page transitions on smartphone for helping mobile application developers to select the suitable page transitions according to user emotions. This study applied Evaluation Grid Method and Quantification theory type I based on Miryoku engineering to figure out the attractiveness of various types of animated page transitions. We summarize five dimensions of attractiveness of animated page transitions, which include “User Control”, “Fluency”, “Spatial Extension”, “Reading Satisfaction”, and “Natural and Intuitive”. The results show that animated page transitions on smartphones have the strong relation with user gestures, visual movement, and the logicality of how information appears on the screen.
(1) Bartram, L. (1997, October). Can motion increase user interface bandwidth in complex systems? In Systems, Man, and Cybernetics, 1997. Computational Cybernetics and Simulation. 1997 IEEE International Conference on (Vol. 2, pp. 1686-1692). IEEE.
(2) Bederson, B. B., & Boltman, A. (1999). Does animation help users build mental maps of spatial information? In Information Visualization, 1999. (Info Vis' 99) Proceedings. 1999 IEEE Symposium on (pp. 28-35). IEEE.
(3) Shneiderman, B. (1992). Designing the user interface: strategies for effective human-computer interaction (Vol. 2). Reading, MA: Addison-Wesley.
(4) Chang, B., Ungar, D (1993). Animation: From Cartoons to the User Interface. In: Proc. of UIST 1993, ACM Symposium on User Interface Software and Technology, pp. 45–55. ACM Press, New York.
(5) Chen, K., Shen, K.S., & Ma, M.-Y. (2012). The functional and usable appeal of Facebook SNS games. Internet Research, 22(4), 467–481. doi:10.1108/10662241211250999
(6) D'areglia, Y. (2014). Interactive Transitions. Retrieved Jan 14, 2014, from http://www.thinkandbuild.it/interactive-transitions/
(7) De Stefano, Ralph A (2008). Anticipation. Electronic Visualization Laboratory, University of Illinois at Chicago.
(8) Dragicevic, P., Bezerianos, A., Javed, W., Elmqvist, N., & Fekete, J. D. (2011, May). Temporal Distortion for Animated Transitions. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 2009-2018). ACM.
(9) Frank T., and Ollie J. (1981, reprint 1997). The Illusion of Life: Disney Animation. Hyperion, pp. 47–69. ISBN 978-0-7868-6070-8.
(10) Huhtala, J., Sarjanoja, A. H., Mäntyjärvi, J., Isomursu, M., & Häkkilä, J. (2010). Animated UI Transitions and Perception of Time: A User Study on Animated Effects on A Mobile Screen. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 1339-1342). ACM.
(11) Ishihara, S., Ishihara, K., & Nagamachi, M. (1998). Hierarchical Kansei Analysis of Beer Can Using Neural Network. Human factors in organizational design and management (Vol. VI). Amsterdam: Elsevier.
(12) Johannes, T. (2011). Meaningful Transitions: Motion Graphics in User Interface. Bachelorarbeit zur Erlangung des akademischen Grades.
(13) Kelly , GA (1955). The Psychology of Personal Constructs. New York: Norton. NY.
(14) Klimmt, C., Hartmann, T. and Frey, A. (2007). Effectance and Control as Determinants of Video Game Enjoyment. Cyber Psychology & Behaviour, Vol. 10 No. 6, pp. 845-847.
(15) Komazawa, T., & Hayashi, C. (1976). In F. T. de Dombal & F. Gremy (Eds.), A statistical method for quantification of categorical data and its applications to medical science. North-Holland Publishing Company.
(16) Lasseter, J. (1987, August). Principles of traditional animation applied to 3D computer animation. In ACM Siggraph Computer Graphics (Vol. 21, No. 4, pp. 35-44). ACM.
(17) Trapp, M., & Yasmin, R. (2013). Addressing animated transitions already in mobile app storyboards. In Design, User Experience, and Usability. Web, Mobile, and Product Design (pp. 723-732). Springer Berlin Heidelberg.
(18) Miryoku Engineering Forum (1992). Miryoku Engineering, Miryoku Engineering Forum, Kaibundo.
(19) Shen, K. S. (2013). Measuring the sociocultural appeal of SNS games in Taiwan. Internet Research, 23(3), 372-392.
(20) Shneiderman, B. (1997). Designing the User Interface: Strategies for Effective Human-Computer Interaction. Massachusetts: Addison-Wesley.
(21) Smith, C. D., & Jones, A. B. (2004). Perspectives on curriculum and instruction. Journal of Educational Research, 55(1), 28.
(22) Sugiyama, K., & Inoue, K. (1996). The basic for survey and analysis by excel: a collection of tools for Planning and design. Tokyo: Kaibundo.
(23) Tseng, L. T., & Ma, M. Y. (2012). Evaluation of attractiveness factors of Taiwan lantern festival. National Cheng Kung University, Taiwan, ROC.
(24) Ujigawa, M. (2000). The evolution of preference-based design. Research and development Institute.
(25) Dong, W. (2011). The evaluation method for product form attractiveness based on Miryoku Engineering. Applied Mechanics and Materials, 44, 86-90.
(26) Willian (2006). Squash and Stretch. Blender. Retrieved June 27, 2008.
(27) Yasmin, R. (2012). Storyboarding of Standard Animated Transitions for Interactive Mobile Interface Applications, Studienarbeit, TU Kaiser slautern, Germany.
(28) Zumbrunnen, A. (2013). Transitions in UX / UI design. Retrieved Sep 25, 2013, from http://azumbrunnen.me/blog/transitions-in-ux-design/
(29) 倪于珺 & 何俊亨(2012),運用魅力工學於產品創值研究 _ 以專業型 LED 手電筒為例,國立成功大學工業設計研究所。
(30) 馬云芊 & 馬敏元(2011),從女性族群的產品涉入程度探討健身器材魅力因素之研究,國立成功大學工業設計研究所。