翻譯:jzjz
最近沉迷陰陽師翻譯拖太久了吹埠,然而昨天手抖把吸血姬給喂了......今天不長記性把鯉魚精給喂了......痛定思痛斩郎,默默開始寫翻譯超度一下她們T-T
譯文僅供個人學(xué)習(xí)脑融,不用于任何形式商業(yè)目的喻频,轉(zhuǎn)載請注明原作者缩宜、文章來源、翻譯作者及簡書鏈接甥温,版權(quán)歸原文作者所有锻煌。
上篇戳這里:http://www.reibang.com/p/e0821738d504
![Uploading Poster Design via MyDesy_730596.jpg . . .]](http://upload-images.jianshu.io/upload_images/148196-f432e68bcb753ae1.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
11.對比
對比是能夠讓你的設(shè)計緊跟潮流的一個關(guān)鍵因素,這也是許多客戶的需求姻蚓。
對比是指設(shè)計作品中兩個元素之間的差異程度宋梧。
一些常見的對比包括明與暗、厚與薄狰挡、大與小等等捂龄。
對比對可讀性和易辨性有著很大的影響。這也是為什么小說或者其他出版物要以白紙黑字的形式呈現(xiàn)加叁。想象一下如果是淺灰色的字印在白紙上倦沧,那還能看嗎?所以如果你在做類似的設(shè)計它匕,請注意提升對比度展融。
看看Jonathan Correira設(shè)計的這張海報。 海報的主題分為兩半豫柬,一半以綠色為主告希,另一半則以深灰為主,兩半的顏色對比都有相應(yīng)的調(diào)整以保證所呈現(xiàn)的內(nèi)容都很容易辨識烧给。
想象一下燕偶,如果“New York”的顏色與“Bike Expo”顏色相同,海報的對比度將大大降低這樣閱讀起來會很困難础嫡。
Robbie Cobb 的這幅作品也是高度比度設(shè)計的代表之一指么。設(shè)計中包含了明與暗,薄與厚的對比。
對比不僅僅能夠起到讓設(shè)計中的元素風(fēng)格化或讓元素更易讀的作用涧尿,它還能夠引導(dǎo)人們的行為系奉。這點在網(wǎng)站中很常被使用,我們來看看 Audible’s網(wǎng)站的登錄頁姑廉。
暗色系的背景以及背景中被淡化的圖像和明亮的紅色按鈕形成了鮮明的對比缺亮。這種設(shè)計使得登錄頁的行為召喚功能(引導(dǎo)注冊)更加明顯。
12.邊框
如同照片和其他藝術(shù)品桥言,邊框?qū)υO(shè)計作品來說也很重要萌踱。 我們通常認(rèn)為攝影中的邊框主要決定了照片中的內(nèi)容包含什么,不包含什么号阿,在設(shè)計中也是這樣的并鸵。
邊框中有形的邊框可以起到凸顯元素的作用。
我們來看看由Trevor Finnegan設(shè)計的這個菜單扔涧,特別推薦的菜譜和企業(yè)使命被線框框出园担,讓讀者的目光馬上就可以注意到這兩部分內(nèi)容。這種簡單的方式完全可以幫助你提升對重點內(nèi)容的強(qiáng)調(diào)枯夜。
邊框不一定是有形的弯汰。 如果你正在設(shè)計中考慮采用攝影元素,也可以考慮用這些元素來設(shè)計邊框湖雹。 來看看下面這幅海報咏闪,海報中的邊框是周圍看似隨意擺放的各種工具。 這樣也可以打造出一個視覺上的邊框并引導(dǎo)讀者觀看到真正重要的內(nèi)容摔吏。
13.柵格
柵格就像地基鸽嫂,是構(gòu)建成功設(shè)計的第一步。 柵格是一個設(shè)計的總體概要征讲,決定著放置哪些元素据某,哪些元素要與哪些元素保持一致。
柵格雖然重要稳诚,但是在設(shè)計中它卻是隱形的存在哗脖。用戶只會感受到設(shè)計內(nèi)容的整潔、清晰扳还、有序才避,卻看不到真正讓這些內(nèi)容有序的對齊的線。
讓我們來看一些柵格的案例氨距。
上面這個例子來自Nikola雜志桑逝,設(shè)計案例中選用的是五列柵格,其中一些元素僅在一列中顯示俏让,一些元素會占據(jù)兩列或三列楞遏,然而設(shè)計整體看起來卻非常整潔干凈茬暇。
這個例子還是來自Nikola雜志。這次的設(shè)計展示了十二列柵格在元素對齊中的靈活性寡喝。 我們再次看到一些元素橫跨多列糙俗,而一些元素僅占兩三列。 不要認(rèn)為柵格包含區(qū)域內(nèi)所有的地方都需要填充上內(nèi)容或者著色预鬓,它的劃分能夠給你的創(chuàng)作帶來了無限的可能巧骚。
現(xiàn)在我們大概了解了柵格是什么,以及是如何應(yīng)用的格二。讓我們再來看看高階柵格運(yùn)用的案例劈彪。案例來自 Matt Willey,能看出作品中用的是幾列柵格嗎顶猜?三列沧奴? 還是六列? 無論這個作品被看做是用哪種方式劃分长窄,作品里的每個元素都是對齊的滔吠。這充分展現(xiàn)了柵格靈活,適應(yīng)性強(qiáng)的特性抄淑,所以在你下一個設(shè)計中考慮試試它吧屠凶,它會讓你的作品簡潔驰后、醒目肆资、有吸引力~
14.隨意性
到目前為止,我們一直在講述對齊和秩序灶芝。 但是郑原,更自然,粗獷和隨意的設(shè)計呢夜涕? 隨意性在設(shè)計發(fā)揮了很大作用犯犁,但是這里指的隨意性并不是普通的意義上的隨意性, 我們可將這種隨意性稱之為“設(shè)計隨意性”女器。
“設(shè)計隨意性”和其他形式的隨意性的區(qū)別在于目的和執(zhí)行酸役。設(shè)計的主要目的應(yīng)該是溝通 ——通過作品你要對消費者說什么? 想說的是否都清晰的表達(dá)出來了驾胆? 如何使作品與消費者溝通中的共鳴更強(qiáng)烈涣澡?
讓我們來看看下面這幅設(shè)計作品,這類作品往往很容易被認(rèn)為是“隨意的”丧诺,但其實都是有意的入桂。 這幅海報是由 Heath Killen 為電影“The Killer Inside Me”設(shè)計的。這類作品中大多運(yùn)用了刮擦驳阎、手繪效果抗愁,字和詞凸起的效果馁蒂,其間的間隔都是不規(guī)則的。
這幅海報中的手繪效果和排列層次都運(yùn)用了一種看上去很隨意的方式蜘腌,有些人會說這阻礙了閱讀沫屡,但是這樣展示是有目的的——這樣是希望展現(xiàn)電影里混亂和扭曲的心理。
如果海報里這樣的設(shè)計被應(yīng)用到一個關(guān)于會說話的快樂小動物那種兒童電影海報中撮珠,那樣看似隨意的效果就不能傳達(dá)正確的情緒谁鳍。 但在現(xiàn)在這種情況下“隨意性”設(shè)計完美地傳達(dá)了電影的主題。
另外看看這個Laura Berglund的設(shè)計作品劫瞳,作品中利用一定程度的隨意性創(chuàng)造了一個自然的倘潜,拼貼的效果。 雖然這件作品乍看之下像是被砸在一個頁面上志于,但又有那種時尚的粗糙和凌亂感涮因,再仔細(xì)一看會發(fā)現(xiàn)它實際上運(yùn)用了許多設(shè)計原則。
作品中的每個元素實際上是都是被策略性地定位過后形成天然的引導(dǎo)線來引導(dǎo)讀者的眼睛伺绽,并且在平面顏色养泡,紋理和圖片之間運(yùn)用了有選擇性的平衡。
下面這幅作品來自Juan Camilo Corredor奈应。 這幅作品可以看做是隨意性的全面展現(xiàn)澜掩,奇怪的形狀、紋理杖挣、插圖肩榕,被以不同尋常的方式剪裁并以有趣的方式安排。
這幅看似隨意的作品如果你剖析它包含的元素惩妇,你會注意到某些部分其實是對齊的(左下藍(lán)色形狀和它旁邊的綠色尖角形狀完全是對其的株汉,等等),布局也有助于眼睛瀏覽頁面歌殃,甚至有一些柵格進(jìn)行提示乔妈。
所以不必是整齊和有序的才能被歸類為設(shè)計。 例如“隨意性”設(shè)計或更前衛(wèi)設(shè)計也可以是吸引人的和超級有趣的設(shè)計氓皱。
在以后的設(shè)計中你也可以效仿 Juan Camilo Corredor以奇怪的方式調(diào)整元素的大小路召,僅展示個“a”的尾巴,裁去一只雞的頭波材,但做這樣嘗試的同時請注意你要傳達(dá)的目的和設(shè)計原則股淡。
15.方向
許多設(shè)計要考慮的一個重要方面是眼睛如何在頁面上移動,以及其所移動的方向—— 這有時也被稱為“流”各聘。 你的眼睛如何在頁面上移動揣非? 你的讀者確切知道接下來看哪里嗎? 你所設(shè)計的視覺“流”的方向是他們眼睛的邏輯方向嗎躲因?
許多研究已經(jīng)分析了我們眼睛的運(yùn)動習(xí)慣和我們在觀察特定事物時的追蹤模式早敬。 看看尼爾森諾曼集團(tuán)的眼動跟蹤研究忌傻,其跟蹤人們的眼睛,同時查看網(wǎng)頁搞监,以此觀察他們的消費模式水孩。 下圖為視覺熱圖結(jié)果展示:
研究證明,當(dāng)瀏覽網(wǎng)頁時人們眼睛常見的閱讀模式是“E”或“F”形狀琐驴,所以將你最喜歡的內(nèi)容放在頁面的左邊俘种,或者置頂是最好的選擇。 眼睛追蹤的另一種常見模式是“Z”形绝淡,如下所示:
總的來說宙刘,人們的眼睛在閱讀時會自然地以“掃動”的形式自左上角移動到右下角進(jìn)行瀏覽。 具體理論可以看The Gutenberg Diagram的深入解釋牢酵,具體文章戳這里:http://vanseodesign.com/web-design/3-design-layouts/悬包。
當(dāng)然盡管這三種閱讀形式是基于大量案例得出的經(jīng)典形式,設(shè)計時也不是需要100%遵照馍乙。 只要記住布近,人們閱讀時眼睛會從頁面左上角開始向下移動就可以了。
讓我們看看相關(guān)的例子丝格。
這幅設(shè)計作品來自Atelier Martino&Ja?a撑瞧。作品以一種非常流暢和自然的方式引導(dǎo)讀者的視線,文字就在自上至下貫穿整幅作品的曲線圖像上展現(xiàn)显蝌, 標(biāo)題和日期首先映入眼簾(這兒還有個小的層級結(jié)構(gòu)预伺,太妙了~),然后我們的眼睛留會隨著圖像的引導(dǎo)向下移動流經(jīng)各個內(nèi)容琅束。
簡而言之扭屁,這幅設(shè)計作品在展示圖像的同時,將所需傳達(dá)的信息以正確的方向順暢的展現(xiàn)出來涩禀。
16.規(guī)則
關(guān)于規(guī)則這一點肯定會引發(fā)很多爭論,如果有一屋子設(shè)計師肯定有一半宣稱在設(shè)計中根本沒有規(guī)則然眼,而另一半肯定會抗議說有很多規(guī)則艾船。 理論上來說他們都是對的。
與任何一種技能一樣高每,有一些事情你必須學(xué)習(xí)屿岂,這些就屬于一般規(guī)則。 例如:確保你展現(xiàn)的是清晰的鲸匿、不使用低像素圖片像等爷怀。這些是設(shè)計的基礎(chǔ),能夠幫助你完成基本的設(shè)計带欢。
但是正如許多人所說运授,規(guī)則就是用來打破的烤惊。
讓我們來看一個故意打破規(guī)則的例子。 這張搞笑海報來自Shahir Zag吁朦,作品故意打破了一些印刷排版鐵則柒室。
另一個規(guī)則破壞者的例子來自David Carson。Carson以前是一個前衛(wèi)出版物的設(shè)計師逗宜,為Ray Gun Magazine這類雜志做設(shè)計雄右,他打造出了一系列令人震驚,有活力的和打破傳播規(guī)則的作品纺讲,至今仍令人欽佩擂仍。
關(guān)于Carson的一個軼事是他有一次負(fù)責(zé)排版音樂家Bryan Ferry的采訪,Carson看了采訪內(nèi)容之后覺得這個采訪太無聊了熬甚,于是他就用Zapf Dingbats字體(一種基于符號的字體防楷,類似Wingdings)來排版,讓采訪內(nèi)容完全不可讀则涯。 下面就是就是這個采訪的排版:
Carson設(shè)計時的基本精神是“不要錯誤理解溝通中的易讀性”复局。
Carson和其他違反設(shè)計規(guī)則的設(shè)計師通常會選擇通過違反規(guī)則來向讀者傳達(dá)不同的想法。 我們前面討論的Shahir Zag的海報通過打破了規(guī)則粟判,來展現(xiàn)一個笑話亿昏,卡森通過打破規(guī)則來展現(xiàn)他對這次采訪的態(tài)度。
所以档礁,雖然案例中的排版在可讀性上有點妥協(xié)角钩,但是在表達(dá)效果上可是很到位的。
遵循規(guī)則和打破他們在設(shè)計世界中都占有一席之地呻澜,只有兩者都學(xué)會递礼,才能將設(shè)計發(fā)揮到極致。
17.動感
你有沒有聽說過或看到有人描述一幅畫或一件藝術(shù)作品有“很有動感”羹幸?你可能首先被這個解釋所折服——畢竟靜態(tài)的作品是如何看上去是移動的呢脊髓?動感是視覺藝術(shù)的一個重要部分,包括平面設(shè)計栅受。
早些時候将硝,我們討論了設(shè)計的方向和視覺的“流”,這些因素在設(shè)計的動感方面發(fā)揮了重要作用屏镊。如果你的作品從上到下依疼,從左到右,角A到角B等等都是流暢而芥,你的作品將順利的“移動”起來律罢。
但是,對于你想給一個元素或一個字制造出運(yùn)動的感覺應(yīng)該怎么辦呢棍丐?也許你有一個球误辑,你想顯示它在運(yùn)動中沧踏,或者你想描繪一輛汽車在高速公路上奔馳。有很多方法可以描述這種運(yùn)動稀余,所以讓我們來看幾個例子悦冀。
首先,我們有透明度睛琳。我們之前簡要地談到了透明度和不透明度如何能夠為你的設(shè)計創(chuàng)營造動感盒蟆,但是現(xiàn)在讓我們更深入一些。
這個標(biāo)志的例子來自Vladimir Mirzoyan师骗,標(biāo)準(zhǔn)中層疊各種不透明的幾何形狀历等,刻畫出了在飛行中的蜂鳥翅膀。元素間的重疊效果干凈利落的展現(xiàn)了復(fù)雜的動感辟癌。
同樣寒屯,來看看由Alan Clarke為2012年奧運(yùn)會設(shè)計的海報。 海報通過不同不透明度的簡單形狀為這張海報創(chuàng)造了強(qiáng)烈的速度和運(yùn)動的感覺黍少。
動感也可以通過模糊效果來實現(xiàn)寡夹。 下面這個例子中將模糊效果應(yīng)用到一個典型的靜態(tài)元素中產(chǎn)生了動感的效果。這個例子來自由德國設(shè)計師Anzinger厂置,Wüschner菩掏,Rasp設(shè)計的書的封面,在對字母的邊緣和角落應(yīng)用一個有趣的模糊處理后昵济,創(chuàng)造除了一個動感的錯覺智绸。
最后,動感也可以通過線條來表達(dá)访忿。 這些在漫畫和插圖中很常見瞧栗,當(dāng)一個角色逃跑或快速移動時都會運(yùn)用到這種表達(dá)。 回憶下你看過的漫畫海铆,是不是這樣迹恐?
下面的這個例子來自 Matt Chase,運(yùn)用線條來表達(dá)“future”的動感游添。 一個小小的線條引導(dǎo)就就可以使元素產(chǎn)生動感系草。
18.深度
深度是設(shè)計中一個重要而令人興奮的原則。即使是平面的媒介唆涝,如果你能夠創(chuàng)造一種深度,那么就能夠使作品展現(xiàn)超越了二維的感覺唇辨。
那么廊酣,我們?nèi)绾卧谖覀兊脑O(shè)計中創(chuàng)造深度呢?下面有幾個方法可以拿來運(yùn)用赏枚。
首先亡驰,最常見的方法是—— 陰影晓猛。陰影可能是棘手的小惡魔,因為它們不總是線性形狀凡辱,有時它們伸展戒职、彎曲、扭曲或和傾斜透乾。所以洪燥,探索陰影使用的一個好方法是觀察真實世界的陰影,看看光如何打在不同的物體的不同點的乳乌,并在設(shè)計中嘗試復(fù)制這種感覺捧韵。
讓我們來看一個如何有效使用陰影來創(chuàng)建深度的例子。這幅海報來自Dominique Schmitz汉操,以非常真實的方式展現(xiàn)了陰影再来。海報中對每個元素的陰影采用了不同的渲染方式,非常值得學(xué)習(xí)磷瘤。
另一種制造陰影的方式是重疊某些元素芒篷。 讓元素重疊,減少其中一部分元素的展現(xiàn)會使設(shè)計整體看起來有更多層次采缚。 Fabian De Lange的這幅設(shè)計作品针炉,通過重疊、覆蓋元素仰担,創(chuàng)建一個分層的糊识,擁有深度的設(shè)計。
另一種技術(shù)是使用透視摔蓝,這是一種經(jīng)常給元素“3D效果”的方法赂苗。 通過調(diào)整某些元素的視角,可以給出將它們抬高出頁面的錯覺從而打造出作品中的深度贮尉。 讓我們看一個例子拌滋。
這幅海報來自Neil Stevens,向右傾斜的每一個字母都有一個獨特的形狀和深度的展示猜谚。
當(dāng)然败砂,另外一種設(shè)計風(fēng)格就是扁平化。 這是最近很流行的風(fēng)格魏铅。
一個知名的扁平化設(shè)計者就是蘋果昌犹。 2013年9月,蘋果推出了一個新的操作系統(tǒng)引起了整個設(shè)計界的震動览芳,扁平化基本上消除了所有的斜角效果和陰影斜姥,并用更平坦的應(yīng)用程序圖標(biāo),屏幕等等來去除深度。
19.排版
排版可以說是設(shè)計的最大基礎(chǔ)之一铸敏。讓我們來看一個排版的案例缚忧。一般來說醒目字體的展現(xiàn)是基于更華麗,更風(fēng)格化的設(shè)計杈笔。具體可以回想一下雜志和電影海報的標(biāo)題設(shè)計闪水。
來看看Benjamin Bours的這些雜志排版作品,每幅作品都有著華麗復(fù)雜的標(biāo)題設(shè)計蒙具,這樣的排版能讓標(biāo)題的吸引作用發(fā)揮更大的功效球榆。
接下來,我們來看看正文的排版店量。 對于正文的排版是運(yùn)用有襯線字體派還是無襯線字體更能提升可讀性和易讀性一直存在著爭論芜果。
那么,答案是什么融师?這其實由個人偏好和運(yùn)用的場景決定右钾,但一般來說,有襯線字體最好應(yīng)用于印刷品排版旱爆,無襯線字體最好應(yīng)用于web排版舀射。讓我們來通過下面這幅由UrbanFonts制作的信息圖來做進(jìn)一步的解釋:
下面在列一些排版的基本原則:
強(qiáng)化標(biāo)題;
確保正文字體不要太大或太小以便于印刷怀伦;
盡量避免一次使用太多的字體脆烟;
對于大號字體,左對齊是最容易閱讀的房待;
如果對排出來的版有疑問邢羔,打印出來(當(dāng)你把內(nèi)容打印出來后經(jīng)常能發(fā)現(xiàn)排出來的有多尷尬)。
當(dāng)談到排版桑孩,另一個難關(guān)是組合字體的藝術(shù)拜鹤。 讓我們來看看組合字體相關(guān)的案例。
這本99U雜志的排版設(shè)計只使用幾種不同的字體流椒,但將字體有機(jī)結(jié)合后敏簿,看起來非常時尚,讓人印象深刻宣虾。
20.組合
組合是我們討論的每一個其他原則的匯集惯裕。
“組合”是指元素在設(shè)計中的整體布置,在設(shè)計中通過使用比例绣硝、重復(fù)蜻势、排版,線條鹉胖,隨意性等原則可以創(chuàng)建獨特咙边,有吸引力又合理的布局猜煮。
讓我們來看一些案例次员。首先败许,這幅作品來自J.Crew,作品通過使用比例和深度來突出它的焦點在“30”淑蔚。作品還通過使用層次結(jié)構(gòu)將標(biāo)題放置在頁面的頂部中心市殷,使得它比其他元素更大,同時還將他用邊框框出來刹衫。
雖然作品中運(yùn)用的設(shè)計原則看似簡單醋寝,但是請注意它們是如何被組合運(yùn)用的。
另外一個例子是來自 Lab B Design Office的海報設(shè)計带迟。海報中運(yùn)用到了與上一個例子類似的原則音羞,但產(chǎn)生了非常不同的結(jié)果。 海報通過調(diào)整元素的比例仓犬、深度和層次嗅绰,形成了邊框,框出了要突出的元素搀继。
總的來說窘面,通過將不同的設(shè)計原則進(jìn)行組合,可以創(chuàng)造出無限的可能叽躯。
其實這有點像學(xué)習(xí)音樂财边,先學(xué)習(xí)五線譜,學(xué)習(xí)'do re mi'点骑。一旦你掌握了基礎(chǔ)原則酣难,你就有機(jī)會創(chuàng)作出優(yōu)美的歌曲。
讓我們再來列舉一些進(jìn)行組合時需要注意的事項:
設(shè)計是否平衡黑滴?
設(shè)計是否具有邏輯層次結(jié)構(gòu)憨募?
讀者的眼睛是否很容易和有邏輯地瀏覽頁面?
我希望傳達(dá)的信息是否真的傳達(dá)到位了跷跪?
結(jié)論
設(shè)計是一項復(fù)雜的事業(yè)馋嗜,充滿了原則和技巧,其中一些你可以從別人那里學(xué)習(xí)吵瞻,其中一些你必須自己鉆研葛菇。
你讀到的每一條“原則”都有一定的適用程度,有時也要學(xué)會放棄原則橡羞。多觀察周圍的設(shè)計有助于提高自身的鑒賞能力眯停。
設(shè)計是一個不斷變化和發(fā)展的領(lǐng)域,會面臨很多令人興奮的挑戰(zhàn)卿泽≥赫總的來說滋觉,多嘗試蓖墅,多總結(jié)闺兢,祝你在設(shè)計中找到樂趣~
你有什么設(shè)計的原則或者技巧歡迎留言討論~