隨著資訊圖表一詞的興起，越來越多人渴望以圖像化的方式傳遞資訊，因此大量的資訊圖表製作工具興起，朝向降低使用門檻、快速製圖的方向邁進，但每個平台擁有的功能形式皆不盡相同，這部分於操作體驗與使用效率皆有重要影響。因此，本研究目的為針對資訊圖表製作工具之圖表功能進行研究，探討使用者之偏好與需求，並進一步探討加入圖像輔助與不同的編輯型式是否會對使用性與使用者滿意度造成影響，期望提供良好資訊圖表製作工具之介面組合，提升該類工具之使用性。

本研究包含兩部分實驗：(1)前導性實驗：藉由文獻探討之理論依據進行資訊圖表製作工具初步調查，並透過實驗任務操作與訪談，釐清現有工具之問題點與使用者需求；(2)驗證實驗：根據前導性實驗之成果，設計六款實驗模擬樣本，深入探討資訊圖表製作工具之編輯型式與功能列具備圖像輔助與否兩變項，測驗不同樣本於使用性及主觀感受之變化。

驗證實驗採2(圖像輔助) x 3(編輯型式)雙因子實驗方式進行，「圖像輔助」採取兩層級：(1)無圖像輔助：功能列沒有圖像輔助之介面；(2)有圖像輔助：功能列有圖像輔助之介面。而「編輯型式」分為三層級：(1) 嵌入式：進入編輯模式後，可縮式之編輯工具從右側彈出，並保留左側主功能列；(2)彈窗式：編輯工具以覆蓋視窗方式顯示於原有頁面內；(3)固定式：主功能與編輯工具固定於介面右側，進入圖表編輯模式後，編輯工具覆蓋掉右側主功能列

研究結果顯示：(1) 於簡易任務操作時，「彈窗式」有較佳之操作績效表現；(2)「有圖像輔助」之功能列介面可以提升操作效率，同時於使用者之易用性滿意度表現也較佳；(3)整體任務績效表現上，編輯型式「彈窗式」優於「嵌入式」，「固定式」則位於中間；(4)於知覺易用性上，「有圖像輔助」之功能列介面有較高之使用者滿意度；(5)雖「有圖像輔助」之功能列介面可以為使用者帶來幫助，但若一次呈現過多資訊仍會降低其易用性。

關鍵詞：資訊圖表、資訊視覺化、資訊圖表製作工具、使用性評估、使用者經驗

As the growing usage of infographics, more and more people tend to transfer information by pictures and figures. Thus, a number of infographic-design Websites grow up, which allow users to operate more easily and rapidly. However, the platforms vary in function and form, which has significant influence on user experience and efficiency. Therefore, this study mainly examines the chart-building function of infographic-design Website, user preferences, and requirements. In addition, a further evaluation of toolbox style and iconic interface is conducted to understand the influence of user satisfaction. By so doing can help generate an innovative user interface of infographic-design Website and to create a better usability for users.

The experiment in this study consists of two sections: (1) The pilot test: Conduct initial survey of infographic-design Website through relative theory, then obtain a further comprehension of potential problems of existing tools and user requirements by pilot test and interview. (2) The validate experiment: Based on the results from pilot test, six simulate prototypes were created to examine the influence of two variables, i.e., iconic interface and toolbox styles, on interface usability and users’ perception.

The validate experiment is conducted based on a 2 (iconic interface) x 3 (toolbox style) two factors experiment. Iconic interface can be divided in two levels: (1) No iconic interface: Only text is used to indicate the function of each button on the toolbar. (2) Iconic interface: Both icon and text are used to point out the function of each button on the toolbar. Toolbox styles are divided into three levels: (1) Inlay toolbox: The retractable toolbox pops up from the right side when editing, remaining the left side toolbar at the same time. (2) Overlay toolbox: The toolbox is shown within the page as an overlay. (3) Always-visible toolbox: Fasten both toolbox and main toolbar in the right side, the toolbox covers the main toolbar when editing.

The results indicate that: (1) Overlay toolbox has better performance in efficiency for users to operate simple tasks. (2) Iconic interface can improve efficiency and achieve higher user satisfaction. (3) In overall efficiency, overlay toolbox is better than inlay toolbox, and always-visible toolbox is in the middle. (4) Iconic interface won the better user satisfaction in the evaluation of perceived usefulness. (5) Though iconic interface is easier for users to operate tasks on most occasions, it causes interruption to users when showing excessive information.

Keywords: Infographic, Information visualization, Infographic-design Website, Usability evaluation, User experience

中文文獻：
1. 方裕民(2003)。人與物的對話：互動介面設計理論與實務。台北市：田園城市文化。
2. 李佳穎(2008)。網路書店使用者介面之資訊呈現與商品圖片型式對使用者體驗感受之影響(未出版之碩士論文)。國立台灣科技大學，臺北市。
3. 林育成、陳立杰、林家華(2015)。互動式歷史資訊圖表之設計要素研究。中華民國設計學會研究論文。689-694。
4. 林廷宜、賴采秀、黃苡蓁(2012)。數位時代視覺資訊圖表的視覺思考與設計方法。行政院國家科學委員會補助專題研究計畫期末成果報告。（編號：NSC －101－2410－H－011－014），未出版。
5. 林昆範、王孝筠(2009)。資訊圖像應用於蘋果日報編排設計之研究。設計學研究，12(1)，43-65。
6. 林孟潔(2014)。時間性資訊圖像應用於互動式介面設計之創作研究－以近代平面設計史為例(未出版之碩士論文)。國立臺灣師範大學，臺北市。
7. 吳建和(2002)。小型資訊產品介面操作性研究-以行動電話為例(未出版之碩士論文)。國立台灣科技大學，臺北市。
8. 徐仁輝(2004)。績效評估與績效預算。國家政策季刊，3(2)，21-36。
9. 陳俊文、梁朝雲(2001)。資訊設計及其延展與應用。視聽教育雙月刊，57，46-57。
10. 陳建雄(譯) (2009)。互動設計：跨越人-電腦互動Interaction Design: Beyond Human-Computer Interaction。(原作者: Preece, J., Rogers, Y. & Sharp, H)。臺北市：全華圖書。(原作出版年：2002)
11. 陳建雄、邱柏清、蔡佳穎(2004)。使用者後設認知策略在互動介面愉悅性設計之研究 II，行政院國家科學委員會補助專題研究計畫成果報告（編號：NSC 92－2213－E－011－046），未出版。
12. 陳國團(2000)。知識學形式基礎：世界意識型態緒論.。臺北市：允晨文化。
 
英文文獻：
1. Berinato, S. (2016). Good charts: the HBR guide to making smarter, more persuasive data visualizations. Boston, MA: Harvard Business Review Press.
2. Card, S., Mackinlay, J., & Shneiderman, B. (1999). Readings in information visualization. San Francisco, CA: Morgan Kaufmann.
3. Craik, K.W. (1943). The nature of explanation. Cambridge UK: Cambridge University Press.
4. Eisenhardt, K. M. (1989). Building theories from case study. Academy of Management Review, 14 (4), 532-550
5. Fleming, N. D. (2001). Teaching and learning styles: VARK strategies. New Zealand, Christchurch: IGI Global.
6. Fontana, A., & Frey, J. H. (1994). Interviewing: The art of seicence. In N. Denzin and Y. Lincoln (Eds.), Handbook of qualitative research. (361-376). London: Sage publications, inc.
7. Frone, M. R., Russell, M., & Cooper, M. L. (1992). Antecedents and outcomes of work-family conflict: testing a model of the work-family interface. Journal of Applied Psychology, 77(1), 65.
8. Garrett, J. J. (2011). The elements of user experience: User-centered design for the Web and Beyond. Indianapolis, Ind.: New Riders.
9. Hawkins, D., Best, R. J., & Coney, K. A. (2009). Consumer Behavior: Building Marketing Strategy. New York, NY: McGraw-Hill Publishing.
10. Hilbert, M. (2011, December). Mapping the dimensions and characteristics of the world’s technological communication capacity during the period of digitization (1986-2007/2010). 9th World Telecommunication/ICT Indicators Meeting, International Telecommunication Union, Port Louis, Mauritius.
11. Holmes, N. (2005). Wordless diagrams. United States of America, New York, NY: Bloomsbury Publishing.
12. Horn, R. E. (1999). Information design: Emergence of a new profession. In R. Jacobson (Ed.), Information design (15-33). Cambridge, MA: MIT Press.
13. Kraft, C. (2012). User experience innovation: User centered design that works. Berkeley, CA: Apress.
14. Krum, R. (2013). Cool infographics: Effective communication with data visualization and design. Indianapolis, IN: John Wiley & Sons.
15. Lankow, J., Ritchie, J., & Crooks, R. (2012). Infographics: The power of visual storytelling. Hoboken, NJ: Wiley.
16. Lester, P. M. (2013). Visual communication: Images with messages(6th ed.). Boston, MA: Cengage Learning.
17. Medina, J. (2011). Brain Rules: 12 Principles for Surviving and Thriving at Work, Home, and School. Seattle, WA: Pear Press.
18. Michell, G., & Dewdney, P. (1998). Mental models theory: Applications for library and information science. Journal of Education for Library and Information Science, 39(4), 275-281.
19. Nielsen, J. (1993). Usability Engineering. Boston, MA: Academic Press.
20. Nielsen, J. (1994). Usability inspection methods. In Conference companion on Human factors in computing systems. 413-414. ACM.
21. Nielsen, J., & Pernice, K. (2010). Eyetracking web usability. Berkeley, CA: New Riders.
22. Norman, D. A. (1983). Some observation on mental models. In D. Gentner & A. L. Stevens (Eds.), Mental models. Hillsdale, NJ: Lawrence Erlbaum Associates.
23. Norman, D. (2013). The design of everyday things: Revised and expanded edition. New York, NY: Basic Books.
24. Scott, B., & Neil, T. (2009). Designing web interfaces: Principles and patterns for rich interactions. Sebastopol, CA: O'Reilly Media
25. Sisler, P., & Titta, C. (2001). User Experience Design for Working Web Sites and Applications. In Annual Conference-society For Technical Communication, 48, 203-208.
26. Sless, D. (2008). Measuring information design. Information Design Journal, 16(3), 250-258.
27. Tidwell, J. (2011). Designing interfaces: Patterns for effective interaction design(2nd ed.). Sebastopol, CA: O'Reilly Media
28. Tufte, E. R. (2001). The Visual Display of Quantitative Information(2nd ed.). Cheshire, CT: Graphics Press.
29. Wildbur, P. & Burke, M. (1999). Information Graphics. London: Thames and Hudson.
網路文獻：
1. Paluch, K. (2006). What Is User Experience Design. Retrieved July 4, 2018, from https://goboomfactor.com/what-is-user-experience-design/