top of page
  • Grey Instagram Icon
  • Grey Facebook Icon
  • Grey Pinterest Icon

BUYPAY

  • 作家相片: Yeeling
    Yeeling
  • 2018年7月25日
  • 讀畢需時 1 分鐘

品牌名稱為 BUYPAY 的電商,為該品牌製作RWD的購物車網站。

BUYPAY官網首頁


整體視覺以藍色與灰色調作為主色,簡潔的畫面才不會搶去眾多特色商品的表現,在不同功能的區塊呈現上皆有視覺習慣性的走向,所以在安排限時特賣(稍縱即逝)的區塊時,將其排在橫式閱讀的第一順位,而主題商品的區塊編排上使用依照活動去選擇粉、綠、黃等不同代表色,讓體驗者可以明確知道活動的區別。


Website layout

首頁的目錄表示


Communication and feedback

對於網站的分類名稱太過個人主觀感受的形容容易混淆體驗者的認知,因此子分類的表現方式規劃上為其重要,將大區塊的重點色藍色為底白色文字為輔,hover為黑色,去減少體驗者在理解主類項目時的疑問。

會員登入/註冊會員頁面

商品頁/商品細節頁面

訂購流程頁面


Mobile layout



首頁的目錄表示

會員登入/註冊會員頁面

商品頁/商品細節頁面

訂購流程頁面


在手機螢幕限制的狀況下,要引導體驗者順利完成結帳的步驟必須要是簡單的小提示,所以這次設計上加入了 1 -> 2 -> 3 到完成訂購的文字提醒,讓體驗者理解訂單已經順利完成。

Communication and feedback

在訂購流程的第2步驟,為了避免資訊過於冗長,所以將已購買的商品資訊加了pull down menu 的功能,如果有再次確認訂購了哪些商品的需求,不必再按回上一頁查看,直接點擊藍色區塊就可以展開瀏覽。

最新文章

查看全部

Commentaires


SIGN UP FOR ALL UPDATES,

POSTS & NEWS

  • Grey Instagram Icon
  • Grey Facebook Icon
  • Grey Pinterest Icon

© 2023 by Shades of Pink. Proudly created with Wix.com

bottom of page