设计规范 - UCD大社区

产品之道-用规范来封装自己

行者 — 2009-09-11 17:18:05

工作两个多月了，上周给公司提交了工作报告，统计了最近的工作，大大小小的策划稿出了七、八个。

原本是计划一周写一次工作小结的，但因为目前项目的保密性要求，所以很多东西都没办法写出来。写案例是最有效果的，光写心得缺少实际的情景和内容，所以尽量找一些可以分享的东西出来。

本章写一些规范性的内容，主要思路是，做产品的，要用规范来封装自己。这里说的不仅是设计出来的产品要规范，另一方面更要时时有这方面的意识。

在可用性设计的原则中，有一条很重要的指标就是一致性，同个性质的元素不应该出现二种以上的形态，便于用户识别和体验。

而产品的规范，也是一致性远离，不过目的不一样，产品规范的目的一方面是有效沟通、另一方面是快速完成工作，导出高效、高质量的产物。

最近项目中跟同事配合整理了整个项目中的UI规范，个人觉得一个项目特别是多模块的大项目，一定要在事前理清好这些规范，在开发的过程中，才不会引起混淆及后面需要额外付出人力成本来统一。

规范的类型，在我的第一次学习计划中有提过，包括：

（一）策划文档规范

（二）功能结构、功能清单规范

（三）用户调研模板（调查问卷、访谈问卷等等）、人物角色规范

（四）原型图规范（模板和控件、规则和说明规范）

（五）交互设计规范（UI规范和交互规范，概念设计）

（六）流程图规范

（上面的案例都是上个项目的一些产品，有些地方可能做得不好，大家看看就好，不过过多注重形式）

在我参与的最近两个项目以来，一直在陆续整理着这些方面的相关材料。

有志于做好产品的童靴，建议多花点心思在这些方面

相关话题：设计规范源地址：http://joshes.cn/post/9.html

设计规范不应是摆设

兰思 — 2009-06-24 00:56:17

大部分公司，都会或多或少的有设计规范。而大多数设计规范往往是在某个角落里面，多的放了三年五年，少的放了3，5个月。

设计规范本来是一个好东西，但是为什么没有用处呢！

设计规范不仅仅是几页纸的文字

我们看看这些公司的设计规范是怎么出来的：

A公司是个新成立的公司，刚组建起来的设计团队中，大家各自有各自的想法，于是，老板给产品/项目经理/设计经理下了个任务，快点把设计规范制定出来，不能总是这么乱下去；于是乎，A公司的某个经理奋战了一个星期，终于写出了厚厚的设计规范； B公司是个已经运营了有一段时间的公司了，但是一直也没有设计规范，突然有一天，老板心血来潮，或者在**地听说设计规范是个好东西，于是找到相关的经理X。“你是不是该制定个设计规范了”。X也很郁闷，没有设计规范不是好好的吗？难道我们的项目，哪个因为没有设计规范出错了。于是X只花了一天的时间，草草的给了老板一个规范；

这两家公司可以预见的结果就是：A公司的设计规范出来以后，思想还是不统一，甲在这个地方钻点漏洞，乙那天因为“特殊情况”没有按照设计规范设计，丙又说项目紧，没办法完全按照规范来。久而久之，连制定这个规范的经理都不再看这个规范了。

B公司的老板看到这个也没太在意这个设计规范，于是这个规范就直接的睡在那里了，整个团队还是原来一样的做事。等整个team的人渐渐的多起来了，X经理不仅感叹，怎么招进来的人水平越来越差，难道是人心散了，队伍不好带了。

兰思的想法是，这两个方法都不可取，太早的就制定好设计规范，不但限制设计师的思路，而且也是很难被接受，在后面的某个点盲目的建立设计规范，往往是产品的团队的习惯已经形成，甚至这个习惯是没有办法被改变的。

团队的形成和设计规范的形成应该是同时的

兰思在以前的一篇文章中就说过，设计规范是由某一代相互之间有默契的team成员的默契传承下来的，而本文中同样要提到的是，设计规范是在整个团队的运作过程中，一点一点积累起来的，团队的任何一个人都要对这个事情负起责任，尤其是团队的领导人员。

在项目到达一定的阶段，或者是某个项目完成的时候，一个的团队需要在一起讨论在项目中有什么发生了什么问题需要避免，有什么好的经验和工作方式可以用在其他的项目中，当这些讨论的结果被应用在其他的项目中，以避免那个重走以前项目的弯路，或者用以前的经验使得后面项目的工作变得简单的时候，即使设计规范没有被写成条文，由公司的某某部门发文，但是设计规范已经形成了（当然，设计规范还是要记录下来，这样更方便传达和查阅）。

设计规范的建立是个长期的过程了，任何人都不能急，也不能忘。

设计规范应该是帮助工作的，而不是限制思路的

设计师往往是抱怨，按照那些鸟规范，完全没有办法做事情，或者是自己实在没有发挥的空间。

不论是设计师还是工程师，都比较自信或者说是自负，一旦在他的思路上加上一个框，往往是感觉四处受到限制而没有办法尽情发挥，甚至有人说这个设计规范完全是抹杀设计师的创新能力，可以说部分设计师和工程师抵制规范的原因也是在此。

看起来的确是规范在一定程度上限制的思维，但是设计规范并不是要限制设计师思考的能力的，如果一个设计规范在限制了设计师的思考，那么这个规范并不能说是成功的规范，设计规范应该告诉设计师，你的“前辈”犯过什么样的错误，这样的错误可以用规范中的办法去避免；或者你的前辈在某些方面取得的很好的成绩，这个规范就是按照这个定的。在设计规范公布的条目中可能不会写这些内容，但是在详细的说明中，最好把背景一起放在里面，以便于设计师的理解为什么这条设计规范会存在。

当一个规范不是在限制工作，而是在帮助设计师工作时，那么这个规范想必更容易被设计师所阅读和接受。

对于打破设计规范的 应该奖惩分明

一个设计规范在制定的过程中，由于种种地原因，难免有不符合实情的地方，而且随着时间的推移和外部环境的变化，难免有不再适用的条目。因而，设计规范和奥运会的记录一样，仿佛就是天生要被打破或改写的。

但在另一个方面，设计规范的存在，就象社会上的法规一样，在公司里面，对每个人都有约束的力量，没有充足的理由不容挑战。这两点对于设计规范的应用上，是一个非常矛盾的事。

任何一个设计师，在自己的工作职责和权利范围内，都有不遵从设计规范，甚至是打破它，制定新的设计规范的权利。但是打破设计规范是有风险的，任何这样的行为都应该被仔细的跟踪，并且在最后确定效果，对于在全局（请注意是全局）上起到正面效果的，不但要鼓励，而且要奖励。但是同样的情况，不论是在什么情况下，打破设计规范，造成一定后果的，都应该以相关的管理制度进行惩罚，以保证设计师在没有非常大的把握的情况下，去违反和破坏设计规范。

后工业时代的后规范思考

admin — 2009-06-02 11:53:39

07年，我是极力推崇网站规范制作，好处很多，对商业，对用户，对设计师。我们走了两年，现在有了一定的成效，我们也看到了规范所带来的好处和便利。看看我们通过规范，模板，标准控件，能快速制作出多少页面，产品来，这种工业化的操作的确给一个大网站带来了天翻地覆的效率。
现在，我又要开始极力去推崇后规范时代的重构与打破思维了！
为什么？因为现在是后工业时代，我们要从大环境背景说起。
17世纪工业革命之前，世界产品制造基本属于手工作坊，产品完全依靠每个劳动者的手工制作，也发明过简单的流水线作业，这样出来的产品，每个产品都有各自劳动者的特点，但最大的问题是工作效率低下，同一类产品会导致水平参差不齐。
工业革命的工业大生产，提供了良好的产品制造标准和机器流水线，工作效率上百倍提高，商业规模也上百倍的扩大，人们用到的产品有了统一的规格和质量，也有了统一的使用习惯，同时产品的价格也大大降低。之后，全球化，品牌化，随应而生。
上世纪末，量身定制，个性定制，自定义设计开始进入大众视线，计划经济后的开放经济让人们内心个性需求开始膨胀，大家看厌了一成不变的产品，不喜欢毫无个性的东西，更甚者开始推崇手工作坊时代的物品，这样，应声而出了宜家家居这种自定义家居产品。
以上简单的回顾历史上的产品设计，其实不是简单的轮回，而是更进一步的发展，产品的标准化不是简单的千篇一律，发展到这一步应该是更高级的利用工业制造来满足个性需求。
看我们的互联网产品，是不是都要这样来做呢？答案是否定的，任何事物都不能一盆水端平。我把我们的产品分为三类，一类是快速应用型，产品的目的就是快速应用，不能让用户多待一秒钟，而且让用户走的明白，走的确认。这类产品往往是流程设计，注册设计，表单设计，搜索设计，因为要求快，这种设计往往需要高度简洁与易用（不排除因为品牌效应而做的个性设计，比如每个网站的登录框）。
另外一类是自我应用型，产品归用户来管理，比如个人空间，我的XX的产品，这类产品的目的是留住用户，希望用户能多点时间呆在这里，因为其他用户可以访问使得用户自己希望自己的空间有个性，与众不同，自定义的设计产生。而为了网站提供的应用可以插入到任何人的地方（当然一般插入与否是用户自己的行为），这种自定义又是控制在一定合理的统一框架内。
还有一类，不需要自定义，也需要个性化设计，而且是有一定的品牌性，页面内容相关性，我叫它服务应用型，垂直网站就属于此，这些产品不属于用户自己，但需要给用户灌输品牌特征，让用户明白设计表达出了内容特点，所以，美容产品不能设计成数码产品的样子。
通过以上三类产品，我们就可以看出，其实对待产品设计，不能用一个标准来对待的，分析清楚各自的特点和实际给用户的反应，设计师们要有针对性对待，所以有一种言论：“你这个产品搞特殊，那其他产品是不是都要特殊”。这句话本身就已经一盆水端平了，有计划经济的味道。

相关话题：设计规范源地址：http://dimcolor.com/blog/?p=516

后工业时代的后规范思考2——如何应用

定候 — 2009-06-07 23:01:29

我们的规范到底做到哪一步算是发挥良好的价值？
其实一件事物我们理解错根本目的会导致出大不一样的结果，直接反应在设计师到底要体现什么的价值。
想想我们天天最大的工作量是在什么地方，产品应用创意？制定清晰的信息架构？新用户体验？交互逻辑关系？还是开着制作软件去左三个像素调边距，为了一个虚线去画半天，文字行距调来调去，图片尺寸争执不休…
我想大家都明白我们要做什么，所以规范的问题就来了，如果等你做完一个稿子，用规范来卡你：行距不标准，容器边线的颜色不规范，字体大小有问题，图片尺寸不标准…回去重新调整，然后设计师吭哧吭哧放大像素一点点的去调整，结果制作时间又延长一倍。你再给设计师说规范的好，我想没人去从心里真正相应你，只能说这是工作规定，不得不遵守。
规范好，但不是这样做的。
首先，根据上一篇所述，一刀切产品肯定有问题，根据不同特点和用户使用心里去规划制定好各自合理的规则，先要保证的是这个规则是合理，有效，易用，符合用户使用心里的（这部分也是需要时间去不断演化和发展）。这个前提下，如何应用的问题将是最重要的，直接影响到设计师的工作内容，就像上面所说的，这是堵墙还是电梯。
规范可以到设计制作的每一个环节：交互，视觉，前端代码，再加上用户研究，用户测试，文案制定。用户不知道我们有这些环节（这些也仅是产品的一部分），用户看到的就是产品上线本身，上面讲到的是一个整体。如果说一个月设计时间里，一两天简单了解功能需求，剩下大部分时间全部用来消耗在制作上，也许用户看到就是一个没有新意思维，应用平平的普通产品。要是我们还是用一个月时间，前期大部分时间来规划好产品，设计师根据创新思维去提出更合理，更易用，更贴心于用户的的设计方法，后面的制作其实我们用规范了的机械化操作来大幅节省时间，那么最终用户看到的将感受完全不一样。甚至说没有必要用或者没有创新思路，那么起码我们还可以一个月做2个，甚至3个产品出来。
问题的关键就在如何真正节省机械化的时间。
工具，任何工具的使用目的都是为了让人们生活工作方便，我们设计产品的目的也毫无疑问的是这样，那么我们设计产品的过程也应该是让我们方便的。时间花在一个好的创意点上，哪怕有技术成本，但这个成本一定会被机械制作成本的节省所抵消。
时间是金钱，就看花费这个金钱换回来的是石头还是钻石了。

感谢二当家抛出对此问题的看法，应该会有设计方法革命的。

设计模式库大搜罗

包总-代理掌柜 — 2009-02-17 01:00:33

对于一个设计团队来说，好的设计模式库能够帮助实现规范化，从而减轻界面开发的工作量，提高一致性。而对于设计师个人来说，设计模式库有助于减少误用、滥用，以及无效的创新。

著名交互设计师Jared Spool曾总结出优秀的设计模式库应有的元素，它们包括：

- 模式名称（Pattern Name）
- 描述（Description）
- 应用场景（Context of Use）
- 在何处使用（Where to Use it）
- 原理（How it Works）
- 规范详情（Specifications）
- 相关模式（Related Patterns）
- 其他实现模式（Competitive Approaches）
- 源代码（Source Code）
- 可用性研究结果（Usability Research）
- 讨论（Discussion）

如今最为著名的模式库之一无疑是雅虎的咯~~~

YDL采用了比较传统的模式分类——

每一模式都会有总结、应用场景、解决方案、原理、举例等，有的还有相应的代码。

另外一个比较有名的模式库是UI-Pattern，目前有47种模式。对于每种模式的介绍与YDL大同小异。但这个模式库是开放式的，注册后可以贡献模式或模式下的样例，用户还可以搭建自己的模式组（user sets），还可以为模式评分。

用户贡献内容是王道，所以此类模式库也不断涌现。

Interface Design Patterns

这个模式库的分类比较特别，增加了按照设备以及输入输出的筛选。

每个模式除了标准化的介绍，还会有例如用户添加的标签等元数据。

UX Patterns Explorer

这个模式库又换了一种分类思想

对单个模式进行介绍时，用了比较动态的样例展示，不过感觉使用体验不是特别好，呵……

Pattern Tap

这个跟UI Pattern的组织结构比较像，主要是按收藏集（collection）、标签来分类，用户也可以自己创建组。目前有46个收藏集。感觉这个库的内容偏艺术性一些，对于每个模式也没有详细的介绍，应该说是案例库才对。是汲取灵感的好地方~~~

Info Design Patterns

这个模式库更偏重可视化的模式，比较特别的是会有一些模式效果演示。

另外还可以参考的资源包括——

Search Patterns: Peter Morville收集整理的与搜索有关的模式库
Designing Interfaces :Jenifer Tidwell所撰同名书的网络版
Designing Web Interfaces：Bill Scotts所撰同名新书里提到的模式的案例

Bill Scotts新书可参考这个PPT哦~~~

Designing Web Interfaces Book - O’Reilly Webcast

View more presentations from Bill Scott. (tags: rich ajax)

以上谈了很多可借鉴模式，但是反面模式（anti-pattern）同样值得借鉴并避免，Bill Scotts也有专门谈论这个问题。这些反面模式都有超奇怪的名字，晕~~~

Design Anti Patterns - How to Design a Poor Web Experience

View more presentations from Bill Scott. (tags: design web)

另一篇文章同主题的文章也提出了10种反面模式，也是不错滴~

本期采茶人：小何老师(Helicopter in the air)

如您有英文阅读习惯，不妨来做采茶人。

迷你屋视觉规范简介

臭鱼 — 2009-02-09 07:46:53

迷你屋商城项目在视觉设计的过程中建立了一套相对简单合理的视觉规范，这里介绍一下规范的内容以及制定规范的思路。建议您在阅读此文之前先对《迷你屋视觉规范》有个大概的了解。或者对应着规范阅读本文。

制定视觉规范的基本思路：在整体设计的基础上，规范出具体视觉元素的表现形式，在更多的页面设计中，应用规范，而不是每个新页面的设计都重新创作。通过对页面元素表现形式的定义，让整个网站视觉表现更具一致性，视觉识别更容易，从而提高用户的使用效率。

“所谓设计，指的是把一种计划、规划、设想、问题解决的方法，通过视觉的方式传到出来的活动过程。”—《世界现代设计史》王受之

设计是一个有意识的计划、规划信息的活动。从这个角度来说，制定并执行规范过程本身就是设计。

迷你屋商城视觉规范在之前大量的视觉设计基础上加以整理、提炼出6类，共13项基本界面元素。商城中的所有页面都严格的依据视觉规范进行设计。下面简要介绍一下迷你屋商城视觉规范的具体内容：

文字颜色
文字颜色定义了三种，分别是：突出色，正文颜色和辅助色。
突出色是页面上的最抢眼的颜色；正文颜色，无需多解释；注释、说明之类不需要太让用户留意的文字使用辅助色。

一个网站的文字颜色总体上可以按上面这三种划分，当然不一定只有三个文字颜色。单纯的来看文字颜色，并没有太多的问题。但文字颜色与链接样式；文字颜色与页面背景颜色这两个问题就比较复杂了。这些问题将在下面分别讨论。

链接
链接最传统的表现手段是：蓝色+下划线。但是由于这两个表现手段明显的缺陷，多数时候难于应用。
从上面这个最传统的表现还可以演化出很多种链接的表现手段：
1. 链接文字只用蓝色。链接文字默认状态时，只显示为蓝色，鼠标经过时再出现下划线或者反色。Yahoo.com flickr都使用的是这样的方式。这种表现的缺陷：网页上多数文字是有链接的，于是页面上多数文字都是蓝色的了，视觉表现可发挥的空间比较小。
2. 链接文字只加下划线。有下划线的文字是可以点击的，这是足够清楚的表现了。这种表现的缺陷：很多链接的时候，就会是满页都是下划线了。同样是让视觉表现比较痛苦。
3. 列表文字默认不加下划线；分散出现的链接有下划线。Qzone就是应用的这种。缺陷：在一个页面中同时出现这两种情况，和列表中的链接相比，分散出现的链接加了下划线，显得更为强眼，更明确的传达出“可点击”的信息。而分散的链接并不总是要强调的。所以需要再用其他方式补救，必要的时候让列表突出。Gmail中有比较不错的方式。

链接的表现方式也许还有更多，但无论是什么样的表现，都需要确保一个基本原则：操作前操作可识别，即，直接浏览页面就可以知道哪些文字是可以点击的。

迷你屋商城页面中主要是图片的展示，文字相对较少，很少在一页中大量出现链接，因此采用了第二种方式：链接文字只加下划线。

第二种表现方式链接的表现并不涉及颜色，任何颜色的文字都可以加链接。之前我们也规定好了不同类型的文字使用的颜色。这样的组合规范自由度较大。文字的颜色取决于它的重要程度。非常重要的用紫红色，非常次要的用灰色(辅助色)。有链接则加下划线。不存在“链接文字需要强调，但又不得不用链接文字的固定颜色”的问题。

背景色
背景色也是一个应该与文字颜色一起考虑的元素。迷你屋商城视觉规范中定义的背景色，除了白色背景，另外主要还有两种：辅助的浅灰色和主色彩-橙色。

浅灰色是用于区隔内容，内容表达上并不总是能用边线来区隔的，那么可以使用这个浅灰色作为背景加以区隔。

主色彩是一个网站的主体风格。用于类似导航等位置的背景。这里需要强调的是：主色彩只能用于背景而不能用于文字，而文字突出色只能用于文字而不能用于背景。这是因为，主色彩背景上会显示各种样式的文字，以amazon为例：

主色调的背景下会出现各种文字，强调色的文字、正文文字、链接，甚至是辅助文字。因此需要背景色能适应上面所说的种种文字。

主色彩上的文字有可能会出现强调色文字，所以，主色彩和强调色文字不能是同一个颜色。主色彩上会显示链接，如果链接选用了蓝色文字颜色的方案，主色彩最好不选用蓝色，在蓝色背景下显示蓝色的链接，效果不好，如上图。

迷你屋选用了橙色。选用橙色是出于产品内涵的考虑，因为迷你屋是一个结合Qzone与QQ秀的产品，在黄与红之前。但是，作为主色彩，橙色并不是最好的选择，橙色比较抢眼、亮，页面上需要突出的是强调色的文字和突出的按钮，而不是主色彩。主色彩并不宜过亮。在橙色的基础上再选择更亮的颜色作为突出的文字颜色，我们选择了紫红。

按钮
共定义了大、中、小三种样式：

这三种样式的按钮，尺寸大小不做严格限制，可以根据页面上的具体情况适当缩放，但保证在同一页面中，第一种按钮的尺寸不小于第二种；第二种不小于第三种。

有了尺寸上的自由度，实际上，只需要两种按钮样式就够了。一种紫红色的，一种灰色的。为了给视觉表现上留出更大的发挥空间，我们将紫红色的“强调按钮”又细分成了两种：圆角的和方角的。这样设计使得页面表现更为灵活，同时确保页面上按钮主次清晰。

由于突出的文字颜色选定了紫红，因此在按钮设计中，前两种表示强调信息的按钮同样使用了紫红色。这样使得色彩的使用有了一致性，即，在一个页面上：紫红色的信息都是突出的。

单元框
单元框是指网页上为了区分一个个基本的内容而设计的表现形式。一个网站这样的单元框可以不止一种表现形式.迷你屋商城的单元框设计从简，只设计了两种：有标题栏的和没有标题栏的。

Tabs页签
对于tabs页签的设计，只强调一点：tabs有三种状态-当前态，非当前态和鼠标经过状态。不规范的设计中，往往会用当前态代替鼠标经过态，这样设计是存在缺陷的，当没留意当前光标位置时，会误以为有两个当前栏目。

迷你屋商城的设计是第一次比较系统的制定并执行规范的项目。规范本身还很简单，缺少很多细节。对于一个长期运营的产品，类似的规范需要在之后的长期维护过程中，不断添加、修改，逐步细化。但是，规范的不断优化并不意味着无休止的添加新内容。视觉规范也不应是在完成所有设计稿的基础上整理视觉元素的表现方式，而是有意识的在设计的早期固定下视觉表现。原则上，规范条目应越少越好，更少的表现形式用户的学习成本才能更低，使用效率才能更高。如果一个网站的视觉规范中规定了10种按钮的样式，那基本上就等于没有规范了。

迷你屋商城在制定视觉规范之前就已经有两位视觉设计师参与，历时一、两个月，在比较充分的视觉设计基础上，以交互设计师为主导，提炼出视觉设计元素，形成了规范。在通常的视觉设计规范的制定过程中，视觉设计师往往是主导力量。交互设计师与产品经理需要更多的考虑需要规范哪些元素，视觉设计师决定每个元素的表现是什么样子。具体的执行可以参见迷你屋商城。

相关话题：设计规范源地址：http://webteam.tencent.com/?p=617

初尝规范甜－ISD规范浅谈

浩子 — 2009-01-07 13:00:38

最近常常看到有人在网上谈起web设计规范这个话题，而这半年中ISD也在如火如荼地制定着各种规范，所以我们觉得有必要和大家分享一下我们这半年来我们遇到的问题和经验.

就ISD来说，制定规范的初衷在以下三个方面
1.品牌风格在探索中被明确，品牌备忘和梳理势在必行。
2.产品线日益丰富，后续设计一致性和可循性的要求被提高。
3.公司机构壮大，新人不断流入，沟通和执行效率急待提升。

在这之前，我们已经拥有许多零散的规范，但多为某一样特定产品的制作标准，例如给CP外包制作时的品质规范等,而对ISD四大业务的梳理(QQ会员＼QQ空间＼QQ 秀和QQ音乐)，实际上是从08年中旬才开始的。
半年多的时间，我们陆续完成了:

QQ空间完整的portal线上规范、空间模板规范，以及细节到空间loading、挂件制作的规范；

QQ音乐针对portal和miniportal的线上规范；

QQ秀改版后的新portal线上规范；

以及QQ会员改版后整理出的一套PPT格式的设计规范；

这些规范为我们带来了便利，指明了方向，提高了效率，甚至一定程度上为设计团队赢得了认可…白纸黑字果然是解决意见分歧的最好方式…好吧，付出总会有回报的，规范的好处想必大家也都了解，这里就不繁述了。
重点在于，我们的规范还可以更规范一些：

1．别把规范做成了VIS手册。
目前我们的规范中还有太多华丽的词藻，类似花大篇幅介绍网站的配色方案这样的方式，把规范做成了花架子，几乎没有人会去用到它。我们的设计师大都受过平面设计公司的影响，一说到做规范，总是会下意识地做成企业VIS手册，想必这VIS手册里面的门道大家也都了解一二，那都是忽悠客户用的…当然，我们不是排斥装饰，但如果把过多无用的规范整理成华丽的效果图，或是无中生有的编织许多美丽的花圈，显然是不符合ISD的现状的，规范应该更加务实。

2．别让规范拖累了你。
我们在制定每一个规范的初期，都很担心规范的制定会限制了设计师的创作，所以我们没有把规范做到细无巨细，类似文字的左右边距这样的规范，其实是有非常大的不确定性的。所以我们还是倡导在规范中加入一条设计意识的规范，比方说，在设计中的找对齐，以及在设计后的去繁求简。只有大家的设计意识被规范了后，设计品质才会真正实现质的突破。当然，一些灵活的规范，例如：可定制式的模块规范也可以很好的解决这些问题。

3．规范也要有“试用期”。
在规范执行的时候，我们总是会遇到一些别扭的条目，让我们进退两难，有些设计师就干脆直接把规范给“扩展”了。确实，我们一般都是在关键设计完成后，来制定规范，很多条目并没有经历过各种情况的考验。所以，如果实践是检验真理的唯一标准，那么就也给规范一个试用期吧。

4．不要忽视了规范的用户体验。
规范做好了，是给大家用的，除了不要用过多无用的装饰来干扰规范的可读性，对于敏捷的互联网设计团队来说，“目录准确”“标识图容易懂”“文件好找到” 等，也是我们所不容忽视的，为什么许多规范在上线后，我们的设计师都记不住地址，是不是很多时候，我们的规范倒不如一个PSD源文件来得便捷些。

5．规范的规范。
说完了前面的这些感想，我们理所应当地想到，对于ISD这样一个产品丰富的部门，我们的规范是不是也应该有一个统一的标准，而不是像现在这样，规范分类不同、规范描述不同、图文标注不同、文件格式不同…
看样子，想要更专业，还需要付出更多的努力…

这些就是ISD在摸着石头过河中的一些简单的心得，对于规范，我们浅尝但绝不停止，之所以把这些思考写出来，是想大家共同来关注这个互联网设计规范这个话题，希望大家多多指正，多多交流。

相关话题：设计规范源地址：http://webteam.tencent.com/?p=159

从网易用户体验谈开去

arthy — 2008-10-31 23:41:58

一年多以前刚进入网易的时候，比较惊讶的是美术部还没有自己的网页规范，只有小莫同学一些比较原始的条目，刚好那时自己收集过其他一些大型网站的视觉规范，并为以前公司做过类似的标准，于是欣然接受了重新编写网页视觉规范这个任务。后来出来的版本增加了非常多的条目，有些条目看似比较冷门很少人关注，不过在我看来对于提高用户体验是非常有帮助的，而恰恰是网易做得不太好的，借博客这里解释一下某些条目列入网页规范的原因。那时在写规范的时候还总结了版面影响体验的一些具体问题，后来由于各种原因不了了之了，现在也同时在这里总结一下拿出来给大家讨论讨论。先声明一下，观点仅代表个人意见，欢迎拍砖。

网页规范中诸如固定标识、页面结构、header、footer、文字规范、色彩、统一按钮样式等是属于用户体验中品牌性的范畴，品牌性反映的是品牌形象，各网站之间没有统一的标准衡量，是很具有特异性的，需要公司整个决策层去制定，但需保持一个网站内品牌形象的一致性和延续性。其实有时老罗同学说得也是对的，新浪的排版、色彩、结构不一定就是好的，但给用户接受和习惯了之后它就牛了，说的其实就是品牌性问题，对比这些其实无太多意义，而一味模仿只会越发损失自己原有的品牌特征。之前改版组一次讨论到首页改版问题，就谈到新浪的首页改来改去都基本是老样子，考虑的可能就是品牌延续性问题，而网易二级栏目页里大间隔分栏加频道标识则是网易独创，品牌性非常明显，而品牌特征非常明显的东西个人希望是延续和保留的。

其实以下要讲的问题基本都不涉及用户体验中的品牌性，也不属于内容，而是功能性和使用性。功能的健全与否、能否及时得到信息及反馈、是否易用、是否符合使用习惯、使用中是否友好、是否能有预知性等等是功能性和使用性的范畴，这方面其实是有标准的，也较容易评判，也比较容易发现问题。要改善用户体验，改善功能性和使用性则更显得迫切，也能更快体现效果。

一些样式上的误导或者不统一带来使用上的认知失误和非预知性

网页上一些交互按钮或标签，强调的是操作的可识别和可预知性。如果鼠标移上一个按钮区域，而这个按钮没任何反应的话，那说明这个按钮是不可识别的，会令用户非常迷惑。网易页面上还有不少此类情况，样子是按钮的样式，但鼠标移入按钮的区域是没任何反应的，其实是要移到里面的文字才会有反应，如下图。

解决的办法要么就取消按钮的样式，要么就把整个按钮区域加上链接而不是只有文字有链接。

标签有4态，激活前、激活后、鼠标移上和点击，不过现在一般都缩减为3态或者2态了，这倒不是最重要的问题。如果一个网站不同的页面上甚至同一个页面上混杂着标签鼠标移上就激活和需点击标签才激活两种操作方式的话，那会令用户无所适从，因为用户不会花心思去记住你这个标签是鼠标移上就激活还是需要点击才激活，常常会出现操作混乱和失误。如下图网易首页的标签是鼠标移上即激活，而到了体育首页和财经的的切换标签便需要点击才能激活了。

有同样问题的还有很多页面的焦点图变换，如图体育的是点击激活，而其他的则是鼠标移上激活。

解决办法是全站统一一种激活方式，让用户习惯于一种操作方式，减少用户使用前不必要的思考。

增加解释性标签的必要性

如下图中一个例子，为了迁就某些固定宽度的板块，又不愿文字链折行而影响美观程度和令内容减少，造成的后果是用户只能看到文章标题的一部分，甚至只是一小部分，连大意还弄不明白。

而此处用户移上鼠标没任何提示性语言，用户就只能是一个个链接去打开才能清楚知道文章内容是什么了，但用户不会那么有耐心去一个个点击，也许他漏掉了他关注的内容。网易还有不少地方存在相类似的情况，文章标题未完而用省略号代替的情况下，添加title标签显得尤其重要，这可以令用户不必每条链接打开而鼠标移上便可以看到完整的文章标题内容。

Title标签的作用还不仅于此，对于某些评论或者和某篇文章相关的内容，可以添加title属性指明对应的文章。而一些栏目的“更多”链接，有时用户并不十分清楚这个“更多”打开的是什么，添加title标签可以十分明了的告诉用户这个“更多”将链接什么内容。如下图新闻首页首屏的更多链接，用户就不是十分清楚打开的是什么，如果添加个title标签注明是打开更多重磅回顾，则清晰明了很多。而在网易的页面上，基本不存在title的提示功能。

图片的Alt属性标签具有类似功能，还能提供显示不了图片的时候提示文字功能，因此显得更为重要。这方面网易有些页面较为规范，但有些频道页面的图片就基本忽略了这个标签。

增加解释性的标签，除了上述所说的增加人性化体验外，还有重要一点，对于SEO也是非常有帮助的。

导航的一些看法

先说说自己以前碰到过的一些故事：我一直比较喜欢看新浪的体育新闻，我一般是输入新浪网址，然后从新浪首页的顶部导航点击进入体育频道，以前新浪的导航体育的链接位于第二行第一位，因此我养成了一个习惯，打开新浪首页后我几乎是不会看导航的字，而是把鼠标直接移向导航区域的第二行第一位。但有次我失误了，点出来的竟然是新浪的新产品爱问，倒回到新浪首页一看，原来是新浪的导航顺序变了一通，体育标签不在原来的位置上了。由于习惯的问题，竟然过了两三周我还是不能接受体育这个标签调换了位置这个事实。

另外一个遭遇是关于网易首页服务产品导航的，由于工作关系，popo对于日常来说还是比较重要的，有时popo发生错误，更新升级，或在另外的电脑登陆，都需要去下载和安装popo，以前在网易首页服务产品区域列表那可以轻松找到popo页面，现在是把popo的链接在产品服务导航里直接给取消了，为了查清楚这个入口是不是隐藏在首页某些隐蔽的地方，我特意点源文件出来Ctrl F了一下，发现整个页面都已经没有了popo或泡泡的字眼。幸好是自己记住了popo.163.com这个域名直接输入进入的，不然估计又要去百度了。

由此可见，保持导航的稳定性非常重要，包括一些产品服务的导航和二级频道导航，如果导航一两个月内变动一次或几次的话，那导航基本就等于废了，也留不住用户了。每更改一次导航，必将会导致一部分忠实的用户流失，这是毫无疑问的。

现在的频道是越来越多，频道里的栏目也越做越多，总希望把新的一些栏目往导航里堆，而导航里位置却是基本固定的，只能把一些旧的，点击率不高的栏目从导航里撤掉，但这样又会造成一些点击率不高的栏目更少人去看了，可能把一些忠实的用户也赶走了，形成恶性循环。

怎么解决这些问题呢。个人认为导航中保留一个固定位置作为全站地图式的列表页是非常必要的，这个会是导航中最稳定的一个，会逐渐引导一部分忠实用户使用这个快速的到达自己需要看的但在主导航上没有的栏目，也许是一些比较冷门的栏目，但不能忽视其中的价值。貌似长尾理论套到此处也很好解释，在成本不增加的情况下，更多的关注长尾人群的利益，会收到意想不到的效果。新浪、QQ在这方面做得比较好，而网易没有提供类似的功能，比较遗憾。其实这项功能可以进一步改进一下，把新开单独的导航网页换成鼠标移上浮动显示的方式，则更加人性化一些。

顶部登录区该提供什么

网易二级频道页面的顶部登陆区都没有设置注册按钮，有登陆便有注册，有了注册才能登陆，这是约定俗成的习惯，有登陆的地方用户一定会搜寻注册的地方，不能随便把一些方便的按钮去掉。如果是从其他途径如搜索引擎引导过来的用户，第一次进入网易页面，如果有较为明显的注册网易通行证按钮，会带来潜在的注册用户。

登陆后已经可以读取到注册用户的信息了，现在只有邮箱的一些信息，其实可以把一些需要登陆才能使用的功能产品罗列，让已经登陆的用户很方便的使用其他功能，同时也能吸引注册用户去使用新产品，进一步提高用户粘性。如：欢迎，XXXX，进入邮箱博客交友拍拍印象派。

现在网易还有些页面如首页还不能读取登陆后的信息，需要用户重复登陆，体验不够好。如能引进一些新的体验功能，如异步的显示新到邮件、新的评论等，则对用户体验来说更是一个极大的促进。

Flash动画在网页上对用户体验所产生的不利影响

在其他大型网站视觉规范中都会有动画这方面的限制，因此我把这条也单独列一项到视觉规范里。其实这条规范貌似不太引人注意，而我们实际工作中对这样的限制也基本是忽略无视，不过动画对于丰富网页表现形式的同时也有它的弊端，一旦被误用和滥用有时会产生严重的后果。

以前我所在的公司发生过这样一件事，网站首页一向都非常正常，访问速度也一直比较快，忽然一天上午，所有人打开公司的首页，发现浏览器都死掉了，无论是ie还是其他浏览器，打开任务管理器查看，cpu占用率是100%，再让外面的人访问，出现同样的问题，技术总监一时束手无策，也看不出是什么技术问题。我倒是看到那天的首页比平时多了两条效果极眩的对联广告，也随浏览器死掉停在了效果最眩的那一刻，找到做对联广告的那位美术部同事，本地打开动画文件，再打开任务管理器，竟惊人的发现cpu占用率flash那项峰值去到了80%多，还是在美工cpu性能比较好的机器上测试的，这样的动画去到网站首页，还是要对联成双的出现，浏览器当然要处理不过来挂掉了。这次的经验教训还是非常深刻，自从这次以后，我都要求做动画的同事做好动画后，Ctrl+Alt+Del自检，CPU占用率峰值在50%、60%以上的就基本不能通过了。

平时大家做动画尤其是要挂网上的，关注得最多的无非是体积大小而已，都知道体积大，等待下载的时间长会影响用户体验，但动画体积大还未到严重影响用户体验的地步，而且还可以用下载进度条来优化，而CPU的占用率高的话，令到浏览者电脑假死，就算动画做得再眩，体积优化得再小，对用户的打击却是致命的。偏偏对于这个问题，很多动画制作的同志们都忽视了。在网易的页面上依然会偶尔碰到极耗资源的flash动画出现，估计很大部分是来源于客户直接给过来的广告……前不久就给我逮到了一个，还害我浏览器假死了5秒，如下图所示页面右列三国风云的flash广告，下载至本地测试cpu占用率峰值达到70%多。

造成flash动画cpu占用率高通常于几个方面：有透明度的变换，特别是png透明图比如有些复杂光线或者有些发光效果只能用外部软件做好，存成透明png图导入flash进行伸缩或移动操作；多节点的矢量图变换动画，有个误区就是以为矢量图变换不耗资源，都尽量转变成矢量，实际结果是多节点的矢量图运动和变化极耗资源，但尽量转化成矢量图是没错的，可以尽可能缩减flash体积；还有一些计算比较复杂的flash编程实现的动作，如大量使用一些循环函数onEnterFrame、setInterval等。这些都极耗资源，应当尽量回避。另外优化动画mc结构、将复杂耗资源的动画在时间轴上分开、减少位图使用、尽量调用相同的背景或元件都能明显使flash动画体积减少和cpu占用率高的风险降低，解决了这两个问题，flash动画的用户体验就算是成功一半了，剩下的就是创意和视觉效果问题。

至于在网页上一屏内动画数量的限制，大型网站都会有所规定，一般是不超过2个，但在网易的页面上，这点实际上做得并不好，究其原因可能比较迁就了广告的要求。如下图所示一个网易新闻最终页头屏flash广告达到了6个之多。

这里说的一屏是指浏览器一次所能浏览的区域，因为对于CPU来说，在屏幕上能显示到的flash会处理，而显示不到的则不会处理，一屏内显示的flash动画的CPU占用是一个叠加的效果，如刚才那头屏6个广告的页面，假设每个flash动画占用10%CPU，那叠加的效果就是60%，大大增加了处理的风险。再有从视觉角度考虑，一屏内6处动画闪动，也实在让人视觉疲劳，广告的效果其实也并不好。如果实在要加那么多flash广告，可以分散至各屏摆放。

另外一点是如果页面已经有视频等极占CPU资源的产品时，不适宜再有任何的flash动画。前不久奥运视频报道，sohu就是因为在视频页还设置了一个极耗资源的flash弹出广告，极度影响用户体验而备受责骂。

链接该在原窗口打开还是新窗口打开

我觉得是很重要的一个问题，如果一个网站所有的页面都在原窗口打开，肯定会造成网友阅读信息的不方便，必定会频繁进行返回操作；如果一个网站所有的页面都是以新窗口打开，那会造成网友要不时关闭不必要的窗口，同样会造成阅读信息的不方便。因此制定一个链接打开方式的规范对于网友来说是必要的，有利于提高用户体验、有利于阅读并更好的获取信息。所以我把这项也写到规范当中。

其实这也是一个非常有争议的问题，网上也有不少这方面的讨论，国外普遍的观点是用户需要能控制与其互动的界面，替用户做决定是错误的，强制用户去打开新窗口也是错误的，因此国外一般网站都会在原窗口打开新链接。而国内由于网民思维和浏览的习惯不一样，大多数会是新窗口打开链接。Google原本都是原窗口打开链接，进入中国后中文版一开始的时候也是原窗口打开链接，后来是改成了新窗口，正是因为Google发现了中国人浏览习惯的差异。而最近比较热的开心网则是另外一个比较失败的例子，里边所有的链接都是原窗口打开，以致于我在浏览一个好友的好友名单时，链接过去了另外别人的空间，浏览了一遍，发觉还想回去那好友的好友名单那里浏览其他人的空间，而不得不去点n次返回。国人的浏览习惯就是这样，不会右键新窗口打开一个链接，又或者是按住shift去点一个链接。所以我们的网页要去迁就国人的浏览习惯。

但这并不是说就可以无休止的使用新窗口打开链接了，很多网页就是这样，页头那里加个base taget=blank就全然不管了，做网页的很方便，但有时累了用户。一些有分页的页面，如果全部是新窗口打开，那会是一件很恐怖的事情，网易的股票有些页面有类似的情况。而同级的频道或子频道间的跳转，因为有具体的导航可以很方便跳转，也应该设为原窗口打开。

出错页面的设置

其他大型网站规范都有出错页面设置这项，显得这项还是非常重要的，而网易这方面做得不好。

有个统计表明，在搜索引擎大行其道的今天，一个网站约40%的流量都是搜索引擎带来的，而在搜索引擎搜索到的网页，不可避免的有些陈旧或者是已经访问不了，设置出错页面来加以引导用户去浏览相关内容，会带来额外的流量。另外一些功能性页面可能会程序出错或者由于网络的原因而出错了，那出错页面会引导用户完成相关的操作。

出错页面的设置不仅可以在使用性和功能性方面提升用户体验，还能提高网站满意度和品牌形象

相关话题：设计规范网易源地址：http://www.ued163.com/?p=188

Windows Vista 用户体验设计规范

Richard Bao — 2008-10-30 00:43:03

此官方 Windows Vista® 用户体验设计规范（简称“UX 规范”）的目标在于：

为所有基于 Windows Vista 的应用程序划定高品质与一致性的基准。
回答关于用户体验的问题。
使你的工作更为轻松！

开始使用 Windows Vista

如果你刚刚接触 Windows Vista：

首先查看 Windows Vista 中的新功能。这些文章总结了那些你应当在 Windows Vista 界面（UI）设计中使用的新的核心 UI 特性，以及它们与 Windows XP 中的有何区别。
接下来，继续阅读首要规则。它总结了 Windows Vista 设计小组向您建议的，为创建高品质、具有一致性的 Windows Vista 用户界面而应当遵循的一些最重要的规则。
检查最常见的设计错误，总结了 Windows Vista 设计小组在审查设计时发现的一些最为普遍的错误情况，并给出了用于避免类似错误的设计规范。
最后，请阅读使用 Windows Presentation Foundation 进行设计。它简要介绍了如何利用这种新的 UI 开发环境的优势。

更新列表

2007 年 10 月后发布了下列设计规范：

2007 年 7 月后更新了下列设计规范：

原文最后更新于 2008 年 10 月 10 日
© 2008 Microsoft Corporation. All rights reserved. Terms of Use

相关话题：设计规范源地址：http://www.richardbao.com/vistauxguide/index.aspx

关于UI设计规范的制定

nick — 2008-10-15 14:10:59

现在什么都讲规范,讲流程,UI设计也不例外,但是我们往往在制定规范的同时,忽略了延续性以及可用性,导致到作茧自缚,规范是出来了,但是下面的工作没法做了.而且这还严重影响了后来的UI设计师的发挥.规范定得太泛,起不到应有的效果,规范定得太细,那别招设计师了,找个美工,照做行了.

我们再来看看制定UI设计规范的目的是什么?

在我看来,制定UI设计规范对公司来说,是为了公司产品风格的延续性,一致性,使设计更加产品化,杜绝了一家公司设计出来的产品,五花八门,除了 Copyright之外,没有一个地方看得出是一家公司的产品.对UI设计师来说是更容易让后来的UI设计师快速的了解公司的设计风格,产品风格,快速的融入团队.缩短磨合时间.

那么根据这个目的,来制定属于公司的UI设计规范,通常我会通过以下这些界面要素来加以描述

1.字体/行距
2.主色系
3.板式布局
4.页头页尾
5.图片文件大小

基本上,我认为有这些已经够了.看到许多公司制定的规范,还包括按钮啊,边框阿,背景图阿,一看就晕了,就拿按钮来说吧,能规范的吗?如果是要吸引用户注册,我是不是得把注册设计得很大很突出?常规的登录按钮能这样吗?在制定规范的同时,还要牢记一点,规范并不是一层不变的,规范是需要慢慢积累,慢慢完善的,在没找到更好的规范之前,一定要严格执行,在找到更好的规范后,应该立刻修订.而不是因为规范两个字就觉得这东西是圣经了.

还有一点必须说的就是,往往规范的制定,都是把握在设计总监,经理手里,所以通常会带有一定的主观性,必须强调的是,一份好的规范,最好是经过大家一起协商,探讨制定出来的,而不是一个人说得算的.

相关话题：设计规范源地址：http://www.offidea.com/post/226.html

把“规范”当作“产品”来设计

折折熊 — 2008-09-10 09:09:26

这次我要谈的是规范而不是产品设计。一直都在说设计需要规范，各大公司团队都有自己的规范，也会不断地更新和制定新的规范，但是执行难，效率低，力度弱却是规范的弊端。Angela提出了“理想设计规范的三条状态”，她指出规范的作用是满足使用者需要、满足协作需要以及提高团队效率，但是通常这些是制定者的理想，却是执行者的痛苦。

　　规范越复杂，流程就越复杂，执行起来就越困难。为什么会缺乏执行力？反过来想想，是不是我们制定的规范缺乏用户体验，让执行规范的“用户”感觉很难用。所以我提出来，要把规范当作产品来设计。

　　先分析一下现状。

现在的规范不外乎时间上的控制、流程上的把握、人员上的配合以及看上去的可行性。所以规范不是来制定某个设计需要多少注释和说明，而是让使用者能够有更多的时间关注更重要的东西，能够让协作来的更加轻松甚至是能够提高整个团队的效益比。如果你的规范是要求你的产物需要用绿色框来做标注，那么请停止，你的规范只会让使用者叫苦，却不会给团队带来太大的效益比。

再从执行方面来讲，规范是制定容易执行难。通常管理者和制定者不是同一个人，所以管理者会忽视制定者的主要意图，最后使规范荒废掉。之前提过的DQA的角色，TA是控制质量和效率的重要角色，TA是规范的执行者。但不是有了DQA我们就高枕无忧了，而且实际上 DQA的角色对于很多公司来讲是一种负担，很多公司都把DQA的责任交给了设计总监，毕竟是总负责人，即有权又有能力。也就是说在没有规范的时候，设计总监就是规范！但我觉得把规范应该交给人文环境进行控制，而不是某个人来亲自执行。就像国家的禁塑令，在推出前很多人报以怀疑的态度，但是现在你去超市看看，大部分人都拎着自己的袋子，你还好意思去买塑料袋吗？这就是人文环境的影响。

最后现在的规范有一大块是关于文档等的记录。至少我就有很多文档模板，而且在做每件事的时候都会想到在文档里面应该怎么记录。周报日报一大堆，说是记录你所做的事情，但是回头看看，写了也就写了没有什么大的作用，最后久而久之就慢慢荒废了。文档要用的恰当好处，有些实在无法描述的说明还是需要进行相应的沟通，就好比网站的某些功能实在没法使用的时候还是需要客服电话，如果这时硬要用户去发邮件描述并安静等待的话，用户肯定会发疯。规范不是需要刻意记录的文档，大部分文档是在执行规范时的产物，类似于日志一样，只有部分输入输出物必备的文档才是需要去关注的。

现在我再次提出，把规范当作产品来做。通过分析使用人群和应用场景，对其进行投入产出比的配置规划，并且合理设计流程上的体验，在规范上线之后有效地制定升级包的计划和远期规划，以此来得到对执行者有更好体验的规范。

那么我们来试试看吧！拿我们的团队作为背景来进行规范的设计。

一、分析用户群

按照横向维度分，使用人群主要有产品设计师、视觉艺术家、内容策划师、前端开发工程师、用户测试员以及团队管理者，外围人群包括产品业务经理、需求分析师、系统分析师、系统开发工程师、项目经理、测试工程师、系统平台发布管理员等等。

按照垂直维度分，可分为被动接受（新手）、被动接受并有反馈（熟练）、主动执行（精通）、主动执行并推动产品升级（高级）、全力推行并负责升级（管理）。

二、应用场景

主要有业务相关项目、自发项目、日常需求三个。

三、需求分析

工作中每个角色间都有互动的关系，但并非是如下图的垂直传递互动。

图 1-1 垂直传递互动的关系

角色间的关系应该是互补的形式，下图是在业务相关项目下的范例：

图 1-2 互补型的互动关系

图中蓝色文字是互动的内容，蓝圈是UED团队的开发核心，红圈是业务方，黄圈是系统地层，橘圈是测试及产品发布服务。

从上图可以看出在完成一个项目，产品设计师是产品的核心，也就是说产品设计师是最终产品的决定者，TA除在完成本职任务以外，还肩负着协调和执行各方角色工作的任务。所以从规范来看，应该从产品设计师入手，并且散发到和每个触角的互动中去。

下面简单分析一下团队里面的产品设计师角色需求如下：

1、根据项目（需求）的大小来灵活控制输出物；

2、能够及时了解发展规划方面的行为动向；

3、输入物的格式能够成为设计师的资源而不是阻碍；

4、输出物可以让其他角色一目了然，尽量减少沟通的成本；

5、在申请资源的同时希望能够及时落实并得到资源的反馈；

6、能够清晰明确项目的进展等相关情况；

7、对于产出物可以得到合理的评价体系支撑；

8、对产品的远期有规划和标准执行方案；

9、其他。

四、流程设计

这一步在传统的产品设计中是主要部分，当然在设计规范时也是最重要的部分，它决定了最后规范如何被执行，也预见了规范在执行时所遇到的问题和解决办法。

这里要做的就是把产品设计师的互动流程进行规范。分为三大块，分别是产品业务项目、自发项目、日常需求。

1、产品业务项目：

由业务方发起的互动中需要包含一些市场数据和业务分析以及期望值，有明确的产品规划和目标，最后需要有BRD和详细产品描述资料。

接着在产品设计师的互动中，需要明确设计资源和时间点，明确产品内容、视觉以及前端的需求，并有能够直接指导开发工程师来完成产品概念的指导文档。最终要得到可用性评估测试的反馈和改进方法，以及产品规划方向的标准制定。

2、自发项目：

由产品设计师自主发起的项目，在与业务方互动时，主要是得到一些现有数据，并且得到一些业务支持，在和其他角色合作时与产品业务项目时类似。

3、日常需求

由需求方发起的日常需求，互动时需要双方遵守传递统一化的方式，并且在和前端、视觉、内容策划互动时，主要是确定资源和时间点的问题。

这里的流程没有细讲，主要是把关系和内容简单的整理了一下，在设计具体规范时还需要细化每个点的流程，特别是遇到问题的解决方法。

五、原型设计

这一步就是实施规范的撰写，方法有很多，但是我建议先从全局的出发，通过发散思维和流程设计的结果，再慢慢细化每个环节。除了文档以外，规范还需要角色间的培训和认知，并由管理者统一进行意见反馈和收集。

六、测试

也就是规范的试运行，尽量不要大面积使用，会使执行者产品疲倦感，最好使用AB test进行测试，得到较好的测试用例。

七、上线

经过一系列的反复测试和修改，最终的规范就发布上线，并由管理者来监督规范的执行情况，但管理员并不是来执行规范的主要角色，执行规范的永远是使用规范的“用户”以及相应的人文环境。

　　通过产品设计的方法出来的规范是符合个性化团队需求的，它也会像很多互联网产品一样成为每个公司团队独特风格的产品。百家争鸣只是第一步，最终的目的是希望能够在众多产品化规范中有一个能够成为整个行业的规范，把难执行的规范从封闭的团队中释放出来，让更多的人参与并得到行业标准解决方案才是产品化规范的最终目的。

相关话题：设计规范源地址：http://www.jojobox.cn/blog/article.asp?id=139

设计规范给什么鬼看（二）

Tony — 2008-07-27 17:46:21

<接上文>

Junchen:
我就成天像个苍蝇一样对前端的说细节问题，这边是”确定”，怎么那边是”提交”？所有表单操作的提交按钮文字都改成”确定”。
然后我对图形的说，这个图是614px，那个图是613px，都给我统一成615px（所有图片的尺寸必须是 5 或者 0 结尾，我的洁癖）。
如果写成规范，那么别妄想着他们看了就会执行，得不断的说。

Sky:
规范的内容应该涵盖界面设计本身以及上下游的接口（上：业务需求和逻辑；下：工程技术实现），不仅仅是给设计师看的。
我的做法是分成三个层面去做规划和内容组织：
信息层：信息架构，数据输入输出，内容组织结构
交互层：Persona，可用性准测，Design Pattern Library（参考YUI），封装好的UI组件
表现层：颜色，字体，材质，尺寸与位置关系，图形元素

这样的划分，首先是出于规范的灵活性考虑（分离表现层和结构层的好处，相信做过前端的人都有所认识），其次可以便于团队中不同的角色在长期工作中可以落实到责任制地对规范进行长期的建设。
另外为了更加灵活的推广和使用，在规范中可以引入优先级的权重概念，我划分了三个级别，标准（必须遵循，比如公司/产品VI相关的规定），推荐使用（一些久经考验的解决方案），参考资料（在新产品的设计中仅供参考）。
另外关于流程和管理，我觉得必须是强制规定，并且要注重规范的与时俱进。

路人周:
我觉着吧，要认真搞规范，这个顺序做比较实在，产品设计责任制 - 产品设计原则 - 设计评估手段 - 设计规范。
一开始就操家伙整规范不太好，规定的任何元素都是有修改的可能的，因为连产品方向都是可以更换的，中国公司搞游击战搞惯了，市场压力和客户压力都大，不是哪个公司都敢像西门子一样，花6年开发一个产品。

中国的产品经理最大的特点就是人浮于事，你搞出来的东西一旦和他的想法有出入，一则拒绝执行，二则磨洋工。

要搞规范，不但要决策层下力度支持，也要下面具体执行的人积极配合，但是这个很难办。如果你CEO（或者对整个产品负责的大PM）开个全体会议说：”这个规范我和设计部XXX讨论了，决定在全公司范围执行，谁不执行就是不给我面子，后果自负，下午3点前大家会收到公司发文邮件。”那力度肯定够了，但是会这样么？一般来说不会，除非你的规范有保证说，对效益，对控制成本，对用户满意度有绝对的数据支撑。

再说下面执行的人，我就喜欢拿FW做图，存成PNG，你非要规定我PS做图存成PSD,是我设计还是你设计啊？设计师很容易有抵触情绪，在半瓶水的设计师中间更是如此，总觉得除了他自己谁都不懂设计，谁都是SB，这样就麻烦了。团队当中有朵花，香味只有领导知道，团队当中有驼屎，那就是遗臭万年，会影响甚广，所以我说，搞规范最重要还是先把人搞好。

我们原来8个人小团队做手机方案设计的时候，根本不要什么”规范”，我就做一套输出模板，交下去大家伙用，用得不爽了，觉得有问题了直接找我。我不规定你什么风格，个性化，色彩取向，你就给我记住四个字”漂亮，好用”。

要不搞个规范就搞个半年，黄花菜都凉了，弄得不好，上下受夹板气，索性你也皮实了”算求，这规范爱谁谁，我不做了，你们自己泥腿子去吧。”

帅哥甲:
1.视觉规范确实比交互规范相对好整理，因为前人有很多可以借鉴的经验。
但是如果一个公司有多线产品的应用：如新闻资讯、SNS、IM…
其实就视觉规范这种表现层的在后期推行起来也很难。
特别是遇到没规范就上线已经赚钱的产品，只能折中的推每个产品实际应用规范。
而由于这些产品，设计的时候就严重没按照规范走，
现在要改，”这些人”会觉得在给他们找麻烦，增加工作量，还不能保证赚钱效果。
连根拔起几乎不现实也不可能。

2.而没上线的产品我觉得强制起来比较容易。权力够大的话不规范不让上线。

3.而上线了但是很烂没赚钱的产品，也麻烦。
做产品的这些人都在混，不专业
你咋还能有效的去推行规范哦。要么强制扣钱、开除几个人。
但是一段时间内有人反抗了，有人工作没人做了…
然后又要招新人,时间一秒一秒地过去了。
在这个过程里很小公司慢慢消失了。

Sky:
一个人建规范那就成独裁了，规范这种东西要结合团队现有的人员构成去做的，这样才能有的放矢。

路人周:
上面我那个案例要修正一下，那个是在团队搭配不平均的时候运用的，如果大家都不了解这个东西如何设计执行，那么这个时候需要一个人来挑头做，但是做出来的东西必须经过团队讨论认可和落实执行，同时要报决策层批准。

一个人独裁式的建设规范是大忌，因为最容易出现的情况是，你会发现规范中的内容和他自己没关系，他根本不参与其中，是推卸责任的做法。

Sky:
规范建立的目的在于：
1. 设计与设计实现的平衡
2. 设计工作的基准和参考
3. 有效的沟通
4. 成本控制
5. 良好用例的重用
如果花时间去建立一个规范，而不能达到这些目的，不如不建立。
每个公司和团队在设计和研发上都应该去找适合自己的流程和管理，并不是仅仅设计规范一种方法。

白鸦:
很遗憾，今天一直在开会，错过了这个群P的机会。。。
认真看到大家的讨论，我总结了最重要的一点：
规范不能是一个人也不是一个”团队”建立起来的，应该是所有人一起搞的。包括设计的人没有规范总是咨询设计师的人、用规范的人、老板一起参与。只有这样才好执行下去。不然只能给鬼看。（就算老板强压大家也都很忙，不执行..）

<全文完>

相关话题：设计规范源地址：http://uitony.com/?p=50

设计规范给什么鬼看（一）

Tony — 2008-07-27 17:45:24

该文章是ucdchina内部邮件组关于设计规范的话题的讨论整理，本来应该发到话题里面的，但因为时间拖太长了，已经过了该期话题，所以整理发到自己博客里面。建议读者阅读本文之前先看该期话题。

注1：这个群P有点长，分两篇发。
注2：希望读者有兴趣讨论在文后跟帖，对于说“顶”、“好文”、带攻击和辱骂性的语言，以及没有意义的回复将一并删除。

<对话开始>

小兔子:
正在用onenote整理视觉规范的制定和更新维护

Junchen
发了一篇文章《规范没有规范》

白鸦:
junchen在跟我抬杠。我说一个人要规范是说为了备忘。只是一个txt文件作为备忘即可。如果你们公司有两个以上的产品，半年以后你再去做那个半年没管的产品你就知道备忘的作用了。

Junchen:
因为我更倾向于再次把产品用一遍,另外txt文件的重要性和备忘的时效性很成问题

小兔子:
一个人需要规范，主要是整理归档和备忘的作用；
一旦一人以上，就有协作的需要，这样自然就需要规范。不过人数少，规范的形式和内容可以灵活精简嘛

白鸦:
其实这个问题就像在交互复杂的网站中，我只给工程师一套可以点击的html原型是不够的，还需要给他们简单的流程图。
不反对让他点着去体验，而且支持一定要再用一遍，体验是必须的。但只用是不够的，仍需要一个备忘作为给他的指引。这样熟悉”规范”的效率更高，针对性更强。当然”备忘”需要记得更新。txt只是一个”比如”，不一定必须用txt。

Junchen:
规范在设计领域（尤其是网站）远没有其他领域来的那么重要，另外就是规范的执行成本很高。

白鸦:
这个观点完全赞成。规范在很多领域都比在设计领域更重要。

Sky:
规范可以做的很好，很有说服力，但是执行的时候就是不按照规范走，或者执行的力度不够，那有规范和没有规范其实也差不多了（甚至有时候会更糟）。
所以规范不应该只是一个单纯的文本或者文档，还有有比较成熟的运作和管理体制去保证规范的实施与更新，不然规范就是个死的东西，也就只有鬼才会去看了。

子条:
比较成熟的运作和管理体制是怎么样的？强制执行，还是天天去磨？

白鸦:
如果一定要二选一，我选择强制执行。

Tony:
将规范放到网站的管理后台，以HTML的形式呈现。
这样相比其他的文档类型，相对容易查询。
里面内容会包括：
效果展示（图片）
简单描述
常犯的错误
代码-供开发人员引用

Junchen:
规范是双重成本的，做要成本，执行要成本。
并且在网站这个领域中，变数过多，变化过快，成本相应增加，收益相应减少。

小兔子:
给开发的文档里就有交互设计，把效果图也打包给他们。设计会给标注主要尺寸的效果图，
在这个基础上，我们再整视觉和通用的交互，以及文字规范。

帅哥甲:
因为我参与过XX公司的规范设计。而我后期提出的就是和TONY一样的做法。
做成WEB的形式容易查询。其实这是参考微软以及一些大公司的传统做法。
但结果就是这个部门会去产品经理磨。执行力度肯定不强。

然后目前我在试着编写一个新的创业公司的规范，经历从无到有的过程。
我先制定了一个简单可行的，比如几大主流浏览器的测试，页面尺寸，大小，CSS等等初级问题。
现在遇到的问题是，执行力度仍然非常差，几乎没有，我编的规范就相当于在给鬼看。

如果在XX公司，肯定是磨啊磨，没有明显的感觉改观效果，甚至磨失败。
在这里呢，有感觉强制不出来，所有去执行的人都很忙，公司赚钱是放在现实的第一位。
忙不过来还管那么多规范，出了东西再说。
所以感觉结果又是磨啊磨。
最后….都是问题啊。

小兔子:
规范怎样去保证落实？貌似是个很挑战的问题啊
PM不管吗？确切说，设计主管之类的来管吧？

XXXX:
现在XX公司没有专门做视觉和交互设计的人员，都是产品经理靠感觉做，但不同产品有不同的产品经理，他们对一些字体、颜色按钮、链接样式、输入框尺寸和样式这些问题，经常跑来打搅我问我要意见。
同时还有很多开发人员，他们只注重功能的bug，他们也懒得写CSS。
原因主要就是这样，想提高效率。节省前端人员、UI设计师的时间。
这个事是长期的，不需要专门花2周或者一段时间来做，而是持续添加、修改、整理的过程。
好的规范不存在执行的压力，如果有这规范，产品经理和开发人员再来问我界面上的视觉和交互问题，我会给他个链接。如果规范里面没有的，我会想能否加一条。
但现在我在工作中的问题是，信息架构需要规范，这个没有达成一致的话，各个产品经理都有理由坚持不执行交互规范，而且你很难去说服他们。
视觉规范相对好整理。

<未完待续>

相关话题：设计规范源地址：http://uitony.com/?p=49

产品规范之道

千鸟 — 2008-07-27 17:44:24

对规范更深层次认识来自于YUI的启发，这个几乎已经是控件代名词的英文缩写，可能很少有人注意全称The Yahoo! User Interface Library，其实就是整套带有开发模式的界面规范，因此我也喜欢把整理好的各种规范叫做XXX Design Library。

产品规范的应用对象，分为设计师、工程师两类人。对设计师来说主要是“协调”工作，使交付物统一；对工程师来说主要是“配合”工作，使开发效率提高。

1. 规范的时机

我倾向于在概念设计的低保原型之后，也就是说得先有第一批可开发的页面。我反复强调的原因，概念上不管做产品还是平台，核心都是由一个个页面组成的网站，有效规范只针对于最终产出。

很多朋友提到边设计边整理规范，这是对设计工作的总结。我的看法，产品设计与开发是整套系统工程，所以更进一步，应该边开发边整理规范，让规范与开发同步，互相契合更新。也就是说，每次迭代之后，都应该升级规范。

对工程师而言，上手来一份事无巨细的规范，读完要花两天，熟练要花十天，在庖丁解牛的开发过程中，简直就是噩梦。于是还没等走完这个过程，早因想痛打设计师而消极怠工了。这也正是不建议使用现成规范的原因，第一国情不同，第二时机不对。

2. 规范的程度

经常听到种声音“规范对开发工程师的约束力太弱。”我认为并非问题根源，因为规范的目标不是约束。产品规范对工程师的唯一好处就是快，越快越简便完成任务，工程师才越可能认可。打算让工程师把工作重心偏移到界面体验来完全不现实，因为各自的工作职责不同。

注意使用工程师的思维来横向描述产品，尤其在模块和组件角度，更有必要最终细化到代码和字段。工程师不愿意遵守，做规范的人首先应该扪心自问，是否阻碍了别人的工作？作产品设计规范不能只考虑如何设计好，关键是如何配合执行好，更不是完全主动的监督。

规范最大的作用，在于方便分享，减轻沟通压力。规范越翔实，越容易体现专业的大家风范，也就越凸显设计价值，对拿了钱就走人的设计师来说很受用。但高瞻远瞩只看上去很美，不具有可控的操作性，强制执行的后患无穷。

3. 规范的内容

概念文档，固化产品架构和业务大流程。便于设计师快速了解全局结构和流程，同时有助于工程师搭建程序结构，以及数据库逻辑。但是得注意，满脑子函数的工程师们，普遍对信息架构、交互设计不敏感。

页面设计，固化界面布局和表现。用于设计师协作完成原型设计，同时起到指导工程师修改页面的作用，尤其是页面结构、样式定义、信息块标注。忙于功能的工程师们，对界面的仔细程度往往也不如设计师。

模块控件，固化功能落实和操作小交互。既便于设计师新增、修改界面，也便于工程师嵌程序和调整。最好是做成各种精确的Module或者 Pattern，做到有据可依有档可查。尤其是对状态描述，能省不少解释的口舌，也便于小范围升级和做版本管理，做到工作流程中的Don’t make engineer think。

4. 规范的执行

规范的监督成本，全部建立在规范本身的有效性之上，也就是说，对产品和团队有足够可控的了解，是提高执行效率的基础，并非设计单方面合理就行。

在项目时间受限制的情况下，工程师解决问题一定有优先级，功能高于界面不仅合理，而且完全应该这么做。我观察到的矛盾，绝大多数都因为产品方提要求的时机不合理所致。

如果没有时间压力，也没有任务压力，工程师仍然不遵守设计规范，那是工作态度问题，应该尝试与工程师团队沟通解决，或者把协调级别再调高。多注意沟通，互相调整工作方式，任何小矛盾和不契合都可能因时间而被放大。多尝试改变自己，这也是种挑战，除非有权利选择同事。

模块化开发中，工程师最怕因为乱引起的麻烦，而不是技术难度，因为难度可以妥协解决。作为设计师，多学习技术并亲自实践，除了能精确把控节奏，所获得的经验也将成倍增长。

相关话题：设计规范源地址：http://ucdchina.com/blog/?p=478

规范没有规范

JunChen — 2008-07-27 17:43:38

注：如无特别指明，以下规范可能只适用于设计。

规范一定是文字吗？当然不一定…尤其对于图形设计规范来说。规范可以是以下任何一种形式：

* Word文档
* psd或jpg图片档
* ppt演示文稿
* VISIO框图
* 等等

规范的内容简而言之是这样：嘿，以后照这样来做。然后给“这样”举个例子。

正因为设计规范表达（或交付）形式的多样化，造成了执行贯彻规范的障碍。但这一点在一定程度上是可以避免的（沟通和执行力的问题，本文略）。在书友会上，我说了两句话：a) 规范很灵活；b) 规范可有可无。我想前一句话，大家都能理解并且赞同的。后一句估计会引起不少争议。

可有可无的意思是说，有不一定就好，没有就不一定不好。因为实际情况往往是，花了时间和精力的规范束之高阁，甚至成了束缚人行动甚至思想的臭布条。在我看来，讨论规范怎么执行，比讨论怎么做规范来的更有意义一些（当然这两者也是相关的）。既然不能发挥最大价值，或者相对成本来讲价值偏低，那就别做傻事。

我想反过来回答 Angela 的问题：什么时候不要规范？

1、没有流程的时候

流程和规范是兄弟。我们的工作流程：用户研究、产品设计、开发等等，所谓规范，是用来指导和规范化工作流程中的一些环节。规范只有在合理、明确、稳定的工作流程中才能发挥最大价值。当你的工作毫无规律，那你也别指望有了规范可以让你更轻松，那只是一个更大的包袱。

2、人少的时候

这点上，我跟白鸦的意见相反。我并不觉得一人团队或几个人的团队需要规范。原因很简单，规范都在哪儿摆着呢，以前怎么做的，值得保留的则继续保留，不值得保留的则改之。这就是唯一的规范。

听上去让新人能够阅读规范等文档是一件听上去很酷的事，嘿，这是团队文化。但前提是，这些规范在新人来之前是被正常执行了的。

3、没有管理能力的时候

最终将导致执行不下去。要转变这点，不是本文要讨论的内容。但很明显的一点是，如果能做好管理，那规范是水到渠成之事。领导者来推行规范可行么？也不一定。

4、规范没有规范

虽然说，Word文档、psd、ppt等都可以是规范文档，但是为了顺利执行，必须有另外的规范来明确设计规范。比如说，交互设计用ppt、图形设计用psd，而不是来个doc+psd+jpg+ppt+txt的混搭而且格式还五花八门不知道看什么了。

规范本身不是一件立竿见影的事，需要时间去证明的事情，最缺的就是执行。不过说了那么多不要做规范的理由，最后还是建议一下有一个规范可能是最值得做的：文字内容规范。因为这是最简单，但也最容易出错的。不过如果有专人在做这事，暂时也可以放一放，等这个人要离职了，把知识规范写下来后传承即可。

相关话题：设计规范源地址：http://ucdchina.com/blog/?p=477

设计规范有谱么？

lytous — 2008-07-27 17:42:46

从业这几年，自己写过的和帮人参谋的所谓“设计规范”不少了，这个东西大概在中国的决策层眼里是这么回事儿 - 一帮农民在一块田里种粮食，起先天气不错，土地肥沃，但是不久天气变差了，虫子多了，土地沙化严重，还有几个缺心眼的内鬼偷粮食，这下必须立定一个规范，挑头的告诉他们该在哪儿种，收多少麦子算合格，哪部分的地是留到下一季种的，种出什么样的麦子给奖金，偷懒不干活的怎么处理……

但我理解的规范不是简单的把一个设计做成一个“行业套路”的量化指标，而是一个综合的品质评估的参考，甚至是一个设计能否面市的决定因素。为此，我们需要拟定一些表格，文档备案，图形参考，交互模板。

同时，设计规范还要成为设计部门或者一个公司对于设计品质的共同价值观，让大家伙都知道这样做出来的是好设计，通过这样的规范教育和交流，形成对设计品质的统一认识。设计规范不是规定要做什么，而是提出这样做是正确的，但是有更好的地方可以改进。

国外设计师管这种做法叫设计工具，是模板化应用的方法（stencil），我们称之为规范，更多的偏向于规则（regulation），却只学习到了量化指标的简单部分。说的严重点吧，我们中国人向来就特别擅长给自己搞个框架（紧箍咒），来约束人的作为与想法，可能有三个原因：
1. 我们不太擅长找到解决问题的严谨逻辑，甚至是已有现成教训的；
2.我们始终缺乏对于团队成员之间的信任，哪怕是共同合作了多年的；
3.我们的企业无法承担某些错误带来的后果，甚至是很小风险的。

我们一开始就把一个工具性的东西变成了制度，因此问题便出来了。对于成长期的设计团队来说，建立设计规范需要的是确立一套可用工具，然后在工具的基础上发展成为部门设计品质建设的road map，如果只是弄个“导航按钮间距不得超过10px”这样的规范，就跟小时候尿尿要听到“嘘~~~~”声一样，尿得更快。

我不是跟这儿扯谈，在我看来咱们现在行业里面瞧得见摸得着的优秀的设计规范不多，现在来说说，和大家交流一下：

1. 设计规范达不到预期效果的原因

总是出现问题和错误后才开始拟定和修改规范，缺乏预见性；
规范制定出来后，执行不到位，缺乏力度和奖惩措施，监督控制节奏拖沓缓慢；
在产品设计过程中，不对设计规范做进一步的修订，甚至之前出现的错误也不去改正；

完全教条的根据设计规范设计，比如有些团队做的还是通用设计规范，很多设计师就照着里面的要求重复设计类似的页面，类似的广告，类似的动画，完全豪无特色，没有差异化。- 用心的话，你可以看看现在各个互联网产品的相似程度有多少？我不得不说，那些恶劣的设计规范要负一定的责任。

2. 设计规范最常见的错误

让部门领导者制定设计规范 - 设计规范是共同讨论出来的，在迭代中改进修正，由于国内设计师大多数有“领导恐惧症”，因此这样的规范就算制定出来也是空头支票，甚至有不少领导是很少参与一线工作的。
照搬国外成功团队的设计规范 - 这样的事情多半发生在喜欢“洋为中用”的设计团队中，国内外的设计环境差异很大，产品差异很大，面对的市场差异也很大，所以不要照搬，更不要直接翻译。
把设计规范打印出来贴在座位旁边 - 这是“大字报”，还是“表决心”啊？从我认识的设计师朋友来说，经常看座位旁边的东西只有2种，一是日程表，二是检查手机电池是否充满了。

3. 设计规范的本质是做好人的工作

在我看来，中国的企业只要是有设计部门的，做这个设计规范，最重要的是要和企业管理，团队文化建设绑定到一起，做人的发展建设工作。我们的设计师老实说没那么成熟，也没有过多的设计锻炼，整个不良的规范在哪儿杵着只会让设计师更加不愿意沟通 - “有啥好聊的？不是有规范么，照着做就行了”

设计部门如果真的沟通紧密，在设计过程中有共同价值观，这一个设计的流程是顺水推舟的，也是自然就形成的“规范”，不需要过多的文字描述。我还见过某些公司的设计规范中赫然写着：“一旦出现上述设计制作中A-C问题，设计师个人考评-5分”，OMG，原来你家的产品原来就值5分。

4. 优秀的设计规范要达到什么目的

A. 量化指标：确定一般可用性原则和审美常识下的避免犯错的方法，以及一旦出现错误后的补救方案。规范的第一个目的是减少设计过程中出错的次数，一般这是针对新手设计师的，好的量化指标是告诉他经验，比如：建议html文件输出后在ie6,ie7,firefox,safari中做至少2次不同分辨率测试，并将结果添加到《设计规范-参考数据》中；而不是规定他方向，比如：根据产品部要求进行测试修改。

B. 确认设计关键点：获得该设计规范针对范围内的关键点，包括设计方向和设计元素，以通过项目设计的过程，达到团队成员的更加密切的配合效果。它是一份检验文件，记录过程中的错误，留作以后的经验。并在此可以做出项目和产品设计的里程碑。

C. 规范设计原则：这个原则有可能是针对单个项目的，也有可能是整个设计团队的指导原则，这个原则要被反复强调，反复实施，团队人员要共同为这个原则负责，比如：“确保在任何项目结束时间前4小时，完成设计输出”，“绝不允许设计粗糙的界面方案，如下图所示说明：XXXXX”等。

D. 设计规范本身也需要可用性：描述同一个设计要求，可以说：“S级设计师针对该项目phase1部分工作，可控时间不超过2.5循环周期，输出交付件供ISO000459号程序评审 ”；但这样描写，能够明白的人会更多“界面设计师 XXX 设计该项目界面高保真原型，需在10个工作日内完成，5月22日下午14：00在5号会议室评审”。

千万不要把事情搞复杂，能把事情做简单的人是伟大的，设计规范也是如此。

相关话题：设计规范源地址：http://ucdchina.com/blog/?p=475

以团队默契总结出规范

lancelot — 2008-07-27 17:41:46

规范的建立之路：

我曾经和一个UI、一个程序员三个人一起开发过，我给UI的需求从来不写细节，她出的页面也不会返工。甚至到程序的那个部分都是一路绿灯的。我想这样的开发速度是任何文档或者是规范都是不能比的。

但是后来人多了，我就不得不一遍一遍的告诉每一个UI，我的思路是什么，我习惯于怎样去设计，甚至包括我用了什么样的符号在设计文件上，那个是表示什么需求的。这样，容易被UI理解和记忆的被使用了。还有一些不能满足要求的，我不得不按照他们的意见去写自己的需求和设计文件。

这样规范就形成了，新来的产品经理，UI设计师，程序员都是按照这样的方式去作事情。

建立规范的目的是信息的有效传递：

先举个例子，同事去买烟； “哥们，帮我带瓶水回来。”结果这个新来的同事帮我带了瓶矿泉水回来。而如果是老同事的话，一定会给我带一瓶可口可乐回来。
事情的原因在于我没有清楚的说出，我要的是什么。可能规范的目的，就是避免这样理解错误的发生。
从最开始的一段就可以看出，如果只是为了快速的开发，那么最需要的是开发人员间的配合，而非规范。有些时候，这些规范反而会影响到开发人员个人的开发效率。
虽然在理想的状态下，规范可以帮助建立默契，但是规范往往是在第一代或者是某一代开发人员默契的配合下形成的，这个先后的关系在很大的程度上制约了规范在这个已经形成的团队中来发挥这个功能。

结合上两段表述的内容，规范真正要建立的不是本身开发人员中的默契和快速开发，而是为了建立一个传承。让后来的人能在应用种快速的和原来的队伍形成一种默契。
甚至可以有这样一种理解，如果一个规范被推出以后，而且比较合理，成为真正的规范，对于后来的人来说，按照这个规范来作事情，可以节省很多的思维时间。在这里，规范才真正体现了其快速开发的意义。

由此可说规范是必须的，在一定程度上，两个人之间传递的信息，往往会因为个人的习惯不同而产生不同理解，规范在很大程度规范了表达的方式，使得不同习惯的人之间的沟通的信息更加有效。当然，这如果扩展到了两个团队之间，一个团队的规范，可以帮助其他的团队按照这个团队之间的沟通方式快速的组建起来，这更是规范在宏观上的意义。

规范必须是细化的可执行的：

去年我们分管编辑部分的高层给下面一个操作规范，上面写的东西是，编辑要尽量多的添加该频道的资料，资料要尽量的于频道的核心有关系，资料要尽量的对用户有帮助。
看到这个规范，我的第一个反应是想痛打他一顿。
诚然，这些都没有错，但是确是完全没有办法执行的，因为所说的所有东西，每个人都有不同的理解；因此，这个东西只能是一个规则或者是原则，拿给编辑部的主管（当时没有）看看还成。但是拿个普通编辑就……。

一个成文的规范，必须是没有理解歧义，并且是完全的可以执行的规范，如果在任何一个角度，这个条目可以细化下去，那么必须将它细化下去，否则规范在给新人看的时候，他们依然会按照自己的理解去细化这个规范，理解上难免就会有所偏差，起不到传承的目的。

规范的建立是团队的作品：

现在建立规范的方法，往往是一个团队种某个领导人的思路，当然，这可以使得规范文件迅速的形成，但是副作用就是，这个规范文件很可能被尘封。

第一点原因是，建立规范的领导是往往是按照自己的习惯建立规范的，这个是不是符合多数人的习惯是一个问题。
第二点是按照正常的理解，领导的能力往往是比被领导的人是要强的，其建立规范的时候往往是很难考虑员工的理解能力和在这样条件下的发挥能力。
第三点也是最重要的一点是一个人建立的规范，就很难是完全合理的，虽然领导是比较有权利的，但是在这些不合理的地方存在的时候，员工们看待这样规范时的厌恶感情，要求领导必须时刻注意才能推广这样的规范，尤其是在新人进入的时候，而领导往往不是这么有时间来作这样的事情。

所以规范应该是一个公司第一代或者是某一代员工默契配合，工作总结的结果。而并不是什么人强制下去的结果。当然，在有一个合理规范的时候，对于后加入的员工，这个规范能很好的起到传承前一代员工思想和协作的工具。

以上几点只是个人的拙见，欢迎大家批评。

相关话题：设计规范源地址：http://ucdchina.com/blog/?p=472

ASK ME，关于界面规范(1)

白鸦 — 2008-07-27 17:41:01

1、常见的界面应用规范有哪些？

非常系统的界面应用规范有很多，很多软件公司的应用规范经常长达几百兆，快成了一个小型的系统。但实际上真正实用的规范不需要那么多，特别是在作网站产品的时候。站在实战应用的角度我尝试过的界面应用规范有这些：

信息架构。网站栏目，导航结构，界面结构和布局，通用局部信息规则等。
人机交互。任务流程（如，所有信息提交直接显示完成，随后验证），交互方式（如，所有出错信息不用弹出窗口提示，所有表单录入及时验证和提醒），导航的展现方式（如，通过导航的层级提示位置感，不用面包屑），链接原则等。
界面视觉。界面的视觉层次关系，色彩应用规则，界面尺寸和比例，控件大小及应用规则，间距和边距等等。
语言和文字。行文风格，通用术语，提示/报错用语，说明/帮助，内容规则，和用户/客户的来往邮件等。

.

2、什么时候整理规范更合适？

很早我就写了多篇日志说过应该什么时候开始整理界面规范，意思很简单：“不能在一开始就写规范，那样的规范不实用；不能在项目结束后写规范，那样的规范意义太小而且耽误效率，造成反复太多成本太大；更合适的时间是在具体应用的时候边设计边停下来整理规范，然后按照规范继续前行”。

为什么不能一开始就写规范？这很容易理解。
试想一下你从来没有用过IM，现在是第一次使用。这个时候你是不是要一开始就拍脑袋制定好详细的分组方案，然后严格执行呢？显然不是，这个时候你制定的分组方案显然是不可能实用的，后面在应用的过程中肯定得不断的调整甚至彻底推翻重新修改。
怎么办？很简单，不管三七二十一直接用了再说，不分组，等好友上到十几个的时候再开始分组。而且这个时候仍不能完全确定分组方案，仍需要在后面不停增加好友的过程中继续修改和调整。

很显然，后面在添加某个好友的时候会遇到三种情况：
1> 已有的分组可以直接把这个好友加进去。处理方式：加之。
2> 已有的分组不能把这个好友加进去。处理方式：新建分组，并确定以后同样类型的人也加到这个分组中。
3> 因为要加这个好友，发现已有分组不合理，需要调整。处理方式：优化之，然后形成新的分组方案。

界面规范也是同样的道理：在什么都没有开始设计之前不要去制定规范，（往往你的老板也没时间让你干这么）开始动手工作之前不要管那么多，动手干就是了。
当然，有些时候在动手之前需要制定一定的“原则”，我认为这不能叫规范应该是一种“制度”。（比如，不要用12号以下的字体，行文不要太啰嗦，不用突兀的弹出窗口等）

很多人对于“为什么不能后期整理规范”不是很理解，跑过来找我交流。

其实原因很简单：如果在后期才整理规范，那么前边的设计过程势必会有问题，把前期的设计成果调整统一会浪费很多时间。如果你等IM的好友加到500的时候再整理分组，你会疯掉。
规范的作用不只是为了更好的保证后期的设计实现效果，还得保证设计过程中的统一和连贯性。
.

3、什么样的规范形式更适合网站产品？

在以往的软件产品上，因为系统的庞大，也因为版本更新不能过于频繁，我们经常会制定非常系统和完整的“应用规范系统”，以保证不要因为一些小的问题经常去要求用户对产品进行更新。通常我们会在“制定和形成规范”的环节花费大量的时间和人力，而且由于整个规范系统会很庞大和繁杂，往往在规范的执行上成本很高而且效率很低。到最后我们经常发现：所谓的规范系统就是一个摆设，为开发库添加了一堆多余的信息而已。

网站产品的迭代过程很短，更新和反复很快。将以往软件产品上的规范做法直接拿到这里后，我们发现维护和更新规范的成本要远远高于其带来的协作效率。这也导致了一些早期用软件开发方式制定界面应用规范的互联网企业，都相继放弃了这个工作环节。

但这不能说明界面应用规范在网站上就失去了意义，准确的总结应该是说“软件产品的规范形式在网站产品上很不适用”。
于是，我们需要寻找更加适合网站产品的界面应用规范的表现形式和方法。在网站产品上规范的形式要更加自由、更加低成本，应用上要更加的方便简单，越华丽的形式反倒越不利于后期的应用。

另外，如果是一个迷你型团队，我建议你把规范作的越简单越好。比如我曾经有一个规范只是建了一个文件夹，里面有各种场景下的不同界面和一个”*.txt”文件。文件的内容是这样的：
1、所有通用的二级展示页面，布局规则参考“news.jpg”；
2、所有警告类的弹出窗口参考“xxx.jpg”
3、…
当然，这样的“规范”其实只是一两个设计师之间的“设计备忘”。一般的中型团队还是需要一个简单的大概几页纸的示范文档作为规范记录。
.

4、网上有很多人公布的界面规范，我看到了很多形式和很多不同方式的内容，可我们团队人很少没有时间整理这么多的东西，而且有些我还不理解是什么（比如，“情感化设计规范”是什么意思？）。怎么办？

不办。
别管他们的叫法和形式。动手作你认为对的，然后不断完善和调整。只要动手作了，就会有好处。什么都还不了解的时候不要试图作一个“博识”，选择作一个实战者你的老板会更喜欢你。
和在IM加好友一样，看到别人那么多分类不知道自己怎么分的时候就别分，人多了再分，再调整。
没有万能的规范和准则，只有最适合你的。那就是你自己慢慢“修炼”出来的。

5、工程师对于界面上的很多东西往往并没有设计师那么敏感，经常和设计的差别很大。特别是一些“小问题”，比如在我们设计师看来18的行距和22的行距有着天壤之别，但他们无所谓。这个时候怎么办？

（合理来说，你的界面制作人员应该在设计团队而不是开发团队）
首先，必须自我检查一下。“我的界面规范是不是太复杂太多，给工程师在应用的时候增加了太多成本？”。
然后，想办法让你们的规范简单再简单，应用起来方便更方便。比如，不要用太多的文档“写规范”，而用图片“画”规范，把间距等等问题标示在图片上，让工程师更容易“阅读”。比如，把你的网站规范写成HTML的，把元素的代码放出来方便工程师直接拷贝，减少应用成本。（如这里的第二种方式）。
再后，如果你的规范足够简单，应用足够方便。再去和工程师进行更多的沟通，看看是不是他们现在打心理根本还很小视重视界面的问题。
还不行，把实现的效果和设计效果对比给他们看。同时请你的老板帮忙督促。
.

6、我们公司只有我一个设计，从交互到美工全活。没有规范行不行？

不行。
1> 就算是你一个人，时间长了没有一个被记录在案的“规则”，你的设计一样会乱。可以考虑让规范的形式简单更简单（如只留一个PSD文件或者TXT文件说明），但不可少。这个事情很简单，别偷懒。
2> 规范不只是为了今天看的，后面的设计执行、以后产品的维护和优化都需要用到。
3> 作为设计师要养成良好的工作习惯。

.
用以上6点抛砖引玉，欢迎在6月份第二周结束前继续提问，或者投稿说出你的观点。如有必要我会尽我所能再次统一撰文回答。
经验有限，部分观点可能相对片面，请选择性采纳。

相关话题：设计规范源地址：http://ucdchina.com/blog/?p=474

设计规范的理想

Angela — 2008-07-27 17:40:08

撰写和执行设计规范，是一件让人头疼的事情。往往一个项目做到可以抽象出规范的时候，也是这个项目正在全力冲刺的时候，要不要抽出2到5天的宝贵工作时间，来写一堆貌似多余的文字，这是大家一直争论不休的问题，这可以总结成：“什么时候写规范？”。

规范之所以让人觉得多余，最重要的原因是认真阅读并执行规范的人实在是太、太、太少了，大部分的规范要么就成了电脑里永不被打开的文件，要么就成了书架上落满灰尘的纸，这可以总结成第二个问题：“如何执行规范？”

不过我们在讨论这两个问题之前，需要先搞清楚，“在理想状态下，规范有什么用处？”

一、满足用户需要

用户在使用产品的时候，总是凭着直觉去使用，不到万不得己，不会求助于所谓的“帮助系统”（如果这个产品有的话）。这一点在互联网产品上更加突出。而保持产品概念、界面元素、视觉风格的一致，能帮助用户：

1、快速了解产品的运作方式。
2、建立精确的心理模型。
2、降低培训和支持成本。
3、减少犯错误的概率。

Shneiderman在1998年提出的“交互设计8项黄金法则”中的第一条，就是“力求一致性”，由此可见“一致性”在设计中的重要地位。“一致性”带来的最直接的好处就是：用户“认识”你的产品了。这种认识纯粹是一种主观的认识，用户可能没有认真想过这种“熟悉感”，只是隐隐觉得产品很亲切，很可靠。

设计规范正是对所有元素的运行规则的一种提炼和抽象。因此，一份撰写完善的设计规范，能划出产品的正确轨迹，帮助产品在正常范围内运转。

二、满足协作需要

产品的设计和开发从来都不是由一个团队完成的。通常情况下，一个产品的最终交付环节是开发团队，而在实际工作中，这个环节甚至会具体到某个开发人员。这也就意味着，专注于功能逻辑的同事，很难也没有时间去理解并执行你在产品设计阶段中反复强调的概念、界面、视觉等因素，所以才有“最终产品只实现了当初设计70%”甚至更低的现象发生。

另外，由同一个产品团队长期、持续地维护同一个产品的情况很少出现，一般的产品人员都同时兼顾多个项目，一个产品上线后，立刻转而关注其它产品。产品上线后的命运通常是交给运营团队或执行团队去维护，那些在设计过程中被反复讨论、验证过的设计思路，很难通过无声的界面传递下去，结果就是慢慢地变形。我曾经遇过几个产品设计师，在面试时展示自己的Web产品，一般都要强调一下：“我走了以后又改过版了，当初我的设计是……”。

所以在团队协作方面，需要有一个载体，用来记录设计时的思路和规则，这个职责，也同样落到设计规范身上。

三、提高团队效率

创意是一件很累的事，不管是产品创意还是视觉创意。如果每一个界面、每一个功能，都要创建新的规则，那么从事产品设计这个工作的人恐怕很少能幸存下来。事实上，在创意过程中，我们对所使用过的东西都是茶壶煮饺子──心中有数的，但是这些“数”通常只存在于我们的潜意识里。

把这些颇有价值的概念记下来并传达给其它设计人员，能避免大家做重复劳动。同时，发动同僚一起来总结规则，一方面可以节省他们的精力和时间，另一方面他们也能帮助你完善这些规则。

这样的一个协作平台，也是通过设计规范来完成的。

当然，以上这三点都是一个理想化的状态，我们姑且称之为“设计规范的理想”。为了实现这个理想，我们需要做的事情还有很多很多。本期UCDChina的话题“设计规范”，正是想跟大家一起探讨这个议题。

同时，从08年4月开始，UCDChina写作话题与书友会讨论话题相同，并向所有同行开放投稿（投稿方式见这里）。

那么，就以我这篇文章作为一个开始，欢迎大家都来发表自己对于“设计规范”的看法，分享曾经有过的经历和经验。希望大家能解答我在一开始提出的两个问题：什么时候写规范？如何执行规范？

相关话题：设计规范源地址：http://ucdchina.com/blog/?p=470