從《LA LA LAND》中能學到這么多構圖新姿勢!

      作者:眾安ZED-candy
      分類: 觀點/經驗
      2017-03-17
      6941

      構圖就像是整個畫面的骨骼,設計者要賦予作品怎樣的構成秩序,就要采取怎樣的骨骼形式,以達到更高層次的有秩序的變化。作為視覺設計師,用設計語言來解構畫面是我們必須具備的基本素養。同時,在移動端這樣較小的屏幕上有效展示并引導信息指向,又在考驗著設計師的能力。我們以往看到的構圖文章,大部分老生常談九宮格和三分法構圖,但一個頁面滿足了九宮格和三分法的構圖就一定是優秀的作品嗎?下面是傳統的九宮格和三分法構圖:現在,讓我們跟著奧斯卡最佳攝影《愛樂之城》的鏡頭來看看構圖的另一面。畫面的構成可以分成兩個方面來說,一個是畫面的造型構成

      構圖就像是整個畫面的骨骼,設計者要賦予作品怎樣的構成秩序,就要采取怎樣的骨骼形式,以達到更高層次的有秩序的變化。作為視覺設計師,用設計語言來解構畫面是我們必須具備的基本素養。同時,在移動端這樣較小的屏幕上有效展示并引導信息指向,又在考驗著設計師的能力。

      我們以往看到的構圖文章,大部分老生常談九宮格和三分法構圖,但一個頁面滿足了九宮格和三分法的構圖就一定是優秀的作品嗎?

      下面是傳統的九宮格和三分法構圖:

      1.jpg

      現在,讓我們跟著奧斯卡最佳攝影《愛樂之城》的鏡頭來看看構圖的另一面。

      2.jpeg

      畫面的構成可以分成兩個方面來說,一個是畫面的造型構成,另一個是畫面的黑白灰結構。就像唱歌一樣,用高中低音的不同穿插來豐富主體。

      一、構圖中平衡的把握

      當我們看到圖片時,均衡感相當重要,任何一個均衡的構圖都和造型,方向,位置等因素相關,不均衡的圖片會給觀眾挫敗感。

      3.png

      下面是優酷的一張插圖,整個畫面平衡而有力,怎樣畫面可以做到錯落有序,多而不亂呢。

      4.png

      畫面中各元素之間有著磁場一般的力,他們相互作用抗衡,主物體較多的構圖較難,但分析后仍能找到規律:

      1. 造型平衡

      a. 越接近中心,力越強

      這就像是杠桿原理,越遠離中心,份量越重。頁面上偏離中心的的形小卻仍能壓得住畫面。

      5.jpg

      b. 垂直方向次之,四個點為中心的四分之一。

      c. 上重下輕。

      這是根據我們眼睛的視覺習慣形成的規律。構圖時,我們多會增強下半部分的份量感,來尋求平衡。

      6.jpg

      這是眾安保險女神節曬照片的活動頭圖,也遵循了上下構圖中,上輕下重的原則。

      7.jpg

      d. 右重左輕

      這是人類左右手習慣造成,所以我們在構圖的時候會讓左邊更重一點。當然對于左撇子來說,就是左重右輕。

      下面是眾安保險春節紅包H5頁面,除中間主體物外,左邊的物體明顯比右邊要重,使整個畫面和諧舒適。

      8.jpg

      2. 色彩平衡

      色彩在平衡畫面構圖中也起到了重要的作用。

      9.png

      a. 我們會發現離用戶越遠,重度越重。

      這是兩張國外設計師作品,相同色彩并且面積相差不大的形,在越遠處重量越重。

      10.jpg

      b. 鮮艷顏色重于灰暗色,白色重于黑色。

      在視覺稿上鮮艷的顏色更跳更容易抓住用戶眼光,也更重。

      下面的插畫中明顯鮮艷的顏色要比周圍暗色更重更跳躍。

      11.png

      c. 有趣的吸引人的形,也會重量大。

      這也是我們做視覺稿時所說的小巧思。

      12.jpg

      d. 孤立也會形成重量。

      下面插圖中單獨人物和一群人物兩邊對立,仍然能保持畫面的平衡,這就是孤立的力量。

      13.jpg

      畫面的傳達不是靜止的,而是流動的。比如構圖也在傳達情緒。

      二、構圖也能表現需求

      構圖本身有著強烈的表達能力,對用戶也有著強烈的感染能力,正因為如此,構圖是有感情的,不同的感情也在傳達不同的需求。

      1. 九宮格的點表達不同的需求

      天空面積較大,傳達著積極向上的情緒。

      14.jpg

      15.jpg

      地平面上主體物的面積多,給人壓抑的情感氛圍。

      16.jpg

      17.jpg

      畫面中主體物面積大,代表主體物更強勢,更有自信,更易被接受。--

      18.jpg

      19.png

      2.  畫面方向的表達

      畫面方向是主體物產生的向某方向的力,比如人往前走,往后跌倒,眼光視線,或者樹枝的延伸。

      人們在閱讀畫面時視覺點會形成從左上角主要視覺區到右下角末端停留區,這是閱讀的引力。強迫眼球反向移動會破壞觀看節奏,這一點也在眼動儀中得到證實。

      20.jpg

      一個頁面表達同一時間或故事順序時,我們需要遵守這樣的從左到右的規律。但對于阿拉伯人,這順序是相反的。

      uisdc-lld2017031327-768x511.jpg

      下面是眾安保險的一張專題banner,從標題到主體物的過渡,表現從主到次的順序。

      uisdc-lld2017031328-768x179.jpg

      從左到右也表達了積極,順境,樂觀的情緒。在舞臺劇中我們也會發現人物都是從左邊上場。

      uisdc-lld2017031329-768x510.png

      下面是美團和眾安保險的視覺稿,春節回家的心情也遵循了從左到右的規律。

      uisdc-lld2017031330-768x553.png

      從右往左,表現受挫,被強大勢力壓迫的情緒。

      uisdc-lld2017031331-768x510.png

      這方面讓大家印象深刻的案例之一是“911”,當時電視臺對這起災難的實況拍攝是從左往右的方向,如左圖。但這個視頻放出來后,電視臺內部很快進行了調整,之后二次報道都變成了右面的圖像。

      uisdc-lld201703135.jpg

      可想而知畫面構圖方向的重要性。

      向左向下,代表回憶,過去,低落,悲觀的情緒。

      uisdc-lld201703136.jpg

      這是國外插畫師的一張兒童插畫,向左向下的趨勢表達了考拉從樹上跌落的驚慌氛圍。

      uisdc-lld2017031311.jpg

      向右向上代表積極,樂觀,未來。

      uisdc-lld2017031332-768x628.jpg

      下面是國外設計師的一張扁平插畫,艷麗的色彩和熱氣球向右向上的趨勢,整個頁面給人美好生活的情緒感染。

      uisdc-lld2017031333-768x426.jpg

      3.  封閉式和開放式構圖

      框架式的構圖:利用框架截取主體物,形成集中的視覺可以用人物,樹枝,花朵,都可以營造這樣的氣氛。這種形式也起到強調的作用。

      而框架式構圖中圓形構圖的優點是在視覺上給人以旋轉,運動,收縮的審美,在圓形構圖中如果出現一個集中的趣味點,那么整個畫面就以這個點為軸線,產生強烈的向心力。

      uisdc-lld201703137.jpg

      這在我們工作中多用于烘托節日氛圍,中國人對于圓有著特殊偏愛。-

      uisdc-lld2017031334-768x617.png

      開放式構圖:強調畫面內外的相互聯系,表現形式是畫面上人物實現、行為、落腳點常常在畫面之外,暗示與畫面外的某物體相呼應。多在我們頁面設計上起到引導作用。

      uisdc-lld2017031335-768x510.png

      4. 光影構圖

      光影構圖會讓簡單的頁面生動起來,更能抓住用戶情緒。

      光線與色彩對于界面構圖而言,是一種重要的補充元素,起到無可替代的渲染效果,突出畫面的空間感,節奏感和韻律感。在界面中,通過光線明暗對比,主體輪廓與背景彼此的關系可以得到進一步加強,使主體與背景相分離,以加強主體的大小和所處空間位置,向用戶傳遞了構圖空間的深度感,同樣也使構圖形成豐富的美的形態。通過不同的顏色搭配,讓畫面有了鮮明的質感和空間感,形成強烈的視覺沖擊,與形式組成的對比。

      uisdc-lld201703138.jpg

      下面是分別是國外設計師的插畫和眾安保險的H5頁面,都利用了光影來突出焦點。

      uisdc-lld2017031336-768x501.png

      光影對畫面的構成也可以做一個切割,增加畫面形式感,整個畫面表達了一種戲劇性的神秘氣氛。具有強烈的主觀認識。

      uisdc-lld2017031337-768x479.png

      下面分別是國外設計師和美團的一張H5頁面,利用光線進行了畫面的切割。

      uisdc-lld2017031338-768x501.png

      三、總結

      隨著審美感悟的發展,不斷的在形成新的審美理念,用戶對畫面的高要求,使構圖進入一個更加靈活的境地。每一個設計作品不僅體現了產品需求和公司的品牌文化的傳達,同時也反映了設計者獨特的藝術風格和創造思路。構圖本身就有一種與生俱來的強烈的表達能力,這就有助于用戶領悟設計之外的公司的形象和內在品質,并且有利于幫助用戶由表及里地挖掘產品傳達的內涵和情感。



      0
      0
      分享到:

      0

      喜歡他,就推薦他上首頁吧^_^

      推薦閱讀

      ×

      賽事服務聯系方式

      0371-86068866

      4008887269

      cndesign@163.com

      好的,我知道了

      官方微信

      聯系我們

      • QQ:33143335 QQ:1904200230
      • 電話:18569912460
      • 投稿:cndesign@163.com
      • 地址:鄭州市國家大學科技園東區9號樓2層

      版權信息

        移動 Android 版 豫 ICP 備16038122號-2 豫公網安備 41019702002261號

      主站蜘蛛池模板: 在线精品一区二区三区电影| 精品视频一区在线观看| 一区二区三区免费视频观看 | 亚洲av成人一区二区三区观看在线| 国模极品一区二区三区| 久久精品国产一区二区三区肥胖 | 在线成人一区二区| 在线视频一区二区三区三区不卡| 成人欧美一区二区三区在线视频 | 一区免费在线观看| 国产精品亚洲一区二区三区| 亚洲午夜电影一区二区三区| 无码国产精品一区二区免费式芒果| 亚洲一区无码精品色| 国产激情一区二区三区在线观看| 亚洲av色香蕉一区二区三区蜜桃| 精品一区二区三区在线播放视频| 久久久无码精品国产一区| 成人影片一区免费观看| 熟妇人妻一区二区三区四区| 国产日韩AV免费无码一区二区三区 | 国产视频一区在线播放| 国模大胆一区二区三区| 国产萌白酱在线一区二区| 国产精品一区电影| 视频精品一区二区三区| 国产乱码精品一区二区三| 亚洲一区精品无码| 亚洲AV无码一区东京热| 久久精品免费一区二区| 国产精品无码一区二区三区毛片| 成人在线观看一区| а天堂中文最新一区二区三区| 国产情侣一区二区三区| 亚洲一区免费观看| 国产一区二区好的精华液 | 一区二区三区四区精品| 好湿好大硬得深一点动态图91精品福利一区二区 | 亚洲综合无码一区二区三区| 亚洲综合一区无码精品| 国产伦一区二区三区免费|