設計喃喃【品田牧場】

撰文者 | Debbie & Anya
編輯者 | 怡安


 

踏入這場味蕾與視覺的碰撞,翻轉美學強勢回歸

王品旗下許多品牌隨著時代變遷,一步一腳印地堆疊形象實力與評價,品田牧場是陪伴我們成長歲月不可或缺的記憶。感謝讓樂活擔任製作網站的重任,從「心」的感受出發,讓我們在原有的品牌規範下,注入嶄新風采。

在此,樂活非常感謝客戶的信任,允許我們改動與調整原有的功能,以追求最優化的應用體驗。
一探究竟豬排的魅力 >


三版首頁視覺提案

經過最初的視覺會議及參考的網站資料,發現整體風格較活潑外放,而我們也依循品牌規範的內容、素材,來製作跳脫框架的設計。我們運用日式風格會有許多小元素的組合拼湊,同時搭配品田牧場提供的版畫風格插圖,來豐富整個網站的視覺排列。

A版

整體配色依照識別規範裡的輔助色再去延伸輕鬆活潑感,我們有留意到若使用過度飽和的色彩在大面積上,會讓閱讀時眼睛較疲勞,所以此版將強烈的主色彩應用在部分區塊。將品填提供的豬鼻子插畫納入標題設計也是此版本的設計巧思。

B版

在排版上特地做了不同的編排,網頁上半部也以日本網站常用的切割設計,並將最新消息跑馬燈陳列在右側;下半部分以咖啡色及綠底呈現,表達品田牧場嚴謹的層層把關天然食材及食品安全。頁尾的設計也加重整體比例,搭配SLOGAN「品味好豬排,幸福滿心田」。。

C版

運用更多品田提供的輔助圖形進入設計,加強品牌印象的同時也提升溫度,同時運用較多曲線作為區塊的分隔線,在簡潔俐落之下還具有圓滑的作用。


A版

整體配色依照識別規範裡的輔助色再去延伸輕鬆活潑感,我們有留意到若使用過度飽和的色彩在大面積上,會讓閱讀時眼睛較疲勞,所以此版將強烈的主色彩應用在部分區塊。將品填提供的豬鼻子插畫納入標題設計也是此版本的設計巧思。

B版

在排版上特地做了不同的編排,網頁上半部也以日本網站常用的切割設計,並將最新消息跑馬燈陳列在右側;下半部分以咖啡色及綠底呈現,表達品田牧場嚴謹的層層把關天然食材及食品安全。頁尾的設計也加重整體比例,搭配SLOGAN「品味好豬排,幸福滿心田」。。

C版

運用更多品田提供的輔助圖形進入設計,加強品牌印象的同時也提升溫度,同時運用較多曲線作為區塊的分隔線,在簡潔俐落之下還具有圓滑的作用。

以C版為主再次出發

最後以C版的形式加強區塊調整,並在header中結合版畫風格。C版在響應式呈現其實小有難度,若只是單純的曲線還能透過調整code的數值來控制;在響應式的狀態下,豬鼻子選單不能跑版,不過為了與眾不同的表現,在此有特別花心力去調整。

另外在下方幸福料理區,左側的圖片是自動播放的幻燈片,我們在上層製作毛邊的遮罩,在視覺上營造出豬排的麵衣脆感,也在設計上多點豐富的層次感。

若欲瞭解更多,請至正式發佈案例查看,帶我前往 >


Click to Hide Advanced Floating Content