平面設計和網頁設計的區別

标签: 觀點思考 區別 差異 平面設計 網頁設計 | 发表时间:2012-07-05 11:30 | 作者:boxui
出处:http://www.mydesy.com

最近剛好在招UI設計師職位,發現很多設計師(特別是剛畢業不久的)都分不清UI設計(甚至是網頁設計)和平面設計的區別,現轉載短文一篇,藉以分析一下同樣作為視覺傳達設計,它們之間的差異性及通性。

1.視覺元素

在色彩方面平面設計與網頁設計使用的色彩模式完全不同,平面設計因為後期的實現依賴於印刷,所以採用CMYK的色彩模式,而網頁根據其顯像方式使用RGB 的色彩模式。平面設計時的色彩運用注重視覺的衝擊力及視覺流的引導(在這點上與網頁設計中的BANNER設計相類似),而網頁設計(產品類)更注重的是信息結構關係的梳理,如果將色彩運用的過多過強,很容易引起視覺的疲勞感。

我們平時在設計過程中,平面設計的字體選用更為自由一些,不用擔心後期實現的問題,所有的文字最後都會輸出為圖形進行印刷,而網頁設計就需要考慮的更為全面,並且在字體的選用範圍上也很小,為了讓輸出的成品大小不對服務器造成壓力,基於html的特性,所有字體都是根據用戶操作系統內默認字體而定的,當然近年隨著技術的沿革與發展,這個差距也逐步在縮小,目前通過html5的API可以實現個性化字體的使用而不需要將個性化的字體最終輸出為圖形,在不增加後端壓力的同時,大大提升了用戶體驗,非常贊。

從圖形使用上,平面設計比網頁設計豐富,表現方式也多樣化,特別是對於產品類的網頁設計,模塊化的設計思路更為明顯,在視覺表現上也是如此,平面對於圖形的表現是不需要考慮到後期的實現的,在一點上是有目共睹的。在來說一下咱們設計時使用的尺寸單位問題,平面設計在使用尺寸標註時都用的是物理尺寸的概念, 比如英寸,厘米,毫米等,而網頁使用的像素。

2.呈現方式

3.信息載體

 

4.瀏覽方式

平面設計的屬於漸進式的瀏覽方式,無法對整個瀏覽的過程進行多樣化串聯,網頁設計擁有滾動條下拉、按鈕鏈接跳轉等多樣化的瀏覽信息方式,在擁有同樣一種信息架構的條件下,信息之間的串聯性更為豐富,用戶選擇信息的自由度更大,但平面設計也自然有其優勢所在,比如平時我在設計照片書這類產品的時候,就很明顯的發現,這一類的產品在電腦顯示器上進行翻閱,不如印刷成為一個真實的書本來翻閱感受要更好一些,並且更具有收藏及紀念意義。

5.信息傳播

平面設計屬於比較傳統的信息媒介設計,一般會通過張貼、銷售、郵寄派送等形式進行傳播,這樣傳播的方式範圍小且成本較高,相對而言在這方面網頁設計的信息傳播能力卻非常的強,但依賴於第三方媒介的支持,平面設計卻擁有更為廣泛的受眾人群,不同的年齡層對於紙張或書本的信息接受能力總是強於網絡媒體的,畢竟網絡信息獲取的將會存在一個學習成本,在今後網絡信息的不斷普及以及終端媒介用戶體驗的不斷提升,在受眾人群方面在我看來差距會越來越小。

這兩種設計形式擁有著不同的用戶體驗,我們應該根據不同設計內容,選擇正確的設計形式提升用戶體驗,以上這些只是個人對平面與網頁設計的一些粗淺認識,也作為拋磚引玉希望大家能分享出自己對於設計的想法。

文章出處: 盒子UI

不能錯過的的創意:

Open Web Design – 下載免費的網頁設計模板! (@freegroup)

Pattern Tap – 免費網頁設計素材庫,常用資源一應俱全 (@freegroup)

-網站企劃- 網頁版面設計

30個以大背景圖為主題的網頁設計作品欣賞

25個暗色系的網頁設計作品欣賞
无觅


相关 [平面] 推荐:

诺顿赛门铁克平面广告

- Kaero - PADMAG视觉杂志
文案:TheMomentSheSaidYes.jpg(她说YES的瞬间.jpg). 底部小字:It’s more than just data. LOGO旁边的口号:Protecting the Stuff that matters. 简洁到极致,文案取胜,创意来自芝加哥李奥贝纳Leo Burnett.

FLOORPLANNER—家居平面设计的网上天堂

- 肉 - 怪点子
Floorplanner 是一款操作简单的创作与分享相结合的家居平面设计的在线程序;. Floorplanner 后台编辑采用Flash技术架构, 你可以通过他们提供的个性服务,随心所欲的为自己的小屋做各式各样的布局设计;同时, Floorplanner还融入了少许的社会性元素,你可以保存自己的设计并分享给你的家人以及好友等.

苹果正在开发新型平面无键键盘

- Henry Lee - 36氪
概念图:marat kudryavtsev. 苹果正在为iMac和其他设备设计一种虚拟键盘,这种键盘没有按键,采用的是压电声学和电容检测系统. 其中的方案之一是一个玻璃键盘,听上去挺酷. 据苹果专利跟踪网站Patentlyapple称,在美国专利商标局公布的一份专利中,苹果列举了这项发明要解决的问题:比起传统机械键盘,触觉感知表面及相关设备在识别按压指令方面稍逊风骚,有时需要按压好几次指令才能生效.

搞笑的平面设计之亮点王

- Zen - 设计|生活|发现新鲜
前阵子网络掀起各种找亮点的风潮,这股风现在吹到GQ杂志社啦. 常规的时尚杂志拍摄大片肯定是找一批迷死人不偿命的俊男美女,担当各种男女猪脚,摆着各种你羡慕嫉妒恨的pose. GQ杂志这次采用另一种搞笑的点子,他们找来Ken Jeong,介家伙是谁小编还真不知,总之他很幸运. 大片中Ken Jeong在激情缠绵的情侣旁摆着各种夸张搞笑的pose,着实成为真正的猪脚,真正的亮点王.

40个极具幽默的平面广告

- 混沌 - 互联网的那点事
在广告设计中,除了设计有技术含量的光影叠加外,还有很多其他性质的设计创意. 今天我们就来说说幽默,记得朋友说过,很多时候男童鞋吸引女童鞋的别不是帅气神马的. 因为在有幽默感的人身边总是快乐的,总是感觉不到时间的流逝. 所以幽默算是人性中最重要的元素之一. 当然,在平面设计里我们也可以用这样的幽默,有趣而调侃的设计元素融入到产品中来急速催化出你无法想象的效应.

海平面上下不同的迷人風情 – 分割攝影

- 萌叔 - KAIAK.TW | 城市美學的新態度
準備好你的海灘行頭,打包好行李,拿著防水相機,讓我們找一處水質清澈的海水來拍攝這樣的美麗照片吧. 這種被稱為〝以上/以下〞或是〝分割攝影〞的攝影技巧可以讓人同時看到水(海)平面上下不同的景觀. 將鏡頭(通常是魚眼鏡頭)置於中線進行拍攝,有興趣的人不妨可以嘗試看看這種美麗又饒有趣味的攝影喔.

Light Touch:将任一平面瞬间转换成触摸屏

- Deejan - cnBeta.COM
Light Touch是一个互动式的投影,可以瞬间将任何平面转换成触摸屏. 它将多媒体内容从小屏幕中解放出来,利用触控技术,允许用户使用他们的手持设备和这些内容进行互动.

Light Touch把任意平面变成一个触控屏

- Coolxll - 36氪
最近,各地出现了一些餐厅和咖啡馆,在这里可以使用iPad进行点单操作,大家是不是觉得很潮. 现在,我们可以直接在桌面上玩了. 利用Light Blue Optics公司的Light Touch技术,用户可以在任何平面上进行触摸操作,触控无处不在. 这项技术于2010年在CES上首次发布. Light Touch是一种小型交互投影设备,它利用激光投影原理可以随时将任意平面虚拟为一块10英寸触摸屏,再使用红外线感应技术来获取用户操控动作.