網頁分析_Arcade Fire

這是一個樂團的互動式網站，網頁一開始的loading畫面是一個圓形和正方形會改變大小和位置

接下來出現首頁，從這張開始就可以看到，這個網站風格走向

按下進入後就會播出樂團MV，只要移動滑鼠就可以開始玩玩這個網站的互動裝置

在滑鼠所選的範圍內可以看到比較清晰的畫面，其他部分會有發散的效果，讓畫面更有張力，但是有時候不同照片也會有不同的效果

即使將影片按下暫停，同樣可以移動滑鼠來製造效果，像這張就是配合不同情境有不同效果

等到影片播完後，可以進到樂團的官方網站

下圖就是Arcade Fire 的官方網站首頁

這個網站的互動裝置很特別也很好玩，就算對他們音樂沒有認識太多的人，也能透過這種互動方式聽完整首歌，或許就會因此喜歡他們的音樂。

網站連結：http://www.justareflektor.com/

網頁分析_spoiledbrat

這個網站是一個珠寶品牌的網站，幾乎全部的元件都有設置flash，滑鼠移到按鍵時會有一些動畫或小變化

這是他的首頁

接下來可以移動滑鼠例如以下這張就是將滑鼠移到選單上的Earrings，會有耳環的插圖浮上來

點進去後出現的內容也是以flash動畫為主

當滑鼠滑到想看的商品上時，也會出現一段小動畫

點進去之後就可以看到價錢、大小以及成分

雖然這個網站的版型很中規中矩，可是因為最近在學按鍵的三種變化，我覺得這個網站做得算是精緻，值得學習。
網站連結：http://www.spoiledbratjewelry.com/

網頁分析_Reebok

這是一個Reebok的官方網站，一開始的loading畫面就很有趣，是達文西的人體黃金比例

網站的footer也是以紅黑色為主

而整體風格大部分都是採用紅黑兩個主色調，搭配上風格一致的照片使網站有一致性

而捲動滑鼠滾輪就可以看到下一個主題的照片和文字了

繼續往下捲會看到一個大腦的圖案，也是我覺得最有趣的部份

點進去會看到一個像下圖一樣的圖示，圖示下面有卷軸可以點

點右上角的箭頭可以將大腦放大並旋轉

每個卷軸的節點都是在循序漸進的說明運動對大腦的好處，圖中會有簡單的圖解以及統計資料

有時候還會有一些小插圖

到後面可以看到大腦活躍以及漸漸變得越來越繽紛的動畫

不想要大腦退化就動起來吧!!

網站連結：http://fitness.reebok.com/international/be-more-human/#/home

Flash vs html5

這個網站是利用互動甚至遊戲的方式讓我們認識flash和html5

一開始的loading畫面就是一個動畫

等loading完之後會看到首頁，接下來只要滾動滑鼠上的滾輪就可以看完整個網站，也可以直接點選最上方的選單，他會直接跳到那個主題

再繼續往下會看到一連串的動畫可以用滑鼠滾輪控制看的速度

接下來會看到一些敘述文字

接下來就要進入遊戲的部分了，讓使用者比較flash和html5的差別

接下來會有圖示解說

最後這個網站要告訴我們，flash和html5都是很好用的工具，彼此各有優缺點，所以最後比賽的結果是平手

網站連結：http://www.flashvhtml.com/