簡易檢索 / 詳目顯示

研究生: 王君綺
Chun-Chi Wang
論文名稱: 以群化原則探討購物商城應用程式之介面設計
Exploring the User Interface Design of Shopping APPs through the Principle of Grouping
指導教授: 陳建雄
Chien-Hsiung Chen
口試委員: 曹永慶
Yung-Chin Tsao
柯志祥
Chih-Hsiang Ko
學位類別: 碩士
Master
系所名稱: 設計學院 - 設計系
Department of Design
論文出版年: 2023
畢業學年度: 111
語文別: 中文
論文頁數: 126
中文關鍵詞: 完形心理學群化原則使用者介面購物商城
外文關鍵詞: Gestalt psychology, Perceptual grouping, User interface, Shopping applications
相關次數: 點閱:174下載:2
分享至:
查詢本校圖書館目錄 查詢臺灣博碩士論文知識加值系統 勘誤回報
  • 隨著後疫情時代來臨,大眾的消費模式以及購物型態有了更加多元的面貌。購物商城帶給使用者便利性,介面複雜度也隨之增加。本研究目的在於從人類先天的視覺組織能力來探討如何優化介面。運用群化原則的造型組織原理,探討購物商城介面型態及其排列組織對整體介面視覺之影響,並推導出使用者介面的設計配置原則。本研究以焦點團體法確群化原則之關鍵因素,並擬出四項原則之構面問項,以三個購物商城為樣本,邀請30位受測者參與本實驗。評估群化原則與使用者滿意度之關聯,研究結果如下:(1)群化原則中之接近性、連續性、共同命運。(2)購物商城首頁與商品排序介面。(3)彈出視窗的應用。(4)購物商城之動態收納功能設計。(5)結帳分類之排序。最後根據前導性實驗研究之顯著差異關鍵因素,製作實驗模型樣本。並採用系統性使用尺度量表(SUS)及半結構式訪談法,結果顯示改善後之實驗模型樣本其使用者滿意度均高於其他三款樣本。最後根據使用性評估結果與前導性實驗研究,歸納出介面設計之準則,以供相關行業設計師參考。


    With the advent of the post-pandemic era, the public's consumption patterns and shopping styles have become more diverse. Shopping malls bring convenience to users, but also increase the complexity of the interface. The purpose of this study is to explore how to optimize the user interface from the innate visual organization ability of humans. By using the principles of gestalt psychology, we investigate the impact of shopping mall interface types and their arrangement on the overall interface visual, and derive design principles for user interfaces. This study used three shopping malls as samples and invited 30 participants to participate in the experiment. The correlation between gestalt principles and user satisfaction was evaluated. The research results found that the factors affecting consumer satisfaction were: (1) proximity, continuity, and common fate in gestalt principles, (2) the homepage interface layout and menu classification of shopping malls, (3) the application of pop-up windows, and (4) the design of dynamic storage function in shopping malls. Finally, based on the results of the usability evaluation and literature review, we summarize the guidelines for interface design as a reference for designers in related industries.

    摘要 ....................................................................i Abstract...............................................................ii 目錄....................................................................iv 圖目錄...................................................................vi 表目錄..................................................................viii 第一章 緒 論...............................................................1 1.1 背景與動機.........................................................1 1.2 研究目的...........................................................1 1.3 研究架構與流程......................................................2 1.4 研究範圍與限制......................................................3 第二章 文獻探討.............................................................5 2.1 完形心理學..............................................................5 2.1.1 完形心理學起源.........................................................5 2.1.2 完形心理學主張及架構....................................................6 2.1.3 完形心理學派研究貢獻...................................................11 2.2 群化原則...............................................................11 2.2.1 群化原則起源..........................................................11 2.2.2 群化原則定義..........................................................12 2.2.3 群化原則種類..........................................................12 2.2.3 群化原則的應用........................................................17 2.2.3 群化原則小結..........................................................25 2.3 使用者介面..............................................................25 2.3.1 使用者介面種類.........................................................26 2.3.2 使用者心智模式.........................................................26 2.3.3 Norman的認知理論......................................................27 2.3.4 人類的資訊處理.........................................................28 2.3.5 人機互動設計...........................................................29 2.4 軟體互動設計.............................................................31 2.4.1 圖形使用者介面..........................................................31 2.4.2介面圖像設計.............................................................35 2.4.3 使用者經驗.............................................................36 2.4.4 使用者中心設計..........................................................37 2.4.5 使用者心智模式..........................................................38 2.4.6 使用性評估.............................................................39 2.5 文獻小結................................................................40 第三章 設計研究..............................................................42 3.1 研究方法................................................................42 3.2 研究架構................................................................42 第四章 前導性研究與實驗.......................................................45 4.1 購物商城使用調查.........................................................45 4.2 購物商城使用問卷調查結果..................................................45 4.2 購物商城使用調查問卷小結..................................................53 4.4 焦點團體法..............................................................54 4.4.1 焦點團體法的研究主題....................................................54 4.4.2 使用焦點團體法的理由....................................................54 4.4.3 焦點團體法的規劃設計....................................................54 4.4.4 座談執行..............................................................58 4.4.5 事後檢討..............................................................58 4.4.6 焦點團體的研究設計與實施.................................................59 4.4.7焦點團體研究結果彙整.....................................................61 4.5 研究假說及問卷擬定........................................................62 4.6 衡量構面問項之關鍵因素分析.................................................63 4.7 受測者..................................................................65 4.8 實驗設備................................................................65 4.9 實驗設計與樣本說明........................................................66 第五章 研究結果..............................................................67 5.1 研究方法................................................................67 5.2 前導性實驗研究結果........................................................67 5.2.1回歸分析研究結果.........................................................67 5.2.2問項三「在結帳時可以清楚知道所有幾種選項且不複雜」.............................69 5.2.3問項五「在此介面可以知道查看更多選項與商品」..................................69 5.2.4問項七「此介面的彈出視窗不影響視覺呈現」.....................................71 5.2.5問項十一「此介面的動態收納功能很好」........................................72 5.3 前導性實驗研究小結........................................................73 第六章 原型設計與實驗驗證......................................................75 6.1 驗證實驗研究變項..........................................................75 6.2驗證實驗設計與流程.........................................................77 6.2.1驗證實驗樣本............................................................78 6.2.2驗證實驗問卷操作與介面...................................................80 6.3驗證實驗對象.............................................................81 6.4驗證實驗結果.............................................................81 6.4.1構面一「接近性、相似性」實驗分析..........................................81 6.4.2構面二「連續性」實驗分析.................................................83 6.4.3構面三「圖地原則」實驗分析...............................................85 6.4.4構面四「共同命運」實驗分析...............................................88 6.4.5構面五「使用者滿意度」實驗分析............................................90 6.5驗證實驗結果小結........................................................92 第七章 結論與建議...........................................................95 7.1 研究結果...............................................................95 7.1.1前導性研究現有購物商城之研究實驗結果......................................95 7.1.2驗證實驗購物商城與市面三款樣本之研究實驗結果...............................96 7.2 設計建議..............................................................98 7.3 後續研究建議...........................................................99 參考文獻..................................................................101 附錄一、前導性實驗問卷......................................................106 附錄二、焦點團體法訪談......................................................108 附錄三、驗證實驗問卷........................................................111

    英文文獻
    1. Barber, C. and Stanton, N. (1991). Task analysis for error identification: towards a methodology for identifying human error, In Contemporary Ergonomics, E. J. Lovesey (ed.), Taylor and Francis, London: pp. 67-71.

    2. Cooper, A. & Reimann, R. & Cronin, D. & Noessel, C. & Csizmadi, J. & LeMoine, (2014). About Face:The Essentials of Interaction Design (4th ed.).Wiley: Indianapolis, Inc.

    3. Dimmick, J., Sikand, J., & Patterson, S. (1994). The gratifications of the household telephone: Sociability, instrumentality, and reassurance. Communication Research, 21(5), 643. Author, A. A. (1993). Book title. (2nd ed.). Location: Publisher.

    4. Garrett, J.J. (2010). The elements of user experience: User-centered design for the web.

    5. Geoergeson (1996). Sub-pixel Accuracy: Psychophysical Validation of an Algorithm for Fine Positioning and Movement of Dots on Visual Displays.

    6. Gibson, J. J. (1979). The ecological approach to visual perception. Houghton, Mifflin and Company.

    7. Gittins,D. , (1990). Icon-based Human-computer Interaction, International Journal of man-machine studies , Vol.24, p.p519-543.

    8. Hansen, Wilfred J., (1971). "User engineering principles for interactive systems", Proc. Fall Joint Computer Conference, Vol.39, AFIPS Press, Montvale, N. J., pp.523-532.

    9. Horton, (1994). ”Illustrating computer documentation,” USA, John Wiley & Sons, Inc.

    10. Kollar, I. (2003) Implementing a graphical user interface and automatic procedures for easier identification and modeling.

    11. Nielsen, J. (1993). Usability Engineering. Academic Press, Boston, MA.

    12. Nicholos Roukes (1996). Design Synectics: Stimulating Creativity in Design

    13. Norman, D. A. (1986). The Design of Everyday Things. Doubleday, New York.

    14. Preece, J. & Rogers, Y. & Sharp, H. (2006). Interaction Design: Beyond Human-Computer Interaction. Wiley: Indianapolis, Inc.

    15. Shneiderman, B., & Plaisant, C. (2005). Designing the User Interface: Strategies for Effective Human-Computer Interaction (4th ed.). Addison-Wesley.

    16. Leung, L. & Wei, R. (2000) More than Just Talk on the Move: Uses and Gratifications of the Cellular Phone.

    17. Wilbert, O. (2002). The Essential Guide to User Interface Design: An Introduction to GUI Design Principles and Techniques.

    中文文獻
    1. Atkinson, R.L., (1991). 心理學。(鄭伯壎、洪光遠、張東峰等編譯).台北市:桂冠。(原著出版於1989)。
    2. Helen, S., Yvonne R., Jenny P., (2009). 互動設計。(陳建雄譯;第一版).台北市:全華科技出版社。(原著出版於2007)。
    3. Norman, D.A., (2007). 設計&日常生活:如何選擇安全好用的日常生活用品。(卓耀宗譯;第一版). 台北市:遠流出版。(原著出版於1986)。
    4. Robert, L.S., (1992). 認知心理學。(黃希庭譯). 台北市:五南圖書出版公司。(原著出版於1988)。
    5. 王民雄(1991)。美術心理學,台北市:台北市立美術館。
    6. 朱志明(1999)。動態圖像應用在網頁介面設計之研究。國立雲林科技大學工業設計研究所碩士論文,雲林縣。
    7. 何明泉,林其祥,劉怡君(1996)。「文化商品開發設計之構思」,設計學報,第1卷1期。
    8. 呂理欽(1996)。高階主管資訊系統:從人因面探討使用者介之設計。中山大學資訊管理研究所碩士論文。
    9. 李青蓉、魏丕信、施郁芬、邱昭彰(1998)。人機介面設計。空中大學出版社。
    10. 李姍姍(譯)(1998)。完形心理學,台北市:桂冠出版社。(Kohler, W., 1989)
    11. 李建緯(2006)。什麼是符號學?從藝術作品談起 。台南市:國立臺南藝術大學藝術創作理論研究所論文博士班論文。
    12. 林廷宜(2012)視覺資訊設計的基礎元素與概念。ASBDA 亞洲基礎造形聯合學會韓國大會。p.260-264。
    13. 林庭如(2000)。國小弱視兒童完形 圖像認知歷程之研究-以「圖與地」、「群化原則」為例,碩士論文,交通大學人文社會科學院應用藝術研究所視覺傳達設計,新竹市。
    14. 林敬欣、張育銘(2001)。網頁介面中動態圖形對圖像意義傳達影響之研究,國立成功大學工業設計學系碩士論文。
    15. 林家維(1992)。網頁瀏覽器指標圖像之研究-以數位博物館圖像介面為例。大葉大學設計研究所碩士論文。
    16. 林榮泰、莊明振(1991)。從圖像語意探討人機介面圖像的設計,工業設計,第二十卷,第二期。
    17. 林麗娟(1996)多媒體電腦圖像設計與視覺記憶的關係。教學科技與媒體p10-11。
    18. 吳盛木(1986)。心理學,台北市:三民出版社。
    19. 吳曄暐 (2014) 。行動購物APP介面設計與使用性之研究,碩士論文,雲林科技大學工業設計研究所,雲林縣。
    20. 吳菁樺(2004)。圖地反轉類型標誌意象認知之探討,碩士論文, 銘傳大學商業設計學系碩士班,台北市。
    21. 許勝雄(1993)。人因工程學, 台北: 揚智文化事業股份有限公司。
    22. 許鳳火(1998)。使用者對不同相機產品的操作介面比較研究,中日設計研討會論文集。
    23. 邱奕憲 (2016) 。行動裝置介面閱讀習慣對於網路廣告效果的影響-以 Facebook 為例,碩士論文,大葉大學設計暨藝術研究所,彰化縣。
    24. 莊國榮(2001)。媒體、電信及資訊產業的匯流與管制。國科會專題研究計畫成果報告。台北市:國立政治大學公共行政學系。
    25. 陳俊宏、楊東民(2004)。視覺傳達設計概論。台北:全華科技圖書股份有限公司。
    26. 張繼文(1995)。從認知心理觀點探討記號設計。屏東師院 學報,8,417-502。
    27. 熊祥林(1990)。消費者的知覺(附完形論),熊祥林發行。
    28. 黃崇冀(1993)。人之因素與電腦介面–圖像研究,碩士論文,淡江大學管理科學研究所,新北市。
    29. 黃鴻鈞(2005)。教師對藝術進修網站圖形使用者介面滿意度調查研究。碩士論文,新竹教育大學美勞教育研究所,新竹縣。
    30. 葉芳姿 (2013)。完形心理學群化原則應用於數位影像設計的創作研究,碩士論文,台灣師範大學設計研究所,台北市。
    31. 葉政鑫 (2011)。運用完形心理學探討介面形態組織關係對注意力之影響,碩士論文,雲林科技大學工業設計研究所,雲林縣。
    32. 楊憶婷(2003)。室內設計之完形心理視覺構成架構研究,碩士論文,中原大學室內設計研究所,桃園市。
    33. 楊雅淳 (2001)。從使用者中心探討影視娛樂介面設計原則─以電影公司網頁介面為例。銘傳大學設計管理研究所碩士論文,台北。
    34. 鄭文俊(1999)資訊產品螢幕圖像與操作介面設計思索與實務。大葉學報,第八卷,一期。
    35. 鄭伯壎(1990)領導與情境:互動心理學研究途徑。台北市:大洋發行。
    36. 鄭麗玉(1993)。認知心理學:理論與應用, 台北市: 五南。
    37. 謝忠利(1993)。圖形使用介面:本質與隱喻之映對,碩士論文,交通大學傳播科技所,新竹市。
    38. 謝毅彬(1994)。電腦操作圖象(ICON)設計,工業設計23卷2期, 107-113頁。
    39. 劉思量(1992)。藝術心理學,台北市:藝術家出版社。
    40. 蔣載榮(2002)。觀‧念‧攝影:影像的視覺心理剖析。台北市:雪嶺文化。

    無法下載圖示
    全文公開日期 2025/07/24 (校外網路)
    全文公開日期 2025/07/24 (國家圖書館:臺灣博碩士論文系統)
    QR CODE