99%
En
UI/UX Design

Dr.Talk 線上醫學課程平台

Overview
大昌華嘉希望重新設計現有的線上醫學學習平台,並且期待未來可以納入講師、學分、收費機制,來取代實體認證的流程,一方面可推廣醫療產品,另一方面可以優化醫學認證的步驟。
  • Role
    DesignLead / UX Designer
  • Duration
    10 month
  • Team
    1 PM, 2 Designers, 1 SA, 3 Developer
Pain Points
原本的線上學習平台在介面呈現上沒有太大問題,主要的痛點為:
  • 先前規劃的功能無法滿足客戶需求
  • 整個網站視覺上給人較生硬的醫療印象
User Personas
根據與利害關係人進行的需求訪談,我們統整出了主要的兩個使用角色,一個是後台的主要使用者-專案經理,主要負責醫療內容的上架與管理,另一個是前台的使用者-醫生,平常會有獲取醫療學習資訊的習慣,或是對某方面醫療資源有學習的需求。
Our Goal
經由上述需求訪談、痛點分析、與決定使用者角色後,我們的設計目標為 根據不同角色提供客製化內容,拉近醫學內容給人的距離感,營造一個可以輕鬆探索的線上學習平台。
Style Proposal
釐清目標後,我們提供了兩套視覺風格提案:
「專業大方」採用留白、斜線與淺灰色的搭配來營造清透的視覺感受,給人舒適、不強迫的專業視覺體驗。
「親和簡約」整體形象更加深了圓滑且平易近人的形象,透過插畫輔助減輕使用者在使用醫療平台上壓力的感受。配色添加對比藍色,整體更清新透明且無距離感。

而最後客戶選擇「親和簡約」,但希望Banner調整成以實體圖片為主,加一些裝飾Icon來點綴。
Character
針對不同身份,我們考量特定的內容呈現方式與吸引加入會員的策略。

針對「陌生使用者」,我們注重在品牌的形象傳達,告知陌生使用者我們的核心價值與功能,吸引有興趣的用戶加入會員來瀏覽更多內容。

針對「尚未驗證的會員」,我們希望提供足夠的提示來引導使用者完成驗證,來瀏覽更多專業內容。

針對「已驗證會員」,我們希望提供更多客製化的項目,讓使用者可以更輕鬆的找到有興趣的影片內容。
Admin Design
後台設計與前台相比較為單純,所以我們直接沿用前台的風格來設計,主要功能以提供前台內容為主。

而統計報表是大昌華嘉十分重視的項目之一,我們參考了知名網站分析系統與競品的後台,像是Google, Youtube ,SimilarWeb,並結合客戶的需求來考量。

主要會以瀏覽分析、會員使用狀況、網站內容導向三大方向來設計。

Analysis Report

瀏覽分析
上方以卡片來呈現重點資訊,下方再以圖表的方式來呈現瀏覽數、停留時間、造訪頁面的詳細情況。
會員使用狀況
以圓餅圖與橫向長條圖來快速了解比例分佈,下方以表格的形式來瀏覽各會員細項。
影片類別分析
透過長條圖來瀏覽個影片分類的排名,並且用頁籤的方式來快速瀏覽不同根據的排名狀況。
影片分析
提列前五名的影片與各項平均數據來快速了解整體觀看狀況,下方以表格的形式來瀏覽各影片細節。

Learnings

這個案子十分注重在不同角色所看到的內容,對於UX來說同一個畫面要用3個以上的角度來審視是否都有顧慮到,也讓我更加謹慎在每一個畫面上的權限控管。

這次也深入的與SA探討各個報表的數據來源、可行性等等,也更加了解每個網頁中的操作是如何被記錄的。

Next Work

大陸工程雲端管理系統

UI UX Design