在整個(gè)產(chǎn)品設(shè)計(jì)的過(guò)程中,視覺(jué)設(shè)計(jì)與交互設(shè)計(jì)的“工序”非常緊密,兩者關(guān)系也是相輔相成,互相影響。而視覺(jué)界面作為最直接與用戶交流的層面,如何把交互設(shè)計(jì)以良好表現(xiàn)形態(tài)展現(xiàn)給用戶,這里主要集中探討視覺(jué)在提升交互的可用性方面的作用:
提升可瀏覽性
精確與高效地傳遞信息與任務(wù)
貼合用戶的心智模型
讓交互富有情感
1.提升可瀏覽性:
1)信息結(jié)構(gòu)的良好表現(xiàn)
視覺(jué)設(shè)計(jì)在對(duì)交互的幫助中,首要滿足對(duì)產(chǎn)品與交互信息結(jié)構(gòu)的展現(xiàn),展現(xiàn)信息的清晰可讀性,然后才是品牌,情感的傳達(dá)。視覺(jué)語(yǔ)言可以通過(guò)分層,分類,對(duì)比等語(yǔ)言手段對(duì)產(chǎn)品概念及信息進(jìn)行處理。
同樣都是文章詳情頁(yè)面,相信沒(méi)有多少用戶在瀏覽pic01時(shí)能快速準(zhǔn)確地知道網(wǎng)站想給他什么信息,或者讓用戶做什么。信息主次的分布,層級(jí),色彩,均無(wú)做好有效分布,用戶一邊迷惑,一邊迷路。而pic02對(duì)內(nèi)容按主次程度來(lái)劃分,最重要的文章詳情信息一目了然,結(jié)構(gòu)有序,條理清晰。
我們能感受到視覺(jué)語(yǔ)言的有效干預(yù),能對(duì)信息結(jié)構(gòu)的展現(xiàn)起到很大的幫助作用
2)增強(qiáng)信噪比
信噪比(Signal to Noise Ratio)又稱為訊噪比,原義是電聲學(xué)里輸出信號(hào)的電壓與同時(shí)輸出的噪聲電壓的比。
一般來(lái)說(shuō),信噪比越大,說(shuō)明混在信號(hào)里的噪聲越小,否則相反。類比到界面設(shè)計(jì)中,有效的視覺(jué)元素就是信號(hào),而其他干擾元素,就是噪音。
界面的噪音是由多余的干擾信息造成的,會(huì)分散用戶注意力,使用戶不能把注意力集中到直接表達(dá)產(chǎn)品功能和行為的元素上,導(dǎo)致給用戶帶來(lái)認(rèn)知壓力和妨礙導(dǎo)航的速度和精確度。不合適的字體,表義不明確的ICON,不必要的裝飾等等,都是界面噪音。在視覺(jué)設(shè)計(jì)中如果保持最高的信噪比來(lái)展現(xiàn)信息,能增強(qiáng)界面的可瀏覽性。換句話說(shuō),如果去掉這些次要的或者干擾的設(shè)計(jì)元素,并沒(méi)有使功能有所影響,那強(qiáng)烈建議縮小這些元素的應(yīng)用比例,或者直接去掉!
原本需要表述的幾個(gè)柱狀數(shù)據(jù)信息,結(jié)果被埋藏在一堆花哨,文字信息堆雜的背景中,典型的信噪比過(guò)低。
2.精確與高效地傳遞信息與任務(wù)
良好的視覺(jué)設(shè)計(jì),能增強(qiáng)信息條理的清晰度。這里的清晰度有兩方面的含義:清晰的視覺(jué)引導(dǎo),和視覺(jué)引導(dǎo)元素本身的精確性。
1)信息引導(dǎo)
良好的視覺(jué)設(shè)計(jì)能用色彩和層次等語(yǔ)言,自然而又清晰的羅列出一條視覺(jué)的“路線”,引導(dǎo)用戶流暢的閱讀,而不用自己費(fèi)力的去疏通條理,或者在密密麻麻信息的忙海中尋找未知的方向。這條指引的路線,我們稱他為“視覺(jué)流”。
表單中視覺(jué)流的形成
表單是個(gè)關(guān)鍵有效信息集中,需要讓用戶集中注意力完成操作以提交數(shù)據(jù)的地方。各種類型的數(shù)據(jù),控件,信息的展現(xiàn)方式都會(huì)堆積一起,常給瀏覽和填寫帶來(lái)干擾和不順暢感。
通過(guò)讓多種信息分類,統(tǒng)一規(guī)范處理后的效果有沒(méi)有好一點(diǎn)呢?(pic.04)
所有的lab標(biāo)簽與input輸入框居中軸線對(duì)齊,一個(gè)表單中,有且只有一條中軸線——這是視覺(jué)引導(dǎo)的關(guān)鍵。讓用戶需要查看的信息與填寫的內(nèi)容整齊劃一地羅列下來(lái)。視覺(jué)引導(dǎo)的形成很好的幫助了用戶在填寫過(guò)程中的順暢感
2)準(zhǔn)確直觀的信息符號(hào)
有了清晰的視覺(jué)引導(dǎo)還不夠,這些視覺(jué)引導(dǎo)元素本身需要遵循一定規(guī)范,和富有準(zhǔn)確的語(yǔ)義,才能起到有效引導(dǎo)的作用。
精確規(guī)范的視覺(jué)元素的運(yùn)用,使得pic.05的閱讀瀏覽清晰,流暢,加強(qiáng)了網(wǎng)頁(yè)的可掃描性。綠色的標(biāo)題設(shè)計(jì)使用戶很輕易得在板塊間快速跳轉(zhuǎn),并且結(jié)合使用了文案,以問(wèn)題標(biāo)題的形式,讓用戶迅速的知曉板塊的內(nèi)容和有無(wú)必要再進(jìn)行下去。
而B(niǎo)ar沒(méi)有語(yǔ)義定義及運(yùn)用規(guī)則的pic.06,則在瀏覽閱讀中給用戶造成了不必要的干擾和混亂感。并沒(méi)有起到引導(dǎo)的作用
3.貼合用戶的心智模型:
將現(xiàn)實(shí)生活中的影子,借鑒模擬到產(chǎn)品設(shè)計(jì)中來(lái),是交互設(shè)計(jì)中常用的方法,而視覺(jué)設(shè)計(jì),也能在這方面更好的起到貼近用戶感受的作用。增強(qiáng)用戶的認(rèn)知熟悉度,和適應(yīng)性,能讓用戶感受到無(wú)縫而舒服的用戶體驗(yàn)。
1)尊重用戶體驗(yàn)
窗口關(guān)閉、放大、縮小按鈕,是常被拿來(lái)當(dāng)?shù)湫偷囊粋€(gè)例子。明顯的,是將現(xiàn)實(shí)生活中的紅綠信號(hào)燈演的,延續(xù)到了這里。由于在現(xiàn)實(shí)生活中,紅色被用來(lái)代表警示,警告,危險(xiǎn)等語(yǔ)義,用戶已經(jīng)潛移默化的被影響。當(dāng)看到紅色按鈕時(shí),不需仔細(xì)思考,潛意識(shí)會(huì)小心謹(jǐn)慎點(diǎn)擊該按鈕,以免帶來(lái)不好的結(jié)果。
2)體現(xiàn)交互的統(tǒng)一性
蘋果公司在PC,MP3,TOUCH,IPHONE等平臺(tái)界面上,都沿用了相同的視覺(jué)風(fēng)格設(shè)計(jì),并且每個(gè)不同產(chǎn)品本身的工業(yè)設(shè)計(jì),也近乎一致,讓用戶在“切換”每個(gè)不同產(chǎn)品時(shí),又能找到產(chǎn)品身上相當(dāng)多的共同語(yǔ)言。
4.讓交互富有情感:
如果說(shuō)交互是產(chǎn)品的骨骼,視覺(jué)就是他美麗的外衣,讓產(chǎn)品看起來(lái)有血有肉有性格。也使得產(chǎn)品能和 用戶產(chǎn)生情感上的交流互動(dòng)。而抓住目標(biāo)用戶的情感場(chǎng)景而做出的視覺(jué)表現(xiàn),能有效觸動(dòng)和推進(jìn)產(chǎn)品和用戶間的交流更順暢。熟悉,親切,喜愛(ài)甚至貼心的情感,都由此而建立起來(lái)了。
1)符合目標(biāo)用戶的場(chǎng)景
淘寶網(wǎng)搜索頁(yè)面無(wú)結(jié)果時(shí),改良后代設(shè)計(jì),用很配合用戶心情,甚至更夸張、可愛(ài)的旺旺可憐鬼圖案來(lái)表達(dá)。讓產(chǎn)品主動(dòng)站到了用戶這一邊,使用戶覺(jué)得,你是理解我,體諒我的,而不是冷冰冰很官方的,化解了用戶本來(lái)會(huì)產(chǎn)生的不爽情緒。
我們由以上,大體看到了視覺(jué)會(huì)從哪幾個(gè)方面對(duì)交互和產(chǎn)品產(chǎn)生積極的影響。那么,是不是說(shuō)只要交互無(wú)法完成的使命,需要填補(bǔ)的空缺,有視覺(jué)來(lái)完善,最后都會(huì)OK呢?視覺(jué)是不是萬(wàn)能的包裝殺手呢?
答案使否定的!視覺(jué)設(shè)計(jì)不是神話。
我們要知道,一個(gè)產(chǎn)品的完成是由“創(chuàng)意+行為+外觀”這幾個(gè)主要的關(guān)鍵步驟來(lái)完成的,反映到產(chǎn)品設(shè)計(jì)里面,就是產(chǎn)品的創(chuàng)意概念,交互設(shè)計(jì),和視覺(jué)設(shè)計(jì)。
每個(gè)步驟都是至關(guān)重要,并且有著先后順序的。就像一個(gè)流水線作業(yè),前一道工序完成與否與質(zhì)量好壞,影響著后續(xù)工序的進(jìn)行。也就是說(shuō),在產(chǎn)品設(shè)計(jì)里面,如果遇到失敗的產(chǎn)品創(chuàng)意,或者糟糕的交互設(shè)計(jì),即使賦予再優(yōu)秀的視覺(jué)設(shè)計(jì),最終也是個(gè)失敗的產(chǎn)品,視覺(jué)設(shè)計(jì)不能改變產(chǎn)品的命運(yùn)。而在失敗的產(chǎn)品創(chuàng)意與糟糕的交互設(shè)計(jì)之上進(jìn)行的視覺(jué)設(shè)計(jì),被稱為“尸體彩繪”。
我們要努力讓視覺(jué)設(shè)計(jì)大程度的發(fā)揮能動(dòng)作用,并且我們也要努力不能讓一個(gè)產(chǎn)品中,只有視覺(jué)設(shè)計(jì)。
本文來(lái)源于成都網(wǎng)站建設(shè)公司與成都網(wǎng)站設(shè)計(jì)制作公司-創(chuàng)新互聯(lián)成都公司!
分享文章:論視覺(jué)設(shè)計(jì)與交互設(shè)計(jì)
分享網(wǎng)址:http://m.rwnh.cn/news32/309632.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供關(guān)鍵詞優(yōu)化、靜態(tài)網(wǎng)站、網(wǎng)頁(yè)設(shè)計(jì)公司、品牌網(wǎng)站建設(shè)、網(wǎng)站營(yíng)銷、外貿(mào)建站
廣告
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源:
創(chuàng)新互聯(lián)