DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> 關於網頁技巧 >> 音樂與設計關系:理解色彩應用方法
音樂與設計關系:理解色彩應用方法
編輯:關於網頁技巧     

網頁制作poluoluo文章簡介:一直以來都想寫篇關於音樂與設計關系的文章,免去每次和別人大篇幅講述應用音樂原理去把控設計的時間。

 

一直以來都想寫篇關於音樂與設計關系的文章,免去每次和別人大篇幅講述應用音樂原理去把控設計的時間。

常有朋友問我,怎麼樣搭配色彩才好看,怎樣培養色彩感?我沒有系統學習過色彩學,但對色彩的把握有自己的一套,這要從我的第一份工作說起。

我的第一份工作是做策劃,平時工作比較閒,便下些Photoshop教程自己學學,剛開始也是摸不著思緒,也不知道圖層是作什麼用的,突然靈感一現,這圖層不就是樂隊中的鼓、BASS、吉他、鍵盤嗎?每樣樂器都是單獨的個體,協調好每樣樂器,就能奏出悅耳的音樂,反之則為噪音。Photoshop中的圖層不也一樣麼?每個圖層都可以單獨的調節透明度、色相、色彩等屬性,整個畫面就是一個樂隊排練房,仔細調節每樣樂器屬性,以奏出完美的音樂。就這樣,入門 photoshop。

先說說音樂中的色彩吧。《布拉格廣場》中間奏部分,有好幾段音樂都能讓你聯想到不同國家的畫面和色彩。《上海灘》前奏音樂一起,你馬上會想到就上海的畫面,這音樂和色彩之間有什麼關系呢?

同一個色彩,有不同的冷暖關系。

懂得音樂的人都知道在樂器上找不到一個固定的音,音符“Do” 隨調式改變著位置,不同的調式傳達出不同的感情,適合著不同的樂器與人聲。這與我們運用色彩的道理是一樣的,整幅畫面的基調與情緒是通過畫面色彩的冷暖傳達出的。但從小我們頭腦中的色彩冷暖關系就是固定的。紅色偏暖,藍色偏冷。其實這是一個錯誤的概念。如同音符一樣,顏色隨周圍環境的變化轉換著調性(冷暖關系)。明白這一道理,藍色也可以被我們渲染成暖洋洋的樣子。

和弦與旋律概念在平面設計中的應用。

玩音樂的朋友都懂得另一個道理,無所謂哪一個音好聽與難聽,音符一定要放到一起去,才能叫音樂,否則“Do” “Do” “Do”一直按下去一定是噪音,“Do” “MI” “So” 放在一起就變成了和弦“C”。這好比顏色中紅藍白的搭配一樣,永遠和諧。和弦可以繼續往裡添加新的音符,比如加個“Si”這個和弦馬上變了情緒,變成了一個7和弦。如果把“Mi”換成降“Mi”就更是大相徑庭地跑到藍調裡去了,就好像在紅藍白的組合中,配上紫色或桔色給人的視覺感受是截然不同的。和弦一直可以添加音符進去,成為9和弦,13和弦……在色彩上就好比我們常說的高級灰。

顏色分組使用。

明白這個道理後,我們就會更直接地理解顏色是應該分組使用的。這些組合的基礎應該向和弦C、D、E、F…一樣,有一個最原始的搭配,設計師想不斷變化,就在這些組合裡求變吧。你一定要把沒關系的顏色放在一起,就象”發“和”希’誰也不挨著誰,兩者之間沒關系,你的畫面一定平淡;如果你一定要把敵對的顏色放在一起,准會難看。運用和弦的道理去理解色彩,你會立刻跳出色彩貧乏的誤區,發現眼前可用的顏色太多也太美了。合理搭配的色彩組合把畫面的視覺空間不斷拉伸,讓畫面不僅絢麗而且厚實,這就是色彩和弦的作用。大家如果需要有關方面的色彩搭配資料,可以上我的 www.cabbageman.cn 上下載調研手冊,每份調研手冊都有一份色彩組合表。

設計中的畫面主旋律。

但僅僅有了和弦就能成為音樂嗎?不對,音樂還需要旋律,沒有旋律的音樂不好聽。那麼,平面作品的旋律是什麼呢,它是我們眼睛觀看一幅作品的過程。一幅招貼也罷,一本宣傳冊也罷,都存在著一個先看到什麼,再看到什麼,最需要人們看到什麼,記住什麼,回味什麼的問題。這些邏輯就構成了平面作品的旋律,讓觀眾的眼睛什麼時候緊張,什麼時候休息,最後停留在哪個地方,這是我們最需要動腦子考慮的問題。設計中的畫面主旋律也就是設計策劃稿,這是設計中我們最初也最需要斟酌的地方,這決定著整個設計的價值。

設計中的畫面節奏 。

光有色彩還不行,色彩的使用與音樂中的節奏一樣,需要比例,平面作品一定需要一種節奏的控制,控制節奏的元素有很多,它們中常用的就是顏色、圖片與文字排列,也就是主基調。

設計中的基調。

歌曲有大調小調之分,大調明朗開闊,小調憂傷黯然,我們樂隊排練一首歌曲的時常常會說這是E大調的歌曲,那麼調性就明確下來了,無論怎麼走都是在這個調內。設計中也需要定一個基調,也就是我們總設計師所設計的框架和規范,設計師們圍繞這這套框架和規范進行創作,掌握了基調,那麼這作品一定會非常統一,非常和諧,偶爾的幾個出彩的音會讓整個設計亮起來。

希望各位設計師們多學學音樂,用音樂的理論解析色彩真是簡單直白。
如果有什麼不對的地方,敬請提出。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved