2024-02-11 分類: 網(wǎng)站建設(shè)
本篇交互設(shè)計(jì)教程探討了WEB交互設(shè)計(jì)中的視覺(jué)結(jié)構(gòu)如何設(shè)計(jì),希望閱讀本篇文章以后大家有所收獲,幫助大家對(duì)交互設(shè)計(jì)的理解更加深入。
網(wǎng)站的交互設(shè)計(jì)分2種:流程交互和界面交互(即”單頁(yè)面交互”或“小交互”),而界面交互又包含2類:“視覺(jué)結(jié)構(gòu)”和“動(dòng)態(tài)模塊”。
何謂動(dòng)態(tài)模塊?簡(jiǎn)單的說(shuō)就是“AJAX”,它有幾種視覺(jué)呈現(xiàn)方式:彈出的浮動(dòng)層、Tab切換、展開(kāi) (側(cè)邊展開(kāi)或下拉展開(kāi))
何謂視覺(jué)結(jié)構(gòu)?
界面信息按邏輯關(guān)系、包含關(guān)系和先后順序,進(jìn)行排列、組織后形成的模塊,即為視覺(jué)結(jié)構(gòu)。
這個(gè)界面結(jié)構(gòu)可以很大,也可以很小。拿Igoogle的三欄式來(lái)舉例,其視覺(jué)結(jié)構(gòu)是這樣的:
再如Blog的視覺(jué)結(jié)構(gòu)
這些大的界面視覺(jué)結(jié)構(gòu)都是由一個(gè)個(gè)小的模塊結(jié)構(gòu)組成(如下圖):
視覺(jué)結(jié)構(gòu)的對(duì)比:
以上是2款網(wǎng)頁(yè)游戲中關(guān)于“農(nóng)田升級(jí)”時(shí)的不同表現(xiàn)方式,哪一種視覺(jué)結(jié)構(gòu)更易讓用戶接收信息并操作?
導(dǎo)致視覺(jué)結(jié)構(gòu)混亂的因素有哪些?
1. 最常見(jiàn)的情況是公司無(wú)交互設(shè)計(jì)師,產(chǎn)品信息未經(jīng)過(guò)梳理就傳達(dá)給UI設(shè)計(jì)師了,最后產(chǎn)出了一個(gè)可用性比較差的產(chǎn)品。 互聯(lián)網(wǎng)的一些事
我們常常看到:PM把設(shè)計(jì)訴求提供給UI,UI也按部就班的完全執(zhí)行,可出來(lái)的東西就是感覺(jué)有問(wèn)題,但也說(shuō)不出到底為什么,于是一版接一版不停的改,最后……這個(gè)沉重的負(fù)擔(dān)壓得UI直不起腰來(lái),這不公平。
此時(shí)UI設(shè)計(jì)師或產(chǎn)品經(jīng)理要大膽的站出來(lái):“我們需要交互設(shè)計(jì)師來(lái)幫我們梳理信息!”
當(dāng)然,交互設(shè)計(jì)師也要積極主動(dòng)回應(yīng)一下。
2.還有一種情況:由于視覺(jué)設(shè)計(jì)本身是一種比較主觀的創(chuàng)作性工作,那些已經(jīng)被制定好的視覺(jué)結(jié)構(gòu)常常因設(shè)計(jì)師的“審美需要”而被剝離、切割。UI設(shè)計(jì)師也常常為滿足個(gè)人表現(xiàn)欲,加入許多不必要的線條和修飾……諸如此類,很多產(chǎn)品上線后的可用性可想而知。
這種情況下,交互設(shè)計(jì)師(或產(chǎn)品經(jīng)理)的個(gè)人魅力和溝通能力尤為重要,既不能打擊UI設(shè)計(jì)師的積極性,又要確保UI設(shè)計(jì)師利用其專業(yè)知識(shí)在視覺(jué)結(jié)構(gòu)內(nèi)進(jìn)行充分發(fā)揮,這是一種藝術(shù)。
視覺(jué)結(jié)構(gòu)對(duì)于信息架構(gòu)的作用:
因?yàn)橐曈X(jué)結(jié)構(gòu)中承載著信息,所以在某種程度上它也起到詮釋、部分驗(yàn)證信息架構(gòu)是否合理的作用。
攻守平衡的關(guān)隘: 互聯(lián)網(wǎng)的一些事
視覺(jué)結(jié)構(gòu),上可攻信息架構(gòu),下可守界面設(shè)計(jì)。一個(gè)交互設(shè)計(jì)師對(duì)信息的理解有多深?看看他原型中的視覺(jué)結(jié)構(gòu)就知道了。 互聯(lián)網(wǎng)的一些事
當(dāng)前標(biāo)題:WEB交互設(shè)計(jì)中的視覺(jué)結(jié)構(gòu)如何設(shè)計(jì)
URL分享:http://jinyejixie.com/news34/317134.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供手機(jī)網(wǎng)站建設(shè)、虛擬主機(jī)、品牌網(wǎng)站建設(shè)、網(wǎng)站策劃、軟件開(kāi)發(fā)、網(wǎng)站導(dǎ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)
猜你還喜歡下面的內(nèi)容