画流程图是程序设计的基本功，但又似乎属于各有各的高招的一个领域。那么到底用什么标准评价流程图的好坏呢？从事用户体验设计咨询的丁宇在博客上分享了他“画 Web 流程图的一点心得” 。除了给出他自己的一套形状，还逐一说明注意事项，很有爱心：
作为整张流程图的头和尾，必须标清楚到底具体指哪个页面，以免日后出现歧义。
[……]
所有从形状出来的线条，都具有和此形状边框一样的颜色。这样的做法不仅看起来漂亮，在复杂的流程图中还能轻易地标明各形状的关系。
[……]
几乎总是让‘是’的分支往下流动，让‘否’的分支向右流动。因为流程图一般都是从上向下、从左到右绘制的，遵循上述规则一方面可以让绘制者不用为选择方向操心，另一方面也方便了读者阅读。
[……]
并非所有后台动作都绘入流程图中（否则流程图就会变成庞然大物了），只有需要特别强调的后台动作（和用户体验直接相关的）才使用此形状。
[……]
可以利用跳转点来分割篇幅巨大的流程图
[……]
分割篇幅巨大的流程图，更好的办法是用子流程。
[……]
他还特别强调： > 在团队合作中，图例是必须的，否则没人知道你画出来的东西到底是什么。
除了确保别人能看懂你的流程图，评价流程图的好坏，还要谨记“流程图是要指导 UI 设计的，是 UI 设计的参照物”，必须“覆盖了各种可能的情况和细节”，“考虑到系统的设计和承受能力”。
支付宝交互设计师 Joycce 总结得更加扼要：
- 简单易懂
- 表达正确全面，有重点、有细节
- 形像生动
丁宇也发起了一个征集活动，邀请大家一起分享自己的心得，各位达人请不吝赐教，InfoQ 中文站将继续跟踪报道。
如果想了解流程图的一般用法，Arky Tan 翻译了Jesse James Garrett 撰写的“描述信息结构和交互设计的图示词汇表 ”。顺便一提，流程图这东西是有标准的，在发明自己的一套图形之前，不妨先翻一下 ISO 5807:1985 。
暂无签名
分布式云行业实践指南（2023）
业内首个分布式云行业实践方法论、工具箱。
评论