韓國三大門戶的基礎(chǔ)設(shè)計(jì)

0 評(píng)論 2756 瀏覽 3 收藏 10 分鐘

前言

本博文通過韓國的最具有代表性的NAVER、DAUM、NATE三大門戶網(wǎng)的設(shè)計(jì),從中了解首頁布局,頁面色彩應(yīng)用,以及頻道導(dǎo)航,頁面模塊處理等一些基礎(chǔ)設(shè)計(jì),使得讓我們更方便、直觀的跟我們國內(nèi)的門戶做對(duì)比,了解韓國門戶的設(shè)計(jì)方面的流行的趨勢(shì)和風(fēng)格把握,希望能給每一位關(guān)心門戶設(shè)計(jì)的朋友一些新的啟發(fā)。
頁面布局、結(jié)構(gòu)

以上三個(gè)門戶的首頁頁面布局和結(jié)構(gòu)中可以看到比國內(nèi)的幾個(gè)門戶網(wǎng)的布局大不一樣。韓國的首頁布局通常都是以簡潔清晰、區(qū)塊明顯的的特點(diǎn)吸引用戶。但這并不意味著內(nèi)容上單一、乏味。韓國的門戶更多的是利用清晰的導(dǎo)航來引導(dǎo)用戶更快、更直接的到達(dá)用戶所需要的頁面中,而不是把全部的頻道、分類羅列在首頁。記得曾經(jīng)在一位韓國設(shè)計(jì)的博客上看到過他寫的一段話,講到:用戶預(yù)覽網(wǎng)站就像逛商場(chǎng)一樣,商場(chǎng)不一定為了大賣把所有商品堆積在顧客進(jìn)門的大門口處,而更重要的是怎樣讓用戶少走一些彎路,買到更多自己滿意的商品,這就需要一個(gè)清晰明了的導(dǎo)航和合理科學(xué)的布局。

頁面色彩應(yīng)用

為了更好的做出對(duì)比以上拷貝的都是三家門戶的同樣形式的專題頁-手機(jī)應(yīng)用的宣傳專題。

從中可以看到,每家門戶都是圍繞著VI的標(biāo)準(zhǔn)色來制作的,其三家的設(shè)計(jì)風(fēng)格都很接近,淡淡的背景,清晰的文字、直觀的素材。沒有過多的修飾和渲染,沒有過多豐富的顏色這就是韓國的設(shè)計(jì)風(fēng)格。

頻道導(dǎo)航規(guī)范

每個(gè)門戶都有豐富的子頻道,因?yàn)樯婕暗念l道太多,我這里只能列了一些重點(diǎn)頻道和,具有代表性的頻道導(dǎo)航。

以上三家門戶的頻道導(dǎo)航處理上略微不同的是NATA任何頻道白底黑字,只是用分別不同的細(xì)的色條來區(qū)分頻道之間的差異。NAVER和DAUM用的是VI標(biāo)準(zhǔn)色,和應(yīng)用頻道的特點(diǎn)取了一些周邊補(bǔ)助色。但任何頻道都沒有脫離VI的標(biāo)準(zhǔn)色,這樣處理的好處是很好的體現(xiàn)了其品牌的凝聚力和品牌旗下的概念。

頁面顏色及文字顏色

三家門戶頁面用色基本上都嚴(yán)格按照VI的專色和淺色的搭配,整體看協(xié)調(diào)。

其中VATE的文字用色上有明顯的特點(diǎn),沒有標(biāo)明文字鏈,只是用CSS文字感應(yīng)來表示可點(diǎn)。

在國內(nèi)的界面設(shè)計(jì)中,中文字鏈的部分通常都用藍(lán)色、或者藍(lán)色掉劃線來表達(dá)。但目前沒有一個(gè)界定的標(biāo)準(zhǔn),什么樣的文字鏈?zhǔn)撬{(lán)色,什么樣的文字鏈只是用通常的顏色+文字感應(yīng)樣式來表達(dá)。NAVER和DAUM的文字鏈處理上,一般的文字鏈都是用主體文字顏色來表達(dá),在特殊特定的文字鏈才應(yīng)用了藍(lán)色文字鏈。

icon

及客戶端、wap

icon和客戶端一般線下使用,所以更需要保留自身品牌感。icon必須在有限的像素空間上既能表現(xiàn)出產(chǎn)品的特點(diǎn),也要表現(xiàn)品牌的統(tǒng)一形象、品牌的整體感、品牌的系列性。
以上三家門戶的icon和客戶端都有共同特點(diǎn),都保留品牌自身的基本色和風(fēng)格、質(zhì)感,確保了用戶的識(shí)別性。在國內(nèi)的icon和客戶端的用色上比較混亂,由于只重視其產(chǎn)品的自身特點(diǎn)和風(fēng)格,往往忽略掉了品牌感。這一點(diǎn),我們可以多多借鑒一下。

頁面模塊的視覺處理


作為設(shè)計(jì)師應(yīng)該有良好的對(duì)模塊的表現(xiàn)手法,而且還要具備對(duì)模塊意識(shí)。哪些模塊可以利用標(biāo)簽形式,哪些模塊要做成切換滾動(dòng)形式……
以上三家門戶的模塊處理方式上和視覺表現(xiàn)形式上都比較雷同,基本上都用淺色線條、和淺色色塊、甚至都沒有應(yīng)用漸變、反白文字的深色分類條。這種處理方式頁面看著比較清爽、簡潔。

結(jié)語
以上是韓國的三大門戶NAVER、DAUM、NATE的基礎(chǔ)的設(shè)計(jì)中幾個(gè)方面,我們從中了解了韓國的設(shè)計(jì)風(fēng)格和規(guī)范的應(yīng)用。
wed設(shè)計(jì)是一門綜合的藝術(shù)表現(xiàn)形式,肩負(fù)著不僅要跟國外的優(yōu)秀方面學(xué)習(xí),還要設(shè)計(jì)出符合國內(nèi)用戶的習(xí)慣產(chǎn)品、也要用最科學(xué)的方法引導(dǎo)用戶群體,使得更好更快的使用網(wǎng)絡(luò)產(chǎn)品。

PS:

為了方便大家的學(xué)習(xí)交流,特意注冊(cè)的一套ID,大家可以登錄后可以瀏覽到更多的頁面,以及下載到官方的客戶端.
文字方面有疑問我會(huì)也盡我所能幫大家翻譯.

http://www.nate.com/ ID:netease?? 密碼:我的名字拼音+163(不用輸入+符號(hào))

http://www.naver.com/ ID:xiaohuizi?? 密碼:我的名字拼音+163(不用輸入+符號(hào))

http://www.daum.net ID:dandanqinghui? 密碼:我的名字拼音+163(不用輸入+符號(hào))

來源:http://uedc.163.com/6491.html

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 目前還沒評(píng)論,等你發(fā)揮!