作者:Robin Williams、John Tollett
譯者:王煦淳、張雅芳
出版社:旗標出版股份有限公司
出版日期:2007年01月19日
可惡!才剛借回來沒兩天,就有人預約去了,本來想細細品嘗這本書,順便偷個閒小小設計一下我的名片,但這下子我怎麼也得加快速度看完\_/
Idea Sparks!
善用圖庫
- 隨時準備好創意收藏百寶盒,隨時收藏身邊的素材,變化的可能性,圖片字型、背景、邊框、材質可以當作美工圖案。
- 讓畫面看起來好像「沒動過什麼手腳一樣」,即使是用現成的美工圖案,一點想像力及加入一些文字的能力也逞生具有無限創意的美工圖案。
善加利用照片
- 注意照片的構圖,如何抓住觀賞者的焦點與注意力,引導它們的視線按照順序從某一點看起。
- 大膽嘗試創意剪裁,從照片蒐集創意
- 黑白照片可以為設計營造出某種氣氛,可看起來更具藝術性與時尚感,但是黑白照片得更注意構圖、裁切與變形等的處理。
- 雙色調的運用,特別色(spot color)的使用,陰影部分使用暗色墨水印,中間調以及亮部會使用較亮的顏色。
- 創意特效的使用,如PhotoShop的濾鏡效果、色相與飽和度的調整、色彩平衡、調整功能等。
- Stock photo與Stock illustration的運用
設計是一種挑戰
限制你的設計選項,四個主要思考方向幫助限制選項:每一次製作生產產生的過程、客戶指定的事項、預算、交件日期。
選擇一種視覺重點
- 一般的設計手法,置中對齊、Helvetica字型的使用、沒有對比、缺白空白。
- 讓人驚呼「哇!」的風格,使用驚人的相片、搶眼的插圖,誇張的對比
- 以字型為主的設計手法有時比圖像更能讓人印象深刻,要不要使用更富變化的字型,全看市場而定
什麼樣的因素會讓設計看起來很流行?
- 穿過整幅作品的趣味線條
- 大膽、簡單,超現實的用色
- 標題採用與眾不同的字型
- 文字部分沒有對齊或有點歪
- 在文字上方或下方加入線條
- 不重要的其他元素可以呈現不規則感
創造視覺衝擊效果
- 以圖像為主的設計幾乎都有三個主要目的:捉住讀這目光、創造容易記憶的視覺印象、傳達訊息
- 運用尺寸大小呈現視覺衝擊,決定性的重點在於「強烈對比」,尺寸大小不見得都要很大才行,有時候「小」也是另一種視覺呈現方式。
- 色彩,出乎意料外及極度強烈的色彩
- 意外性,花點時間想想該怎麼傳達你所要傳達的訊息
- 一圖雙關,將文字結合在圖像裡
- 大膽的去做,跳脫既有的規格,與眾不同的字型、特別的紙張大小或古怪的圖像
每種想法都可以有很多種方式呈現,傳奇性很重要、裝飾性很重要,而簡單也不見得會比複雜來的好。
LOGO
- 使用一個介於影像和文字之間,讓視覺和概念產生相互關連的字型
- 在字型上作手腳,增加裝飾元素,多利用圖庫中的小圖片,增加插圖
商務名片、信頭與信封
- 名片大小是3.5 x 2,別想把名片做得大一點因為名片夾絕對放不下
- 設計的真理:角落可以留白、整個設計可以不要置中、可以不要全用大寫字母、可以使用Helvetica或Times以外的字型、可以使用小於12pt的字體、寧願用一個大圖也不要把兩個小圖塞在角落裡。
- 大部分的標準字型都是規律、數字大小一樣的。如果你使用的是數字字型大小都一樣的字型,要將數字設得比其他數字小O.5-1pt,要不然這些數字很可能會凌駕過文字。
- 括弧容易製造凌亂感,區域號碼的括弧有很多替代方案,如英文句號「.」、空格、分號「-」、上標、斜體、粗體等。
網頁設計
- 尊重原始碼及其能耐
- 清楚呈現網站的目的
- 速度為首要的考量
- 謹記設計的基本原則
- 運用基本的使用者介面準則
- 細心照顧你的文字設計
- 文字之可讀性
- 校對並測試網站
- 不要煩人(如:不要使用跑個不停干擾可讀性的動畫)
- 網頁規格,標準的網頁圖片應該設定為72dpi, RGB,網頁選單應該在永遠看得見的地方
目錄與索引
別使用不相配的前置符號,別用重複鍵入英文句點的方式製作前制符號,別將相關項分開,要謹記類聚的原則,不要將各個層級混在一起
大量文字的設計方法
- 加入空白讓眼睛稍作休息,製造頁面的開闊感
- 靠左對齊而非左右對齊,會讓文字更容易閱讀加入更多留白的空間
- 稍微加寬行距,段落間使用空行而非縮排
- 使用對比來強調標題
- 如果沒有很多標題的話,可以使用「引述」來避免密密麻麻的文字感
- 找出重複的元素,強調這些設計的特色,重複性會讓畫面統一
- 使用多欄的格線讓版面配置更富變化
相關網站:
http://istockphoto.com/index.php (圖庫)
Brain Forstst作品及網站
http://coolestdesigns.com/
http://cwd.dk/http://e-creative.net/enter.asp
http://linkdup.com/
http://www.lookom.com/
http://www.netdiver.com/
http://www.netspiration.com/
http://standoutawards.com/
Check your CSS


Comments (0)