分類彙整:UX

網站優化案例(六腳福利社)

圖片優化:

  •  圖檔大小(讀取速度最快到67%以上

有些頁面圖檔過大(MB以上),調整圖檔解析度後(KB等級)

Page Speed Insights從Poor不及格到及格

SEO 案例 問題

 

  • 圖檔命名(改成有意義檔名)
SEO 案例 圖檔名稱
無意義檔名:DSC_2473_large.jpg
 
SEO 案例 圖檔名稱
有意義檔名:reflective-raincoat-dog-2_1024x1024.jpg
  • 加入圖片替代文字(原本圖片都沒加)
SEO 替代文字 案例

 

URL優化:

新產品命名有意義URL
例如舊產品多功能寵物墊 URL結尾是product-9
SEO 案例 URL
新產品寵物涼暖墊URL結尾是cool-warm-pad:
SEO 案例 URL

頁面標題、Meta description調整:

SEO 標題 案例

產品分類重新命名、排序:

從操作行為發現(可參考易用性測試)用戶在產品尋找、判別上會遇到問題
  • 重新命名(一般顧客不曉得「馬卡龍」、「方土司」是什麼產品)
SEO 案例 產品分類
  • 相似產品分類放一起(舊版過於分散)

SEO 案例 產品分類

易用性測試流程介紹Usability Testing step by step

易用性測試 :專注在觀察使用者行為以及尋找如何改善產品的證據

易用性測試一般而言遵循這格式:

易用性測試流程(4W1H)

    1. 設計任務情境(What)
    2. 招募有代表性使用者(Who)
    3. 挑選地點(Where)
    4. 執行測試 (How)
    5. 分析測試結果 (Which)

 

  1. 設計任務情境(What)

設計的任務要明確具體來驗證目的,任務順序要符合使用者操作習慣,測試場景要情境化,並且要寫下來當成額外資訊來完成這任務。

舉例來說,測試化妝品網站時,你可以設計這樣的任務。

任務:

    • 你覺得這網站如何?哪部分讓你印象深刻?你認為這網站是在幹嘛的?
    • 您若在首頁被化妝品產品吸引,您會如何搜尋產品介紹呢?
    • 你若想購買這化妝品,你會如何購買?

2. 招募有代表性使用者

取決您的時間和預算,如果資源允許請招募真實使用者,時間不夠或只想做快速迭代 ,就邀請朋友、同事吧

建議有代表性使用者不要超過5位,盡量執行多次小型測試

為何只需測試五位用戶 by nngroup

3.挑選地點

在何處執行測試影響到成效,關鍵在讓情境驅動任務,舉例來說,如果你想測試生產力應用工具,不妨在類似辦公室環境中執行任務。

4 . 執行測試

    • 記錄工具:盡量選能收集越多資料類型的器材(用戶臉部、觸碰/滑鼠點擊處、眼部追蹤等)
    • 測試前介紹(約三分鐘):設計師需先告知受試者我們是誰、期待收到何種回饋,以及我們是在測試產品而不是測試你。
    • 背景:詢問受試者職業以及多久使用相似產品
    • 任務執行(約20分)
    • 受試者回饋(約3分)

提醒:

    • 假使受試者過程中遇到問題,不要給他們任何協助,問問他們遇到問題時,會產生何種行動
    • 不要帶領受試者操作產品

5. 測試結果分析

還沒忘掉細節前,先把器材無法錄製遇到的問題快速記錄下來,易用性問題嚴重性是由許多因素組合而成:

    • 頻率:問題多久產生一次?
    • 商業優先:這問題對我們商業目標重要嗎?
    • 使用者感覺:這問題使用者容易克服嗎?

使用這些指標分配最多資源在最重要問題上。

史基農生技 案例裡,使用便利貼做用戶問題整理,每種便利貼顏色代表一位受試者回饋。
史基農生技 案例裡,我們把用戶回饋分成X軸、Y軸。
X軸代表對用戶的重要性,Y軸代表對商業目標影響力

結論:
易用性測試是簡單易執行技術,你甚至可在產品開發前期使用像是紙原型低真草圖做測試,它能幫助我們在低成本下重新塑造產品。


相關閱讀Related reading

如何設計好網站:Dont Make Me Think by Steve Krug 

Usability Test on Product Hunt for iPhone by Eric Lee

設計的方法:100個分析難題,跟成功商品取經,讓設計更棒、更好的有效方法 by Bruce Hanington and Bella Martin

破茧成蝶:用户体验设计师的成长之路 by 刘津 and 李月

Information Architecture 100:100個網站規劃必備的知識 by Atsushi HASEGAWA