视觉设计不只是图形_网页设计教程

推荐：网页制作,改变你的思维方式
“重构”的春风吹遍大江南北，互联网一时间风声鹤唳，“divCSS”俨然已成为一种“时尚”，难以尽数的网站都不约而同地开始了自己的“重构”。然而打开这形形色

一般情况下我鼓励视觉设计师在设计之前一定更加深刻的了解设计需求：

1. 这个产品需要给什么样的一群人用，他们需要什么样的视觉感受。
   比如，你在给一帮老干部做一套软件，就别搞的像qq那样热闹。（曾经介绍过一次 “通过收集典型用户身上的视觉元素确定视觉风格”的方法）
2. 这是一个什么样的产品，它需要展现给用户什么样的”气质”和情感感受。
   上次说维信 的视觉设计感觉很好，其实很大一部分是在说它对于那些ajax动画效果的应用符合该产品”灵巧、迅速”的定位。它让我在感官上认为”这个产品很轻便、快捷，不会占据我手机的大量空间也大量的上网流量”。
3. 我有多少的创意空间可以发挥，是否需要遵循一些熟悉上的”定式”。
   比如，你做的一个产品在行业中已经有了很多同样的，他们已经把这样产品的定义上了某种感官的形态，那么是否需要遵循？ 假如更改自己的创意有多大风险？ 你有把握做到更好吗？
   （抱歉，这里没有典型的例子。我认为绝大多数时候视觉设计还是需要体现自我特色的）

视觉设计中的加法和减法：

1. 一个产品的视觉设计需求下来时，你不能马上就有很多的想法，这是一个非常普遍的现象。但，很多时候市场不等人，你的老板会要求你必须快速完成设计方案。
2. 那么，开始动手吧。 先从”减法”开始做起，用最简单的风格初步完成你的设计。也许他没有什么色彩和风格，也没有很绚缓的视觉展示效果。
   等你完成这个减法设计的时候，再后头看看想想，大部分时候你已经有了一个好的创意可以优化进去。
   就算没有，你只要在这个设计上做一些点晶式的修饰就可以完成这个设计了。
3. 当然，有些时候设计需求一下来你就会有很多的创意想法。
   那么，千万不要压制自己也不要蹑手蹑脚不敢去按照”创意”做。 把他们都给做出来。然后，把这些创意放在一起对比，结合起来，形成你的风格。
   但，最后一定要去做足够的”减法”。”把多余的都去掉”是一个必须认真作的工作。我们现在几乎成天都能看到很多为了视觉而视觉的多余设计。
4. 产品的存在是为了帮助用户完成某项任务。第一眼的”视觉感官”固然重要，但因为过多的多余修饰而影响了用户完成任务的过程就很不值得了。所以，警惕某些视觉效果会成为”多余的设计”，让你的视觉效果的应用应该适当其所，是设计师必备的素质。

这几年”用户体验设计”逐渐成熟，反到很多”视觉设计师”纷纷转行做”交互设计”或者”可用性工程师”。这是一个比较可怕的现象。归结这个现象，我认为主要原因大概有：

1. 视觉设计师的职能范围很小，导致很多有想法的设计师没有发挥的空间，经常在工作中受挫，能力得不到发挥和认可。
   他们的工作往往都具体于”颜色”"造型”等纯粹的”图形表现”上，连一个按钮的大小都很难有话语权。更有甚者：在很多对于设计不够重视的企业，视觉设计师只是作为一个”执行的工具”，视觉设计师连”用什么颜色”"按钮用圆形还是方形”都必须听命与治理者。
2. 比如，做电子商务网站的时候有一个”商品列表”的页面，pm告诉你”商品的名字要用14号的加粗蓝色字，商品描述用12号的黑色字”，这个时候大多数设计师会很不爽，往往甚至会开始闹情绪：”视觉上的事情你就不管了，你们丫根本不懂设计，这里用14号的加粗字太难看了。”，然后改成了一个自己认为更加”好看”的设计，往往这个时候pm也会较劲：”叫你用14号你不用，你看现在列表密密麻麻的用户根本不能一眼就明了的看到商品名…”。
   其实原因很简单：假如一开始pm就告诉设计师”这个列表一定需要用户很清楚的一眼就能看到商品名，其他商品描述不用那么突出抢眼”，根本不用具体说用什么字体之类的要求，设计师就明白了；假如设计师可以主动思考pm提出需求的原因，然后在保证设计需求的基础上让界面更”好看”一切都解决了。所以，问题应该是双方的。
   通过这个例子我们能看到：视觉设计师没有”理解产品思想”的机会，对自己应该表现什么样的产品形象和气质没有概念。很多时候不要说他们能提出来对于产品视觉传达的合理见解了，就算提出来也是会被否定。
3. 当我们把”视觉设计”只定位成”图形设计”的时候，”视觉设计师”的门槛越来越低，导致所有”视觉设计师”的待遇一致下降，更导致整个行业对于”视觉设计”的价值和能力产生比较的质疑，不愿意再在其中投入过多的成本。
4. 很多视觉设计师发现和他在一起的所谓”交互设计师”比自己的待遇好，而且他们做的那些”交互设计”（其实这只是”视觉交互展现的设”计而已，真正的交互设计pm都给合在”产品架构和业务流程设计”的时候给一起做了）自己也能做。
5. 很多视觉设计师觉得：做图形越来越没有空间，改做交互设计将来可以转行做pm，最后说不定还可以成为产品治理者。他们给了自己一个”被错误现实误导”的职业规划。（推荐：ued的职业规划应该是什么）

我必须马上解释一下关于”交互设计”的误区：

如，我们在设计一个im软件其中涉及到这样的一个功能：当有新的好友信息时在右下角弹出一个提示的”气泡” 窗口。那么，这个”气泡”是”从下往上缓缓推出”、”从右往左缓缓推出”、”从右角往左角缓缓推出”、”直接在固定位置弹出”、”由浅变深由大变小在一个固定位置缓缓出现”、”…”？？？
这个工作本不应该是由”交互设计”来完成了，所谓的”交互设计”指”用更加合理的信息展现方式更加高效的表现用户使用过程”，而非上例中说到的”视觉上如何动态展现”。

好的交互设计师在产品设计过程中应该完成的任务是：用合理的信息架构准确的将”产品结构”表现在”界面”上，并保证其充分的延展性；将”产品的业务及数据流程”准确的转换为最终展现给用户的(更加高效易用的)”使用流程”。

所以，各位交互设计师：把”视觉互动”的工作交给你的视觉设计师吧！在视觉上他们比你专业。你们应该更加关注”信息架构”和”用户使用流程”。

这个提到了 视觉设计占据整个体验46％的报告 被我多次提及，最后在这里再提一次。很多人反对这个报告的结论，但某种程度上我是持赞成态度的。因为我认为这里占据46％体验的视觉设计不只是图形，它应该包括一切和”视觉”相关的东西。对于任何一个产品来说，视觉设计不应该仅仅只是”用什么颜色、圆角还是直角、什么样的造型”等纯粹的静态”图形界面”。

分享：首次完整小型站点架构的心得体会
http://www.jzfestival.com/你现在看到的是我对近学习标准化网页设计几个月的一个测试结果。这次我力争将内容与样式分离及考虑到尽可能多的重用性，在图片压