<strike id="cy2gs"><menu id="cy2gs"></menu></strike>
  • <del id="cy2gs"><dfn id="cy2gs"></dfn></del>
  • 淺談網(wǎng)頁UI之Banner篇

    2012-11-11    藍(lán)藍(lán)設(shè)計(jì)的小編

    轉(zhuǎn)載藍(lán)藍(lán)設(shè)計(jì)(   www.skdbbs.com  )是一家專注而深入的設(shè)計(jì)機(jī)構(gòu) ,為期望卓越的國內(nèi)外企業(yè)提供有效的   BS界面設(shè)計(jì) 、  cs界面設(shè)計(jì) 、  ipad界面設(shè)計(jì)   、  包裝設(shè)計(jì) 、  圖標(biāo)定制 、  用戶體驗(yàn) 、交互設(shè)計(jì)、   網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)

    來源: http://ucdchina.com/snap/7592

    如果您想訂閱本博客內(nèi)容,每天自動(dòng)發(fā)到您的郵箱中,            請點(diǎn)這里

    關(guān)于網(wǎng)頁UI,UE之類的論點(diǎn)文章網(wǎng)上太多了,更多大師將這些大師分析到,無論是開發(fā)領(lǐng)域還是設(shè)計(jì)領(lǐng)域,這些真正的大師所發(fā)表的文章都從不賣弄自己,更多的分析而無私的供獻(xiàn)自己的獨(dú)道見解,他們所寫博文與其它政治、娛樂、商業(yè)等領(lǐng)域所發(fā)表的博文完全不同類型,我不是大師,但我很崇拜大師。

    一個(gè)頁面最醒目最吸引用戶的應(yīng)該是Banner了,尤其是Web2.0平臺(tái)Banner顯得更突出,Banner主要體心意旨,形象鮮明的展示所要表達(dá)的內(nèi)容。因?yàn)樗涯浚苑乓粋€(gè)很糟蹋的Banner上去效果也當(dāng)然“醒目”了。因此網(wǎng)頁Banner設(shè)計(jì)在這里起到了至關(guān)重要的作用,特別是首頁的Banner,直接決定了用戶的停留,下面讓我們通過大量優(yōu)秀的案例進(jìn)入Banner,走進(jìn)大師們的靈感世界。


    1.大面積的Banner

    Banner_1.jpg

    http://www.tearoundapp.com/
    這個(gè)Banner非常直接的采用了一個(gè)很大的iPhone圖片,用戶幾乎不用思考的就知道網(wǎng)站的大概內(nèi)容,而且加上與產(chǎn)品類似風(fēng)格的功能按鈕直接展示了部分功能,大的Banner最直接最醒目,處理也最需要謹(jǐn)慎,否則事關(guān)功倍。

    例其它類似Banner

    Banner_2.jpg

    Banner_3.jpg

    Banner_4.jpg

    2.文字與圖片1/2比例

    Banner_5.jpg

    http://www.scrapblog.com/
    這種Banner不是很大,雖然文字與圖片占居空間相等,但加上大的Button讓文字內(nèi)容相對比較醒目,這種Banner的處理重點(diǎn)在于背景與和圖片和文字的協(xié)調(diào),比例要均勻。

    其它類似Banner

    Banner_6.jpg

    Banner_7.jpg

    Banner_8.jpg

    3.人物與文字

    Banner_9.jpg

    http://www.showandtellsale.com/
    采用人物加文字內(nèi)容,讓主題思想顯得更鮮明活動(dòng),人物可以更直接更友好的告訴用戶這里有什么?

    其它類似Banner

    Banner_10.jpg

    Banner_11.jpg

    Banner_12.jpg

    4.創(chuàng)意矢量圖形

    Banner_13.jpg

    http://ideafoundry.info/
    純鼠繪而且的矢量CG圖形,獨(dú)特創(chuàng)意和視覺沖擊,精致的矢量風(fēng)格與網(wǎng)站整體完美結(jié)合,體現(xiàn)出網(wǎng)站整體實(shí)力。

    其它類似Banner

    Banner_14.jpg

    Banner_15.jpg

    Banner_16.jpg

    Banner_17.jpg

    Banner_18.jpg

    5.軟件產(chǎn)品界面

    Banner_19.jpg

    http://bydreamtime.com/
    大凡軟件產(chǎn)品服務(wù)網(wǎng)站都將自己的產(chǎn)品界面直接融合在Banner中,加上文字與個(gè)性Button,可以讓用戶直接深入的了解產(chǎn)品基本功能和構(gòu)造,甚至?xí)て鹩脩粝肓⒓丛囉玫挠?/span>

    其它類似Banner

    Banner_20.jpg

    Banner_21.jpg

    Banner_22.jpg

    Banner_23.jpg

    Banner_24.jpg

    Banner_25.jpg

    6.線條與光線

    Banner_31.jpg

    http://www.scarbantia-art.hu/
    漸變的背景在融入線條元素,讓Banner更加動(dòng)感奪目,單色或多色的光線讓線條和背景更加炫彩,使Banner充滿迷幻進(jìn)一步刺激用戶的探索欲望。

    其它類似Banner

    Banner_32.jpg

    Banner_33.jpg

    Banner_34.jpg

    Banner_35.jpg

    7.純文字內(nèi)容的Banner

    Banner_26.jpg

    不需要華麗的背景,更不需要圖片的點(diǎn)綴,只需要一段文字加上單調(diào)的背景色....
    http://enviramedia.com/

    其它類似Banner

    Banner_27.jpg

    Banner_28.jpg

    Banner_29.jpg

    Banner_30.jpg

    由于時(shí)間有限更多經(jīng)典案例沒來得及整理和未被發(fā)現(xiàn),不同類型的網(wǎng)站搭配不同類型的Banner,Banner的主要功能到底是誘導(dǎo)用戶,還是展示形象,還是刺激神經(jīng),這些觀點(diǎn)都有它的支持者,所有Banner的核心共同點(diǎn)是讓用戶在短時(shí)間內(nèi)將鼠標(biāo)滑上去點(diǎn)擊。做到這一點(diǎn),設(shè)計(jì)人員還需要好好的琢磨。

    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

    藍(lán)藍(lán)設(shè)計(jì)案例分享:新奧集團(tuán)燃?xì)鉅I業(yè)廳網(wǎng)站設(shè)計(jì)

    新奧集團(tuán)燃?xì)鉅I業(yè)廳網(wǎng)站設(shè)計(jì)

    日歷

    鏈接

    個(gè)人資料

    存檔

    主站蜘蛛池模板: 精品视频无码一区二区三区 | 亚洲国产精品自在拍在线播放 | 在线观看国产精品普通话对白精品 | 国产欧美精品一区二区三区四区| 国产精品无码无卡无需播放器| 精品无码人妻一区二区免费蜜桃| 成人精品在线视频| 久久se精品一区精品二区| 国产精品成人久久久久三级午夜电影| 久久996热精品xxxx| 亚洲av永久无码精品国产精品| 国产精品拍天天在线| 国产夫妇精品自在线| 亚洲一级Av无码毛片久久精品 | 青青草原精品国产亚洲av| 久久国产精品成人片免费| 久久午夜无码鲁丝片午夜精品| 日本一卡精品视频免费| 久久夜色精品国产亚洲av| 成人一区二区三区精品| 亚洲欧美精品综合中文字幕 | 国产香蕉国产精品偷在线观看| 日韩精品无码免费视频| 国产精品区免费视频| 亚洲av永久无码精品表情包| 国内精品伊人久久久久AV影院| 欧美精品一区二区三区免费观看| 国内精品久久久久影院优| 中文字幕日韩精品有码视频 | 国产亚洲精品看片在线观看 | 久热精品人妻视频| 久久97久久97精品免视看秋霞| 国产乱码伦精品一区二区三区麻豆| 欧美一区二区精品久久| 午夜在线视频91精品| 久久久久久久久久久免费精品| 精品人妻少妇嫩草AV无码专区| 国产精品无码久久综合网| 久久精品国产精品亚洲下载| 老年人精品视频在线| 午夜精品久久久久成人|