網站 · 設計概念
以音響產品為題的網店設計，展示產品瀏覽、詳情和購物袋摘要，並附建議的選取及存貨狀態。
以下為設計概念，並非客戶項目。畫面屬靜態示意，名稱及數據均為虛構。
讓產品照片成為視覺主角，同時交代選購後可以在哪裏核對商品。示例是一間虛構音響店，並非可下單的商店。
產品列表以照片配合簡短名稱及價格，並提供篩選條件縮窄選擇。
詳情畫面放大所選揚聲器，將款式選項放在加入購物袋的按鈕附近。
購物袋摘要在瀏覽介面旁顯示已選商品，方便用戶核對。
中性色背景和相同圖片比例方便比較外觀。產品本身配合少量紅色重點，形成商店的視覺風格。
購物袋摘要讓用戶看見所選商品。正式版本亦應列出確實款式和數量，不能只靠縮圖辨認。
以下是建議的設計樣式，屬靜態示例，並非可操作的功能或正式開發規格。
產品背景
#F6F5F2
選購操作
#C8442E
文字及結構
#242424
資料清楚，下一步自然明確。
採用簡潔的無襯線字體，產品名稱和價格較突出。規格資料保持易讀，但不搶去主資訊的比重。
產品卡片對齊，照片四周保留空間。款式選項靠近選購按鈕，購物袋摘要則與產品介紹分開。
購物袋未有商品
購物袋內未有商品。可以先瀏覽產品。
已加入購物袋
已加入購物袋。繼續前請核對款式及數量。
款式未能供應
這款暫時未能供應，請選擇其他款式。
購物袋讓用戶在瀏覽期間核對已選產品及款式。它不等於結帳頁；送貨資料、最後費用及付款仍需要獨立的核對步驟。
