2016年1月21日 星期四

B'IN LIVE 必應創造

http://www.bin-live.com/
"B'IN LIVE 必應創造"是ㄧ間規劃演唱會的公司,是我之前要練習寫CV時找的練習目標。
B'IN LIVE 官網的設計很獨特,他是"斜面"的,不過卻不會讓人有不舒服的感覺,反而是獨樹一格。






 除了作品(演唱會)部分的照片是彩色的外,其它都採用黑白,即便是主視覺的地方也是。



 用黑白搭配紅色,我覺得不僅是象徵熱情、創新,也提升了該公司的專業感。


一些選單採用圓形造型,緩和了"斜面"設計的尖銳感,也讓整個畫面較平衡。




Menu也是簡單該要的呈現在上方,整個就是簡單俐落!

B'IN LIVE官網的配色和斜面設計一直讓我印象很深刻,所以想分享給大家!
另外,B'IN LIVE的官網設計跟先前介紹過的"一朵 ICHIDO"一樣,都是採用一頁式網頁。但是B'IN LIVE就有做menu,在瀏覽網頁時就方便很多,資訊取得更快、更清楚。




OFFICE BOSTON 株式會社

http://www.office-boston.co.jp/
OFFICE BOSTON株式會社旗下有經營柏青哥、餐廳和健身房。
他們的首頁十分有趣,是以彈珠檯的形式呈現。檯子上的文字寫的是他們的理念等;人像放的是他們公司的員工。整個畫面十分繽紛、童趣!



 (彈珠檯是動畫,字和人像也會像拉霸一樣變換)

menu收納在右上角,打開是黑色色塊搭配白色文字,這樣的配色,才不會被繽紛的背景干擾、變得眼花撩亂。

下方的圖片也是黑白照搭配彩色框線和文字。不是全用繽紛的色彩,而是適當的點綴提高整體質感,並不會顯得太陰暗,襯托娛樂產業的詼諧感!


裡面的文字排版是我很喜歡的部分!
置中、直式、橫式、齊頭,
雖然是黑灰色調,卻因為不一樣的文字排版,讓整個畫面一點都不死板,反而多了活潑的韻律感!而且還有種詩詞感!







旗下企業的文字介紹作了可收納的形式,可以縮短滑動頁面的時間。
(收納) 

(展開)
(OFFICE BOSTON職員的應徵條件我覺得寫得很像神社詩籤。)

OFFICE BOSTON的官網設計得很有巧思!完全符合娛樂產業給人的印象!可惜我不懂日文,不然我真得很好奇他們的內文是不是也寫得很有趣!



和菓子屋 - 一朵ICHIDA

一朵 ICHIDA 是日本一間專賣和菓子的店。
手繪插圖增添了濃厚日本職人的專業感。



點進網頁,就是 "一朵"漢字的書法手寫動畫,緊接著是滿版的黑白素描插圖。


(緊接著是原版照片)



整個畫面是照片和插圖相互配合擺飾,留白的空間很多,整體很乾淨清爽。
因為賣的是食物,整潔、衛生感對消費者來說是很重要的,我覺得這有加到分!


同樣的,畫面和文字的安排皆有考慮人的閱讀習慣。


內頁的介紹也是簡單的排版:Logo、大標、小標。沒有過多的裝飾。


主頁的下方,放了FB粉絲專頁的欄位,方便消費者直接進入了解詳情和店內活動。


我覺得''一朵 ICHIDA"整體風格營造的不錯,但是感覺把網路行銷這塊的重點放在FB上,所以官網架設的不是很完整,有點可惜。整個頁面就是ㄧ直往下拉,沒有menu的輔助,資訊其實沒辦法馬上找到。如果能構架設完整,讓內容在豐富一點,我想應該能成為一個充滿"手作"、"職人"感的官網。










慈善捐款網站-2015沒你救不行

http://help.children.org.tw/index.php#/index

今天要分享一個慈善捐款網站-2015沒你救不行。


以往看過的慈善網站,都是滿滿的敘述文字加上零星的照片,顯得乏味,難以吸引人點進去瀏覽。但是''2015沒你救不行''所設置的網頁則是以插畫的方式呈現並搭配簡單的動畫,讓整個頁面充滿溫馨的感覺。



色系搭配的不錯,不會太活潑,以至於讓人以為跑錯網站;不會太沉悶,使人不願瀏覽。畫面簡單,選單操作也不會太複雜。


伴隨著這些手繪人物流覽這個網頁,有種在讀故事書的感覺,自然也就會去閱讀文章內容。




加入一點拼貼元素增加豐富度。


因為現在網路使用者大部分也會使用FB做為接收資訊的媒介,該網頁也不忘結合這一點。他們在描述那些需要被幫助的家庭的頁面下,加上了FB留言的部分。透過FB留言,可以將消息傳遞給更多人,增加捐款的機會。



(影片收納在角落)

''2015沒你救不行''整個版面操作很簡單,沒有過多的文字,畫面也不會跳來跳去的,適合每個年齡層來操作。而且插畫的風格,比起其他充斥著文字敘述的捐款網頁,更能吸引人花時間聊解。另外,結合FB的操作,更能將效益發揮到最大。




GODIVA

這次要分享的網頁是知名的比利時巧克力品牌 GODIVA 。
GODIVA的首頁設計是基本款(我們在做課堂練習時常見到的範本),主視覺清楚而明顯,首頁也多為照片,鮮少有文字敘述。在排版上,也十分中規中矩。


在品牌、廚師等介紹的頁面,看起來很有在閱讀報紙的感覺。文字上使用有襯線的字體,感覺上比較時尚、高級,符合該品牌高單價的定位。


雖然GODIVA的網頁設計很規矩,但他們也不忘在排版上要符合人類眼球的閱讀習慣。


 GODIVA的商品多元,但透過有系統的分類和清楚的選單,可以讓消費者快速的找到自己的目標物,同時也可以讓消費者知道自家的品牌有多種不同類型的商品可供選擇。



(分類包含時間場合、對象、價格等等,讓消費者快速的找到自己的目標物)


在商品選單的部分,除了商品的基本資訊,還有顧客對該產品的評價,提供其他消費者選購時做參考。 


在首頁的下方,可以看到消費者的照片分享,增加客戶之交的交流並達到有效的宣傳。





GODIVA的網頁很適合拿來做網頁設計練習的範本!
他的視覺設計可能沒有那麼有特色或吸引人,可以說是很一般的基本款。但從首頁就可以看見消費者的照片分享和讓消費者公開的對商品打分數這兩點來看,就可以知道這個品牌很重視與消費者之間的交流。