目前日期文章:201612 (9)

瀏覽方式: 標題列表 簡短摘要

本文為『the non-designer’s design book』一書(Robin Williams著)內容心得系列文章第一篇,這本書如它的書名一般,即使是沒受過正規設計教育的人也能學到正確的設計概念,本系列文章共有六篇,分別為 :

  • 設計四大基本原則
  • 設計第一原則:親密性
  • 設計第二原則:對齊
  • 設計第三原則:重複
  • 設計第四原則:對比
  • 設計四大基本原則總結

對齊(Alignment)

任何東西都不能在頁面上隨便放置,每個元素都應該與頁面上的任何元素有某種視覺關係,讓設計能夠保持清晰、精巧,提昇整體的可讀性。

避免在一個頁面上混合使用多種對齊模式,也就是不要有一些置左,一些又置右。

盡量避免使用置中對齊,除非這是比較正式、穩重的設計。

我們要儘可能的採用硬邊界的效果,避免居中對齊這種版式

 

左圖為隨意置放,右邊為經過對齊法則部局。


親密性(Proximity)

彼此相關的項應當靠近,歸組在一起。如果多個項相互之間存在很近的親密性,它們就會成為一個視覺單元,而不是多個孤立的元素。這有助於組織信息,減少混亂,為使用者提供清晰的結構。

一個頁面有太多孤立的元素

不要在元素間留有相同的空白,除非這些元素互相之間是存在著關係的。

上圖信息動線混亂,下圖流暢運用對齊方式。


重複(Repetition)

重複的目的就是「一致性」,讓設計中的視覺元素在整個設計中重複出現。重複這項技巧在設計上也十分常見,例如你會重複的使用相同顏色、形狀、材質、空間關系、線寬、字體、大小和圖片等。

太多的重複元素,這樣會讓原本想呈現的主體被埋沒,而且令人討厭。


對比(Contrast)

對比的就是避免頁面上有太多相似的元素,透過對比讓最重要的內容能夠稱脫出來,吸引使用者的目光。對比可以使用字體、顏色、大小、線寬、形狀、空間等方式,對比能夠讓訊息更準確傳達、內容更容易被記住、內容更迅速尋找,是設計必備的技巧。

猶豫不絕,如果你想要讓對比效果明顯,就不要害怕,對必的差距要夠大:不要將黑色與咖啡色拿來做對比,這樣的對比力道完全不足。
太多對比,不要在一個頁面使用太多種字體,造成沒有主角的窘境。


 

樹風 發表在 痞客邦 留言(0) 人氣()

三、畫面構圖探討

 

1.水平構圖:畫面有平靜、穩定、緩慢、的感覺
● 回憶、獨白:於其他強烈視覺的畫面後,除了展現角色的獨白更給予觀者整理思緒的思考空間
● ‚時空對比:相同的構圖、不同的場景、角色的變化,讓觀者能隨著畫面比照體會時間推移下角色內心世界與故事的變化。


 

2. 封閉空間的窗戶光源

愈早年的回憶 光源多為暖色系

戲劇化的照明,窗戶的光源連貫了整部片,形成獨特風格

隨著人生的轉變,色情業、殺人、死亡、暴力、監獄,光線多為高飽和的冷色系
刻意的刺眼高光,畫面處於過曝效果,隨著劇情轉變,光源於觀者心中賦予了寓意

 

 


 

3. 繽紛花朵前景

•美麗的花朵經常出現在悲傷的劇情裡對比出劇中人的心境。

松子家的大門

松子離家前

松子家的大門是一再出現的場景。

前景繽紛的花朵隨時間更換了不

同的配色,屋裡卻是受父親冷落

略帶感傷的童年松子,與成年後

不斷的爭吵

 

父親已過世

打扮豔麗的松子多年後終於回家了,門前鮮豔的花朵,顯得無奈感傷

 

戀愛的花朵、美麗而殘酷

暴力、盲目的愛情,鮮豔的花朵顯得殘酷、危險

 

松子租屋公寓前

封閉自我的松子

破舊公寓前滿滿的太陽花,應是象徵希望與光明,

更顯得松子孤獨淒涼

4 . 電視畫面

引出劇中的時間的推移,並將電視中角色與電影的角色做連結呼應

松子好友-小惠色情片

帶出小惠與松子的友情故事,將小惠與外甥作連結。

 

5 . 置中的角色

除去前景,角色鮮明的站在觀者眼前

 

 

6 . 迷幻炫麗的歌舞動畫

 

歡樂的歌舞、夢境般的動畫,和現實產生極大的反差

 

凸透鏡圓形構圖,超現實的畫面,隱喻對美好生活不切實際的幻想

 

黑白的現實人生與彩色夢境的結合,對比出真實人生的灰暗

 


7. 時空對比:

時間、空間、物件、姿態、色彩物換星移的哀傷。

 

(1)  童年與成年,角色的轉換.

童年與父親

在快樂的兒童樂園

 

成年後的松子

落魄的與弟弟相約

 

 

(2)  松子與外甥的連結

製造了相同的構圖,以暖色系和冷色系區分松子與外甥的獨白。

 

 




(3) 愛情的逝去與生命的逝去

不同階段愛情逝去,松子說我的人生像結束了一樣。

想為自己而活時,卻在草地上真正結束人生。

 


 

電影構圖是具有時效的,中島哲也以大量重覆的並且多元的構圖形式與展現手法穿插連結了整部片,充滿了強烈的個人風格,角色的居中構圖、強烈的刺眼光線、鮮

豔的花朵襯脫悲劇的角色、超現實的歌舞動畫,完全跳脫了傳統美學形式與悲劇灰暗的表現手法,刻意營造的對比畫面像歌曲中反覆的副歌節奏,以一再的呈現衝擊

觀眾的感官。

 

 

 

 

 

 

樹風 發表在 痞客邦 留言(0) 人氣()

 一、電影劇情概述

影片以第三人稱的插敘形式,為觀眾們講述了一個日本女性看似不幸但是卻充滿哲理意蘊的一生。

 

       東京打拼的青年川尻笙,一日二年未見的父親意外的來到東京自己居住的髒亂的小公寓,得知有一位從沒見過面的姑姑於近日死於殺人意外,答應了父親去姑姑的住所整理她的遺物。川尻笙的父親捧著姑姑的骨灰慢慢離開,對說道:
“不管怎麼樣,看著都是無聊的一生。”


 

在松子的童年生活中,記憶里基本都是父親偏心生病的妹妹久美的影子,搞笑的表情只是想換得父親的笑容。


 

成年後的松子當了老師,替學生頂罪卻遭到學生的背叛,最後失去教師的資格


 

學校的事件中自己所有的壓抑、憎恨情緒全部發洩於正在生病卻一直受到父親偏愛的妹妹的身上,然後憤然離家出走。


 

第一段戀情----
松子脾氣火爆作家,松子經常遭到男友的毒打,最男人自殺了最後的遺言深深的烙印在松子心中
「生而為人,對不起」


 

第二段戀情-----
松子作了視澈也為敵手的作家岡野的情婦,享受寵愛後最終仍被拋棄


 

出賣色相,泡泡浴女郎-----
松子為了生活善用美色,做了色情泡泡浴女郎


 

第三段戀情-----
因寂莫與金錢關系在一起的小野寺,最終因金錢與情感的背殺。
松子殺了他。


 

第四段戀情-----
逃亡的松子遇到了純樸的理髮師,卻因被判刑進了監牢,出獄後理髮師已組了新家庭


 

第五段戀情-----
當初害自己丟了教師工作的學生-阿龍。黑色會的阿龍對松子暴力相向,逼松子賣身做非法的事。
松子堅持愛的原因只因害怕孤獨。


 

精神失常---
最後的戀情仍被拋棄,松子封閉了自己,致精神失常


 

重拾希望---
遇到昔的好友小惠願意幫忙重新生活,松子燃起一線希望


 

決心恢復正常生活的當晚,卻死於路邊小混混的棍下。
淒涼的死在草地上,結束松子的一生。

 


二、劇情主旨與內涵思想

  1. 「生而為人,我很抱歉」

       松子為愛而生,又為愛而死,她一生都奔波於尋找愛、貢獻愛的過程中,曾經去試圖挽回她人生中的一次次不幸,但是卻最終沒有得到一絲溫暖,遭到了男性的嫌棄。自殺身亡的作家男友留下的遺言「生而為人,對不起」,而松子在精神失常後不斷在牆上重覆的寫這句話,表現出一種莫名執著的懺悔。在電影日本男權至上的社會,松子所做的一切都是為了男人,為了討得父親的偏愛而去做鬼臉​​,為了獲得男人的愛情,忍受著暴力與恥辱,松子展現偏執的愛都與瘋狂。生而為人,但是本質上卻是為了自己,不斷為自己幸福而努力著,一次次努力最終的結果皆不是所謂的幸福,或許松子所說的抱歉可解讀對於自己的人生失敗深感抱歉。

  1. 男權社會下被壓抑的女性

       松子悲劇的一生存在著社會因素,在男權社會中,女性不依附於男性而獨立生活,是十分困難的。日本是一個男權思想根深蒂固的國家,兩性地位不平等,松子悲慘一生反射當時男權社會中對女性群體的不公平待遇,而發生在松子身上的諸多男性角色對於她的欺辱、背叛等行為都是現實社會中女性群體在社會中經歷的縮影。

  1. 女性傳統思想的凸顯

 松子順應了多數女性群體的傳統思想,在強大男權社會中失去了自我,沒有自己的作為與主體,一味地依附於男性而生,不管受到任何傷害,她都會溫柔地接受與忍耐。這樣趨於變態的忍耐行為,就像是一種自虐的包容。日本傳統社會中的女性會接受現存事物,長期持有聽天由命的思想,將男性作為活下去的唯一理由,離開了男人,等於扼殺了她們的生命。 《被嫌棄的松子的一生》中,松子不斷在取悅身邊的男人們,當愛情逝去後,松子總對自己說「我的人生在此結束了。」諷刺的是當松子第一次要為自己而活時,卻淒涼的結束寶貴的生命。


 

 

 

 

樹風 發表在 痞客邦 留言(0) 人氣()

21.【營造動感】

透過影像合成繪圖,繪製瞬間動態。

By Sharpe + Associate Inc.

22.【位移】

通過對事物位置的連續擺放,暗示出一條運動軌跡,會讓人感覺它們在運動的,設計方法雖簡單但效果很明顯。

 

23.【展現細部細節】

直白的展現食物的紋理、細節,強調材料本身。

By Michael McNeive


24【混合配對】
同系列商品不以不同底圖,相同文字編排格式並列。

By Sharpe + Associates


25【擬物】

發揮想像力將食材塑造另一個創意形像。

by Angela Southern


26.【歸真】

By Guillermo Carvajal


27.【文字排版為主角】

凸顯文字排版,以食物照片做為系列襯底。

By Willoughby Design


28【合併同類項】

將文案以類似色舖陳在圖形間。

By Dave Brady


29.【三分法】

版面三分,通常可得到不錯的效果。

By Sean Farrell


30.【解構美食】

將美味餐點組成物一一解構平舖陳列,形成趣味的設計感。

By Acre


31.【加入遠景】

適時加入遠景、中景,抒解視覺壓力。

By Mark Unger


32.【用食材寫字】

By Becca Clason
 


33.【創作互補的圖形元素】


34【形狀對比】

簡單文案向量插圖以方形 對比 食物與餐盤的圓弧線條。

By Vikas


35【超現實影像合成】

By Andrea Censi


36.【基本網格】

回到排版的基礎網格,巴塊區分清楚的網格呈現風格。

y Grant Burke


37.【加入半透明純色圖層】選項卡片式

圖片壓為純背景作用,以文字為主題,適合網頁排版、app、電子菜單…。

By Dual Pixel


38.【加入半透明純色圖層】全版面

By Lauren Pagan
 


39【組成幾何構成】

以食材組成基本幾何構成形式,對稱是不錯的選擇。

By Vanillashake Media


40.【google設計風】

google設計風 material design,無邊框按鈕、聚焦大圖等…。

By Jared Bell
 


41.【完整簡潔的影像】

By Anthony K


42【少點顏色】

By Vincent Xu


43.【創建引導線】

將食物的線條組成視覺引導線,引導視覺致文案重點。

By Lindsay Itani


44.【虛實結合】

極富設計感

By BigFan


45.【巧用流行色】

使用pantone流行色,做為背景。

By Jeremy Cheramy


46.【不要過於保守】

By Snask


47.【返樸歸真】

by Yum Tang


48.【重複重要意象】

By Andrei Hancu


49.【打碎文本】

By Natalia Lachiewicz


50.【加入人情味】

加入人情味,表情符號、手勢都是傳達人情味的好辦法。

By Pearlfisher


 

樹風 發表在 痞客邦 留言(0) 人氣()

圖片來源取自網路連結,出處請查看圖片位祉

1.【食材拼貼】-原始素淨

將食物素材原形、切片、修剪、平舖、重覆、組合,利用聚散關系排列為某種形象。

By Evo Agency


 

2.【食材文字拼貼】

(1)食材與向量文字、平面圖像、 穿插組合,營造層層交疊的層次感。

by Cheungyoon Kim

(2)立體的食材攝影與平面的文字排列組合,營造立體與平面並置的趣味感。

undefinedundefined

undefined

圖片來源取自網路連結,出處請查看圖片位祉

 


3.【餐點、商品、文字拼貼】

同第二式作法,素材改為完整的餐點、食品、飲料…等,畫面呈現較食材拼貼豐富。適用於食品菜單、餐廳網頁、雜誌DM。

undefinedundefinedundefined


 

4.【強烈的主題色塊】

於文字訊息量多時,以「顏色或面積」強烈對比的主題色塊、強調出重點訊息,並且給予畫面重心。

 

By Alaina Sullivan


 

5.【色彩高飽合、高對比】

運用食材本身的色彩與背景色配色!就是強眼。

By Pearlfisher


 

6.【與品牌logo結合】

常用於包裝設計,不同口味統一視覺。

By Pearlfisher


 

7.【創造景深】

運用模糊效果製造景深效果,平面產生空間感相當吸睛。

By Alberto Conti


 

8.【放大紋理】

放大食物局部紋理特色,利害利害利害。

By Prompt Design


 

9.【虛實合併】

食物本體融入平面圖像、文字設計。

by Laura Palese


10.【混合搭配】

二種物件以同樣輪廓合成

By Tanya Zouev


11.【在場景中排版】

將所有素材設計攝影場景,已實物編排攝影,再加上手繪或向量文字物件。

By Input Creative Studio and Corse Design Factory
 


 

12.【攝影插圖組合】

by Robin Kurtz


 

13.【大小對比】

by Brian Struble


 

14【激發情緒】

食色,性也。食欲作為人類本能之一,它潛在的賦予了每種食物或這樣或那樣的天然情緒,而利用這種本能,通過設計表達食物的情緒,勾起吃貨的食欲是非常巧妙的技巧。So,你的口水在哪里?

By Brand Society

 


15.【畫重點】

正如下圖案例作品所示,被叉子高舉的牛排炸薯條就是重點,非常清晰準確地讓吃貨們看到,適用於主打餐品。

by Matthew Lenning


 

16.【把焦點框起來】

利用邊框把焦點框起來,文字和修飾元素的配色也直接取自食材本身。

By Jon Contino


 

17.【美食包圍文案】

by Jill DeHaan


18.【黑板大法】

同美食包圍文字,底色以黑板文字以粉筆。

By Kimberly Low


19.【以食材作畫】

By Anna Keville Joyce


 

20.【美食拼圖】

by Rosa Engracia Peña


樹風 發表在 痞客邦 留言(0) 人氣()

一、互補色 

在十二色相環裡共有六組補色

1.【紫色、黃色】經常被運用,有強烈的視覺衝擊效果,飽滿而搶眼


2.【藍紫、明黃】是互補色中明度相差最大的。


3.【藍色、橙色】【藍綠、紅橙】搶眼吸晴,在許多電影海報及各式海報常上可看到藍橙的配色。


4.【紅色、綠色】

極具聖誕氣息,小時侯常說的「紅配緣狗臭屁(why??)」一不小心就會有「俗味」。

帶點粉色、改變明度飽和度,或是調整二色的用色比例就能去掉俗味。

「墨綠+西瓜紅」具有高質感。


5.【黃綠色、紫紅色】二者都為強烈感的色彩,組合極具性格。不好掌握。

樹風 發表在 痞客邦 留言(0) 人氣()

1.垂直構圖 畫面簡潔 易營造

2.水平構圖

3.十字構圖

4.對角線構圖

5.三角構圖

6.「S」形構圖

7.圓形構圖

8.「C形」構圖

9.均質化構圖

 

※斜角構圖習作「烏來海報設計」

樹風 發表在 痞客邦 留言(0) 人氣()

一、單色系; 同色系

背景使用主體色、單色系或同色系,亦或使用黑白灰做為底色或文字色彩。保持畫面柔和清爽。

二、類似色   取主體色,使用色相環相近位置色彩,容易掌控。

 

三、補色   

四、多色搭配

五、填加輔助元素,豐富畫面。給畫面加一個吸晴趣味的小丑

 

 

樹風 發表在 痞客邦 留言(0) 人氣()

一、四大構圖分析

二、配色分析

三、輔助元素應用

四、實際應用


一、構圖

1.中心集中式。

內容構成 : 主體 > 主題 >裝飾 。

構圖方式 :畫面由一個主要元素撐滿,主標題作為次要元素配合畫面平衡,桹據需求添加小裝飾。

表現特色 :衝繫力強,張力夠,適用於單品及細節豐富的物件。

※文字與圖像重疊錯置,製造文字與圖像間的層次。


2.杠桿式(三角構圖)。

內容構成 : 主體 > 次主題 >主標>裝飾 。

構圖方式 :畫面由主體和對面的次主題,及二者延伸的垂直線落下主標題,形成穩固的三角構成。

表現特色 :穩定飽滿,適合二種或展現多面相商品,或是主商品與商品原料、香味、材質同時展現。


3.頂視角度分散構圖

內容構成 : 主體 > 主標>次主題 >次主題 >…>裝飾>裝飾… 。

構圖方式 :由正上往下的視角,多個物件組成,自一中心點往外發散。

表現特色 :畫面豐富,節奏生動,較難掌握。


3.折線跳躍構圖

內容構成 : 主體 > 主標、次主題 >裝飾… 。

構圖方式 :產品懸浮在畫面中,上下皆可跨出界,呈現折線轉折,空間營造一上一下、一前一後的交疊層次。

表現特色 :活躍、延展性強能快速達到視覺展現。

樹風 發表在 痞客邦 留言(1) 人氣()