教學需求至上:MOOC平臺Coursera的web端選課流程及關鍵頁面設計

2 評論 12194 瀏覽 54 收藏 28 分鐘

筆者通過深入體驗,對每一種選課流程的設計思路進行了概括,并從教學需求的角度對關鍵頁面設計作了進一步的討論,最后對課程注冊頁面進行了設計思路分析。

筆者深刻的體會到,教學需求是教育產品設計過程中不得不考慮的因素。

選課流程和上課流程是Coursera平臺兩個關鍵業務流程,也是用戶在平臺操作的關鍵體驗流程。

通常情況下,頁面流程設計,需要考慮到綜合考慮用戶需求和業務需求;但是在教育類產品中,由于教學的需求有其隱蔽性,用戶和業務都很難察覺的到,所以需要單獨作為一個設計需求來綜合考慮;保證在關鍵的頁面中能夠體現出其教學的設計,引導用戶完成有意義的學習。

本次分析首先單獨對選課流程及其關鍵頁面設計做綜合分析,能夠綜合了解coursera的選課流程,總結其優點,指出不足的地方。

一、web端選課流程分析

Coursera平臺Web端的選課流程主要分為四類,包括搜索、目錄查找、最近瀏覽、學習路徑。其中搜索、目錄查找和最近瀏覽是內容站點常用的內容查找方式;而學習路徑,是針對教學設計而言的一種全新的思考,它的目的不僅僅在于基于用戶興趣的用戶推薦。

1.1 搜索

關于“搜索”,是用戶查找信息最常用的一種方式。搜索框位于頂部懸浮欄的位置,搜索的流程優化關鍵在于搜索結果的排列和搜索結果的篩選。筆者分別以“心理學”和“psychology”為關鍵詞進行搜索,呈現的部分搜索結果如下:

搜索結果返回頁面包含篩選器和搜索結果列表兩個部分,遵循移動優先的原則,在對頁面寬度進行縮小時,篩選器會自動隱藏。

其中,篩選器主要包括:課程語言、字幕語言以及所有主題,中文搜索結果和英文搜索結果存在明顯的差異。

總體來說,大致可以得出以下結論:

  1. 以“心理學”為關鍵詞進行搜索,返回的搜索結果主要是中文課程和英文課程標題已經翻譯成中文的課程,對英文支持不太好。而以”psychology”為關鍵詞進行搜索,返回的搜索結果只有英文課程(有一些英文課程把標題翻譯成了中文,方便中文用戶的客戶端顯示)。
  2. 返回的搜索結果中相對靠后的課程和搜索關鍵詞并不存在明顯的關聯性。如以“心理學”為關鍵詞進行搜索,返回結果中出現《人體生理學導論》、《哲學導論》課程等。經過觀察發現,排名靠后的課程應該是通過搜索關鍵的語言來匹配的,也就是出現不相關的中文標題的課程。
  3. 篩選器中包含課程語言、字幕語言和所有主題。有一點疑問,不明白所有主題的篩選用途在哪里?另外,篩選器可以進行有效篩選的功能有限,

綜合以上分析,我們發現coursera平臺搜索返回頁面表現得中規中矩,有一些優點也存在一些缺點和需要改進的地方。

優點主要包括;

  1. 遵循移動優先的原則,頁面結構清晰、簡潔。
  2. 字幕語言的篩選是coursera平臺作為全球化的MOOC平臺,一個突出的亮點;

缺點和改進主要包括:

  1. 搜索結果返回頁面僅限于標題和關鍵詞的匹配。以中國大學MOOC為例,可以增加和課程概述內容的匹配,如以“經濟學”為關鍵詞進行搜索,《會計學原理》這門課程是屬于經濟學范疇的,單純以標題來匹配,大大降低了搜索的精確度。
  2. 中文和英文的匹配。實際上這里存在一個功能沖突,即課程語言篩選和中、英文獨立搜索的功能沖突,從目前情況來講,以“心理學”為關鍵詞只能搜索到英文課程標題已經被翻譯成中文的課程,還有很多的尚未翻譯的課程是檢索不到的,這樣的設置,和課程語言的篩選實際上是一個沖突的功能設置,讓課程語言篩選失去了意義。
  3. 增加更多維度的篩選,幫助用戶快速選擇優質的課程。目前搜索結果的篩選項偏少,可以增加更多維度實用的篩選,如熱門、評分、精品、專項課程等,目的就是幫助用戶減少選擇的成本,降低選擇的操作難度。

1.2 目錄查找

Courserap平臺的目錄列表是通過頂部懸浮欄目錄入口進入的。為什么目錄列表沒有放在首頁,而是放在了下一個信息層級?我們在MOOC平臺Coursera的web端首頁設計中已經分析過。這里不多做贅述,以下分別是目錄列表頁面和目錄查找返回頁面以及分析討論。

以上是目錄列表頁面。整個頁面當中,包括商務風背景圖、slogan和目錄列表,信息結構清晰,沒有任何多余的元素。

這里有一點需要說明和討論,幫助大家理解這張頁面為什么這么設計。

這張頁面為什么設計得如此簡單?是不是可以再添加一些別的信息?

在頁面設計評估體系中,有一套經典的評估方法,即VIMM系統。

關于智力層,就是通常如果想要減少用戶的認知負擔的話,應該盡量避免多余信息的干擾。所以當我們知道用戶有一個明確的任務,就要給他設計一個封閉的流程,盡量讓他每次操作只允許做一件事,這樣做的好處就是讓用戶不需要思考下一步需要做什么。

目錄列表這張頁面中,用戶的任務就是選擇分類。這樣的設計,就是保證用戶在這張頁面中只做一件事情,快速完成用戶的任務,達到好的用戶體驗。

當然需要說明的是:這一條評估原則并不是指導設計的唯一原則,實際上設計過程中,更多的是根據設計定位尋找一個最優的平衡(如淘寶的確認訂單流程需要填寫很多信息,但是卻不能放在很多頁面當中來保證流程的封閉)。

如果想明白這一點的話,就不需要去糾結這張頁面內容太少,要不要在下面加上熱門課程、精品課程等。

以上是選擇“社會科學”分類,返回的目錄查找返回頁面。主要包含目錄列表、篩選器、和查找結果內容。目錄列表采用了固定窗口絕對定位的樣式,在主內容區不隨著內容的滑動而改變位置,方便在滑動內容的時候對目錄列表進行操作。

篩選器包括常用篩選項和特定專業二級分類篩選項,常用拆選項有課程語言和字幕語言,特定專業耳機分類篩選項,就是特定領域的耳機專業分類,實際上是一個錨點定位的樣式。

比如通過選擇“法律”,可以幫助快速定位到法律的課程內容,查找結果內容就是對查找結果的返回。

這里有兩個特點:一是根據二級專業分類進行課程展示;二是課程排序專項課程優先展示。

這里有幾個需要討論的問題。

  1. 為什么要在這張頁面中加上目錄列表?理由就是用戶在查找完某一分類內容之后,有可能會繼續查看另一個分類的內容,這樣做的好處就是不需要用戶再跳轉到上一層級的頁面,直接在該頁面中進行分類選擇,減少了用戶的操作復雜度。
  2. 二級分類錨點定位存在視覺效果的偏差。目前該頁面的錨點定位是點擊之后直接定位到該內容的位置。中間沒有視覺過渡的動畫,并且在定位上有一定的誤差。導致在點擊之后,出現視覺效果的偏差,找不到具體的對象,用戶視覺注意力容易跳出內容。
  3. 關于目錄分類問題的探討。下圖分別是coursera平臺和中國大學mooc平臺的目錄列表。在學科分類當中有很多的分法,但是不管是哪一類分法,都是為了保證學科內容能夠有條不紊的呈現,保證用戶能夠根據分類快速找到具體的學科內容(圖書館的圖書分類就是一個典型的范例,但是你會發現不同的學校圖書分類方式總是有所區別)。

以coursera為例,其中“社會科學”是一個學科大類,里面還包含教育學、政治學、經濟學、法學、哲學、心理學等等,這些又可以簡單稱之為學科小類,它們之間雖然同屬于社會科學,但是相互之間卻沒有非常強的關聯性。

如果把他們放在同一個分類下,就必須要對結果內容呈現上做出二級分類劃分,這就是為什么coursera平臺,沒有把“社會科學”的結果內容都放在一起的原因,而是在視覺層級上做了區分,通過“查看全部”,讓更多的內容在下一層級顯示。

而中國大學MOOC的做法直接根據學科小類進行分類,由于學科小類的內容具有關聯性,可以放在一起呈現,同時可以通過二級分類來篩選,減少了一個層級的操作。

另外,通過觀察,我們可以很明顯地發現:目錄的分類還將當下的熱門的內容和單個學科的課程的數量作為了目錄分類考慮的因素。如Coursera和中國大學MOOC都將計算機作為了一個重要的目錄分類,coursera甚至還將數據科學作為了一個單獨的分類,這是由于當下機器學習的熱度導致的,而中國大學mooc則是將考研作為了一個重要的目錄分類。

這種動態的調整是為了滿足特定用戶的需求,強調平臺的特色,分類其實一種很重要的能力。

1.3 最近瀏覽

最近瀏覽位于首頁的個人學習信息內容區的下方,視覺信息層級上要比個人學習信息內容區低。具體的首頁設計思路請見MOOC平臺Coursera的web端首頁設計,最近瀏覽主要包含最近查看的專項課程和最近瀏覽的課程。

接下來我們一起來一下討論:為什么會有最近查看的專項課程和最近瀏覽的課程?

關于coursera平臺課程的設置,我們在這里不做詳細的闡述,后續我們會單獨拿出來講。但是為了理解后續的內容,我們有必要對專項課程做一個了解。

以《學術英語:寫作》專項課程為例,它包含“語法和標點、論文寫作入門、高級寫作、面向論文寫作的研究導論、畢業項目:撰寫一篇研究論文”五門課程,每一門課程單獨拿出來又可以作為一門獨立的課程進行學習。

說到這里,我們應該知道:專項課程其實是一個從入門到實踐的綜合課程,能夠幫助學習者不斷地深入學習,并且課程的設置能夠幫助用戶達到從基礎學習到應用的水平。

專項課程的設置考慮到了用戶需求、業務需求和教學需求(第一次提及)三個方面。

  1. 用戶的需求是不同用戶的認知水平不同,如何來滿足不同用戶來學習《學術英語:寫作》這門課程。
  2. 業務需求是在完成用戶學習需求的同時,如何區分專項課程和獨立課程,嘗試平臺的盈利模式。
  3. 教學需求,首先需要強調的是,專項課程的課程組合形式不是傳統商品的打包捆綁銷售,這是有本質區別的。所以教學的需求,是如何針對不同的用戶來設計課程的結構和內容,實現分層教學。

說到這里你就應該明白:為什么會出現“最近查看的專項課程”和“最近瀏覽的課程”兩個模塊,并且“最近查看的專項課程”的視覺信息層級比“最近瀏覽的課程”要高。

1.4?學習路徑

MOOC平臺Coursera的web端首頁設計中,我們講到三種類型的首頁,分別是未注冊的用戶首頁、已注冊未獲取學習路徑的用戶首頁和已注冊并已獲取學習路徑的用戶首頁。

學習路徑的選課流程就是從已注冊為獲取學習路徑的用戶首頁開始的,通過點擊首頁獲取學習路徑入口,在信息頁中選擇或填寫個人目標、興趣、背景等,目標不能超過3個;系統會自動為你的每個目標推薦5門課程;開始第一門課程的學習,注冊之后,目標和課程會進入道首頁個人中心,即已注冊并已獲取學習路徑的用戶首頁,可以繼續添加新的目標,進入下一輪。

大致的學習路徑的選課流程如下:

以下是目標和課程進入到首頁個人學習中心內容區,即已注冊并已獲取學習路徑的用戶首頁。

學習路徑是根據教學需求設計(再一次提到教學需求)的一項功能,它包含對學習者的分析和學習需要分析,以及教學內容的選擇與組織、教學結構的選擇與運用。

學習者的分析包括了解學習者的興趣和目標,比如學習心理學的需求。

學習需要分析是根據可能存在的學習需求,分析現有的資源和約束條件,論證滿足學習需求的可能性,即平臺內是否有足夠優質的課程來滿足各類學習需求。

教學內容的選擇與組織,對教學內容的知識點進行分類,如心理學包含心理學入門、社會心理學、積極心理學、心理學應用等等,教學結構的選擇與運用則是具體的教學內容的呈現方式和結構。

這部分簡單介紹希望能幫助理解學習路徑的選課流程,關于學習路徑的設計后續再具體探討。

二、課程注冊頁面設計

上述介紹了Coursera平臺Web端的選課流程主要分為搜索、目錄查找、最近瀏覽和學習路徑四種方式,并且分析了流程中一些關鍵頁面設計思路,幫助理解選課流程。

如果你看到這里,可以僅僅通過上述的文字閱讀,就可以在腦海里理清四類選課流程以及一些關鍵的設計細節,那說明我講清楚了并且你的理解能力還不錯。如果沒有,我建議你去對照著web端站點再梳理一遍,對你的理解很有幫助。

關于課程注冊頁面,就是課程的信息介紹頁,也就是選課流程的最后一步。上述四種選課方式最終都會到達課程注冊頁面完成選課操作。課程的注冊頁面,相當于課程信息的展示窗口,是影響用戶是否會注冊課程的重要因素,所以課程注冊頁面的設計變得十分重要。

接下來我們就來分析:課程注冊頁面是如何設計的?

上圖是課程注冊頁面部分截圖(為了排版美觀,僅顯示部分),在課程注冊頁面中主要包含錨點導航、注冊按鈕和課程內容信息。

我們同樣是從“分析產品目標—分析用戶需求—分析關鍵因素—歸納設計需求”的設計思路來分析課程注冊頁面設計的一些關鍵節點,這套設計分析方法可以設計思路可視化。

分析產品目標

對于一個課程注冊頁面而言,它的首要業務目標就是引導用戶去注冊課程——有了這個目標之后,我們需要把它和設計關聯起來。

那么,如何讓目標和設計建立關聯呢?根據GSM模型,我們需要根據目標找到衡量指標。

我們知道:業務目標是引導用戶去注冊課程,可以歸納出信號是讓用戶去點擊注冊按鈕,衡量指標就是提高課程注冊按鈕的點擊率。

分析用戶需求

根據業務目標,我們得到了具體的衡量指標,我們需要進一步將業務目標轉化為用戶行為,也就是用戶的使用來幫助我們來完成該頁面的業務目標。我們根據信號知道只有讓更多的用戶點擊課程注冊按鈕,才能提高課程注冊按鈕點擊率。

所以,我們希望用戶產生的行為是點擊課程注冊按鈕,然后我們圍繞著這個用戶行為展開用戶需求分析。

通常情況下,用戶需求分析包含目標用戶、用戶場景、用戶行為、用戶體驗目標四個部分。

針對課程注冊頁面,大致的描述是:

一個想要學習課程的用戶,通過選課的環節進入到課程注冊頁面,想要準確了解課程的信息,找到注冊按鈕,然后就能快速地完成課程的注冊。

根據GSM模型,我們知道用戶體驗目標是快速完成課程注冊,在點擊課程注冊之后,大致會出現兩種情況,一種是收費,一種是不收費,所以信號就是讓用戶讀懂課程須知相關信息,衡量指標就是用戶決策的效率。

(關于課程須知,coursera由于盈利模式的考慮,對不同課程類型設置了不同的課程須知文案,這里只挑一種來講,后續盈利模式的分析會重點講到)

分析關鍵因素

分析完業務需求和用戶需求之后,那到底用戶愿不愿意去點擊課程注冊按鈕?就需要我們站在用戶的角度對業務目標和用戶體驗目標進行關鍵因素分解了。

要達成業務目標,讓更多的用戶去注冊課程,就需要把業務視角轉變成用戶視角。

意思就是說:要對業務目標進行用戶意愿層面分析,看用戶愿不愿意去點擊課程注冊按鈕,業務目標才有可能達成。

通常來講,在點擊課程注冊按鈕之前,影響用戶意愿會有兩個因素:一個是動機,一個是擔憂。

在用戶需求分析方面,要達成用戶體驗目標,提高用戶決策的效率,影響用戶操作的關鍵的關鍵因素只有一個就是障礙。就在注冊課程的過程中會遇到哪些問題和障礙,我們需要幫助用戶解決這些問題和障礙。

知道了動機、擔憂和障礙這三個關鍵因素,我們需要對這三個因素進行分解,并得出初步的解決方案。

其中:

  • 動機,主要是滿足用戶的心理需求,說服用戶。
  • 擔憂,主要是增加用戶的信任感。
  • 障礙,主要是解決用戶使用過程中存在的問題。

歸納需求設計

通過“分析業務需求-分析用戶需求-分析關鍵因素”等幾個分析過程,從一個模糊的引導用戶注冊課程的業務需求,到最后通過分解關鍵因素得出一些初步的解決方案。通過將系統的方法將業務需求分析、用戶需求分析過程可視化,可以使設計思路更加清晰,知道為什么這樣去設計。最后,把動機、擔憂、障礙三個關鍵因素的分析結果匯總在一起,與產品團隊商量是否可以放到設計頁面當中。

說明:目前,Coursera平臺獨立課程的課程注冊頁面,在頁面的最后面放置了最近查看和你可能也喜歡的模塊。如果經歷上述的分析之后你會發現,課程注冊頁面的業務需求引導用戶去注冊課程,當我們明確了用戶的這一任務之后,我們通常傾向于構建封閉的流程,每一次操作只允許用戶做一件事情,減少用戶的認知負擔。

從這個角度來講,這兩個功能就顯得有點累贅。

三、小結

以上就是coursera平臺web端的選課流程分析和關鍵頁面設計。

筆者通過深入體驗,對每一種選課流程的設計思路進行了概括,并從教學需求的角度對關鍵頁面設計作了進一步的討論,最后對課程注冊頁面進行了設計思路分析。對教育產品筆者有著深刻的體會:

嚴格意義上來講,每一個領域的產品都蘊含著該領域某些獨有的特征和思路。而教育產品,教學需求是不得不考慮的因素,也是教育產品創新的唯一途徑,也是教育產品區別于其他產品的關鍵要素。

由于在分析過程中會涉及到課程的設置、學習路徑設計、盈利模式等比較復雜的內容,筆者做了縮略,后續會進一步探討。

從coursera平臺的選課流程中可以發現:coursera平臺在選課流程的設計方面兼顧到了用戶需求、業務需求和教學需求;對于教育產品,有很多值得借鑒的地方,當然也存在一些可以改進的地方,不過這并不妨礙Coursera平臺成為全球領先的MOOC平臺。

MOOC平臺Web端產品分析系列:

一個完美的教育產品首頁設計案例:MOOC平臺Coursera的Web端首頁設計

有什么想法,歡迎在評論區交流。

 

作者:吳翰中,簡書號:吳翰中,產品新人。有七年教育相關專業背景, 一直關注在線教育行業,學習產品經理基礎知識,養成持續輸出的習慣,正在尋求教育產品經理相關的工作。

本文由 @吳翰中 原創發布于人人都是產品經理。未經許可,禁止轉載。

題圖來自 Themerkle

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 剛涉足教育行業,謝謝指導

    來自廣東 回復