灵感源于借鉴.doc

灵感源于借鉴 ——网页设计师王咏刚经验谈 （二） 经典借鉴手法二三例 说到这里，耐不住性子的读者多半已经嚷嚷起来了：“你说借鉴不是抄袭，你说纯粹的独创也不可取，那么你的中间路线到底在哪里？你能不能拿出几个有说服力的设计案例？” 好吧，我给大家看几个借鉴的例子。这些例子都是我自己在工作中积累出来的东西，既不十分高明也不十分专业，但它们都是借鉴与原创相结合的产物，放在这里还是有一定的说服力的。 从题材相似性中寻找灵感 如果需要设计的网页在题材或内容上与某个经典的网页设计相似，那么，我们不妨直接从这种相似性入手，在经典网页中寻找最佳的表现手法和设计思路。 例如，当我们要为某个商品交易和竞拍网站设计网页时，当然要参考一下此类网站的龙头老大——eBay的网页设计了。 图 1 值得借鉴的交易和竞拍类网页设计 图 1是eBay网站中的一个页面。该页面的设计特点非常鲜明：活泼、靓丽的色彩；用色块组成的栏目区域；栏目之间较明显的空白区域；醒目的操作指南（请注意图中“1”、“2”、“3”那三个表明操作步骤的醒目数字）；蓝色文字和黄色背景的对比效果；等等。这些特点显然能很好地满足交易和竞拍类网站的需要——否则它们也不会被eBay的管理层接受，而我们需要借鉴的正是这些最基本的设计手法和设计理念。 图 2 我设计的交易和竞拍类网页 图 2是我在借鉴eBay网页的基础上设计的交易和竞拍类网页。大家可以看到，在这个设计中，我一方面大量借鉴了eBay的设计思路和设计手法，另一方面也保留了许多我自己的独创性构思。例如，我用页面左侧的广告区域打破了eBay网页原有的纯横向布局；在展示交易步骤时，我将“1”、“2”、“3”这三个变形后的数字融入到了栏目区域的绿色标签中；此外，我设计的网页在色彩搭配，字体变形，图标使用和细节处理等方面，还可以体现出许多与eBay不同的设计思路——其中，每个栏目右下角的橙色三角形图标在平衡整体视觉效果上的作用就非常明显，因为它们可以和页面左上角公司徽标中的橙色区域构成面积或位置上的呼应关系。 从色彩相似性中寻找灵感 从主色调相同或相近的网页中寻找设计灵感是另一个行之有效的借鉴方式。比如说，我们要为某广告企业设计以黑色为主的公司首页，那么，图 3所示的网页就非常值得借鉴。 图 3 以黑色背景为主的网页设计 图 3所示的设计有一个最大的特色，就是在3乘3共9个方格构成的前景区域中，设计师将暖色（黄、红、橙、紫）与冷色（绿、蓝）间隔排列——这样的处理手法在黑色背景的映衬下并不会显得特别突兀，反而会使白色的前景文字呈现出不同的视觉效果。 图 4 我为广告公司设计的页面 图 4是我设计的某广告公司首页，这个设计将图 3中的色彩搭配与组合方式巧妙地继承了下来。也许，在这样一个风格、布局完全不同的作品中，“借鉴”更多地意味着设计思想和创作灵感在不同设计师头脑里的“超时空传递”吧！ 亮点组合和思维碰撞法 用不同的优秀设计作品激发自己的灵感，让不同设计师的思想精华在自己的头脑中反复碰撞，这种近乎“头脑风暴”的做法是我们由借鉴通向独创性设计的一条便捷的“时空隧道”。 举例来说，图 5、图 6和图 7所示的网页设计都是当代优秀网页设计的典范，它们在配色、布局、文字、线条、空间、图片等方面各有特色。你能想像得出，当我们将这三个网页设计的优点结合在一起时，会得到怎样的结果吗？ 图 5 值得借鉴的网页设计 图 6 值得借鉴的网页设计 图 7 值得借鉴的网页设计 图 8是我为某软件公司设计的网页。在这个设计里，我使用了图 5的基本布局及其借助透明色块来处理图片的技巧，同时也从图 7中吸收了阶梯形的色块变化、大面积的白色区域以及小巧的箭头图案等设计元素。此外，细心的读者也不难发现，图 6使用类似工程蓝图的造型来展现“专业”精神的做法也是我的借鉴对象之一，只不过，我把工程图变成了栏目背景中若隐若现的UML图示罢了。 图 8 我为某软件公司设计的网页 “通感”的妙用 如果你仍感到困惑，不知道该如何从已有的优秀作品中悟出具有独创意义的“灵感”来，那么，我可以向大家介绍一条奇妙而有效的“借鉴法则”： 使用“通感”的方法让借鉴升华为灵感。 所谓“通感”，其实就是不同的感觉器官或不同的艺术体验之间的“大串门儿”。无论是在生活中还是在艺术创作中，我们都能找到很多“串门儿”的例子。比如，人们经常形容某种声音很“尖锐”，那是听觉和触觉“串了门儿”；设计师们都知道某种颜色是“冷色”而另一种颜色是“暖色”，那是视觉和温度感“串了门儿”；批评家们经常用“韵律”或是“节奏”来评价某部文学作品，那是文学体验和音乐体验“串了门儿”…… 千万别小看“通感”的作用。在“通感”的帮助下，我们可以更容易地发现一个优秀网页设计的精华所在，而不是仅仅注意那些与