張?zhí)焖? 夏宗明

摘要：研究OBE教學理念下的文化教育類App界面設計，目的是增強用戶使用時的情景代入感，以獲得更佳的用戶體驗，從而強化對學習教育的輔助作用。文章將成果導向（OBE）的教育理念引入設計領域，建立了設計視域下成果導向（OBE）理念網狀拓撲模型，并根據(jù)用戶服務設計需求，總結出產品設計策略[1]。最后，以App為例進行了設計實踐。利用繪制服務藍圖等分析了解到，當需求體驗和操作感受研究過程作用于文化教育類App界面設計中，通過界面交互技術使學生能夠更加有效地進行智能化、人性化、整體化學習，進而提高用戶服務的使用和教學。其獨特風格的交互反饋模式，有利于增強產品認可性，以獲得更佳的用戶體驗，從而增強了交互體驗過程中的趣味性。通過對這個課題進行專門研究，以期待更好地為同類產品的設計提供借鑒或參考。

關鍵詞：成果導向理論 服務設計理念 服務藍圖 用戶體驗 界面設計

中圖分類號：TB47 文獻標識碼：A

文章編號：1003-0069（2023）19-0036-04

Abstract：To study the interface design of cultural and educational Apps based on the OBE teaching concept，with the purpose of enhancing the sense of situational involvement of users when using，so as to obtain a better user experience，and thus strengthen the auxiliary role of learning and education. This paper introduces the results-oriented（OBE）education concept into the design field，establishes the network topology model of OBE concept under the design perspective，and according to the users service design needs，Chen Shaofan. Finally，taking App as an example，the design practice is carried out. Through the analysis of drawing the service blueprint，we learned that when the research process of demand experience and operation experience acted on the interface design of cultural and educational Apps，the interface interaction technology enabled students to learn intelligently，humanely and integratively more effectively，thus improving the use and teaching of user services.Its unique interactive feedback mode is conducive to enhancing product recognition，obtaining better user experience，and thus enhancing the fun in the interactive experience process. Through the special research on this subject，we hope to provide better reference for the design of similar products.

Keywords：Results-oriented theory Service design concept Service blueprint User experience Interface design

引言

20世紀90年代以來，智能科技的迅猛發(fā)展，加速了信息社會向知識社會的轉變的背景下，公眾更加愿意使用學習類App進行學習去提升自己。[2]數(shù)字化應用程序具有外形美觀、操作流暢等特點受到眾多學習者的廣泛認同。[3]當今產品的數(shù)字化特性也豐富了對學習資源的呈現(xiàn)形式，增強了產品使用者對于學習目標管理的掌控度，[4]但是同時網絡本身結構所存在的非單一性和傳播多樣性，必然增加使用者的認知偏差和行為困惑。[5]

因此，本研究根據(jù)未來設計創(chuàng)新的發(fā)展需求，引入OBE理念指導并構建以產出式交互制作設計模式，用于應用程序指導設計。強調以用戶的學習成果為導向進行反向設計，以用戶為中心來確定教學目標、教學過程、考核評價體系等。理念指導更加注重教學活動中用戶的學，強調學習的產出，從而實現(xiàn)用戶對發(fā)現(xiàn)問題、解決問題和創(chuàng)造性思維等高階能力的培養(yǎng)。在此背景下廣泛將移動終端設備App技術輔助于教學活動，生動有趣的交互設計方式能吸引用戶參與，對加深和鞏固記憶有重大幫助，從而提高用戶的興趣。

一、相關概述

（一）OBE理念

OBE理念最早于1981年由斯派蒂（Spady）首先提出的，理念注重于教育的實際需求，強調以學習產出為中心，通過合理運用關鍵教學資源的結構模式。該理念已廣泛應用于教育課程資源建設及人才培養(yǎng)等方面，得到了廣泛的認可。[6]在基于結果的教育（OBE）系統(tǒng)中，每個教學部分都圍繞目標（成果）開展，可更為合理、貼切地安排時間學習和提高學習效率，使得大部分學生都能夠達到最初設定的目標。

（二）OBE教學理念在文化教育類App界面交互設計中的作用

1.調節(jié)作用。文化教育學習App對用戶的認知過程會產生積極或消極的影響。學習活動是認知活動，無論在主動學習還是被動接受活動中，OBE教學理念都起著一定的調節(jié)作用。首先，科學的OBE教學理念可以給用戶帶來快樂、自信等積極效應，促進學習活動的順利開展。缺乏科學的概念教育時會限制用戶個體發(fā)展或阻礙其他活動。其次，OBE教學理念有助于提高學習活動的水平，在制定OBE教學理念時無須添加太多復雜的因素，用戶的學習印象才會增強，獲得最佳的學習效果。

2.強化作用。用戶在通過App進行交互作用的過程中，OBE教學理念能夠作用于自我認知改變或強化和鞏固人們行為，最終實現(xiàn)強化學習、提升學習效果的作用。同樣，學習OBE理念的內容也會影響和改變消極的學習行為。對于用戶來說，這種改變具有導向功能，因為用戶在學習時感受到學習自己的引導因素，從而使用戶主動學習，避免不良體驗、糾正他們在自己學習中的不良行為等。

（三）研究意義

當前社會對知識不斷追求，有賴于數(shù)字信息獲得突破和克服大眾化的開放系統(tǒng)合作平臺，移動學習App系統(tǒng)數(shù)據(jù)采用云存儲，功能完善，性能好，為廣大學習者提供了高效的學習支持。但目前國內應用市場中很多研發(fā)人員往往注只注重產品的商用價值，而忽視了App中界面的界面風格、設計要素和整體布局等，無法在用戶學習的同時為抓取有效信息，進而降低了對數(shù)字化學習的熱情。精美的界面是需要有卓越的視覺吸引力跟適當?shù)娜の缎?，交互設計必不可少的，移動端App界面的設計質量有效影響到用戶的操作體驗和忠誠度。因此，確保滿足人們對視覺需求而不斷增強的審美訴求，設計出界面友好且容易操作的交互界面，能夠更好地發(fā)揮出智能學習記憶終端的重要效果，更加適應用戶的使用習慣及語言標志學習。學習者可以在滿意的學習環(huán)境中取得進步并且提升認知能力，從而提高用戶的學習效率，提升競爭意識。

二、現(xiàn)狀分析

（一）設計現(xiàn)狀

1.目前市場上各類產品個性化現(xiàn)象嚴重，產品內容運用不當從而只加劇了用戶在理解成本上的增加，表現(xiàn)在使用過程中顯得操作更加困惑。但有的同類題材產品從形狀到內部功能都差別，以手機期刊App和全球學術快報App首頁為例，我們可以發(fā)現(xiàn)兩款擁有相同屬性的產品整體的視覺結構、首頁排布同樣是天差地別。相關功能各位于上下兩端，排列方式也完全不相同，對比強烈的左右滑動橫幅設計，設計界面的表達風格大不同。而目前App也存在很大優(yōu)化的區(qū)間，產品界面交互設計研究依然出現(xiàn)有如交互性、定位不清晰、服務多樣化、過于個性化、與其他App界面交互設計缺失等，這在后續(xù)將嘗試做進一步優(yōu)化和改進。

2.核心競爭力不足。產品服務本身來講，內容才是核心。學習類App并非只是簡單地將實體教材內容原樣照搬到移動載體上，通過調查的數(shù)據(jù)來看，用戶認為當前主要存在的問題為推廣多、功能多樣，使用困難、老師的教學水平落后等。[7]產品的服務缺乏準確性和有效性，這也從側面反映出產品仍存在一些問題，高成本、穩(wěn)定性差，無統(tǒng)一標準和操作繁瑣等，從而降低了用戶的情感歸屬感。

三、應用分析

（一）服務分析。服務理念的中心思想就是以人的需求為出發(fā)點，借助于馬斯洛需求理論分析用戶需求欲望的痛點、癢點和爽點就成為了產品服務的決定性因素。根據(jù)對用戶對象的畫像及要素分析，將各部分內容對比后得出服務藍圖框架，如圖1。通過服務藍圖可以更直觀地發(fā)現(xiàn)用戶行為碰撞點存在的聯(lián)系。

（二）機會點。通常情況下，體驗設計可以加強記憶和認知因素，能夠增加產品的基本內涵，加深產品印象，強化對產品的情感。在相對程度上加快讓用戶在認知上對所接觸內容差異性關系的快速理解，使得整體設計更符合用戶的行為習慣。

各模塊之間的有效交互作用，直接影響到用戶閱讀和體驗。在交互設計應用到智能產品之中，以用戶為中心，保持界面與交互功能的統(tǒng)一性，能夠讓用戶與產品間的交互作用變得更加簡潔、更加高效，從而給用戶帶來流暢的應用體驗。因此，界面設計所產生的高附加值，潛在價值才會變成現(xiàn)實價值，方便用戶使用習慣的養(yǎng)成，合理促使用戶付諸行動。

四、設計視域下的OBE理論原則

（一）設計原則

1.學習產出性。理論本質是以產品為成果展示為主要目的。學習產出需要根據(jù)服務流程的多元性，在橫向內容層次與縱向形式層次多方面促進的學習成果的轉化，從而提升使用者的學習效率，多方面完成既定目標，通過優(yōu)質化體驗和有效管理，以達到主動學習的效果。[8]

2.幽默有趣性。幽默能有效地讓使用者在體驗過程中體會到歡樂與趣味，可以更高效地增強使用者學習意識跟增加探索實踐。因此，基于OBE理論的App界面交互設計應當在教育學習的新方式，展現(xiàn)出趣味性，特別在目標已經達成的這個時候，通過非特定的幽默方式鼓勵使用者會使得交互過程產生更多興趣。

3.主動參與性。用戶可登錄個人界面，將學習過程、方法心得、觀點建議等以鏈接或發(fā)表動態(tài)進行公開分享，同時可獲得滿足分享條件的對應回報。主通過合理利用學習者的競爭心理及激勵性機制，營造出虛擬的線上學習環(huán)境，提高用戶的體驗。機制里用戶的學時間安排相對自由，同樣能夠根據(jù)個人實際合理安排的學習課程內容，獲得更高的體驗收益。

（二）OBE理論網狀模型

當OBE理論深入解讀時，能夠發(fā)現(xiàn)其與十大好的設計基本原則存有廣泛的聯(lián)系，結合二者可以進一步細化設計要求，有效指導設計。能夠發(fā)現(xiàn)基于此，得出以下網狀拓撲模型，如圖2所示。通過功能準確傳遞設計意圖是產品交互設計的重要部分，是交互界面設計所遵循的原則。[9]設計傳遞的不準確會造成對使用者不好的使用感受，所以交互設計的目的主要應當具備清晰的視覺邏輯及理清各素之間的關系，以提高設計的可閱讀性和可用性。在隨著交互理念的應用和發(fā)展，人機交互方式越來越豐富。通過界面中傳統(tǒng)的部分進行合理的設計，通過更加人性化的交互方式構建出能與用戶直觀互動的界面，有效提升界面中的操作體驗，實現(xiàn)信息傳遞的快捷高效。

五、設計策略

通過該模型能夠得到不同需求之間的相關性，提出具體的策略。[10]先由整體層出發(fā)，在完成知識運用目標的管理上，采用特合理引導的方式，把控使用者的積極情緒，對心理感受上進行加強與滲透，讓使用者在情感上產生共鳴以達到學習收益的最大化。

（一）清晰、長久的目標：通過信息架構和設備交互設計，將用戶的學習需求和學習目標轉化為清晰并可持續(xù)執(zhí)行下去的學習活動。在促進學習，激發(fā)興趣，保持學習等方面有著相對不同程度的要素強化，以滿足用戶的需求，讓用戶更容易參與學習活動。

1.信息結構及用戶心智模式：清晰的信息結構并且符合用戶心智模型的產品界面，有利于用戶快速讀懂，減少用戶界面對認知上的損失，關注于用戶實現(xiàn)學習目標和提高學業(yè)。方便用戶快速瀏覽學習、找到所需備考模塊內容，結合線下盡快掌握考點。App則能夠協(xié)助使用者學習和完善教育知識及文化理念，于是產品會更多地強化在數(shù)字化氛圍下營造與文化輸出，讓使用者可以合理地參與到不同環(huán)境中，強化對掌握知識的熟練度，使練習效果更接近目標。[11]

2.設計流程：將長期任務拆分成一系列可執(zhí)行的短期任務，根據(jù)任務需要主動、潛移默化通過創(chuàng)新性設計的方式吸引用戶，例如，利用基本認知來區(qū)分不同的信息優(yōu)先級，在一定范圍內表達出用戶對內容形式主次先后關系，有利于產品整體交互運行流暢合理。

（二）及時正當?shù)牟僮鞣答仯菏褂谜呓缑鎸W習的目標管理需要產品擁有簡潔易懂的整體結構及明了的可執(zhí)行的活動流程，及時、準確、有價值的學習響應讓使用者獲取了更多的學習動力。所以，正向反饋下的交互設計需要全面思考不同影響因素，以用戶的核心為中心，

強化對學習作用。[12]

通過富有趣味性的方式能夠使用戶更加主動地學習。產品的產出反饋能夠借助于趣味化的鼓勵架構模式，從用戶的角度出發(fā)，通過在使用者界面上正向互動增強使用者的學習效率，最終使其達到順利完成目標管理的目的。通過提供積極的指導和鼓勵，能夠吸引學習群體使用，提升用戶對產品的高感度及對學習目標的長期性。

（三）合理利用注意力：文字是一種承載語言的設計，文字的視覺沖擊力可擁有其他要素無法比擬的優(yōu)勢，在視覺展示中起到了重要作用。專業(yè)的文字起到了易讀性的作用。另外，色彩作為自然的產物，為人們所熟悉，也更容易調動用戶情緒，通常情況下顏色傳遞信息的優(yōu)先級高于文字，保持色彩組合簡潔有助于提升用戶體驗。界面色彩統(tǒng)一設計能夠使一個界面看起來更完整和統(tǒng)一。

六、創(chuàng)新之處

（一）簡化操作思維，減少用戶記憶負擔：

當前市場上文化教育類應用視覺風格設計表現(xiàn)出多樣性，用戶在閱讀和思考上投入大量時間，在一定程度上增加了用戶的認知負擔。優(yōu)化設計從App功能和需求出發(fā)，重新布局搭建，注重營造氛圍，體現(xiàn)界面井然有序的美感。然后使用交互模式，可以輕松實現(xiàn)內容的選擇、跳轉和保存等操作，并且過程簡單。通常用戶期望產品用盡可能少操作來解決問題，所以產品都應該設計得盡可能簡單、直觀，給人耳目一新的視覺體驗。這是讓用戶以盡可能少的步驟和時間盡快了解所需信息的最直接方式。

（二）清晰層級分類，提高產品使用效率：

用戶在產品應用時，美觀和實用是他們固定的選擇。針對其他文化教育類App使用信息層次上較為混亂，信息層的任務重復，應當根據(jù)用戶的需求設計規(guī)劃，精準控制交互界面。設計采用線性布局和圓角的方式，分類整理信息，做到既清晰又美觀。另一方面，應注重用戶的操作習慣，簡化呈現(xiàn)給用戶的視覺元素，提高產品的交互效率，以改善用戶的操作體驗。

（三）增添新模塊、動態(tài)效果和音效，打造引人入勝的互動體驗：

交互設計是響應用戶行為的設計。例如，如果單擊彈出的下拉菜單，探索的部分將改變顏色，提醒用戶不要重試無效操作，卻體現(xiàn)出了用戶交互體驗的重要性。App主界面和子界面之間，要保證相互切換的流暢性與合理性。[13]例如，顏色用于引導用戶的情緒，并對不同的功能主題、圖形和學習內容進行分類和應用能夠增加可玩性和樂趣。

七、設計實踐

（一）服務應用設計信息架構

整體設計更加簡潔、美觀，從而極大地減輕了用戶的視覺負擔，符合當代用戶的審美要求。 交互設計在App中的應用分為4個模塊，首頁模塊—多為信息構架，包含內容跟需求；課程模塊—主要傾向于用戶體驗方面；學習模塊—直接影響用戶體驗時的沉浸度；我的模塊—則為感知設計，體現(xiàn)用戶體驗。具體應用表現(xiàn)中主要含的大小功能結合使應用與傳達更精準性，文化教育類App的架構如圖3。

1.首頁部分。隨著交互理念的應用和發(fā)展，人機交互方式更加豐富。通過界面中功能部分進行合理的設計，通過更加簡單的交互方式構建出能與用戶直觀互動的界面首頁，有效提升界面中的人性化操作，實現(xiàn)信息傳遞的快捷高效。所以，在進行的App界面首頁設計時，應當既高效合理又簡潔美觀，讓所有操作都能清晰產生作用進而讓他們隨時隨地地開展自主學習，滿足用戶的學習需求。

2.課程部分。包含了所有的互動途徑的有效方式，用戶可以很好地監(jiān)督應用使用時的學習狀態(tài)，給學習者所帶來的高效學習的作用。在應用不斷更新性能的同時，讓用戶享受到智能應用的智能化、設計性化、現(xiàn)代化服務，提高學習的長效性，能夠超出傳統(tǒng)教學的學習效果，并給用戶帶去流暢的操作體驗，提高產品課程的轉化率。

3.學習部分。隨著智能產品的不斷發(fā)展，語音識別、圖像識別及行為控制等多感官的交互方式競相出現(xiàn)，極大地滿足了各類用戶特殊情境下的學習需求，提升了學生的學習效率。產品移動端能夠通過簡化流程，更好地符合用戶自主學習的使用習慣，該模塊進行分享學習展出成果，用戶可以把個人的學習成果反饋到后臺，方便進行信息采集與評價，進而提升用戶滿意度。