2011年11月18日 星期五

Marimekko

Marimekko


1.進入marimekko首頁都是以圖片抓住視覺。有趣的是右上角的Search by Colour,可以點選自己喜歡的配色,搜尋同有此配色的產品。














2.product同是以大圖為主,每張精美的產品圖片都整齊排列,點入圖片都有詳細的產品資訊。














3.productBags & Accessories主視覺圖以動畫呈現,吸引人點入後也是規律排版的產品圖。Clothes特別的的部分點入模特兒照片,可以移動框框放大自己想看的部分。













4.News & Events的文字排版清晰簡單,幾張圖片作協調不至於單調,SEE ALL節省內文空間,也不會讓版面雜亂。











5.Who we are的背景圖變成彩色,文字內容與排版簡單明瞭。Unfold the Story以動畫呈現,點入全螢幕,螢幕跟著滑鼠左右移動,游標移到每個文字選項都會有詳細內容。以及救援日本的活動推廣。



























6.Shops以衛星地圖搜尋不同國家的專店位置。








芬蘭的
Marimekko在網頁排版上有北歐的簡約風格,也是因為圖片本身已非常精美,而背景繁雜的黑白植物圖像不影響產品展示圖。每張圖像有如藝術照想讓人珍藏, Unfold the Story像卷軸的方式閱覽Marimekko,介紹衣服的放大圖片功能及衛星地圖可以搜尋每個國家的店面都是此網站貼心之處。

2011年11月11日 星期五

Adidas


1.進入首頁的Adidas的首頁loading很有特色,各個方塊都有文字註釋,灰色部分跑完後翻出圖片。以精美圖片為整體視覺,吸引目光。



2.游標點選任一張圖,圖片將放大且附文字敘述和代言人等資訊,此效果頗有科技感,還有連結廣告和更加詳細的內容。























3.點入左上的performance,圖片部分會變灰色,不影響閱讀performance的內容,任點其中選項,會另跳出視窗詳細介紹產品,主要呈現精美的產品放大圖打動人心,有些以動畫表現。









4.originals較特別的部分是點選選項,選項下會拉開代表此選項的圖案。有Adidas的起源及各國相關Adidas的連結。



















5.style的選項也附有小圖片。Adidas womanBeat ma shine及產品的選項,點入有五花八門、各種呈現產品的手法。用播放相片、動畫..等方式展現產品。




















最吸引我的地方是首頁的部分,可以馬上得知感興趣的產品的詳細資訊,動畫效果帶有未來感。但五花八門的產品有時會讓自己在網站迷了路,不過產品介紹的呈現方式很能抓住目光,無論是圖片或動畫。

2011年11月4日 星期五

MUJI無印良品

MUJI無印良品

1.首頁以大圖片為主視覺,大圖的右下角有小圖可點選,會跟著點選的圖示更換大圖。點入有更詳細的商品資訊。
















2.商品細節介紹,排版與無印主打的簡潔呼應,資訊雖多卻雜而不亂,使人一目了然。









3.服裝、配件部分不單只有商品圖片,旁邊附有範例圖,讓消費者的想像具體化。範例圖排版不像一般雜誌的模特兒東一個西一個,只有一張簡潔有力。











4.家俱也介紹得非常詳細,複雜的資訊一一列出,清楚知道想得知的部分該點哪裡。











5.店鋪一覽使用地圖表達,圖像比文字更容易記憶。















6.首頁頁面往下拉還有許多資訊,簡潔不花俏所以耐看。








整體網站就如無印提倡的簡約精神,用方塊及垂直水平的排列,設計樸素,將龐大的資訊逐一整理,不會讓人迷失於網站。但主視覺圖的右上角的文字選項,因為背景圖的更換而不便辨識。