技術(shù)資訊
網(wǎng)頁設(shè)計(jì)如何傳達(dá)信息
2012-02-19 21:01:54
網(wǎng)頁設(shè)計(jì),有很多是和平面廣告有著共同之處,例如對設(shè)計(jì)主題的表達(dá),視覺中心的定位等等,青島網(wǎng)站設(shè)計(jì)也應(yīng)在頁面設(shè)計(jì)方面對這些因素加以注重。
網(wǎng)頁設(shè)計(jì)與平面設(shè)計(jì)究竟有啥區(qū)別,我們主觀的為頁面添加元素的時候是否有章可循,博主以前曾是一名視覺設(shè)計(jì)菜鳥(現(xiàn)在也是),以自己的切身體會談?wù)勗赪eb頁面設(shè)計(jì)中的一些體會。
在日常工作中,我們經(jīng)常會遇到一些設(shè)計(jì)的很”漂亮”的圖片不被用戶認(rèn)可,點(diǎn)擊率很低,這時候我們會暗地里抱怨,可卻沒明白問題究竟出在哪?
下面我們先看一個專題的banner:
第一眼看上去,畫面感好像還行,但細(xì)看后會發(fā)現(xiàn)整個畫面沒有一個視覺中心,這張圖片究竟想表達(dá)什么也沒有說清楚,看看上面的元素:女人,模特架,燈光,展廳,衣服。好像表達(dá)了很多,其實(shí)除了設(shè)計(jì)師本人知道這是衣服與配件專題的banner,其他人都一頭霧水。
那我們再看看同樣主題的banner:
畫面中心的”fashion apparel”告訴我們是賣時尚衣物的,圖片元素還告訴我們,這里賣衣服配飾,鞋,內(nèi)衣,泳帽等等。這個banner不僅表達(dá)了衣服與配件的主題,還直接告訴了我們種類的齊全。
通過這個例子我們會漸漸明白視覺設(shè)計(jì)的目的:視覺設(shè)計(jì)的本質(zhì)是為了更好的傳達(dá)信息。
傳達(dá)信息的表現(xiàn)形式:
那么究竟怎樣才能通過設(shè)計(jì)把需求信息出色的表達(dá)出來,這里面學(xué)問很多,我就談一談自己的理解:
1.產(chǎn)品風(fēng)格 在做設(shè)計(jì)之前,我們先要搞清楚服務(wù)的對象是誰,每個人群的認(rèn)知度不同,設(shè)計(jì)風(fēng)格也要根據(jù)人群的認(rèn)知度而調(diào)整,說簡單點(diǎn)就是要先根據(jù)目標(biāo)人群確定設(shè)計(jì)風(fēng)格。
下面我們再看看一組banner:
兩者的區(qū)別在于字體發(fā)生了變化,但傳達(dá)出的產(chǎn)品氣質(zhì)卻大相徑庭。”領(lǐng)動”是一個商務(wù)產(chǎn)品,但這個 banner的字體顯然不能表達(dá)商務(wù)人士干凈利索的做事風(fēng)格,對產(chǎn)品的信任感自然就會降低,信任感缺失,表達(dá)的文案也就沒有了任何意義。
所以,設(shè)計(jì)的風(fēng)格要去迎合訪問者的喜好。打個比方,粉色肯定不能用在軍事網(wǎng)站,紅色也不能作為醫(yī)療網(wǎng)站的主色調(diào) 。 產(chǎn)品的視覺氣質(zhì)就是一種信息的表達(dá)。
2.還原物件真實(shí)感
什么叫物件真實(shí)感?我們先看下面的圖片
上圖是iBooks的界面。美觀的內(nèi)容形式,富有真實(shí)感,利用熟悉的木質(zhì)書架UI使用戶感到在體驗(yàn)上的自然。
產(chǎn)品的界面是訪客熟悉了解產(chǎn)品的主要途徑,當(dāng)產(chǎn)品的界面接近真實(shí)世界時,用戶的學(xué)習(xí)成本越低,產(chǎn)品的易用性就會提高。再看一組太陽能主題banner:
對比兩個banner,拋開一些細(xì)節(jié)的推敲,第二張圖片傳達(dá)的信息明顯比第一張要通俗易懂,設(shè)計(jì)師不能夠主觀的代表用戶的審美認(rèn)知能力,還原物件的真實(shí)情感,呈現(xiàn)最真實(shí)的產(chǎn)品圖片,是一種很直接的信息表達(dá)方法。
3.統(tǒng)一規(guī)范
設(shè)計(jì)沒有一個硬性的評價標(biāo)準(zhǔn),正是因?yàn)檫@樣設(shè)計(jì)才會顯得精彩紛呈。但產(chǎn)品用戶界面的設(shè)計(jì)不能等同于海報(bào)招貼的設(shè)計(jì),在追求差異化和表現(xiàn)力的同時,我們要以傳達(dá)信息為主要目標(biāo),以提高產(chǎn)品的易用性為前提。
我個人覺得一個出色的設(shè)計(jì)并不是讓人眼前一亮的感覺,而是讓用戶有種進(jìn)自家房間的熟悉感和歸屬感,面對信息量大的互聯(lián)網(wǎng)頁面,視覺設(shè)計(jì)師的職責(zé)就是讓用戶以最快捷的方式找到需要的信息。
互聯(lián)網(wǎng)發(fā)展至今,大多數(shù)用戶有自己的定向思維的使用習(xí)慣,如何才能將用戶界面的設(shè)計(jì)符合用戶的喜好,就需要去符合主流的視覺規(guī)范或者制定一個視覺規(guī)范。下面看幾個視覺規(guī)范的例子:
①元素的統(tǒng)一
②布局的統(tǒng)一
上圖是www.Made-in-China.com的登錄注冊口,,這塊區(qū)域的可點(diǎn)擊區(qū)域太多,為了保證頁面的簡潔的視覺效果,Button并沒有保持統(tǒng)一,但是登陸口,注冊、找回密碼,指南都在同一區(qū)域內(nèi),這是一種行業(yè)規(guī)范的統(tǒng)一,大都數(shù)用戶都會意識到注冊入口在登陸口的附近,所以注冊口沒有做成Button而只是做了一個簡單鏈接。
總結(jié):上面的內(nèi)容都是我到焦點(diǎn)設(shè)計(jì)部這個新環(huán)境的體會與感想,這些可能是大家熟悉到忽略的知識點(diǎn),我希望這些內(nèi)容能夠幫助以后像我一樣的新同事,少點(diǎn)迷茫,樹立一個正確的設(shè)計(jì)價值觀。
近期更新
- [2023-07-26 14:17:28] 為品牌賦能,海外官網(wǎng)品牌數(shù)字化
- [2023-05-06 10:32:26] 青島網(wǎng)站建設(shè)公司,高端網(wǎng)站定制,一站式網(wǎng)站服務(wù)——力圖數(shù)字科技
- [2023-04-27 13:47:54] 高端定制網(wǎng)站建設(shè)——從滿足預(yù)期到走向卓越
- [2023-04-11 09:17:49] H5頁面設(shè)計(jì)開發(fā)——移動端傳播利器
- [2022-11-16 10:11:43] windows2012程序在哪
- [2022-04-14 11:01:47] 力圖數(shù)字科技配套網(wǎng)站服務(wù)支持
- [2021-05-18 10:14:11] 青島網(wǎng)站建設(shè)的流程
- [2021-04-29 10:14:38] 企業(yè)定制化官網(wǎng)建設(shè)項(xiàng)目
- [2021-03-05 10:34:45] 移動互聯(lián)時代房地產(chǎn)行業(yè)的微信小程序解決方案
- [2021-01-22 17:29:38] 微信小程序有哪些優(yōu)勢?為什么要開發(fā)微信小程序?
- [2021-01-08 17:28:04] 網(wǎng)站建設(shè)最容易忽略的人性化設(shè)計(jì)
- [2020-12-16 16:55:32] 建設(shè)一個常規(guī)的公司網(wǎng)站建設(shè)成本大概是多少?
延伸閱讀
- [2008-03-20 11:05:00] 網(wǎng)頁設(shè)計(jì)之論摹仿和抄襲
- [2012-12-12 21:10:43] 青島網(wǎng)站設(shè)計(jì)該向蘋果學(xué)習(xí)什么
- [2014-10-07 10:13:43] select模擬下拉
- [2013-01-26 00:37:01] 如何復(fù)制圖片中的文字
- [2011-11-05 23:02:49] 讓網(wǎng)站外鏈在你睡著的時候也能自動增加的方法
- [2008-12-18 10:48:00] 為什么網(wǎng)頁設(shè)計(jì)不應(yīng)強(qiáng)調(diào)分工2
- [2014-09-27 00:52:56] 響應(yīng)式網(wǎng)站的利與弊
- [2011-10-18 11:48:48] 一起探討百度快照回檔的五大原因
- [2013-03-01 17:03:29] 如何通過網(wǎng)頁廣告來賺錢
- [2011-10-21 15:45:22] 青島網(wǎng)站建設(shè)時如何有效確保網(wǎng)站的收錄量
- [2014-11-08 22:41:32] 網(wǎng)站頁面設(shè)計(jì)中的問題分析及建議
解決方案
輪胎行業(yè)網(wǎng)站設(shè)計(jì)解決方案 機(jī)械行業(yè)網(wǎng)站設(shè)計(jì)解決方案 房地產(chǎn)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 科技企業(yè)網(wǎng)站設(shè)計(jì)解決方案 電子家電網(wǎng)站設(shè)計(jì)解決方案 食品行業(yè)網(wǎng)站設(shè)計(jì)解決方案 集團(tuán)公司網(wǎng)站設(shè)計(jì)解決方案 企事業(yè)單位網(wǎng)站設(shè)計(jì)解決方案 外貿(mào)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 健身運(yùn)動網(wǎng)站設(shè)計(jì)解決方案 美容與化妝品網(wǎng)站設(shè)計(jì)解決方案 建筑設(shè)計(jì)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 物流行業(yè)網(wǎng)站設(shè)計(jì)解決方案
TAGS關(guān)鍵字
審美 微網(wǎng)站 robots 青島IT資訊 官網(wǎng)網(wǎng)站建設(shè) 色彩心理學(xué) 搜索引擎 集團(tuán)公司網(wǎng)站建設(shè) SEO 網(wǎng)站設(shè)計(jì)資訊 插畫 青島做網(wǎng)站多少錢 css 企業(yè)建站 海信網(wǎng)絡(luò)科技 營銷型網(wǎng)站建設(shè) 膠南網(wǎng)站建設(shè)公司 微信營銷的優(yōu)勢 青島抖音小程序開發(fā) 英文網(wǎng)站建設(shè) 蘋果系統(tǒng) 青島flash網(wǎng)站 青島輪胎網(wǎng)站設(shè)計(jì)公司 青島黃島、紅島網(wǎng)站建設(shè)公司 GOOGLE SEO優(yōu)化 網(wǎng)站制作 扁平化設(shè)計(jì) 青島好的網(wǎng)站優(yōu)化公司 建站常識