RWD
Website
「串珍珠」 是一個專為台灣在地小農打造的 O2O(Online to Offline)購物平台。在資訊碎片化的時代,許多優質小農缺乏數位轉型能力,而消費者則渴望尋找透明、安心的食材來源。
本專案旨在透過溫暖的手繪風格與直覺的介面邏輯,打破農業與科技的冷冰冰隔閡,創造一個既能購買新鮮蔬果,又能預約農作體驗的整合式生活平台。

Visit Website
時間
2019年 - 6週
角色
產品設計師
負責
整體網站主視覺設計(含Logo)
網站RWD架構和UI/UX設計
與客戶溝通與協調
與開發人員合作,執行並改善設計方案
挑戰
信賴感的建立: 傳統電商版面往往過於商業化,如何讓使用者在數位介面上感受到農產品的「溫度」與「產地真實性」?
資訊架構的整合: 平台涵蓋了「實體商品(蔬果)」、「加工食品(手工製品)」與「體驗服務(共享農遊)」,如何讓不同屬性的內容在同一系統下保持導覽的一致性?
受眾定位平衡: 同時需要滿足上架的小農們、習慣數位購物的年輕族群,以及重視食安、對介面敏感度較高的主婦族群。
使用者發現與洞察
情感購物: 消費者購買小農產品不只是為了農產品,更多是為了支持「在地精神」。因此,我認為介面需要較多的情感化設計。
視覺疲勞: 使用森林綠與大地色系能有效降低用戶的購物焦慮,提升對「天然」的聯想。
情境化搜尋: 使用者除了搜尋特定蔬果,往往更在意「季節性」與「在地化」,這反映在首頁「最新推薦」的權重分配上。
設計
手繪插畫系統: 針對導覽列設計了一套具備一致性的手繪 Icon。利用粗細均勻的線條與溫暖配色,將「好物市集」、「共享農遊」等抽象概念具象化,減少認知負擔並增加親和力。

卡片設計: 在商品列表使用簡潔的卡片布局,將品牌名稱、產品名稱與價格清晰分層,並在右下角配置顯眼的橘色「加入購物車」按鈕,提升轉換率。
響應式設計:考慮到消費者(如家庭主婦、上班族)常在廚房煮飯或通勤時利用零碎時間購物,本專案採取了行動裝置優先的策略。
對比度:在白色背景上使用深灰色文字(而非純黑),降低視覺疲勞的同時,保持高對比度以便閱讀商品名稱與成分說明。
功能色標記:使用飽和度較高的橘色作為「購物車」與「行動按鈕」的色彩,在綠色系的主視覺中產生強烈對比,引導使用者快速定位核心操作,有效引導轉換行為。

情境背景運用: 在「最新推薦」區塊使用了淡黃色的農產底紋,在不干擾閱讀的前提下,增加視覺的層次感,並在架構上給予「最新推薦」區塊最高的視覺優先。

預期
視覺與品牌定位契合: 手繪插畫系統與情境底紋的運用,將「在地農產」的溫度具象化,建立起與競品區隔的品牌獨特性。
建立可擴展的系統架構:模組化的卡片與區塊設計,能靈活支援未來更多的小農品牌進駐、農遊行程推廣以及多元農產加工品的擴充需求。
視覺語言直覺化: 利用風格統一的手繪Icon直接傳達頻道分類與服務目標,讓使用者無需閱讀繁雜文字即可秒懂主題,大幅提升操作的直覺性。

Back