資源描述:
《網(wǎng)頁設(shè)計(web design)和用戶界面設(shè)計(ui design)》由會員上傳分享,免費在線閱讀,更多相關(guān)內(nèi)容在行業(yè)資料-天天文庫。
1、網(wǎng)頁設(shè)計(webdesign)和用戶界面設(shè)計(UIdesign)這是兩個現(xiàn)在網(wǎng)頁設(shè)計領(lǐng)域使用頻率非常高的詞。在大多數(shù)情況下,它們被相互替代。這個領(lǐng)域內(nèi)外的很多人都認為這是兩個意義基本一樣的詞。但是它們真的可以互相混淆么?我并沒有為一些名詞而去糾結(jié)的習(xí)慣,比方說我不會在“美工”和“設(shè)計師”之間與別人爭論。但是我想網(wǎng)頁設(shè)計和用戶界面設(shè)計這兩個詞包含了很多東西,這兩個詞的對比可以引申出一些設(shè)計領(lǐng)域的發(fā)展過程和思考。webdesign&printdesign&interfacedesign注:這篇網(wǎng)志所指的用戶界面設(shè)計在無特殊說明下特指網(wǎng)頁中
2、的用戶界面設(shè)計?;氐接脩艚缑嬖O(shè)計的原點這里不做考古,只是回想一下最初在互聯(lián)網(wǎng)領(lǐng)域提到用戶界面這個詞的時候,是由工業(yè)設(shè)計領(lǐng)域的人機交互界面中引申過來的。因而談到界面,則必然會有交互這個概念的存在。從人機界面本身的理解上來看,它是人和機器(本文特指電腦)交互的媒介。如果把機器看作是CPU、硬盤等硬件的話,那么界面就是各種各樣的軟件(包括操作系統(tǒng));如果人交互的對象是軟件里的一些對象(有可能是數(shù)據(jù)啊媒體文件啊等等),那么界面(圖形界面)就是我們很熟悉的軟件界面了。在軟件領(lǐng)域,界面設(shè)計的發(fā)展已經(jīng)非常成熟了,在各種環(huán)境、各種系統(tǒng)下都有不同的GU
3、IBuilder,而之所以稱其為界面,則必須是人會通過界面這個媒介來操作“數(shù)據(jù)”。這和網(wǎng)頁設(shè)計是不一樣的。從用戶的需求出發(fā)來看網(wǎng)頁設(shè)計用戶瀏覽網(wǎng)頁的需求是什么?抽象出來可以歸納為1:瀏覽信息;2:操作數(shù)據(jù)。這里的數(shù)據(jù)是指在數(shù)據(jù)庫中躺著的數(shù)據(jù)。用戶在單純?yōu)g覽信息時,不會對頁面背后的“數(shù)據(jù)”造成任何操作,但用戶可以點擊鏈接,跳轉(zhuǎn)頁面。這部分就是網(wǎng)頁設(shè)計有別于用戶界面設(shè)計的一個主要地方。前者會花相當多的精力在如何通過設(shè)計來準確地傳達信息上,而后者雖然也涉及到信息的傳達,但只占一小部分。這也是為什么做軟件界面的設(shè)計師在做網(wǎng)頁設(shè)計時會遇到比較大
4、的挑戰(zhàn),也并不是很成功(盡管“像軟件一樣”的風格也正流行著)。那是不是可以認為網(wǎng)頁設(shè)計中包含一部分用戶界面設(shè)計的職能,也就是操作數(shù)據(jù)的部分?事實上可以這么看,網(wǎng)頁設(shè)計中的交互模式和用戶界面設(shè)計的交互模式有很多都是想通的。但也需要注意這兩者在交互模式上的差異性。目前由于網(wǎng)絡(luò)速度、瀏覽器標準等原因的限制,能夠完美應(yīng)用到網(wǎng)頁中的交互模式遠少于用戶界面設(shè)計中的交互模式,但這種差距正在逐步縮小(比如drag&drop,realtimeedit);而在用戶界面設(shè)計中,這些交互也顯得更加流暢。網(wǎng)頁設(shè)計受平面設(shè)計及界面設(shè)計的影響很難說網(wǎng)頁設(shè)計是從平面
5、設(shè)計或者界面設(shè)計之中派生出來的。在最早的年代,網(wǎng)頁設(shè)計應(yīng)該是由瀏覽器開發(fā)公司來做的,也就是網(wǎng)景。至于現(xiàn)在發(fā)展成如此蓬勃的一個領(lǐng)域,有望超過傳統(tǒng)的平面設(shè)計和界面設(shè)計,中間的過程中我的腦海中是一團混沌。但無疑,現(xiàn)代的網(wǎng)頁設(shè)計是受了很多平面設(shè)計以及界面設(shè)計的影響。其中我認為平面設(shè)計的影響尤甚。前面有提到用戶在網(wǎng)頁上一個重要需求是瀏覽信息,而網(wǎng)頁設(shè)計的一個職能便是有效地、準確地傳達信息,并且同時保證美感。而這正是平面設(shè)計的一個重要職能。舉個最普遍的例子,大家通常談到的網(wǎng)頁設(shè)計中的排版和布局(layout),實際上正是來源于廣泛應(yīng)用在平面設(shè)計中
6、的格式塔心理學(xué)理論的完形法則:1.相近(Proximity)。距離相近的各部分趨于組成整體。2.相似(Similarity)。在某一方面相似的各部分趨于組成整體。3.封閉(Closure)。彼此相屬、構(gòu)成封閉實體的各部分趨于組成整體。4.簡單(Simplicity)。具有對稱、規(guī)則、平滑的簡單圖形特征的各部分趨于組成整體。而色彩理論、構(gòu)圖理論等等,很多也是直接基于平面設(shè)計發(fā)展多年積累下來的經(jīng)驗結(jié)果的。甚至現(xiàn)在很多設(shè)計師直接把平面設(shè)計中獨特的風格引入到網(wǎng)頁設(shè)計里:PrintDesignInfluence。而網(wǎng)頁設(shè)計和平面設(shè)計最大的不同,
7、也就是在“操作數(shù)據(jù)”上。事實上,網(wǎng)頁設(shè)計的發(fā)展也一直受軟件界面設(shè)計的影響,先前已經(jīng)提到網(wǎng)頁中的交互越來越“軟件化”。而交互的發(fā)展必然會影響到網(wǎng)頁設(shè)計中的“視覺”部分。事實上這兩部分誰先影響誰很難說清楚,是一個雞生蛋,蛋生雞的問題。另外一個網(wǎng)頁設(shè)計有別于平面設(shè)計和用戶界面設(shè)計的地方,我認為是css,html,js三者身上。前端代碼的發(fā)展對網(wǎng)頁設(shè)計的影響非常大,甚至有段時間會主導(dǎo)網(wǎng)頁設(shè)計的發(fā)展潮流,比如用jQuery輕松實現(xiàn)的onepagestyle(本站首頁就是如此)。而在平面設(shè)計領(lǐng)域,沒有代碼環(huán)節(jié);在用戶界面設(shè)計領(lǐng)域,GUIBuild
8、er的革新速度遠遠慢于前端代碼。事實上,有點脫胎于平面設(shè)計和用戶界面設(shè)計的網(wǎng)頁設(shè)計,已經(jīng)開始反向影響它的祖先了。從美學(xué)上對比網(wǎng)頁設(shè)計和用戶界面設(shè)計的發(fā)展在這個維度上來比較的話,影響網(wǎng)頁設(shè)計的美學(xué)風格非常之多:國際主義(S