|
多會(huì)在奢侈品網(wǎng)站上看到流金 溢彩,但用在餐飲業(yè) 設(shè)計(jì)中還是 獨(dú)樹一幟的。 界面布局 導(dǎo)航清晰,功能性強(qiáng)。進(jìn)入首頁(yè) 隨著畫筆渲染出童 話小屋后,網(wǎng) 站導(dǎo)航竟然由下自上展開的。此 時(shí)你 馬上就可以拿起電話或者 網(wǎng)上訂餐。(圖 3-1) 首頁(yè)廣告窗口的活動(dòng)畫面,可以 讓你迅速找到美食、 優(yōu)惠券或者 活動(dòng),而省去了研究導(dǎo)航的時(shí) 間。(圖 3-1) 進(jìn)入童話小屋,每頁(yè)傳遞的信息 不僅是美食,網(wǎng)站召 喚的食客好 像是一些永遠(yuǎn)不愿長(zhǎng)大的孩子, 在每頁(yè)里 你都會(huì)發(fā)現(xiàn)那么多童 年的元素,玩具、畫筆、糖果還 有憨憨胖胖的批薩廚師(圖 3-1、 圖 3-2、圖 3-3、圖 3-4、圖 3-5、)。 此外,在等頁(yè)面打開時(shí),還可以 順便看看關(guān)于匹薩的故事,這也 是必勝客獨(dú)具匠心的地方, 美食 的最高境界在于它的文化。 建站技術(shù) 引導(dǎo)頁(yè)一個(gè)夢(mèng)幻的 Flash 把你領(lǐng) 進(jìn)這間美食小木屋,整個(gè)網(wǎng)站傳 達(dá)著富媒體時(shí)代技術(shù)的發(fā)達(dá)和 成熟的信息,你可以很快打開音頻 視頻,即使你從不看電視,也 可以從網(wǎng)站上看到最新最酷的 必勝 客廣告。 這個(gè)網(wǎng)站主要是用 Flash 和表格 制作的,小版塊放置得精制整 齊。 此外,網(wǎng)站上還包括了一個(gè)用 ASP 數(shù)據(jù)庫(kù)制作的用戶交互平臺(tái)—— 必勝客會(huì)員俱樂(lè)部,你可 以在里面下載最新的必勝客廣 告和精美的 壁紙等等,最吸引人 的當(dāng)然是辦美食打折卡了,而完 成這一切你只 需和必勝客網(wǎng)站 做一個(gè)小小的互動(dòng)而已。
(圖 3-4)
這個(gè)網(wǎng)站橙色和暗紅色的組合 給人一種非同一般的尊貴感(圖 3-14、圖 3-15、圖 3-16),是那 種誘惑落寞的豪華,仿佛作著靈 魂最深處的展現(xiàn),希望有人能夠 聽(tīng)到它內(nèi)心的聲音。 同時(shí),頁(yè)面橙色與黃色相配是種 很舒服的過(guò)渡(圖 3-16、圖 3-17),由繁榮驕傲過(guò)渡到柔和 溫暖,畢竟樓盤再有個(gè)性也要回 歸到家的溫馨感覺(jué)。 橙色一般讓人聯(lián)想到金色的秋 天,豐碩的果實(shí),是一種富足、 快樂(lè)而幸福的顏色,橙色是最適 合家的感覺(jué)的顏色。橙色稍稍混 入黑色,會(huì)變成一種穩(wěn)重、含蓄 又明快的顏色,這樣的配色會(huì)讓 人有回味的余地。 界面布局 整個(gè)網(wǎng)站重點(diǎn)突出(圖 3-13、 圖 3-16、圖 3-17),在頁(yè)面導(dǎo) 航或需要讀者留意的地方都作 了追光處理,讓人很容易就找到 探索這座城堡的途徑。 這個(gè)網(wǎng)站的導(dǎo)航比較獨(dú)特(圖 3-14、圖 3-15),它放在了不太 顯眼的頁(yè)面左下側(cè),像一座小樓 似的矗立在那里,但設(shè)計(jì)者考慮 到導(dǎo)航位置與其他網(wǎng)頁(yè)的不同, 特意在進(jìn)入頁(yè)面時(shí)在菜單欄 (MENU)加了一個(gè)特效,這樣你 不注意導(dǎo)航欄都難。 此外,主頁(yè)面加了弗萊明戈大擺 裙的部分或全部暗和這個(gè)樓盤 的主題(圖 3-14、圖 3-15、圖 3-16),傳達(dá)出“這里是一個(gè)弗 萊明戈的世界”的信息。 建站技術(shù) 這個(gè)網(wǎng)站運(yùn)用了 Flash 的技術(shù)建 站,F(xiàn)lash 技術(shù)比較適合建設(shè)此 類內(nèi)容量少但又需要絢麗產(chǎn)品 展示的網(wǎng)站。
同時(shí),橙色也是是自然的顏色, 喜歡橙色的人通常都非常熱愛(ài) 大自然并且渴望與自然渾然一 體,他們喜歡戶外活動(dòng),在戶外 運(yùn)動(dòng)會(huì)讓他們感覺(jué)到重生的力 量。 頁(yè)面的橙色與白色搭配(圖 3-21),在厚重的橙色籠罩下, 讓人的視覺(jué)稍稍休息了一下,心 情也明快了起來(lái)。 界面布局 網(wǎng)站涵蓋內(nèi)容多但不雜亂,頁(yè)面 左側(cè)的中國(guó)結(jié)與右側(cè)的深橙色 內(nèi)容欄相映襯(圖 3-21、圖 3-22、圖 3-23),平衡了整個(gè)頁(yè) 面,也突出了重點(diǎn)。 導(dǎo)航一目了然,深粉色的底色使 人馬上就能找到他們所關(guān)心的 欄目。 同時(shí),頁(yè)面也很注意整體布局風(fēng) 格的統(tǒng)一,如“新聞熱點(diǎn)”欄目 后凹的感覺(jué)整好與環(huán)形大屏幕 呼應(yīng)(圖 3-21),“寫真與視頻” (圖 3-22)和“軍霞隨筆”(圖 3-23)的表格結(jié)構(gòu)也與頁(yè)面和諧 統(tǒng)一。 建站技術(shù) 整個(gè)網(wǎng)站的建設(shè)是基于 Flash 和表格的運(yùn)用。 這個(gè)網(wǎng)站的 Flash 效果做得非 常細(xì)致,如按鈕上的流光效果和 環(huán)形大屏幕有韻律的照片反白 效果(圖 3-21)。 表格技術(shù)的運(yùn)用使得頁(yè)面規(guī)范 整齊,同時(shí)也避免了純 Flash 網(wǎng)站的打開頁(yè)面速度慢的問(wèn)題。
3.5 蝸牛游戲網(wǎng)站(Snail Game)
界面布局
整個(gè)網(wǎng)站界面以圖布局,甚至導(dǎo) 航欄也隱藏在圖里,如果沒(méi)有提示,恐怕還真得找一陣兒。(圖 3-32、圖 3-33) 游戲二級(jí)頁(yè)面的布局十分簡(jiǎn)單, 像一個(gè)屏幕一樣,你只需下拉菜 單就能找到你所需要的信息(圖 3-34、圖 3-35),但這樣的布局 并沒(méi)有使你有空曠感。 建站技術(shù) 這個(gè)網(wǎng)站基于 Flash 建站。 比較別致的地方就是它的導(dǎo)航 欄的設(shè)計(jì)(圖 3-31、圖 3-32), 你可以選擇滾動(dòng)鼠標(biāo)的滑動(dòng)輪 來(lái)實(shí)現(xiàn)欄目的變換,同時(shí)隨著欄 目的變換,頁(yè)面上的人物也相應(yīng) 變換,這真的很有趣。
橙色賦予整個(gè)網(wǎng)站生命,在一片 桔色海洋里你看到了這款與眾不 同的C2,黑色的汽車圖像被背景 橙色映襯的格外突出,你也會(huì)感 到整個(gè)網(wǎng)站歡快活潑的氣氛。(圖 3-37、圖 3-38) 此時(shí),橙色向明黃色過(guò)渡并不是 那種舒服的溫馨感覺(jué),而是極其 跳躍動(dòng)感的炫色,仿佛網(wǎng)站里的 車隨時(shí)就要啟程出發(fā)(圖 3-39、 圖 3-40)。 此外,淡灰色的運(yùn)用稍稍冷卻了 頁(yè)面里感性的感覺(jué),它向人們 傳達(dá)著科技和安全的感覺(jué)(圖 3-39、圖 3-40)。 界面布局 整個(gè)網(wǎng)站主題鮮明,占頁(yè)面主體 部分的就是那輛車,點(diǎn)選在頁(yè)面 底部導(dǎo)航欄, 會(huì)在頁(yè)面上方出現(xiàn) 子導(dǎo)航,這樣欄目就比較清晰了。 值得一??的是,在“動(dòng)感我型” 欄目中,頁(yè)面分別以三個(gè)字母 V——活力、S——運(yùn)動(dòng)和 T——時(shí) 尚來(lái)切合這個(gè)欄目的主題,讓人 一下就記住了 C2 與眾不同的特質(zhì) (圖 3-39、圖 3-40)。 建站技術(shù) 整個(gè)網(wǎng)站主要基于 Flash 和表格技術(shù)建站。 首頁(yè)用表格制作,同時(shí)用了很少 的 CSS 語(yǔ)言調(diào)整版式,??高了頁(yè) 面打開速度(圖 3-37)。 內(nèi)部頁(yè)面全都運(yùn)用Flash技術(shù),很 多特效做得十分完美,此外汽車 功能可以通過(guò)點(diǎn)選來(lái)了解,快速 方便。
界面布局 整個(gè)界面所要傳達(dá)的信息非常多,但都被合理的安排在一幅頁(yè) 面里,并沒(méi)有讓人感覺(jué)雜亂,這 就是設(shè)計(jì)者的功力所在吧。在很 多元素重疊的頁(yè)面中,設(shè)計(jì)者用 一道彩虹牽連起它們,在頁(yè)面中 形成了一個(gè)穩(wěn)定的倒三角布局, 同時(shí),也為頁(yè)面適度的留白,讓 眼睛有了呼吸的空間(圖 3-57、 圖 3-58、圖 3-59)。 頁(yè)面的下面的左右角都可以帶 你探索網(wǎng)站,左下角方便了一些 “速讀網(wǎng)頁(yè)者”,你只需看一眼 按鈕,就可以知道這條路的方 向。右下角的轉(zhuǎn)盤導(dǎo)航適合那些 “按部就班”的讀者,他們需要 充分了解導(dǎo)航信息,小小導(dǎo)航也 體現(xiàn)著人性化設(shè)計(jì)理念啊(圖 3-55、圖 3-56)。 建站技術(shù) 這個(gè)網(wǎng)站運(yùn)用了 Flash 、 Div+CSS 技術(shù)建站。 Flash 主要體現(xiàn)在每頁(yè)的介紹畫 面,它像電影一樣帶你參觀香港 并了解這款打印機(jī)的性能。 此外,整個(gè)網(wǎng)站還運(yùn)用了一些簡(jiǎn) 單的 Div+CSS 來(lái)確定網(wǎng)頁(yè)的布 局和樣式。
(圖 3-64)
親自玩上一次。 表格(table)主要用來(lái)定位網(wǎng)站 中各種欄目,使頁(yè)面更加規(guī)則、整齊。 |
|
|