【網頁設計】櫻花 SAKURA + 品牌官網上線

做的過程很艱辛,完成後很爽的案子。

早上先分享首頁示意影片在臉書,
有朋友私訊給我
“誒!那個櫻花是熱水器那個櫻花嗎?”
“質感很好誒!”
“跟以前的櫻花不同,已經是精品網站等級了”

精品網站應該要到什麼水平,我不太清楚
不過,我們很盡力把客戶提供的資訊
轉化成易讀、有質感的內容給使用者
包含閱讀字數、捲動一屏大概要看到多少資料量
捲動到最後,靠近Footer的地方
不需要另外再找按鈕,即可切換到下個單元
就像閱讀簡報一樣的輕鬆。

我覺得這部分的UX規劃
比我們的視覺設計來得重要

提案那天,收到負責窗口Rita的回覆
“我們總監很喜歡這個設計,他覺得你很會用黑色”
“這裡面的黑有很多層次,低調,又剛剛好的感覺”

謝謝,這個黑叫做”小吉黑”

跟我一起工作的夥伴們都曾經在上線前
被我精神荼毒,逼著修改成這些黑色過
有興趣的朋友,可以來找我要色碼 (不藏私)

這是我在工作過程中優化的,
應用在網站上的質感大加分網站

正式上線了,有興趣的朋友也歡迎你們上來看看。
這次不只有櫻花,連我們都很認真在實踐 “從細膩,現工藝”了 (笑)


專案客戶:台灣櫻花
工作窗口:Rita Hsieh
視覺設計:Genie Chen
前端程式:Hiking Chen
動畫支援:Kidult Lee

SAKURA+ 品牌官網
探索工藝


起初收到原始需求的時候,只有這組LOGO。
本來擔心可能會很沉悶,經過多次來回討論後,發現這個+號可以應用的變化超多,感覺很有趣
所以這組符號就變成了這個網站上的加分題。

主頁設計。
以引言帶出SAKURA+的品牌核心精神,捲動畫面後,再帶入五大主題商品。

內頁設計。
特點說明中加入不浮誇的動畫設計,輔助文字說明,讓整個商品介紹可以更切題。

從LOGO的符號中找靈感。
PLUS的+號,旋轉45度變成X符號,反轉90度變成引號
作為Loading和頁面中的引用或強調區塊設計都很合適。

Published by Genie Chen

Genie Chen 陳小吉 1981/8/1 A型 獅子座 Innovation Plus Creative Lab 超能力設計戰隊隊長兼網頁視覺設計師