小提醒:有些網(wǎng)站效果不能再贊,谷歌、火狐才能打開(kāi)唷。
Kaipoche該網(wǎng)站致力于今年的風(fēng)箏節(jié)。通過(guò)一個(gè)簡(jiǎn)單的滾動(dòng)激活動(dòng)畫技術(shù),它有一個(gè)真正充滿活力和引人矚目的設(shè)計(jì)。 Bizbrain 是一個(gè)先進(jìn)的長(zhǎng)頁(yè)面網(wǎng)站。它通過(guò)精彩的彩色圖熟練地演示了各種數(shù)據(jù)。各個(gè)版塊都有各自相應(yīng)的信息。
Drugs and Alcohol on Campus 這也是一個(gè)交互式圖表,能夠在不知不覺(jué)中給你最緊迫的問(wèn)題提供答案。所有畫面都是通過(guò)鼠標(biāo)來(lái)激活動(dòng)畫的,使這些問(wèn)題看起來(lái)不那么“干巴巴”的。 Bright Media 該團(tuán)隊(duì)利用視覺(jué)引導(dǎo)串起所有元素,使用正確的順序引導(dǎo)用戶,每個(gè)部分都有裝飾的動(dòng)畫元素,你的任務(wù)就是順著線條走就OK了。
Adobe Muse CC 這是一個(gè)創(chuàng)新的、干凈而復(fù)雜的網(wǎng)站,利用藝術(shù)方法引導(dǎo)用戶來(lái)關(guān)注自身新產(chǎn)品。主要包括簡(jiǎn)潔的白色頁(yè)面、紙張變形模式和滾動(dòng)動(dòng)畫來(lái)實(shí)現(xiàn)效果。 Fluger 網(wǎng)站的開(kāi)發(fā)人員在頁(yè)面上放置了一架小飛機(jī),用戶通過(guò)滾動(dòng)鼠標(biāo)滾輪可以看到小飛機(jī)在頁(yè)面上飛行,實(shí)現(xiàn)瀏覽整個(gè)網(wǎng)站的目的。網(wǎng)站是用圖片和手繪稿糅合起來(lái)的,加上飛機(jī)的引導(dǎo),看起來(lái)酷斃了!不過(guò)加載時(shí)需要等一定的時(shí)間。 Fillet 這是一個(gè)流行的平面風(fēng)格網(wǎng)站,擁有很棒的字體。當(dāng)你向下滾動(dòng)鼠標(biāo)時(shí),每個(gè)色塊都會(huì)順利轉(zhuǎn)化為一串漂亮的字符。整個(gè)過(guò)程顯得很愉快。
NGUMA 這是一個(gè)富有魅力的互動(dòng)機(jī)構(gòu)網(wǎng)站。該網(wǎng)站允許你直接參與它的互動(dòng)。也是基于滾動(dòng)動(dòng)畫的設(shè)計(jì)趨勢(shì)。
Happy New Year 2014 滾動(dòng)激活動(dòng)畫模式非常適合于慶祝節(jié)日的網(wǎng)站設(shè)計(jì)。特別是圣誕節(jié)。這個(gè)網(wǎng)站里面通過(guò)一個(gè)完整的動(dòng)畫建立起一個(gè)溫馨的節(jié)日氣氛,真是讓人感到很別致。 Merry Christmallax 和上面的例子一樣,這個(gè)創(chuàng)意網(wǎng)站的目的就是給用戶們一個(gè)溫暖而衷心的節(jié)日祝福。故事開(kāi)始于一張干凈的紙張,最后演變成一個(gè)充滿活力的插圖場(chǎng)景,整個(gè)故事就是動(dòng)過(guò)滾動(dòng)激活動(dòng)畫技術(shù)實(shí)現(xiàn)的。 Pixelgyar 這是另一個(gè)奇妙的和迷人的圣誕故事。圣誕老人的旅程完全取決于你的行動(dòng),所以旋轉(zhuǎn)鼠標(biāo)滾輪,讓圣誕老人到達(dá)他的目的地吧!
Make Your Money Matters 這是一個(gè)宣傳網(wǎng)站,生動(dòng)地展示了加入信用聯(lián)盟的好處。在整個(gè)動(dòng)畫過(guò)程中你將成為一個(gè)積極參與者。這項(xiàng)技術(shù)允許我們持有一個(gè)既定主題來(lái)實(shí)現(xiàn)網(wǎng)站設(shè)計(jì),做到和用戶之間的良好互動(dòng)。 The Future of Mobile Phones 正如網(wǎng)站標(biāo)題所言,該網(wǎng)站就是預(yù)測(cè)未來(lái)的手機(jī)的。網(wǎng)站的交互式信息里面充滿了各種動(dòng)畫圖形,都是定期統(tǒng)計(jì)的數(shù)據(jù)展示。
Camplight 這是一個(gè)整潔、干凈而時(shí)尚的在線展示網(wǎng)站。提供了一個(gè)較為新穎的展示方式讓用戶來(lái)熟悉公司。
1McHappy Day 這個(gè)網(wǎng)站通過(guò)橡皮泥一樣的圖形設(shè)計(jì)帶給用戶返老還童式的體驗(yàn),心靈上很容易就歡快起來(lái)。(我覺(jué)得要是來(lái)點(diǎn)卡哇伊的背景音樂(lè)一定會(huì)更給力的!) CEZ 提供了另一個(gè)驚人的互動(dòng)之旅,該技術(shù)功不可沒(méi)啊。 What’s behind the number 網(wǎng)站目的是廣泛宣傳關(guān)于防曬霜的防曬指數(shù)及其優(yōu)勢(shì)。當(dāng)你向下滾動(dòng)時(shí),你會(huì)享受到一個(gè)整體活潑的故事,試圖告訴你使用該產(chǎn)品后,在陽(yáng)光下你的皮膚依然很安全。 InfoGuest Infographic 如其名字一樣,它有大量的信息填充內(nèi)容,通過(guò)圖表和動(dòng)畫的有效結(jié)合展示出來(lái)。
Bolia 和上面的例子稍有不同,該創(chuàng)意團(tuán)隊(duì)?wèi)?yīng)用基于照片的滾動(dòng)激活動(dòng)畫來(lái)展示椅子的所有面。
Bam 該公司試圖利用長(zhǎng)頁(yè)面布局和各種圖紙來(lái)實(shí)現(xiàn)信息填充。為了避免各部分信息過(guò)于統(tǒng)一單調(diào),研究小組決定采用滾動(dòng)激活動(dòng)畫給網(wǎng)站帶來(lái)生氣。
Areal Plankstadt 這是一個(gè)寧?kù)o的網(wǎng)站,擁有美麗的氛圍。為什么?——藍(lán)白兩色,青春一生……通過(guò)滾動(dòng)激活動(dòng)畫技術(shù)實(shí)現(xiàn)頁(yè)面之間的切換,非常平靜安寧。 結(jié)語(yǔ) 這里所列出的這些在線信息展示網(wǎng)站、視覺(jué)故事網(wǎng)站、創(chuàng)意機(jī)構(gòu)網(wǎng)站以及投資組合網(wǎng)站都實(shí)實(shí)在在地利用了滾動(dòng)激活動(dòng)畫這一嶄新的設(shè)計(jì)技法,構(gòu)造了一個(gè)特定的用戶體驗(yàn)?zāi)J剑M』锇閭兡軌蛴袆?dòng)力去學(xué)習(xí)這一項(xiàng)新技術(shù)。 我最喜歡Adobe Muse CC和Fluger了,看起來(lái)真的是十分贊的!