教育APP的界面分析設(shè)計(jì)

頁(yè)共23頁(yè)1緒論1.1研究背景于2021年2月發(fā)表的《第47次中國(guó)互聯(lián)網(wǎng)絡(luò)發(fā)展?fàn)顩r統(tǒng)計(jì)報(bào)告》顯示，截至到2020年度，中國(guó)網(wǎng)民數(shù)量達(dá)近10億，其中95%為使用手機(jī)上網(wǎng)的人群。這也說(shuō)明移動(dòng)互聯(lián)網(wǎng)的發(fā)展伴隨著智能應(yīng)用的變革而蓬勃發(fā)展。APP(APP是application的縮寫，是智能手機(jī)的應(yīng)用）在網(wǎng)絡(luò)上如日中天；而“互聯(lián)網(wǎng)+”，更是改變了許多產(chǎn)業(yè)的發(fā)展模式。教育部在2015年5月出臺(tái)的《關(guān)于加強(qiáng)高等學(xué)校在線開放課程建設(shè)應(yīng)用與管理意見(jiàn)》指出，《高校在線開放課程》（簡(jiǎn)稱MOOC）建議高校積極構(gòu)建在線開放教學(xué)體系和教學(xué)平臺(tái)，加大公開開放教學(xué)建設(shè)的實(shí)施力度，開發(fā)“MOOC”學(xué)生和在線教學(xué)應(yīng)用。當(dāng)前，通過(guò)APPStore、各類應(yīng)用商城能搜索到各類教育類APP，盡管數(shù)量很多，但是也能發(fā)現(xiàn)存在的問(wèn)題如低效、同質(zhì)化設(shè)計(jì)、內(nèi)容界面設(shè)計(jì)復(fù)雜等。因此，本文基于用戶體驗(yàn)對(duì)網(wǎng)絡(luò)教學(xué)APP進(jìn)行了深入探討。1.2研究的目的和意義(1)充分利用學(xué)校資源，對(duì)網(wǎng)絡(luò)教學(xué)的發(fā)展起到一定的輔助作用，提高了高校的教學(xué)水平。(2)為在線教育提供更豐富、專業(yè)的在線平臺(tái)，提升全民教育質(zhì)量。(3)為教育APP的設(shè)計(jì)、特別是高校教育APP的設(shè)計(jì)、開發(fā)、實(shí)踐提供更具專業(yè)的參考。1.3研究現(xiàn)狀移動(dòng)互聯(lián)網(wǎng)時(shí)代促使移動(dòng)端APP數(shù)量和內(nèi)容不斷創(chuàng)新。特別是在文化創(chuàng)新上，APP設(shè)計(jì)者們更加重視了app獨(dú)特性的設(shè)計(jì)，對(duì)用戶的使用感愈發(fā)重視?！禪I演進(jìn)—移動(dòng)設(shè)備人機(jī)交互界面設(shè)計(jì)》這本書中，作者從產(chǎn)品化的角度討論了手機(jī)的交互概念設(shè)計(jì)和產(chǎn)品特點(diǎn)，并討論了其設(shè)計(jì)的可行性和實(shí)現(xiàn)方法。文章認(rèn)為可視化是一種讓用戶更直接地看到產(chǎn)品的媒介，是一種有意義的交流過(guò)程。文章結(jié)合實(shí)例對(duì)手機(jī)界面進(jìn)行了初步的分析、研究、數(shù)據(jù)整理和評(píng)價(jià)。目前我國(guó)相關(guān)專業(yè)的畢業(yè)論文大多集中在應(yīng)用程序的界面設(shè)計(jì)上，如《手機(jī)攝影軟件界面設(shè)計(jì)研究》和《手機(jī)用戶注意力設(shè)計(jì)》等書籍中，均是從用戶的角度對(duì)移動(dòng)終端用戶的交互產(chǎn)生了影響進(jìn)行研究。另一部分是研究主要是集中于界面中的特定的視覺(jué)元素。以《中國(guó)畫元素在用戶界面創(chuàng)新設(shè)計(jì)中的應(yīng)用研究》為例，介紹了如何運(yùn)用中國(guó)畫這一視覺(jué)元素。基于符號(hào)學(xué)和設(shè)計(jì)心理學(xué)的界面圖標(biāo)視覺(jué)設(shè)計(jì)與應(yīng)用研究，從設(shè)計(jì)、功能和情感三個(gè)方面闡述圖標(biāo)的設(shè)計(jì)、功能和情感，探討圖標(biāo)設(shè)計(jì)的設(shè)計(jì)原則，探討圖標(biāo)的發(fā)展方向設(shè)計(jì)。1.4研究方法(1)文獻(xiàn)檢索法在前期的準(zhǔn)備工作主要是通過(guò)在知網(wǎng)、百度搜索等平臺(tái)去閱讀手機(jī)界面設(shè)計(jì)、用戶體驗(yàn)、高校在線教育APP等相關(guān)書籍和文獻(xiàn)資料，學(xué)習(xí)相關(guān)的基礎(chǔ)知識(shí)，對(duì)所要解決的問(wèn)題有一個(gè)較為深入的認(rèn)識(shí)；(2)分析歸納法本文的中期研究主要是利用手機(jī)下載和使用大量高校網(wǎng)絡(luò)教學(xué)APP，搜集市面上各種高校網(wǎng)絡(luò)教學(xué)APP的界面設(shè)計(jì)特點(diǎn)，并對(duì)其界面的優(yōu)勢(shì)和缺陷進(jìn)行了分析，并指出了由于視覺(jué)效果差而造成的用戶體驗(yàn)降低的原因。(3)案例分析法本文結(jié)合具體案例，綜合對(duì)比分析在教育APP界面各模塊的設(shè)計(jì)和功能模塊等，結(jié)合視覺(jué)層級(jí)關(guān)系等相關(guān)所學(xué)，指出在教育APP設(shè)計(jì)上的相關(guān)建議。1.5展示平臺(tái)技術(shù)介紹（1）AxureRPAxureRP是一個(gè)可以滿足設(shè)計(jì)師們需求，設(shè)計(jì)功能和界面可以快速的創(chuàng)建應(yīng)用軟件的線框圖、流程圖、原型和規(guī)格說(shuō)明文檔的專業(yè)快速原型設(shè)計(jì)工具，它可以支持很多人在同一時(shí)間一起工作和版本控制管理（2）HTMLHTML5中用一個(gè)新的標(biāo)簽＜canvas＞的定義來(lái)進(jìn)行圖像的處理，＜canvas＞標(biāo)簽提供了一個(gè)2DProgrammaticAPI可以以較低的存儲(chǔ)代價(jià)來(lái)處理圖像。用API不僅可以繪制圖像，且可以做圖像分析和處理。＜canvas＞只是作為HTML頁(yè)面上的一個(gè)元素，如果需要對(duì)圖像進(jìn)行操作就必須要借助canvas的API。（3）CSSCSS（CascadingStyleSheets，層疊樣式表），它是表現(xiàn)HTML或XML等文件樣式的語(yǔ)言?？梢杂肅SS，來(lái)定做、修改優(yōu)化網(wǎng)頁(yè)的顯示效果，還可以產(chǎn)生濾鏡、圖像淡化、淡入淡出等漸變，而且可以完成簡(jiǎn)單的交互設(shè)計(jì)，用來(lái)提提高前端的樣式美觀。CSS與結(jié)構(gòu)碼HTML／XHTML這兩個(gè)的結(jié)合，可以實(shí)現(xiàn)“結(jié)構(gòu)碼”和“表現(xiàn)碼”的分離，減小了維護(hù)站點(diǎn)外觀的工作難度，并且因?yàn)楹?jiǎn)化了HTML文檔，從而縮短了瀏覽器的加載時(shí)間。（4）JavaScriptJavaScript最初用途是圖標(biāo)檢驗(yàn)，現(xiàn)在發(fā)展成一種功能齊全的編程語(yǔ)言，可以處理復(fù)雜的交互與計(jì)算，擁有匿名、閉包函數(shù)甚至某類計(jì)算機(jī)程序的編寫，可以同瀏覽器幾乎所有部分完成互動(dòng)設(shè)計(jì)。一般會(huì)將JavaScript與ECMAScript認(rèn)為相同，但JavaScript其實(shí)要更加的豐富，除了包含ECMAScript、DOM外，還有BOM（瀏覽器對(duì)象模型），利用BOM能對(duì)瀏覽器的窗口和框架進(jìn)行操作。JavaScript是一種動(dòng)態(tài)類型、弱類型、基于原型的語(yǔ)言，所以它不擁有空間命名、引入模塊、私有成員、編譯執(zhí)行等特征，因此在開發(fā)時(shí)必須注意使用。2教育APP設(shè)計(jì)概述2.1在線教育APP的發(fā)展概況在線教育可以說(shuō)是互聯(lián)網(wǎng)時(shí)代才產(chǎn)生的，有學(xué)者也稱之為“在線教育”、“E-Learning”或“在線學(xué)習(xí)”，由此可見(jiàn)在線教育是一種統(tǒng)稱。在線教育最早是在1999年的美國(guó)在線學(xué)習(xí)會(huì)議上提出的，是在網(wǎng)絡(luò)電子技術(shù)的支持和實(shí)現(xiàn)下，通過(guò)網(wǎng)絡(luò)、廣播電視等電子媒體進(jìn)行的學(xué)習(xí)和教學(xué)。在美國(guó)2000年教育部頒發(fā)《教育技術(shù)白皮書》提出“在線教育是一種以互聯(lián)網(wǎng)為媒介的教學(xué)方式”，它以互聯(lián)網(wǎng)為基礎(chǔ)，利用互聯(lián)網(wǎng)開展相關(guān)的教學(xué)活動(dòng)。在線教育相比于線下教育，最大的特點(diǎn)在于學(xué)習(xí)的自主性、教學(xué)形式的多樣化且智能化、學(xué)習(xí)資源豐富。在線教育能充分利用互聯(lián)網(wǎng)資源，和在線應(yīng)用設(shè)計(jì)的智能性，為學(xué)生用戶提供更為個(gè)性化和豐富的資源。同時(shí)，在線教學(xué)不再是傳統(tǒng)的“被動(dòng)”教學(xué)方式。它要求用戶具有更強(qiáng)的自我意識(shí)，能夠隨時(shí)隨地完成教學(xué)任務(wù)。師生、學(xué)生與學(xué)生之間可以在互聯(lián)網(wǎng)上進(jìn)行深入的互動(dòng)和交流，利用大量的信息進(jìn)行教學(xué)反饋。2.2在線教育類APP的發(fā)展現(xiàn)狀1999年以來(lái)，我國(guó)在高等職業(yè)教育中大力發(fā)展網(wǎng)絡(luò)教育。但由于多媒體輔助教學(xué)技術(shù)水平低、成本高，尚未實(shí)現(xiàn)規(guī)?；l(fā)展。在互聯(lián)網(wǎng)信息化和國(guó)外在線教學(xué)發(fā)展的帶動(dòng)下，我國(guó)在線教學(xué)發(fā)展迅速，技術(shù)日趨成熟。2002年，麻省理工學(xué)院為公眾推出了一系列免費(fèi)的在線教育項(xiàng)目。隨著在線育資源的快速發(fā)展，人們可以在互聯(lián)網(wǎng)上使用更多優(yōu)質(zhì)的教育信息?？珊箤W(xué)院、coursera和EDX等互聯(lián)網(wǎng)教育公司正在崛起。在2010年后，在線教育亦或者在線輔導(dǎo)呈現(xiàn)井噴式發(fā)展。特別是在我國(guó)中小學(xué)培訓(xùn)APP上，因?yàn)檎n堂教育的改革，很多家長(zhǎng)為了讓自己的小孩在學(xué)生上能更具有競(jìng)爭(zhēng)力，往往通過(guò)線上教育的方式安排各種培訓(xùn)。正是因?yàn)楦黝惣议L(zhǎng)需求的增加，在線教育的內(nèi)容設(shè)計(jì)和渠道愈發(fā)多樣化。如以培訓(xùn)為主的新東方、中工教育、華圖教育等，或傳統(tǒng)高校北大、清華等國(guó)內(nèi)學(xué)校，均成為了在線教育的主要來(lái)源。在不同的行業(yè)中，我們均可以找到優(yōu)質(zhì)的針對(duì)性在線教學(xué)資源。其中，職業(yè)院校和外語(yǔ)專業(yè)是在線教學(xué)領(lǐng)域規(guī)模最大的兩個(gè)領(lǐng)域。隨著在線教育的快速發(fā)展，許多教育APP進(jìn)入了大眾的視野。用戶可以根據(jù)自己的需求選擇不同的APP。2.3在線教育類APP存在的問(wèn)題在線教學(xué)應(yīng)用APP數(shù)量龐大，但仍存在很大的問(wèn)題。例如，很多同類型APP應(yīng)用內(nèi)容同質(zhì)化強(qiáng)，獨(dú)立設(shè)計(jì)APP產(chǎn)量低；綜合類應(yīng)用APP雖然教學(xué)資源豐富，但綜合教育內(nèi)容來(lái)看與課堂教育內(nèi)容無(wú)法完全整合，缺乏傳統(tǒng)教師課堂備述的針對(duì)性。在傳統(tǒng)教學(xué)中，學(xué)生的上課時(shí)間均被學(xué)校合理的安排，教師會(huì)針對(duì)每堂課設(shè)計(jì)教學(xué)內(nèi)容。但是在線教學(xué)則以學(xué)生的主觀能動(dòng)性和積極性為主。目前，大多數(shù)在線教學(xué)應(yīng)用提供的學(xué)習(xí)資料較長(zhǎng)，缺乏全面的教學(xué)計(jì)劃。大量長(zhǎng)期、多視頻的學(xué)習(xí)項(xiàng)目，降低了學(xué)習(xí)積極性，進(jìn)而降低了教學(xué)質(zhì)量。然而，在目前的網(wǎng)絡(luò)教學(xué)應(yīng)用中，用戶可以在有限的時(shí)間內(nèi)完成自己的學(xué)習(xí)，但用戶的學(xué)習(xí)頻率、進(jìn)度都比較慢。這是因?yàn)楹芏嘣诰€教育企業(yè)內(nèi)容生產(chǎn)能力低，對(duì)用戶需求缺乏了解，缺乏教學(xué)實(shí)踐。在線教學(xué)應(yīng)用APP的界面設(shè)計(jì)是與用戶交流的產(chǎn)物，是用戶對(duì)應(yīng)用的第一印象的主要來(lái)源，會(huì)影響用戶對(duì)應(yīng)用的理解和使用。一個(gè)優(yōu)秀的應(yīng)用頁(yè)面會(huì)吸收用戶的視線和提升好感度。簡(jiǎn)潔、高效、有核心內(nèi)容的頁(yè)面能讓用戶快速獲取信息，特別是符合用戶使用習(xí)慣的頁(yè)面設(shè)計(jì)，能很好地引導(dǎo)用戶進(jìn)行使用，并快速了解相關(guān)功能，從而提高產(chǎn)品的品牌知名度。手機(jī)用戶產(chǎn)品的關(guān)鍵是設(shè)計(jì)好的界面和功能組件的合理展示。但在線教學(xué)應(yīng)用APP的界面設(shè)計(jì)存在識(shí)別率低、視覺(jué)層次不規(guī)則、操作體驗(yàn)差等問(wèn)題。一些在線教學(xué)應(yīng)用APP缺乏趣味性和交互性，用戶體驗(yàn)單調(diào)。另外，用戶體驗(yàn)慢，用戶接受度差。因此，下載的在線教學(xué)應(yīng)用APP不會(huì)被學(xué)生所經(jīng)常使用。2.4高校在線教育APP界面設(shè)計(jì)的復(fù)雜性和重要性隨著互聯(lián)網(wǎng)的發(fā)展、智能手機(jī)的普及和人們的學(xué)習(xí)需求增加，各種在線教學(xué)軟件已經(jīng)通過(guò)手機(jī)這一媒介滲透到人們的日常生活中。清晰的應(yīng)用界面能讓使用者快速了解到該頁(yè)面想要傳遞的信息，也能讓用戶了解到該頁(yè)面內(nèi)容與自己的需求的匹配度。手機(jī)用戶產(chǎn)品的關(guān)鍵是設(shè)計(jì)好的界面，并將功能組件的合理展示。高校網(wǎng)絡(luò)教學(xué)應(yīng)用APP的界面設(shè)計(jì)與網(wǎng)絡(luò)教學(xué)應(yīng)用完全不同。既要考慮學(xué)校教學(xué)設(shè)計(jì)初衷，又要符合學(xué)校的實(shí)際形象，促進(jìn)高校在線教學(xué)的應(yīng)用，提高學(xué)生的粘性。由于在線教學(xué)App內(nèi)容豐富、交互性強(qiáng)、趣味性好，需要引入不同頁(yè)面之間的過(guò)渡動(dòng)態(tài)效果、聲音特效、界面設(shè)計(jì)元素等內(nèi)容，這對(duì)高校在線教學(xué)App界面的整體設(shè)計(jì)提出了更高的要求。.特別是不同高校在教學(xué)內(nèi)容設(shè)計(jì)上有其獨(dú)有的教學(xué)設(shè)計(jì)，而且在面對(duì)社會(huì)對(duì)高校學(xué)生所具備的素養(yǎng)標(biāo)準(zhǔn)下，高校教學(xué)APP設(shè)計(jì)在內(nèi)容豐富程度上更需要進(jìn)行精心設(shè)計(jì)。由于其教學(xué)信息的復(fù)雜性，也決定了界面設(shè)計(jì)中面臨著諸多困難。高校在線教育APP不僅要合理清晰地呈現(xiàn)信息層次和視覺(jué)層次，還要考慮視覺(jué)美感和流暢度。2.5基于用戶體驗(yàn)的高校在線APP設(shè)計(jì)流程以上五種用戶體驗(yàn)本質(zhì)上是產(chǎn)品開發(fā)和設(shè)計(jì)，相互獨(dú)立。本文結(jié)合相關(guān)所學(xué)知識(shí)以及學(xué)者們研究，認(rèn)為高校在線教育APP的設(shè)計(jì)流程如下：項(xiàng)目溝通、需求研究與功能改造、交互設(shè)計(jì)、可用性測(cè)試、迭代測(cè)試。項(xiàng)目溝通，即APP設(shè)計(jì)者、產(chǎn)品經(jīng)理、運(yùn)營(yíng)人員等需要通過(guò)溝通，了解各自的任務(wù)，同時(shí)反饋出高校在線教育APP設(shè)計(jì)的進(jìn)度，確認(rèn)項(xiàng)目立項(xiàng)。只有不斷的溝通，才會(huì)讓需求更加明確，推動(dòng)設(shè)計(jì)進(jìn)度，也能更符合使用者的習(xí)慣。需求研究與功能改造，即在設(shè)計(jì)過(guò)程中，要知道每個(gè)版塊功能的目的，以及功能設(shè)計(jì)邏輯。為了更好的視線需求和功能，也需要APP方運(yùn)營(yíng)者通過(guò)訪談、問(wèn)卷調(diào)查等方式，了解產(chǎn)品目標(biāo)用戶的使用習(xí)慣、需求、偏好等。最后對(duì)用戶需求進(jìn)行篩選，最終得到高校在線教學(xué)應(yīng)用需要設(shè)計(jì)主要功能。在交互設(shè)計(jì)中生產(chǎn)線的設(shè)計(jì)是從用戶角色出發(fā)進(jìn)行功能設(shè)計(jì)、信息框架的構(gòu)建來(lái)完成的。一般而言畫一個(gè)簡(jiǎn)單的草圖，以便以后修改。進(jìn)行計(jì)算機(jī)仿真設(shè)計(jì)，得到較為精確的樣機(jī)，可用于高校在線教育APP初步實(shí)驗(yàn)中。在視覺(jué)設(shè)計(jì)上，產(chǎn)品與用戶交互更加直接，既能展示產(chǎn)品的主要信息，又能為用戶提供更好的視覺(jué)體驗(yàn)。UI作為品牌傳播的主要手段，在APP的設(shè)計(jì)上應(yīng)繼承UI設(shè)計(jì)的主色彩和設(shè)計(jì)元素。視覺(jué)設(shè)計(jì)的基本原則必須符合用戶的使用習(xí)慣和心理特點(diǎn)，才會(huì)更容易被用戶接受。可行性測(cè)試主要是對(duì)設(shè)計(jì)功能進(jìn)行測(cè)試。主要是從用戶角度出發(fā)，確認(rèn)APP各個(gè)頁(yè)面的使用體驗(yàn)感、功能之間切換的邏輯、功能開發(fā)的必要性等。可行性測(cè)試的目標(biāo)主要是對(duì)APP進(jìn)行上線優(yōu)化，盡量切合用戶需求，提示APP的滿意度。迭代設(shè)計(jì)就是不斷的改進(jìn)在APP開發(fā)和使用過(guò)程中發(fā)現(xiàn)的問(wèn)題，可以最大限度地提高在線教學(xué)軟件的質(zhì)量。3教育APP實(shí)例分析3.1評(píng)價(jià)標(biāo)準(zhǔn)制定內(nèi)容在一系列實(shí)驗(yàn)中，A.侗威奧證實(shí)了“信息以視覺(jué)和聽覺(jué)兩種方式存儲(chǔ)”。關(guān)于如何選擇信息，美國(guó)著名傳播專家施拉姆曾指出“選擇的可能性=獎(jiǎng)勵(lì)的安全性/支付的金額”他指出，增加金額的支付或降低成本可以增加選擇特定信息傳播的可能性?；诖死碚?，本文認(rèn)為在高校在線教育APP的設(shè)計(jì)上，也要選擇設(shè)計(jì)免費(fèi)教學(xué)和付費(fèi)教學(xué)。當(dāng)然，這兩種的需求設(shè)計(jì)都需要符合用戶。如果一味追求付費(fèi)，會(huì)丟失基礎(chǔ)用戶群體；如果全是免費(fèi)內(nèi)容，內(nèi)容的精細(xì)程度上會(huì)沒(méi)有競(jìng)爭(zhēng)力。這就需要對(duì)付費(fèi)和免費(fèi)的選擇上進(jìn)行考量。為了在APP上有效傳遞教學(xué)信息，降低教職工的能耗，需要對(duì)APP上的各種元素進(jìn)行適當(dāng)?shù)恼{(diào)整，使其符合學(xué)生的學(xué)習(xí)習(xí)慣，便于學(xué)生接受和理解。在討論多媒體教學(xué)的教育功能時(shí)，LK提出了利用多媒體技術(shù)進(jìn)行人機(jī)交互的方法，包括文本、背景和圖標(biāo)。在教學(xué)應(yīng)用中，文本主要起到傳遞教育信息的作用，文本設(shè)計(jì)的正確與否對(duì)教學(xué)應(yīng)用的質(zhì)量有重要影響。為了傳達(dá)教育信息，我們需要充分考慮文本組合效果的大小和空白，以防止學(xué)生只關(guān)注文本的作用而忽視文本所傳達(dá)的信息。教學(xué)應(yīng)用的界面環(huán)境雖然不能直接將教學(xué)內(nèi)容傳遞給學(xué)生，但是環(huán)境的設(shè)置也會(huì)對(duì)學(xué)生的教學(xué)效果產(chǎn)生一定的影響。如果用戶在應(yīng)用程序中設(shè)置的顏色過(guò)多或顏色不當(dāng)，會(huì)導(dǎo)致學(xué)生視覺(jué)疲勞，影響他們對(duì)教學(xué)信息的理解。教育應(yīng)用程序是一種教育軟件，是一種教育學(xué)生的手段。界面設(shè)置應(yīng)考慮學(xué)生的思維習(xí)慣、視覺(jué)習(xí)慣和使用習(xí)慣。熟悉的事物更容易吸引他們的注意力。人的視覺(jué)區(qū)域應(yīng)該是視覺(jué)從左到右、從上到下，并且容易區(qū)分明亮的顏色。人的精力是有限的，連續(xù)高強(qiáng)度的學(xué)習(xí)會(huì)給學(xué)生帶來(lái)身心疲勞。這種行為會(huì)直接影響學(xué)生對(duì)教育APP展示內(nèi)容的學(xué)習(xí)和吸收。一旦違反這種行為，就會(huì)增加學(xué)生的外在認(rèn)知負(fù)荷，導(dǎo)致學(xué)生無(wú)法專注于學(xué)習(xí)信息，從而降低學(xué)習(xí)效果。教育應(yīng)用在視覺(jué)習(xí)慣、思維習(xí)慣和使用習(xí)慣的設(shè)計(jì)上不斷交互，達(dá)到最佳的交流效果。本文以人機(jī)工程學(xué)原理為第一指標(biāo)，視覺(jué)效果和操作人機(jī)工程學(xué)為第一指標(biāo)，以視覺(jué)效果區(qū)域、內(nèi)容分類、文字、圖標(biāo)、背景和操作方式為主要內(nèi)容，通過(guò)對(duì)比、重復(fù)、逼近，分組等方法，建立了適合教學(xué)應(yīng)用的界面設(shè)計(jì)評(píng)價(jià)標(biāo)準(zhǔn)，并給出了具體內(nèi)容。見(jiàn)表3-1，并闡述了標(biāo)準(zhǔn)的具體內(nèi)容。其中評(píng)價(jià)標(biāo)準(zhǔn)中各項(xiàng)指標(biāo)的具體內(nèi)容為:一級(jí)指標(biāo)二級(jí)指標(biāo)思維工效最佳視覺(jué)區(qū)內(nèi)容分類圖標(biāo)位置圖標(biāo)樣式視覺(jué)工效文字大小文字間留白背景樣式背景顏色搭配操作工效操作模式3.1.1符合“最佳視覺(jué)區(qū)”的標(biāo)準(zhǔn)尼爾森在2006年進(jìn)行的眼動(dòng)追蹤實(shí)驗(yàn)查看了232位用戶的觀察數(shù)據(jù)。結(jié)果表明，他們?cè)诓煌W(wǎng)站和作業(yè)上的閱讀路徑呈“F”形。第一步是水平掃描，F(xiàn)字的頂部，然后垂直向下。但向下的閱讀內(nèi)容比第一頁(yè)少得多。然后是閱讀中間、進(jìn)而閱讀下一頁(yè)。測(cè)試表明，起初用戶的閱讀是瀏覽整個(gè)頁(yè)面，沒(méi)有突出的動(dòng)作；其次，最重要的信息應(yīng)該包含在前兩段中；第三，當(dāng)垂直閱讀最左邊的信息時(shí)，用戶會(huì)注意到標(biāo)題、段落等重要內(nèi)容。因此，設(shè)計(jì)者應(yīng)根據(jù)用戶的閱讀習(xí)慣設(shè)計(jì)教學(xué)應(yīng)用的界面，將主要信息放入用戶的可視區(qū)域，即F字形。3.1.2內(nèi)容分類明顯的標(biāo)準(zhǔn)本文整理的內(nèi)容分級(jí)評(píng)價(jià)，是將相似內(nèi)容進(jìn)行分類后，不同類型的表現(xiàn)形式是否要突出顯著。根據(jù)視覺(jué)感知的注意力理論，設(shè)計(jì)頁(yè)面可以通過(guò)大小和顏色的對(duì)比來(lái)吸引用戶的注意力。頁(yè)面內(nèi)容按不同顏色的色塊、不用顏色的線條進(jìn)行區(qū)域的分割以作為內(nèi)容的分類。在這種情況下，不同區(qū)域的顏色可以是互補(bǔ)的或色彩對(duì)比的，這樣分類的重點(diǎn)更加明顯，從而吸引學(xué)生的注意力。3.1.3圖標(biāo)位置和樣式一致的標(biāo)準(zhǔn)一些實(shí)驗(yàn)表明，在人機(jī)交互中，感知物體和搜索物體的效果與熟悉度有關(guān)。因此，在用戶界面上使用的圖標(biāo)和按鈕應(yīng)盡可能與用戶自身的體驗(yàn)一致。即在教學(xué)軟件設(shè)計(jì)中，具有相同功能的圖標(biāo)或按鈕可以保持不變。當(dāng)用戶根據(jù)自己的經(jīng)驗(yàn)使用圖標(biāo)或按鈕時(shí)，會(huì)讓學(xué)生在短時(shí)間內(nèi)回憶起類似的動(dòng)作以便減少他們的反應(yīng)時(shí)間。3.1.4文字大小適中的標(biāo)準(zhǔn)字體大小取決于它們的表示方式。如果文本以磅為單位，則其真實(shí)大小為1/72英寸。如果用多媒體來(lái)表示文字，那么文字是用像素來(lái)表示的，因?yàn)槲淖值娘@示是由像素組成的。對(duì)于傳統(tǒng)的文字顯示方式，推薦的字體大小為4-5磅。這個(gè)數(shù)字在教學(xué)應(yīng)用中也很常見(jiàn)。一般來(lái)說(shuō)，重點(diǎn)是8-14磅，其他5-8磅。由于不同多媒體的屏幕像素密度不同，使用不同的多媒體形式會(huì)導(dǎo)致文字大小發(fā)生變化，增加了頁(yè)面上字體呈現(xiàn)的層次感。本文采用基于數(shù)值表示的方法將文本量轉(zhuǎn)換為數(shù)值尺度。例如，字體大小是圖標(biāo)或按鍵字體大小的2~3倍，圖標(biāo)或按鍵字體大小的1~5倍。3.1.5文字間有留白的標(biāo)準(zhǔn)在界面設(shè)計(jì)中，人們往往追求簡(jiǎn)潔，摒棄大量重疊的視覺(jué)元素，用簡(jiǎn)潔的方法清晰地傳達(dá)視覺(jué)信息。文本是教學(xué)應(yīng)用中最重要的表達(dá)形式。因此，在教學(xué)應(yīng)用中，用戶可以通過(guò)閱讀大量的文本來(lái)學(xué)習(xí)，文本的選擇將在他們的學(xué)習(xí)中發(fā)揮重要作用。文字布局過(guò)于緊湊，容易造成用戶視覺(jué)疲勞。因此，文章之間應(yīng)該有空格。3.1.6背景樣式一致的標(biāo)準(zhǔn)教學(xué)應(yīng)用需要使用大面積的背景色。當(dāng)用戶學(xué)習(xí)某個(gè)教學(xué)應(yīng)用程序時(shí)，他們將面對(duì)所有的網(wǎng)頁(yè)，每個(gè)網(wǎng)頁(yè)上都有大量的內(nèi)容展示。當(dāng)所有網(wǎng)頁(yè)都有不同的背景時(shí)，人們會(huì)產(chǎn)生錯(cuò)覺(jué)。因此，對(duì)于教育應(yīng)用來(lái)說(shuō)，背景顏色和樣式應(yīng)該同色系。3.1.7背景顏色適中的標(biāo)準(zhǔn)在教學(xué)應(yīng)用的界面中，色彩的協(xié)調(diào)和搭配是最重要的。一般來(lái)說(shuō)，一個(gè)網(wǎng)頁(yè)應(yīng)該使用三種以上的顏色，選擇一種作為主色，并使用適當(dāng)?shù)念伾M合來(lái)體現(xiàn)教學(xué)應(yīng)用的設(shè)計(jì)。顏色的搭配要注意整體的和諧與突出。簡(jiǎn)而言之，網(wǎng)頁(yè)的顏色組合應(yīng)該讓用戶感到舒適。此外，文本和背景之間的顏色匹配是關(guān)鍵。根據(jù)視覺(jué)感知理論，人們對(duì)刺激的感官反應(yīng)是有限的。當(dāng)使用者超過(guò)可接受的限度時(shí)，他會(huì)減少對(duì)身體的刺激，從而達(dá)到協(xié)調(diào)和平衡。因此，背景色彩選擇上嘗試使用互補(bǔ)色，并在文本和背景之間使用相反的顏色。3.1.8操作模式設(shè)置的標(biāo)準(zhǔn)使用教學(xué)應(yīng)用時(shí)，用戶可以手動(dòng)操作各種組件，但活動(dòng)空間有限，不能無(wú)限擴(kuò)展。隨著手機(jī)變得越來(lái)越大，用戶使用手機(jī)變得越來(lái)越困難。因此，在教學(xué)APP的操作中，我們需要考慮學(xué)生的使用情況，比如單手、左掌、橫屏、豎屏等等。在安卓市場(chǎng)、豌豆應(yīng)用下載平臺(tái)中，筆者選擇了教育、教學(xué)進(jìn)行關(guān)鍵詞搜索，篩選出30個(gè)教學(xué)應(yīng)用程序，并簡(jiǎn)要說(shuō)明其功能和分類。詳見(jiàn)表3-2。根據(jù)教育應(yīng)用的服務(wù)對(duì)象，應(yīng)用可以分為三類。第一類主要是學(xué)生，包括中小學(xué)生和大學(xué)生。二是注重技術(shù)培訓(xùn)。表3-2:教育APP介紹3.2.數(shù)據(jù)分析(1)樣本數(shù)據(jù)分析根據(jù)作者提出的評(píng)價(jià)標(biāo)準(zhǔn)，本文從最佳視覺(jué)區(qū)域、內(nèi)容分類、圖標(biāo)風(fēng)格、圖標(biāo)位置、文字大小、文字空白、背景風(fēng)格、背景顏色和操作方式九個(gè)方面進(jìn)行了詳細(xì)研究，結(jié)果見(jiàn)表3-3(教育APP界面設(shè)計(jì)評(píng)價(jià)的內(nèi)容分析中，1代表符合，0代表不符合):表3-3：樣本數(shù)據(jù)分析教學(xué)應(yīng)用設(shè)計(jì)方面，教學(xué)應(yīng)用25款，占比83.7%；其中，教學(xué)應(yīng)用軟件25款，占比88.3%；其中應(yīng)用13個(gè)，占比74.3%，說(shuō)明教學(xué)應(yīng)用的設(shè)計(jì)幾乎沒(méi)有考慮學(xué)生的思維和體驗(yàn)。在教學(xué)應(yīng)用界面中，相同位置的圖標(biāo)有14個(gè)，占比60.7%。本文根據(jù)用戶需求，將30款教學(xué)應(yīng)用分為兒童學(xué)習(xí)、技能學(xué)習(xí)和學(xué)生學(xué)習(xí)三類，以全面了解各類教學(xué)應(yīng)用的發(fā)展現(xiàn)狀?！缎“帻垺?、《貝娃》童謠、《咪咕星寶》、《兔兔》童謠、愛(ài)奇藝動(dòng)漫之家》6首以上童謠；技能培訓(xùn)APP有4本如駕考詞典、駕校一次過(guò)（保證版）、普通話測(cè)試和輪換測(cè)試；學(xué)生教育應(yīng)用包括作業(yè)指導(dǎo)、猿搜索題目、粉筆和考試、網(wǎng)易有道詞典、阿凡達(dá)、日常練習(xí)、金山詞霸、百度翻譯、分詞、作業(yè)、互動(dòng)動(dòng)作、扇貝口語(yǔ)、流利的英語(yǔ)、優(yōu)化網(wǎng)絡(luò)、中文大學(xué)MOOC、新概念英語(yǔ)、猿題庫(kù)等。(2)兒童學(xué)習(xí)類教育APP數(shù)據(jù)分析6款兒童學(xué)習(xí)類教育APP分析結(jié)果見(jiàn)表3-4表3-4:兒童學(xué)習(xí)類教育APP分析三款適合孩子學(xué)習(xí)類APP，占據(jù)了50%的比例。也就是說(shuō)，一半以上的童學(xué)習(xí)類APP在設(shè)計(jì)時(shí)都會(huì)注意到使用者的視覺(jué)喜好，而在界面上有兩款兒童學(xué)習(xí)APP，占據(jù)了33%的比例，也就是說(shuō)一多半的孩子學(xué)習(xí)APP并沒(méi)有區(qū)分出具體的類別。(3)技能培訓(xùn)類教育APP數(shù)據(jù)分析4款技能培訓(xùn)類教育APP分析結(jié)果見(jiàn)表3-5表3-5:技能培訓(xùn)類教育APP分析技能培訓(xùn)應(yīng)用中，只有背景顏色適中的比例為100%。在圖標(biāo)和留白上，均占比50%，就是說(shuō)大部分技能培訓(xùn)APP都會(huì)有相同的圖案；中等字體的技能培訓(xùn)類APP也有3款，占總數(shù)的75.0%。但是在單手和左手操作模式上，比例為0%，可見(jiàn)在行為習(xí)慣的使用觀察上，單手和左手操作被忽略了。20款學(xué)生學(xué)習(xí)類教育APP分析結(jié)果見(jiàn)表3-6表3-6：學(xué)生學(xué)習(xí)類教育APP分析18款學(xué)生的教學(xué)APP在優(yōu)化視覺(jué)區(qū)上使用了內(nèi)容分類設(shè)計(jì)，占據(jù)了90.0%的比重，這意味著，大部分的學(xué)生在使用這些APP的時(shí)候，都會(huì)注意到用戶的思考方式。綜上，對(duì)30款A(yù)PP的數(shù)據(jù)對(duì)比分析可以發(fā)現(xiàn)，它們?cè)诮涌诘脑O(shè)計(jì)上有相似之處，但也有各自的缺陷。4教育APP界面設(shè)計(jì)4.1界面布局4.1.1界面布局的常見(jiàn)類型交互設(shè)計(jì)會(huì)對(duì)界面設(shè)計(jì)產(chǎn)生一定的影響。所以在界面設(shè)計(jì)之前，通常會(huì)有一個(gè)整體的設(shè)計(jì)方案（各個(gè)部分的位置和整體的內(nèi)容），但更多細(xì)節(jié)的補(bǔ)充，需要設(shè)計(jì)師自己去勾畫創(chuàng)作。高校在線教學(xué)應(yīng)用APP的界面布局主要集中在屏幕、文字和圖像三個(gè)方面。合理的界面設(shè)計(jì)可以提高用戶的易用性和美觀性。在智能手機(jī)應(yīng)用的界面布局中，要特別注意各種尺寸顯示屏下的設(shè)計(jì)，以保證各類智能手機(jī)上顯示的均勻性。目前在線教學(xué)應(yīng)用的界面設(shè)計(jì)中，常見(jiàn)的界面布局如下：(1)列表式圖4-1列表式界面在課堂演示中，經(jīng)常使用清單布局將大量課程從上到下排列，有些課程以圖形方式呈現(xiàn)，這是展示所學(xué)內(nèi)容的好方法。界面的設(shè)計(jì)是自上而下的視覺(jué)過(guò)程，更有意義；網(wǎng)頁(yè)上顯示的信息通常通過(guò)顏色和排列來(lái)區(qū)分。新東方在線、有道學(xué)校、網(wǎng)易公開課的成績(jī)以表格形式呈現(xiàn)，供用戶瀏覽。(2)陳列館式圖4-2陳列館式界面陳列館式行形式靈活，可按重要性隨意分配；簡(jiǎn)化版比列表形式在同一界面層次上放置了更多的內(nèi)容。布局的布局通常在顯示類中，與屏幕融合得很好，但由于界面內(nèi)容過(guò)多，屏幕會(huì)顯得雜亂無(wú)章。圖4.2顯示不同板塊的關(guān)卡界面。借鑒陳列館設(shè)計(jì)，可以讓課程更加直觀，讓用戶清楚地了解課程的內(nèi)容和類別。(3)選項(xiàng)卡式布局圖4-3選項(xiàng)卡式布局選項(xiàng)卡式布局的特點(diǎn)就是，無(wú)論身在何處，選擇卡都有一個(gè)快速開關(guān)和一個(gè)按鈕。對(duì)于規(guī)模較大、層次較高的高校在線教學(xué)應(yīng)用，可以清晰的展示門戶的位置，讓用戶可以在不同的門戶之間跳轉(zhuǎn)，操作更加方便。圖4.3顯示了可汗學(xué)院、網(wǎng)易公開課和種子評(píng)分系統(tǒng)，所有這些都以標(biāo)簽的形式出現(xiàn)。每一層都有導(dǎo)航欄，用戶可以輕松切換不同的功能，降低了操作難度，縮短了操作周期。一個(gè)有序完整的在線教學(xué)應(yīng)用的布局是界面之間的整體規(guī)劃，而不是一個(gè)獨(dú)立的實(shí)體。用戶可以看到在使用過(guò)程中可以遵循視覺(jué)路線，從而可以快速輕松地執(zhí)行相應(yīng)的動(dòng)作。以上設(shè)計(jì)僅為高校網(wǎng)絡(luò)教學(xué)應(yīng)用設(shè)計(jì)提供參考。隨著高校在線教學(xué)應(yīng)用的不斷拓展，部分頁(yè)面布局呈現(xiàn)出多種布局形式的結(jié)合與并存，呈現(xiàn)出更多的信息。4.1.2界面布局的基本原則和方法(1)跟隨視覺(jué)軌跡，充分利用最佳視野。人眼的運(yùn)動(dòng)不是隨機(jī)的。運(yùn)動(dòng)是由視覺(jué)運(yùn)動(dòng)引起的，其軌跡遵循平滑的路徑?？v觀整個(gè)界面，上下兩部分讓用戶可以在比較大的區(qū)域內(nèi)連續(xù)觀察。由于關(guān)鍵信息處于最佳視圖中，用戶可以在短暫的停頓后快速捕獲關(guān)鍵信息。(2)對(duì)不同用戶界面上的視覺(jué)元素進(jìn)行分組、分層和對(duì)齊，以實(shí)現(xiàn)整個(gè)界面的平面布局。手機(jī)界面的布局結(jié)構(gòu)按照可視化原理將各種視覺(jué)元素分成若干組，通過(guò)統(tǒng)一的標(biāo)準(zhǔn)化流程提高界面的整體性?？梢越⒁曈X(jué)邊界框和背景區(qū)域以增強(qiáng)數(shù)據(jù)包的可見(jiàn)性?；蛘?，利用“完形”原理，將各種視覺(jué)元素的排列組合成一個(gè)整體。同時(shí)，可以將相同的視覺(jué)元素組合起來(lái)，增強(qiáng)組合效果。在手機(jī)的接口布局中，主接口和從接口分為中繼線和從中繼線。需要保證主干部分的層次清晰，可以根據(jù)位置和大小在界面設(shè)計(jì)中體現(xiàn)出來(lái)。在不同界面的跳轉(zhuǎn)設(shè)計(jì)上，需要注意區(qū)分主次頁(yè)面的對(duì)應(yīng)關(guān)系，保證了整個(gè)畫面的流暢度。4.2圖標(biāo)圖標(biāo)反映了人們對(duì)事物的整體認(rèn)識(shí)，具有很強(qiáng)的認(rèn)知能力，而圖形符號(hào)則是對(duì)事物的高級(jí)視覺(jué)表達(dá)。優(yōu)秀的圖形設(shè)計(jì)可以提高用戶的視覺(jué)和視覺(jué)效果，與用戶進(jìn)行良好的交互，用圖形傳達(dá)信息；在應(yīng)用界面上，圖標(biāo)設(shè)計(jì)包括：應(yīng)用啟動(dòng)圖標(biāo)、界面內(nèi)部圖標(biāo)、工具欄圖標(biāo)等。4.2.1啟動(dòng)圖標(biāo)及設(shè)計(jì)方法在線教育APP的啟動(dòng)圖標(biāo)會(huì)出現(xiàn)在每個(gè)APP商店中，就像學(xué)校的logo一樣成為了APP的代表形象。優(yōu)質(zhì)的圖標(biāo)會(huì)激發(fā)你對(duì)程序的理解并促使你下載它，這就是圖標(biāo)UI設(shè)計(jì)的意義所在。學(xué)校在線教學(xué)應(yīng)用的啟動(dòng)圖標(biāo)可參照?；罩匦轮谱?。大學(xué)標(biāo)志具有一定的歷史和知名度。對(duì)于學(xué)校來(lái)說(shuō)，它本身就可以吸引更多用戶的注意力，并獲得更多的下載和應(yīng)用。因此，我們可以從以下幾個(gè)方面考慮適合大學(xué)生的在線教學(xué)應(yīng)用的圖標(biāo)創(chuàng)新設(shè)計(jì)：(1)簡(jiǎn)單形式由于應(yīng)用程序啟動(dòng)按鈕的大小有限，需要設(shè)計(jì)簡(jiǎn)單，易于使用者識(shí)別和記憶。(2)增強(qiáng)色彩對(duì)比不同的手機(jī)界面如圖4.5所示，由于屏幕背景不同，每個(gè)應(yīng)用的啟動(dòng)圖標(biāo)會(huì)有很大差異。由于啟動(dòng)時(shí)環(huán)境是可變的，所以渲染效果會(huì)隨著背景的變化而變化，導(dǎo)致圖標(biāo)在啟動(dòng)時(shí)的顯示效果會(huì)受到背景顏色的影響。而僅僅設(shè)計(jì)簡(jiǎn)單的背景色或照片，展示效果并不顯著，但設(shè)計(jì)過(guò)于豐富的在色彩和視覺(jué)元素豐富的照片，啟動(dòng)圖標(biāo)的識(shí)別率同樣也會(huì)大大降低。因此，啟動(dòng)按鈕的顏色不僅可以吸引用戶的注意力，還可以增強(qiáng)與各種背景的視覺(jué)效果，讓用戶輕松找到它。(3)預(yù)防措施隨著智能手機(jī)顯示技術(shù)的不斷發(fā)展，用戶對(duì)界面性能的理解越來(lái)越高，對(duì)界面各個(gè)元素的品質(zhì)提出了新的要求。雖然啟動(dòng)圖標(biāo)在手機(jī)屏幕上占用的空間很小，但它的設(shè)計(jì)并不好，很可能會(huì)被其他圖像覆蓋。因此，對(duì)啟動(dòng)圖標(biāo)的細(xì)致處理、對(duì)圖案形狀的多重解讀、對(duì)圖像呈現(xiàn)的精心打磨，都會(huì)讓整個(gè)啟動(dòng)設(shè)計(jì)更加引人注目。4.2.2APP內(nèi)部界面的圖標(biāo)設(shè)計(jì)及方法應(yīng)用程序中除了啟動(dòng)圖標(biāo)外，還有很多圖標(biāo)，其中大部分顯示為頁(yè)面，也有一些是工具欄。根據(jù)網(wǎng)頁(yè)內(nèi)容的規(guī)劃，在設(shè)計(jì)網(wǎng)頁(yè)時(shí)，應(yīng)注意圖標(biāo)之間視覺(jué)風(fēng)格的一致性。圖標(biāo)在形狀、顏色和排列上統(tǒng)一，使用戶能夠更好地記住和熟練使用界面。圖4.6顯示了可汗學(xué)校的移動(dòng)界面和內(nèi)容。可汗大學(xué)有許多教學(xué)大綱。因此在教學(xué)內(nèi)容的圖標(biāo)設(shè)計(jì)中，通過(guò)圖形化的方法，學(xué)生可以減少他們?cè)贏PP頁(yè)面的視覺(jué)混亂。同時(shí)，他們還可以通過(guò)簡(jiǎn)單的圖文進(jìn)行講解。此外，通過(guò)簡(jiǎn)單的圖形和文字的設(shè)計(jì)，用戶可以輕松記住圖形。在APP的使用過(guò)程中，學(xué)生可以養(yǎng)成習(xí)慣。圖標(biāo)識(shí)別不如文字清晰，但視覺(jué)直觀且豐富，因此圖標(biāo)識(shí)別在手機(jī)界面中意義非凡。一個(gè)好的圖標(biāo)可以讓用戶從小就了解它的象征意義和功能，并形成記憶和利于使用習(xí)慣的培養(yǎng)。4.3色彩隨著智能手機(jī)顯示能力和色彩表現(xiàn)能力的不斷提升，高校在線教學(xué)應(yīng)用的色彩優(yōu)化勢(shì)在必行。色彩在高校網(wǎng)絡(luò)教學(xué)應(yīng)用APP中的應(yīng)用，就是根據(jù)用戶的特點(diǎn)合理規(guī)劃各個(gè)界面的色彩，把握主要色彩并對(duì)相應(yīng)信息進(jìn)行強(qiáng)調(diào)和分類。4.3.1色彩的視覺(jué)感知與心理呈現(xiàn)對(duì)于大學(xué)生在線教學(xué)應(yīng)用用戶而言，設(shè)計(jì)色彩對(duì)人們心理認(rèn)知的影響。用戶的特點(diǎn)和需求決定了他們的選擇。相應(yīng)的配色與學(xué)校在線教學(xué)應(yīng)用的定位和學(xué)?，F(xiàn)有視覺(jué)基因的應(yīng)用密切相關(guān)?！吧X(jué)效應(yīng)”是指：看到各種顏色時(shí)，會(huì)有各種感覺(jué)和聯(lián)想；人們?cè)诳吹交蛴涀∧撤N顏色時(shí)，能自發(fā)地、真誠(chéng)地描述這種顏色所引起的各種感受。人們很容易感受到顏色帶來(lái)的心理和情緒變化。在人們的思想和情感中，不同的顏色在人們的精神和情感上具有相似性，如紅色代表著興奮、熱情、熱情和大膽；另一方面，綠色讓人聯(lián)想到自然，讓人感覺(jué)清新、年輕；橙色讓人感覺(jué)充滿活力和年輕。在界面設(shè)計(jì)中，色彩是盡量使用相同色系。比如京東閱讀（左）和常規(guī)的閱讀界面（右）多為灰色，更適合應(yīng)用的定位。4.3.2色彩在高校在線教育APP界面設(shè)計(jì)中的運(yùn)用在一個(gè)界面中，顏色的組合在產(chǎn)品的最終呈現(xiàn)中起著重要的作用，所以要正確使用顏色，突出重要信息，并清晰地描繪出來(lái)。首先，要注意色彩之間的協(xié)調(diào)。通常，在界面中，在選擇顏色時(shí)，會(huì)根據(jù)主色選擇合適的顏色。在此基礎(chǔ)上，根據(jù)不同的手機(jī)界面尺寸進(jìn)行顏色劃分，通過(guò)顏色對(duì)比實(shí)現(xiàn)不同區(qū)域之間的對(duì)比。由于屏幕尺寸的限制，顯示信息存在一定的缺陷，所以在使用色塊分割界面時(shí)，要注意不同顏色的色差，調(diào)整亮度、純度、色相的顏色以獲得一致美觀相片。注意不同顏色之間的區(qū)別。即使是單一的界面，適當(dāng)?shù)厥褂脤?duì)比色和互補(bǔ)色也會(huì)給畫面帶來(lái)層次感和空間感。4.4文字在高校在線教育APP的界面設(shè)計(jì)中，文字作為高校在線教育APP比不可少的視覺(jué)元素之一，幾乎會(huì)出現(xiàn)在高校在線教育APP的各個(gè)界面。雖然文字對(duì)于人的視覺(jué)吸引力遠(yuǎn)不如圖片、圖形來(lái)得直觀、強(qiáng)烈，但是文字對(duì)信息的高效、精確傳達(dá)是圖形、圖片無(wú)法取代的；在高校在線教育APP的界面設(shè)計(jì)中有自己獨(dú)特的作用。文字在高校在線教育APP的界面上，通過(guò)字體、字號(hào)大小的不同，以及字距、行距的調(diào)整使得界面內(nèi)容與設(shè)計(jì)形式達(dá)到高度一致，帶給用戶良好的信息識(shí)別體驗(yàn)。4.4.1字體字體是影響文本元素的主要因素。高校在線教學(xué)應(yīng)用的字體選擇是基于用戶對(duì)文本元素的感知和學(xué)校與生俱來(lái)的視覺(jué)基因。不同的字體匹配高校在線教學(xué)應(yīng)用的風(fēng)格。在移動(dòng)端應(yīng)用中，常用的漢字有Microsoft、Bold、ChineseBold、AppleBold、TimesNewRoman等，而英文字符則比較多樣化，主要是Bold等。對(duì)于高校在線教學(xué)應(yīng)用來(lái)說(shuō)，字體的選擇對(duì)于豐富文本內(nèi)容至關(guān)重要。由于粗細(xì)結(jié)構(gòu)的線性特色，不同的字體有自己獨(dú)特的風(fēng)格。他們的組合帶來(lái)了不一樣的感覺(jué)。在用戶使用中，多種字體的使用可以提供多層次的信息，為用戶提供舒適的視覺(jué)體驗(yàn)。字體可以分為兩種類型：襯線字體和無(wú)襯線字體。常見(jiàn)的中文界面通常是白色的，而無(wú)襯線的則是黑色的。從圖中可以看出，字體的結(jié)構(gòu)進(jìn)行了一定程度的修改，垂直和粗細(xì)有所不同。無(wú)襯線體位更加和諧，構(gòu)圖和線條排列沒(méi)有太多變化。對(duì)于高校在線教學(xué)應(yīng)用中的文本界面，無(wú)襯線圖比襯線圖更顯眼，適合文章標(biāo)題。襯線可用于某些正文文本內(nèi)容。4.4.2字號(hào)在界面設(shè)計(jì)中，字體大小直接關(guān)系到界面布局和信息層次。重要信息通常以大字體顯示，而可以省略的不太重要的信息以較小的文本分隔。同時(shí)，在字體大小的情況下，要根據(jù)文字的顏色進(jìn)行調(diào)整，以達(dá)到更好的視覺(jué)體驗(yàn)。如圖4.13中，三個(gè)不同的界面，雖然標(biāo)題的字體和副標(biāo)題的字體是相似的，但是通過(guò)調(diào)整標(biāo)題字號(hào)的大小，改變副標(biāo)題中字體的顏色，讓標(biāo)題傳達(dá)的信息更加突出了。4.4.3字距和行距在對(duì)大量文本數(shù)據(jù)進(jìn)行整理的過(guò)程中，文本間距的分布是由于文本間距和行間距的不同造成的，對(duì)用戶的文本閱讀影響很大。單詞之間的間距與人們?cè)谒揭苿?dòng)時(shí)創(chuàng)建的視覺(jué)流一致。單詞之間的距離越大，越容易讀得越快。行距對(duì)閱讀速度有很大影響。行距越大，用戶的轉(zhuǎn)換越精確。行距越短，閱讀負(fù)擔(dān)越大。由于信息所承載的信息采用了不同的字距和行距，因此易于擴(kuò)展。在高校在線教學(xué)應(yīng)用的界面設(shè)計(jì)中，尤其是在文字信息量較大的情況下，要注意排版和文字間距。為方便讀者，將信息量過(guò)大的文本信息分成若干部分。4.4.4文字色彩在界面上，還可