立体设计技巧(七)

【译者的话】 如何使版面显得更快更洁净?当版面存在两个焦点时,假如处置让它们可以调和共处?如何应用细弱的字体增强设计的力气?如何应用复杂的元素设计一个醒目美丽的封面?如何让你的网页显得既明晰又咄咄逼人?五

【译者的话】 如何使版面显得更快更洁净?当版面存在两个焦点时,假如处置让它们可以调和共处?如何应用细弱的字体增强设计的力气?如何应用复杂的元素设计一个醒目美丽的封面?如何让你的网页显得既明晰又咄咄逼人?五个适用设计技巧,即刻奉上。

原文出处:www.bamagazine.com

版面:组织元素

我们的冤家理查德不断酷爱飞行,所以他集资买了一架飞机并在西海岸展开专机包租业务。我们可以随便晓得他的心思放在哪里:他所驾驶的喷气式飞机拥有各种高端技术设备,但他所设计的商业名片却让人觉得有点……。让我们看一下能否可以依照原来的根本版面改良一下他的设计,让他的名片与他的飞机看起来一样快!

飞机消费厂商曾经提供了一张十分捧的图片,但理查德却犯了一下我们常常会碰到的错误:他只是将版面中一些空白的区域填上文字。这些文字极大的障碍了飞机的飞行,缺乏层次,文字信息四分五裂。他将本人的名字设为天蓝色――这一点似乎在设计与有关航空时都是一种天性选择,但关于一张颜色饱和度不是十分高的照片来说,这种天蓝色显得过于扎眼。 Times Roman 字体用于文字当然是一种不错的选择,但关于飞机这种圆滑流利的对象来说,则显得过于琐碎,加了暗影的设计进一步添加文字的复杂感。

让版面放慢:我们将文字都移到上方的条状区域里(也更契合我们的阅读习气)。轻巧的细细斜体看起来“更快”。左上角的旗状区域在视觉上支撑着卡片。黑色及灰褐色传达出中性及商业气味,与照片互为补充。如今飞机四周没有什么东西挡住它的来路,终于可以自在翱翔。复杂的调整后出来的效果就是:层次清楚,够 sharp 的设计!

版面:联系区域

设计广告版面时,我们常常会碰到的一个成绩是:版面同时有两个焦点要突出,如我们所谈到的这个化装品广告版面,一个焦点是冲击力十足的照片,另一个是醒目的称号,你如何布置两个焦点但同时又不会相互发生抵触?处理方法很复杂:分开他们!将照片放在一个区域里,而称号放在另一个区域。但颜色及对齐要坚持协调,就象这样:

细心的读者或许会留意到,从照片取色是我们很多篇文章中所常常采用到的一个技巧。象这个版面一样,由于文字颜色均来自图片,所以既构成部分比照,但同时整个版面在视觉上依然是一个一致的全体。技巧无所谓老土,适用就行啦。

版面:健壮的字体使封面更无力

Giza Nine Five 字体线条如此的细弱,使其文字看起来象是一块坚实的区域,既传达出一种强无力的气味,也让设计变得更容易。关键是要配合好这种字体的力气感:

矩外形衬线:上图是 Giza 字体家族中五种最细弱的字体。其中 Nine Five 字体的线条厚重到简直没无形成负空间。所以我们象堆积木一样随便使用这些字体。在下面这个设计中,他们相互紧靠,整个设计十分空虚,没有给纸张留出多余的空位――四个元素把持着各自的阵地!

留意四个元素区域有各自的“纹理”及色彩。最上方的字体最黑, FIRE 这个字体呈短平粗状,注释呈细致纹理。不同的觉得既使各个元素没有相互搅扰,但同时又组成了一个强无力的视觉吸引力。

视觉焦点:矩形区域的特点是:给人稳重、平实的觉得,同时对角位也趋向于中心点,使视野自然地向内聚集。而这张照片自身呈矩形,同时其图片的元素也照应了这种特性――这张角度共同的照片使整个封面的力气感进一步增强。

版面:设计醒目的套入式封面

你需求一个既醒目又容易设计的封面用于一份复杂的文件上?想一下我们所戴的袖章――或许很多旧书封面两头都会加上一个套纸来推介书本――这种技巧我们完全可以使用在设计上。画一个程度摆放的区域,然后将文字直接放在下面,就是这么复杂!象这样:

元素的对齐是其中的关键:将整个页面分红多栏,然后将文字与其中的栏线对齐,再加一个程度的区域。颜色要契合主题(上方的主题是保险业――注),留意标题的颜色与背景构成最激烈的比照,假如你希望将这个程度区域使用一点暗影也可以,觉得会更象一个纸套。下图中,不对称的散布使版面更具静态,居中的散布显得过于静态。

假如这个封面你要在桌面打印机输入,但却担忧不能打印到页面边界?我们可以调整一下:

设置页边距,四边间距应该相等,然后加上一个淡色背景填充,这样才干够“重新定义”空间。

网页:向阅读者打招呼

Syd Lieberman 是一个专业讲故事的人,同时也是一名教员及作家――而他的业务也完全与此有关。为了让人理解他的相关状况,他象一位老冤家一样,“站在门口与你打招呼”,好象他又有什么风趣的故事要讲给我们听,让我们看一下他的网站是如何给人留下美妙的第一印象:

温馨的颜色:三个程度区域辨别使用于标题、导航栏目及简介。网页采用的一种温馨的大地色,下方采用了紧张的细微突变色,而上方区域使用了一些暗影效果。简直处于页面高度两头的导航区域显得不同寻常,也十分无效!

轮廓式的人物图片阻断程度线的延伸,截停你的视野,使你不由端详起这位学问渊博的人。人物图片采用了细细的暗影,发生了深度。留意人物 SYD ,标题及文字四周都有很开阔的空间,这使到几个元素都可以随便捕获。

一张大图片,假如充满太多艳丽颜色,出来的效果能够会吓人一跳。但这个网页中,这张人物颜色十分平实,呈不饱和状(上图四个矩形是从人物身上所取的颜色),背景的颜色异样运用这些相似色彩,使整个版面显得温馨朴实,咄咄逼人。

内页反复首页的元素――但尺寸变小:

在内页中,导航条移到上方,首页上方的设计显得繁复,而在内页中,异样延续这种作风,这使到下方可以展现各个主题。

延续性在设计中是十分重要的,其实也正如讲故事一样,在情节上异样需求有延续。在内页中,将首页的几种元素(人物、标题、导航条)等集中在上方,并以此作为一种根本款式延续到每一页。

美丽典雅的文字是设计中的关键元素。留意 Syd 老兄的名字是固定放在右边,而其他描绘性文字则固定放在左边,并随着不同的主题而改动,十分简约的设计,信息传达上也十分无效率。

细微突变:内页的突变与首页略有不同,显得更浅,由于在内页中有很多信息要放置,一个较浅的背景也使其可以与各种图片、文字及按钮等各种元素构成更好的比照。

本文所用颜色如下:

最新案例