|
「成(chéng)都(dōu)網站建設」 始于網站建設顔值_終于設計質量!成(chéng)都(dōu)網站建設過(guò)程中,網頁的視覺流程設計是一個很好(hǎo)的很重要的設計部分,當人們在浏覽網站界面(miàn)的時候,視覺運動可以根據我們的設計成(chéng)一定的方向(xiàng)和順序去了解我們的網站。而一個好(hǎo)的視覺流程,對(duì)用戶有一個很好(hǎo)的視覺引導。 那麼(me)什麼(me)叫(jiào)視覺流程? 有心理學(xué)研究發(fā)現,人的視覺流動習慣,其實會在進(jìn)行觀察或閱讀時,有一種(zhǒng)自然的流動習慣,最爲普遍的就是:由左到右,由上到下,由左上沿著(zhe)弧線向(xiàng)右下方流動,在流動的過(guò)程中,這(zhè)種(zhǒng)流動線稱做視覺動線。 這(zhè)種(zhǒng)視覺動線并不是絕對(duì)、不可改變,各個元素在設計師經(jīng)過(guò)精心的編排下,能(néng)夠很自然的引導用戶的視覺注意力,就可以改變視線的流向(xiàng),使其按照設計者的意圖跟随各個元素版塊之間而浏覽,從而達到對(duì)用戶進(jìn)行視覺上的引導,重新設定視覺流程。 理想上的視覺流程,需要有方向(xiàng)性和順序感,符合人們的心理順序和邏輯順序。在網頁中,靈活而合理的運用視覺流程會提升用戶在網站上的停留時間。 那麼(me)網頁中的視覺流程是怎樣(yàng)的呢? 1.先整後(hòu)細,先大後(hòu)小,先看到大的物體再看到小的細節先看到文字“LET‘S TALK“然後(hòu)才會注意到字裡(lǐ)面(miàn)的細節裡(lǐ)面(miàn)的細節 先看到圖片裡(lǐ)的人物再看到文字,如果文字的比重較大,我們就會先看到文字,然後(hòu)才會看到圖片 2.先強色後(hòu)弱色,顔色鮮豔的比較容易吸引人的注意,比如紅色我們首先注意到的會是紅色的M,接下來才是灰色的B字,視線首先發(fā)現了由相對(duì)強烈的紅色M,然後(hòu)才會發(fā)現灰色B,這(zhè)說明我們的大腦在接收眼睛傳達信息時候,首先分析了由強烈顔色組成(chéng)部分的信息,其次才是分析弱色所傳遞的信息。 4.先近後(hòu)遠,先實後(hòu)虛,這(zhè)就是爲什麼(me)有些時候需要把背景虛化,目的就是突出前面(miàn)所要展示的内容先看到近處的人物後(hòu)看到遠處的人物,近實遠虛(學(xué)過(guò)素描的人都(dōu)知道(dào)這(zhè)一理論) 5.先動後(hòu)靜,我們視線的注意力會根據某些變化而進(jìn)行轉移剛進(jìn)網站視線先跟随動态的,然後(hòu)才看靜态的,當網站某一元素運動變化時候(有些的還(hái)通過(guò)聲音傳遞信息),我們的視線自然而然的就轉移過(guò)去了。 視覺流程的設計1.不同的色彩給人的感覺給人的感覺耶不一樣(yàng),對(duì)比強,純度高,亮度高。強色比弱色更讓人注意。 第一眼看到的是不是紅色?是不是感覺紅色在前,而灰色在向(xiàng)後(hòu)?(紅色是前進(jìn)色)這(zhè)就是視覺心理造成(chéng)的,不同的顔色會給人不同的感受,也就是暖色的、鮮豔的比冷色的、暗淡的顔色更能(néng)抓住用戶的視線。 2.指示性的圖形和圖标 成(chéng)都(dōu)網站建設當一些的圖形與符号被(bèi)我們所學(xué)習、記憶、運用并賦予它特定的指向(xiàng)性意義時,也會對(duì)我們的視覺流程進(jìn)行幹擾與引導。例如箭頭、手勢等。 3.文字或特殊符号的引導 文字也是一種(zhǒng)特殊的符号,但它并不是被(bèi)賦予了指向(xiàng)性的意義來對(duì)我們的視覺進(jìn)行引導,而是通過(guò)含義上或内容上的連貫性造成(chéng)的引導,如數字1、2、3、4或者英文的a、b、c、d、年份等。 4.動态元素或聲音進(jìn)行引導 剛進(jìn)網站就會被(bèi)這(zhè)個頁面(miàn)便會被(bèi)這(zhè)動态效果將(jiāng)視線吸引過(guò)去,随後(hòu)就是一陣流行音樂的轟炸随著(zhe)HTML5發(fā)展的越來越快,已經(jīng)逐漸取代flash 。它的出現使得網頁頁面(miàn)中的特殊效果愈發(fā)豐富 5.圖片或文字暗示性/指示性的引導我們首先看到卡通頭像/人物,其次我們會根據人物的視線方向(xiàng)看到文字及内容 網頁頁面(miàn)設計中,圖形和文字的應用關系到網頁設計的成(chéng)功。合理、出彩的圖形能(néng)瞬間抓住人們的視線。暗示性引導是通過(guò)網頁中圖形元素對(duì)用戶進(jìn)行方向(xiàng)性的暗示,使用戶的視線沿著(zhe)圖形所暗示的方向(xiàng)進(jìn)行聚焦 6.情感化設計上進(jìn)行引導 情感化不知識趣味這(zhè)麼(me)簡單,通過(guò)動效、文案、卡通形象、彩蛋等等元素進(jìn)行情感化的引導,通過(guò)某元素或事(shì)件,喚起(qǐ)用戶的情感共鳴,讓用戶去認同,從而加深用戶對(duì)網頁的歸屬感,強化對(duì)網頁所傳遞的信息的記憶。人類的情感最爲複雜,不同的人,不同的時期的情感都(dōu)會産生很大的差異。認知心理學(xué)研究認爲,人的大腦中已有的知識和知識結構對(duì)人的行爲和當前的認識活動有決定作用。暗示的産生依賴于來自網頁中的元素以及用戶自身的信息。用戶在觀看網頁的同時受到其中某些元素的暗示或者刺激,大腦開(kāi)始搜索已有的經(jīng)驗知識與其進(jìn)行對(duì)比,理解元素中的暗示性含義并對(duì)此産生反應,視線由此被(bèi)幹擾與引導。每個人頭腦中的知識由于其所處環境都(dōu)不會完全相同,所以暗示性的視覺引導在選擇暗示性圖像時要考慮到人與人之間的知識與文化差異,盡量選擇簡單明了,大衆化的暗示性圖像。 視覺流程在網頁中的運用方法將(jiāng)視覺流程合理的用于設計,從選取視覺中心、吸引用戶的注意力開(kāi)始,到視覺流向(xiàng)的誘導,頁面(miàn)布局的規劃,再到最後(hòu)印象的留存爲止,這(zhè)就是網頁視覺流程設計。運用方法 1,思考網頁大概框架 2.對(duì)網站頁面(miàn)布局的進(jìn)行規劃和調整 3,吸引用戶的注意力,視覺上的誘導 4.成(chéng)功傳達信息給用戶 5,用戶對(duì)網站的印象存留 成(chéng)都(dōu)網站建設可以說把握好(hǎo)視覺流程,那麼(me)在網站建設中將(jiāng)會起(qǐ)到事(shì)半功倍的作用,視覺流程設計會爲你的網站留住客戶,更是提高轉化率的一大利器。 |