簡易檢索 / 詳目顯示

研究生: 花正寰
CHENG-HUAN HUA
論文名稱: 行動支付應用程式主畫面與選單樣式之設計研究
A Study on the Main Page and Menu Style Design of
指導教授: 陳建雄
Chien-Hsiung Chen
口試委員: 張文智
Wen-Chih Chang
衛萬里
Wan-Li Wei
學位類別: 碩士
Master
系所名稱: 設計學院 - 設計系
Department of Design
論文出版年: 2018
畢業學年度: 106
語文別: 中文
論文頁數: 139
中文關鍵詞: 行動支付使用者介面主畫面設計選單樣式系統使用性體驗
外文關鍵詞: Mobile payment, User interface, Main page design, Menu style, System usability, Experience
相關次數: 點閱:456下載:1
分享至:
查詢本校圖書館目錄 查詢臺灣博碩士論文知識加值系統 勘誤回報
  • 行動支付近年來在政府及國內外廠商的推動下,正逐漸取代傳統現金付款形式,未來的應用將透過人工智慧、物聯網等技術,深入人們日常支付情境。本研究以行動支付應用程式(Application, APP) 的「主畫面」與「選單樣式」進行探討,運用問卷及實驗分析瞭解使用現況及使用性,再透過設計驗證提出改善建議。

    研究目的為:(1) 行動支付現況探討與介面設計準則歸納;(2) 行動支付應用程式設計改善需求彙整;(3) 模擬原型設計與驗證;(4) 統整結論與設計建議。本實驗分成三個主要階段:(1) 使用行為調查:彙集現有行動支付應用程式功能資料再進行問卷設計與現況調查;(2) 前導性實驗:採便利抽樣邀請30位受測者,從分析結果取得設計改善方向;(3) 驗證實驗:歸納文獻與前導性實驗結論,進行模擬原型設計驗證。實驗設計採 2(主畫面設計)x 3(選單樣式)雙因子組間方式進行,採便利抽樣邀請48位受測者,透過統計分析軟體獲得任務時間績效、系統使用性、使用者互動滿意度及使用者體驗感受四部分的結果。

    研究結果彙整如下:(1) 付款是行動支付應用程式最重要的功能,在圖示與文字提示、呈現位置等,須以清晰、易懂作為設計要素;(2) 使用「卡片佈局」主畫面需注意功能簡化後是否仍符合使用者心智模式;(3) 主畫面採「格狀佈局」時,建議搭配「頁籤選單」與「漢堡選單」可加快操作效率。採「卡片佈局」時,則建議搭配「無導覽列」及「漢堡選單」使用性、互動滿意度評價較佳;(4) 「頁籤選單」搭配「卡片佈局」主畫面的評價較差,主要原因在於操作行為不一致;(5) 行動支付應用程式使用者介面設計,應依服務性質與用戶需求進行設計。


    Mobile payments have been gradually replacing traditional forms of cash payment driven by the government as well as domestic and foreign manufacturers in recent years. Applications using technologies such as artificial intelligence and the internet of things will fill people's daily payment activities. This study is focused on the "main page" and "menu style" of the mobile payment application (APP). The questionnaires and experimental analysis are used to help understand the current usage and the usability of the application. Improvement suggestions are provided by design and verification.

    The purposes of the study are as follows: (1) Discussing the status of the mobile payment and summarizing the interface design guidelines; (2) Collecting the requests of improving the mobile payment application design; (3) Designing and verifying the simulation prototype design; (4) Consolidating the conclusion and the design suggestion.

    The experiment is divided into three stages: (1) Surveying the current usage: collecting the function data of the existing mobile payment application and then designing the questionnaire and surveying the current usage; (2) Pilot experiment: using convenient sampling to invite 30 users as participants, and obtaining the direction of design improvement from the analysis result; (3) Verification experiment: summarizing the literatures and the pilot experimental results to verify simulation prototype design. The experiment is designed to be a 2 (main page design) x 3 (menu style) between-subjects two-way ANOVA, wherein 48 participants are invited by convenient sampling method to help obtain the results of task time performance, system usability, user interaction satisfaction, and user experience through the statistical analysis.

    The results are summarized as follows: (1) Paying is the most important function of the mobile payment application. As to design, it should be clear and easy to find the illustrations, text prompts, and the presentation positions, etc.; (2) When using "card layout", it should be noted whether the simplified function still meets the user's mental models; (3) When the main screen adopts "grid layout", it is suggested to use "tab menu" and "hamburger menu" to speed up operation efficiency. For "card layout", it is recommended to adopt the "no navigation bar" and "hamburger menu" designs together for better satisfaction; (4) "Tab menu" cooperating with "card layout" is evaluated as the worse main page, the main reason is related to inconsistent operational behavior; (5) The user interface design of the mobile payment application should be designed according to the service type and the user's requirements.

    摘要 i Abstract ii 致謝 iv 目錄 v 圖目錄 vii 表目錄 ix 第一章 緒論 1 1.1 研究背景與動機 1 1.2 研究目的 2 1.3 研究架構與流程 4 1.4 研究範圍與限制 6 第二章 文獻探討 7 2.1 行動支付 7 2.1.1 行動支付定義 7 2.1.2 行動支付生態體系 7 2.1.3 行動支付現況分析 10 2.2 人本設計 11 2.2.1 以人為中心的設計 11 2.2.2 使用者經驗 13 2.2.3 使用者心智模式 14 2.3 介面設計準則 16 2.3.1 互動設計準則 16 2.3.2 易用性準則 17 2.4 人因工程 19 第三章 研究方法與進行步驟 23 3.1 研究進行步驟 23 3.2 實驗流程與建構 25 第四章 使用行為調查與前導性實驗 26 4.1 行動支付應用程式現況調查與功能彙整 26 4.1.1 行動支付應用程式整理與概述 26 4.1.2 行動支付應用程式功能整理 28 4.2 使用行為現況調查與結果分析 30 4.2.1 基本資料及使用經驗調查結果與分析 30 4.2.2 具使用經驗之使用者行為及註冊安全性問題調查結果與分析 31 4.2.3 具使用經驗者之介面操作行為調查結果與分析 35 4.2.4 使用行為調查結論歸納 39 4.3 前導性實驗 40 4.3.1 前導性實驗樣本選擇 40 4.3.2 前導性實驗設備詳細規格 41 4.3.3 前導性實驗對象 42 4.3.4 前導性實驗流程與步驟 43 4.3.5 前導性實驗任務內容 44 4.3.6 前導性實驗之任務操作績效結果與分析 46 4.3.7 SUS系統使用性尺度量表結果與分析 57 4.3.8 QUIS 使用者互動滿意度調查 59 4.4 前導性實驗結論與建議 67 第五章 驗證實驗與結果分析 70 5.1 實驗方法 70 5.2 實驗研究變項 70 5.2.1 自變項 70 5.2.2 控制變項 71 5.2.3 依變項 71 5.3 行動支付應用程式模擬原型設計 72 5.4 實驗問卷設計 75 5.5 實驗對象 77 5.5.1 基本資料調查結果與分析 77 5.5.2 行動支付應用程式使用經驗調查結果與分析 78 5.6 驗證實驗結果 83 5.6.1 驗證實驗之任務操作績效結果與分析 83 第六章 結論與建議 117 6.1 研究結果 117 6.1.1 行動支付應用程式類別、介面設計準則與發展現況探討結果 117 6.1.2 行動支付應用程式現況調查與前導性實驗結果彙整之設計建議 118 6.1.3 行動支付應用程式模擬原型設計與驗證實驗研究結果 122 6.1.4 綜合實驗結果提出結論與設計建議 125 6.2 後續發展 127 參考文獻 129 附錄一:前導性實驗問卷 132 附錄二:驗證實驗問卷 136

    1.Allums, S. (2014). Designing mobile payment experiences 行動支付體驗設計。鄭巧玉譯,台北:碁峰資訊股份有限公司出版。
    2.Bangor, A. (2009). Determining what individual SUS scores mean: Adding an adjective rating scale. Austin: Journal of usability studies, vol. 4, pp. 114-123.
    3.Garrett, J. J. (2000). The elements of user experience – user – centered design
    for the web. San Francisco, CA: New Riders Publishing.
    4.Norman, D. A. (2015). The design of everyday things 設計的心理學,陳宜秀譯,台北:遠流出版。
    5.Benyon, D., Turner, P. & Turner, S. (2009). Designing interactive systems 人機介面互動式系統設計,郭學武譯,台北:台灣培生教育出版股份有限公司。
    6.Preece, J., Rogers, Y. & Sharp, H. (2010). Interaction design: Beyond human-computer interaction 互動設計 跨越人-電腦互動,陳建雄譯,新北:全華圖書股份有限公司。
    7.Shneiderman, B. & Plaisant, C. (2010). Designing the user interface 人機介面設計,賴錦慧譯,台北:台灣培生教育出版股份有限公司。
    8.陳建雄(1999)。色彩辨識度與應用在使用者介面設計上的探討。工業設計,第二十七卷,第二期,p.58-63。
    9.陳建雄(2017)。Human factors/ergonomics in design,2017年5月19取自授課講義。
    10.張一岑(2016)。人因工程學。新北:揚智文化事業股份有限公司。
    11.楊子嫻(2014)。線上音樂服務平台使用者經驗及頁面導覽模式之設計研究。國立台灣科技大學設計研究所碩士論文。
    12.魏澤群(2007)。優使性2.0 網站經驗設計與使用者研究,台北:網奕資訊科技股份有限公司。
    13.李再長、李永輝、黃雪玲與王明揚(2005)。人因工程,台北:華泰文化事業股份有限公司。

    網路資源:
    1.Department of health and human services, digital communications division (2017, May 18). Usability evaluation basics. Retrieved from https://www.usability.gov/what-and-why/usability-evaluation.html
    2.DIGITIMES (2014, May 26). 從學術界角度看行動支付的商機與挑戰。取自http://www.digitimes.com.tw/tw/b2b/Seminar/shwnws_new.asp?CnlID=18&cat=99&product_id=051A30515&id=0000379869_5647K3Z67D7AJR8TJVNMU
    3.International ergonomics association (2017). Definition and domains of ergonomics. Retrieved May 28, 2017 from http://www.iea.cc/whats/
    4.ISO 9241-210:2010 (2010, March 15). Ergonomics of human-system interaction - Part 210: Human-centred design for interactive systems. Retrieved from https://www.iso.org/obp/ui/#iso:std:52075:en
    5.Nielsen, J. (1995, January 1). 10 Usability heuristics for user interface design. Retrieved from https://www.nngroup.com/articles/ten-usability-heuristics/
    6.Sauro, J. (2011, February 2). Measuring usability with the system usability scale (SUS). Retrieved from https://measuringu.com/sus/
    7.UXPA (2013, December 17). UX in practice. Retrieved from http://uxpa.org/resources/about-ux
    8.IT’s通訊電子報(2015年7月23日)。NFC行動支付於臺灣發展現況。取自http://newsletter.ascc.sinica.edu.tw/index.php?lid=308#article_3379
    9.MBAlib(無日期)。雲端支付。取自:http://wiki.mbalib.com/zh-tw/%E4%BA%91%E6%94%AF%E4%BB%98
    10.尹志誠(無日期)。談行動支付。取自www.tteia.org.tw/archive/files/104_169_01.doc
    11.尼爾森行銷研究顧問公司(2016年10月24日)。行動支付正在全球各地流行。取自http://www.nielsen.com/tw/zh/press-room/2015/mobile-money-makes-the-world-go-around.html
    12.吳碧娥(2016年9月21日)。迎向無現金社會,行動支付專利申請日趨熱門。取自http://www.naipo.com/Portals/1/web_tw/Knowledge_Center/Industry_Economy/IPNC_160921_0702.htm
    13.金融監督管理委員會(2015年10月01日)。金管會持續推動金融科技發展之措施。取自http://www.fsc.gov.tw/ch/home.jsp?id=96&parentpath=0,2&mcustomize=news_view.jsp&dataserno=201510010002&toolsflag=Y&dtable=News
    14.科技橘報(2016年6月16日)。Yahoo也要做行動支付!預估 3年內台灣行動支付使用人數將破千萬。取自:https://buzzorange.com/techorange/2016/06/16/yahoo-pay/
    15.資策會產業情報研究所(2016年3月2日)。《行動支付消費者調查》台灣行動支付用戶逾50%為35歲以下族群。取自https://mic.iii.org.tw/micnew/IndustryObservations_PressRelease02.aspx?sqno=427
    16.蘇文彬(2015年2月03日)。LINE與國泰世華聯手提供LINE Pay儲值服務,LINE Taxi叫車服務夏天上路。取自http://www.ithome.com.tw/news/93872

    QR CODE