布局設(shè)計(jì)

「英語流利說」采用了分欄式設(shè)計(jì)，將屏幕分成了上中下三個(gè)欄目，底部用的是選項(xiàng)卡導(dǎo)航，這種設(shè)計(jì)比起漢堡包（三道杠形式）菜單導(dǎo)航來說節(jié)省了用戶進(jìn)入功能菜單的成本，這也是目前很多 APP 產(chǎn)品所使用的設(shè)計(jì)方式。

UE 設(shè)計(jì)

• 打開 APP 首頁出現(xiàn)引導(dǎo)課程「歡迎使用英語流利說」，并用“開始”按鈕引導(dǎo)用戶進(jìn)行點(diǎn)擊，這樣的好處是能以較低的學(xué)習(xí)成本教會用戶怎么使用這個(gè) APP，而核心功能「添加課程」也放在也顯眼的位置，但這個(gè)綠色文字實(shí)在值得詬病

  

• 課程選擇頁面通過“難度”“分類”“排序”三大維度為用戶提供了個(gè)性化的課程篩選，能有效幫助用戶找到自己感興趣的課程內(nèi)容

  

• 查看課程簡介后，可直接添加課程，添加完了不用離開當(dāng)前頁面就可以繼續(xù)打開課程

  

• 可以玩一樣地闖關(guān)學(xué)習(xí)，不會那么無聊。以星星代表掌握的程度，一星表示整體達(dá)到60到70分，二星表示整體達(dá)到70到80分，三星表示80分以上。

  

• 通過不同競爭形式的排行榜，激發(fā)用戶使用 APP 的頻率，提高活躍度，但是這里存在一個(gè)交互感知不順暢的地方，當(dāng) Touch 底部切換榜單選項(xiàng)卡時(shí)（中圖），選項(xiàng)卡的交互式沿 X 軸移動(dòng)的，但是榜單列表的切換方式卻又是沿 Y 軸移動(dòng)的，這產(chǎn)生了一種疑似斷層的交互，建議榜單列表的切換方式統(tǒng)一也沿 X 軸移動(dòng)

  

• 當(dāng)你復(fù)讀一句英語時(shí)，會根據(jù)你的讀音標(biāo)準(zhǔn)與否做出評級，黑色表示還不錯(cuò)，綠色表示發(fā)音很贊，紅色表示不夠標(biāo)準(zhǔn)或不夠清晰，而針對小部分紅綠色識別困難的用戶，在設(shè)置中提供了其他顏色方案

  

可能完善的地方：

• 左側(cè)的信封按鈕作為觸發(fā)率最低的按鈕，放在左上角比較合理，符合單手操作原則的，因?yàn)樽笊辖鞘鞘种笩岫茸畹偷膮^(qū)域，但作為消息提醒中心，這個(gè) icon 改成鈴鐺是否會更好？因?yàn)樾欧飧啻淼氖切畔硗瞻l(fā)的意思，而且容易誤解成了功能建議反饋中心（發(fā)送端）
• “添加課程”和“我的帖子”的字體，從放大后的圖片來看，顯然“添加課程”的字體略小一些

  

• 底部選項(xiàng)卡式的導(dǎo)航，以綠色高亮代表該選項(xiàng)卡被選中，但是“添加課程”和“我的帖子”的文字也是綠色的，代表的卻又是可點(diǎn)擊卻未點(diǎn)擊的按鈕，存在信息噪音誤導(dǎo)用戶

  

• 可以嘗試通過把這兩個(gè)文字加上邊框（如下圖），給予用戶心理暗示這是一個(gè)按鈕，而不是用鮮艷的綠色來搶眼球

  

• 首頁課程列表中，有一個(gè)隱藏的操作（向左滑動(dòng)刪除課程），當(dāng)用戶不知道怎么刪除課程，就會去摸索可能的操作，除了向左/右滑動(dòng)，還有長按不放的動(dòng)作，目前，長按課程除了會變暗之外沒任何作用（左圖），個(gè)人建議當(dāng)用戶長按課程時(shí)，除了變暗還會沿 x 軸方向漂移一下（中圖），作用是暗示用戶可以向左繼續(xù)滑動(dòng)（右圖）

  

• 課程離線緩存不夠人性化
  1、下載過程中無法暫停
  2、下載完成后如果想要?jiǎng)h除緩存，需要經(jīng)過 4 個(gè)步驟才能到達(dá)清除緩存的頁面，而且這個(gè)頁面隱藏的也比較深，

  

• 封面更換時(shí)，應(yīng)該默認(rèn)提供數(shù)張封面壁紙供選擇，而不是只有“拍照”和“從相冊選擇”，并不是誰的手機(jī)里都會存一些好看的“壁紙”
• 頭像、封面、昵稱等 title 文字改成深色顯示會更好，和編輯框內(nèi)的提示語形成對比

  

• 在步驟 1 添加完課程，步驟 2 返回上一層級后，課程縮略圖依然處于未添加狀態(tài)，只有當(dāng)步驟 3 返回再上一層級，再從新進(jìn)來，才會出現(xiàn)右圖中所顯示的“已添加”文字

  

• 無法理解 Touch “詳情”后彈窗的內(nèi)容與“詳情”有什么關(guān)聯(lián)

  

體驗(yàn)綜述

整體操作流程還是比較順暢的，但是 UI 設(shè)計(jì)不夠精美，視覺觀感上相對粗糙，大量使用了綠色元素，想突出一些重點(diǎn)功能可以理解，但是卻沒有駕馭好，起到了適合其反得效果，同時(shí)人性化的地方也還有提升的空間。