視覺流程及版式類型

1、在視覺心理學(xué)家的研究中，視覺運動規(guī)律是其成果之一。一條垂直線在頁面上，會引導(dǎo)視線 作上下的視覺流動； 水平線會引導(dǎo)視線向左右的視覺流動；斜線比垂直線、水平線有更強的視覺訴求力；矩形的視線流動是向四方發(fā)射的；圓形的視線流動是輻射狀的；三角形則隨著頂角之方向使視線產(chǎn)生流動；各種圖形從大到小漸層排列時，視線會強烈地按照排列方向流動。視覺流程，是視線在觀賞物上的移動過程，是二維或三維空間中的運動。這種視覺的流動線極為重要，同時又是很容易被網(wǎng)頁設(shè)計者忽視的因素。經(jīng)驗豐富的設(shè)計者都對此非常重視， 他們善于運用這條貫穿頁面的主線，設(shè)計易于瀏覽的頁面。 從某個角度講，視覺流程的設(shè)計結(jié)果就是版式。本章也將對網(wǎng)頁

2、設(shè)計的版式設(shè)計進(jìn)行總結(jié)和闡述。1.視覺流程的籌劃視覺流程是網(wǎng)頁版式設(shè)計的重要內(nèi)容，可以說，視覺流程運用的好壞，是設(shè)計者技巧成熟與否的表現(xiàn)。視覺流程的籌劃包括幾個重要的因素，下面就對它們作具體的歸納與分析。頁面中不同的視域，注目程度不同，給人心理上的感受也不同。一般而言，上部給人輕快、 漂浮、積極、高昂之感；下部給人壓抑、沉重、限制、穩(wěn)定的印象；左側(cè)，感覺輕便、自由、 舒展，富于活力；右側(cè)，感覺局促卻顯得莊重。網(wǎng)頁中最重要的信息，應(yīng)安排在注目率最高 的頁面位置，這個位置便是頁面的最佳視域。Uottf li誦MW GOhrilMIV(S 電曾 Wva iH-* r41叭*MilTry Acroba

3、t 7.0 Professional 一 free for 30 days!13* fr H獻(xiàn)I Kpir-t i W-fll-. iff rM, nJ-wiJh qF-bl 尸Di.如 .0細(xì)i vdLUbwi md 】a 忙tSTEFriH paaaEarfe.巾 * 盧山Imh ItaM HO (W anr JtfcWH hvr： nftwiwiJ! f- 4# aiiiw -Ml ffW *rip w th*bpH-i . 1-*0* +JHhIm-aI Jr1 沖襯*!0 liaeteJi wmarw圖1頁面的設(shè)計輕松而具均衡的形式感，把最佳視域留給了橫貫頁面的大banner圖2作為

4、個性化的視覺元素，拼貼剪紙式的文字分別占據(jù)了三個點，吸引視線在它們之間流動人們閱讀材料時習(xí)慣按照從左到右，從上到下的順序進(jìn)行。 瀏覽者的眼睛首先看到的是頁面的左上角，然后逐漸往下看。根據(jù)這一習(xí)慣，設(shè)計時可以把重要信息放在頁面的左上角或頁 面頂部，如公司的標(biāo)志、最新消息等，然后按重要性依次放置其他內(nèi)容。重要的信息應(yīng)該讓瀏覽者最容易發(fā)現(xiàn)，而不是深藏在多層鏈接之后。Demand the Best.Demand zWIre.圖3瀏覽者的眼睛首先看到的是頁面的左上角2視覺流程類型視覺流程主要包括以下幾種類型：線型視覺流程、曲線視覺流程、焦點視覺流程、反復(fù)視覺流程、導(dǎo)向視覺流程、散點視覺流程等。2.1線型

5、視覺流程線型視覺流程，分為直線視覺流程和曲線視覺流程兩類。杠v*和-AllIMWiUMlHf A C onQjt圖4視覺流程明確，形成清晰易讀的頁面設(shè)計圖5自由的視覺流程形成生動活潑的頁面設(shè)計1、直線視覺流程有簡潔而強烈的視覺效果。直線視覺流程使頁面的流動線更為簡明， 直接地訴求主題內(nèi)容, 表現(xiàn)為三種形式：豎向視覺流程：給人堅定、直觀的感覺。圖6明確、簡潔的豎向視覺流程橫向視覺流程：有穩(wěn)定、恬靜之感。圖7橫向的視覺流程，向人們傳達(dá)出穩(wěn)重、可信的視覺rPrMrti.iiiijinrl r uivuiiuliirii tfrtirn napirifPrint 1L crriwiMwr fwrwr.

6、Futosl-ath 4 Photo P卄ntsiuclio *w. * f |wi- ” n iruiirtr# Mri* 1 fr* 1w-Md r !?1也2 Min 7 hhv* Wld I tanrUfhiO Z圖8橫向的視覺流程，使頁面穩(wěn)重直觀斜向視覺流程：以不穩(wěn)定的動勢引起注意。22曲線視覺流程曲線視覺流程，是由視覺要素隨弧線或回旋線運動而形成的。它不如直線視覺流程直接簡明,但更具流暢的美感。曲線視覺流程的形式微妙而復(fù)雜，可概括為兩種形式：弧線形（c形）視覺流程：有擴張感和方向感。二楓 drilb d Hl日上 | U 舊E W Hi池 | 喘j 卜 ME hiuH 卜 F 壬

7、| fihJi 11 jJK_P.it I Lifl.tfl|曲| AQ I 口血垃蝕 | Wik 利型 | 亡血宙衲出! |圖10弧線形視覺流程，使頁面具有很強的擴張性 回旋形（s形）視覺流程：兩個相反的弧線則產(chǎn)生矛盾回旋，在平面中增加深度和動感。圖11回旋形視覺流程，使頁面產(chǎn)生更多層次，空間感（四）2.3焦點視覺流程焦點，是指視覺心理的焦點。每個頁面中都有一個視覺焦點，這是需要重點處理的對象。焦點是否突出，和頁面版式編排、圖文的位置、色彩的運用有關(guān)，同時也與對焦點”著力描寫有關(guān)。在視覺心理作用下，焦點視覺流程的運用使主題更為鮮明、強烈。在具體的處理上，一般沿著視覺焦點的傾向與力度， 來發(fā)展視線的進(jìn)程。通常以鮮明的形象 或文字占據(jù)頁面某個位置， 或完全充斥整版，集合瀏覽者的視線，完成視覺心理上的焦點建 造。另外，向心、離心的視覺運動，也是焦點視覺流程的運用形式。按照主從關(guān)系的順序，使放大的主題形象成為視覺焦點，以此來表達(dá)主題思想。*4 I iWLbwb圖12運用圖片大小的對比引起視覺的流動將文案作整體編排，突出主題形象。圖13對主題圖片的遮擋，引發(fā)瀏覽者一探究竟的興趣在主題形象四