專案背景

客戶企業內部在廠內舉行的特賣會,我們針對「家電」、「美食」、「生活」、「休閒」、「戶外」五大類別進行邀商,與廠商談定折扣後上架商品、進行訂單處理,因疫情關係轉為線上購物,當時時程緊湊,網站操作流程不順暢,以下針對商店分類及商品介紹頁面重新設計。

商店分類

原先的介面中,在首頁僅能看見店家類別,看不見類別中有哪些店家,進到類別中僅憑店家名稱又難以辨別其販售什麼樣的商品,店家的入口按鈕也不明顯,從客服的紀錄上發現排序較後面或知名度較低的店家時常被使用者忽略

Before

After

商品介紹頁面

原先的商品介紹頁面中資料層級混亂,沒有店家資訊,要分辨目前的商品屬於哪一家店有一定的難度,再加入購物車、結帳的流程也不流暢,容易讓使用者產生疑惑。

重新設計後在畫面頂端新增店家資訊,讓使用者隨時可確認目前的位置,調整商品的卡片式設計,移除不必要的購物車按鈕,讓購物體驗貼近市面上的電商網站,減低使用者的認知負荷,操作更直覺。

專案背景

客戶企業內部在廠內舉行的特賣會,我們針對「家電」、「美食」、「生活」、「休閒」、「戶外」五大類別進行邀商,與廠商談定折扣後上架商品、進行訂單處理,因疫情關係轉為線上購物,當時時程緊湊,網站操作流程不順暢,以下針對商店分類及商品介紹頁面重新設計。

響應式網頁

在小尺寸的螢幕上仍注重資料的視讀性與操作體驗。

專案背景

客戶企業內部在廠內舉行的特賣會,我們針對「家電」、「美食」、「生活」、「休閒」、「戶外」五大類別進行邀商,與廠商談定折扣後上架商品、進行訂單處理,因疫情關係轉為線上購物,當時時程緊湊,網站操作流程不順暢,以下針對商店分類商品介紹頁面重新設計。

商店分類

原先的介面中,在首頁僅能看見店家類別,看不見類別中有哪些店家,進到類別中僅憑店家名稱又難以辨別其販售什麼樣的商品,店家的入口按鈕也不明顯,從客服的紀錄上發現排序較後面或知名度較低的店家時常被使用者忽略

調整後在導覽列點擊「店家一覽」即可看見所有類別及其包含的店家,除了店家名稱外也新增了 LOGO 幫助使用者更快速的識別,並將店家類別以次要導覽列的形式呈現,讓使用者輕易的察看、往返不同的店家,改善部分店家被忽略的問題。

Before

After

商品介紹頁面

原先的商品介紹頁面中資料層級混亂,沒有店家資訊,要分辨目前的商品屬於哪一家店有一定的難度,點擊加入購物車的按鈕時無法選擇規格而產生錯誤流程,商品內層的資訊夾雜多種字型大小、間隔,造成視覺上難以閱讀。

重新設計後在畫面頂端新增店家資訊,讓使用者隨時可確認目前的位置,調整商品的卡片式設計,移除不必要的購物車按鈕,讓購物體驗貼近市面上的電商網站,減低使用者的認知負荷,操作更直覺。

響應式網頁

在小尺寸的螢幕上仍注重資料的視讀性與操作體驗。