Responsive image
博碩士論文 etd-0625113-145722 詳細資訊
Title page for etd-0625113-145722
論文名稱
Title
以眼動“觀”點探討網頁圖片編排對於使用者經驗之影響
The Effects of the Layout of Web Images on Eye-tracking of User Experience
系所名稱
Department
畢業學年期
Year, semester
語文別
Language
學位類別
Degree
頁數
Number of pages
72
研究生
Author
指導教授
Advisor
召集委員
Convenor
口試委員
Advisory Committee
口試日期
Date of Exam
2013-06-18
繳交日期
Date of Submission
2013-07-25
關鍵字
Keywords
圖片編排方式、偏好程度、瀏覽目的、眼動行為、眼動儀、使用者經驗
browse purpose, image layout, preference, eye-tracking, user experience, eye movement
統計
Statistics
本論文已被瀏覽 5858 次,被下載 152
The thesis/dissertation has been browsed 5858 times, has been downloaded 152 times.
中文摘要
本研究採用實驗法,主要探討網頁圖片編排方式於不同的瀏覽目的下,對於眼動行為與使用者經驗之差異,實驗控制「網格式」與「瀑布流」兩種圖片編排方式,讓受測者於經驗瀏覽、主觀搜尋與客觀搜尋三種不同情境任務下進行實驗,透過眼動儀器、問卷取得量化資料並進行統計分析,最後綜合研究結果進行討論並提出總結、網頁圖片編排設計建議與後續研究建議。

研究結果顯示,圖片編排方式於不同瀏覽目的下,對於部分眼動行為有顯著差異。此外,圖片編排方式於視覺動線中也呈現部分差異,「網格式」大多呈現Z字形視覺動線,「瀑布流」則部分呈現倒N字型視覺動線。偏好程度方面,研究結果於使用者經驗中之愉悅性自我衡量不顯著,但吸引力自我衡量呈現顯著差異,「瀑布流」的吸引力偏好程度高於「網格式」的編排方式。
Abstract
This paper aims to discuss the impact of web images layout on eye movement and user experience in different browse purposes. The manipulations of experiment are “image layout” and “browse purposes”. In the eye-tracking experiment, allow subjects to experiment on three browse purposes; via eye-tracking instrument and after questionnaire to obtain data. The final result of this research proposes a conclusion and provides few suggestions for the web image layout design and future research.

The result shows that the web images layout partially significant affected by eye movement in different browse purposes; moreover, these two image layouts also displayed some differences on the visual movement. In the preference, the result of questionnaire is significant on appeal measure; however, the self-pleasure is insignificant. This research has valuable implications for web image layout design and future research.
目次 Table of Contents
目錄
誌謝 ii
摘要 iii
Abstract iv
目錄 v
圖次 ix
表次 x
第一章 緒論 1
1-1 研究背景與動機 1
1-2 研究目的 2
1-3 問題描述 2
1-4 研究範圍限制 3
1-5 研究流程 4
第二章 文獻探討 5
2-1 視覺編排設計 5
2-1-1 視覺編排的概念 5
2-1-2 視覺編排結構 6
2-1-3 視覺編排與視覺搜索 9
2-1-4 瀑布流的編排方式 10
2-2 使用者經驗(User Experience, UX)的定義 11
2-3 使用者瀏覽行為 13
2-4 注意力與眼動追蹤技術 14
2-5 小節 16
第三章 研究方法 17
3-1 研究設計 17
3-2 實驗對象 17
3-3 研究架構 17
3-4 研究假說 20
3-5 實驗設備 20
3-6 實驗設計與流程 22
3-6-1 實驗設計 22
3-6-2 實驗流程 24
第四章 研究結果分析 27
4-1 圖片編排方式與瀏覽目的之總凝視時間差異 27
4-2 圖片編排方式與瀏覽目的之凝視次數差異 28
4-3 圖片編排方式與瀏覽目的之掃視次數差異 29
4-4 圖片編排方式與瀏覽目的之平均凝視時間差異 31
4-5 圖片編排方式與瀏覽目的之平均掃視距離差異 32
4-6 圖片編排方式與瀏覽目的之視覺動線差異 33
4-7 圖片編排方式之偏好程度 36
4-7-1 量表信度分析 36
4-7-2 圖片編排方式之偏好程度分析 37
4-8 眼動行為小節 38
4-8-1 總凝視時間 38
4-8-2 凝視次數 38
4-8-3 掃視次數 39
4-8-4 平均凝視時間 39
4-8-5 平均掃視距離 39
4-8-6 視覺動線 39
4-9 偏好程度小節 40
第五章 綜合討論 41
5-1 研究假說檢定結果 41
5-1 總凝視時間與圖片編排方式 41
5-2 凝視次數、平均凝視時間與圖片編排方式 42
5-3 掃視次數、平均掃視距離與圖片編排式 43
5-4 視覺動線與圖片編排方式 44
5-5 圖片編排方式偏好 45
第六章 結論與建議 46
6-1 圖片編排方式與眼動行為 46
6-2 圖片編排方式與視覺動線 47
6-3 圖片編排方式與偏好程度 47
6-4 網頁圖片編排設計建議 47
6-5 後續研究建議 48
參考文獻 50
附錄一 實驗畫面 54
附錄二 問卷 59
參考文獻 References
中文文獻
Sternberg, R. J.著,李玉琇、蔣文祁譯 (2005)。認知心理學。台北市,雙葉書廊。
Davis, G.著,余少麟, 李洪瑩, 劉偉興譯 (1994)。版面設計實用指南。新北市, 臺灣珠海文化。
王尹軒、邱秋雲 (2000)。報紙廣告與網路廣告訊息設計之差異分析。第三屆兩岸傳播媒體邁入二十一世紀學術研討會論文集。
王君明、陳永明 (1996)。眼動記錄法對閱讀研究的貢獻。心理學動態,pp.23-28。
田中正明 (1988)。視覺傳達設計。新北市:六和出版社。
伊彬、林演慶 (2006)。視覺影像處理之眼球運動相關研究探討。
朱瀅 (2000)。實驗心理學。新北市:五南圖書。
何耀宗 (1995)。平面廣告設計。新北市:雄獅美術。
吳佳諭 (2008)。使用者經驗對於資訊系統開發影響之研究。淡江大學資訊管理學系碩士論文。
吳姍樺 (2011)。網站使用者經驗之形塑 - 以aNobii書櫃網的使用為例。世新大學資訊傳播學系碩士論文。
呂文耀 (97)。圖文編排比例及圖地色彩組合之閱讀效應:眼動軌跡之分析。銘傳大學設計管理研究所在職專班碩士論文。
李子庭 (2005)。網頁導覽視覺要素與使用者瀏覽行為對瀏覽經驗之影響。銘傳大學設計管理研究所碩士論文。
林价興、王年燦 (2006)。網頁圖文配置對使用者瀏覽偏好之影響研究。藝術論文集刊,pp.45-50。
林奇秀 (1995)。圖書館的瀏覽行為。美國資訊科學學會,pp.39-42。
林昆範 (2007)。引領閱讀的編排設計。科學發展417期,pp.56-61。
林俊良 (2004)。視覺傳達設計概說。台北市,藝風堂出版社。
武星曄 (2008)。平面廣告版面編排設計對眼動軌跡影響之研究。銘傳大學設計管理研究所碩士論文。
邱永福 (1995)。字學。新北市,藝風堂出版社。
唐大崙、張文瑜 (2007)。利用眼動追蹤法探索傳播研究。中華傳播學刊。
唐大崙、莊賢智 (2005)。以眼動追蹤法探討圖文配置閱讀視線軌跡之研究。中國文化大學資訊傳播研究所碩士論文。
陳怡彤 (2010)。廣告訊息及廣告呈現方式對Facebook廣告注意力的影響。南台科技大學行銷與流通管理系碩士論文。
莊宜昌 (1997)。報紙版面設計對讀者閱報認知態度影響之研究。國立政治大學新聞學研究所碩士論文。
莊琇琇 (1999)。建構心像模型之內在機制與歷程:眼球運動之分析。國立中正大學心理學研究所碩士論文。
陳一平 (2011)。視覺心理學。台北市,雙葉書廊,pp.190-195。
湯允一、唐大崙、黃憶婷 (2005)。新聞網頁版面配置對視線軌跡的影響之研究。
楊勝雄 (2002)。編排設計。台北市,藝風堂出版社。
劉鴻世、郭輝明、黃斐慧 (2003)。購物網站靜態圖像介面之研究。明星學報。
謝志成、賴鵬翔、高振源 (2010)。以眼動儀與主觀感受探討高鐵自動售票系統操作介面。台灣感性學會研討會論文。
謝坤哲 (2008)。網頁圖文數量與位置配置對於成年人與青少年的偏好與眼球運動之影響 - 以購物網站為例。國立台灣師範大學設計研究所碩士論文。
蘇宗雄 (1988)。文字造型與文字編排。新北市,檸檬黃。





英文文獻
Arnold, E. C. (1969). Modern newspaper design. New York, Harper & Row.
Barthelson, M. (2002). Reading behaviour in online news reading, graduation project. LundUniversity: Department of Cognitive Science.
Bevan, N. (2008). "Classifying and selecting UX and usability measures." Professional Usability Services.
Desmet, P. M. A. and P. Hekkert (2007). "Framework of Product Experience." International Journal of Design. pp.57-66.
Dirksen, C. J., et al. (1977). Advertising principles, problems, and cases.5th ed. Georgetown, Irwin, Inc.
Djamasbi, S., et al. (2010). Generation Y,webdesign,andeyetracking. Int. J.Human-ComputerStudies.
Duchowski, A. T. (2003). Eye tracking methodology: theory and practice. Verlag London Limited.
Duchowski, A. T. (2003). EyeTtracking Methodology: Theory and Practice. Verlag London Limited.
Garcia, M. R. and P. Stark (1991). Eyes on the News. St. Petersburg, Florida., The Poynter Institute.
Hassenzahl, M. (2003). The thing and I: understanding the relationship between user and product. From Usability to Enjoyment.
Hoffman, D. L. and T. P. Novak (1996). "Marketing in Hypermedia Computer-Mediated Environments : Conceptual Foundations. Journal of Marketing. pp.50-68.
Holmqvist, K., et al. (2003). Reading or Scanning? A study of newspaper and net paper reading. The Mind's Eye: Cognitive and applied aspects of eye movement research. Amsterdam: Elsevier. pp.657-670.
Henderson, J. M., & Hollingworth, A. (1999). High-level scene perception. Annual
Review of Psychology, 50, pp.243-271.
Law, E. L. C., et al. (2009). Understanding, Scoping and Defining User eXperience : A Survey Approach.
McCarthy, J. and P. Wright (2003). Technology As Experience.
Muller, H. J. and J. Krummenacher (2006). Visual search and selective attention. Psychology Press Ltd.
Nielsen, J. (2000). Designing Web Usability. New Riders.
Paluch, K. (2006). What Is User Experience Design.
Poole, A. and L. J. Ball (2005). Eye tracking in human-computer interaction and usability research. Encyclopedia of human computer interaction. pp.211-219.
Rayner, K. (1998). Eye movements in reading and information processing: 20 years of research. Psychological Bulletin. pp.372-422.
Rubin, A. M. and E. M. Perse (1987). Audience Activity and Television News Gratifications. Communication Research.
Solso, R. L. (1994). Cognition and the Visual Arts. Cambridge, MA, The MIT Press.
Stansfield, R. H. (1979). Advertising Manager's Handbook. 2nd ed. Chicago, The Dartnell Corporation.
Steve, O. and R. Laura (2004). The best of Eyetrack III : What We Saw When We Looked Through Their Eyes. Eyetrack III project managers.
Watt, R., J. and V. Bruce (2000). Do the eyes have it? Cues to the direction of social attention. pp.50-58.
Well, W., et al. (2006). Advertising : Principles & practice.
Zimmermann, P. G. (2008). Beyond Usability – Measuring Aspects of User Experience.
電子全文 Fulltext
本電子全文僅授權使用者為學術研究之目的,進行個人非營利性質之檢索、閱讀、列印。請遵守中華民國著作權法之相關規定,切勿任意重製、散佈、改作、轉貼、播送,以免觸法。
論文使用權限 Thesis access permission:自定論文開放時間 user define
開放時間 Available:
校內 Campus: 已公開 available
校外 Off-campus: 已公開 available


紙本論文 Printed copies
紙本論文的公開資訊在102學年度以後相對較為完整。如果需要查詢101學年度以前的紙本論文公開資訊,請聯繫圖資處紙本論文服務櫃台。如有不便之處敬請見諒。
開放時間 available 已公開 available

QR Code