写点什么

画好 Web 流程图

  • 2008-10-13
  • 本文字数:742 字

    阅读完需:约 2 分钟

画流程图是程序设计的基本功,但又似乎属于各有各的高招的一个领域。那么到底用什么标准评价流程图的好坏呢?从事用户体验设计咨询的丁宇在博客上分享了他“画 Web 流程图的一点心得” 。除了给出他自己的一套形状,还逐一说明注意事项,很有爱心:

作为整张流程图的头和尾,必须标清楚到底具体指哪个页面,以免日后出现歧义。
[……]
所有从形状出来的线条,都具有和此形状边框一样的颜色。这样的做法不仅看起来漂亮,在复杂的流程图中还能轻易地标明各形状的关系。
[……]
几乎总是让‘是’的分支往下流动,让‘否’的分支向右流动。因为流程图一般都是从上向下、从左到右绘制的,遵循上述规则一方面可以让绘制者不用为选择方向操心,另一方面也方便了读者阅读。
[……]
并非所有后台动作都绘入流程图中(否则流程图就会变成庞然大物了),只有需要特别强调的后台动作(和用户体验直接相关的)才使用此形状。
[……]
可以利用跳转点来分割篇幅巨大的流程图
[……]
分割篇幅巨大的流程图,更好的办法是用子流程。
[……]

他还特别强调: > 在团队合作中,图例是必须的,否则没人知道你画出来的东西到底是什么。

除了确保别人能看懂你的流程图,评价流程图的好坏,还要谨记“流程图是要指导 UI 设计的,是 UI 设计的参照物”,必须“覆盖了各种可能的情况和细节”,“考虑到系统的设计和承受能力”。

支付宝交互设计师 Joycce 总结得更加扼要:

  1. 简单易懂
  2. 表达正确全面,有重点、有细节
  3. 形像生动

丁宇也发起了一个征集活动,邀请大家一起分享自己的心得,各位达人请不吝赐教,InfoQ 中文站将继续跟踪报道。

如果想了解流程图的一般用法,Arky Tan 翻译了Jesse James Garrett 撰写的“描述信息结构和交互设计的图示词汇表 ”。顺便一提,流程图这东西是有标准的,在发明自己的一套图形之前,不妨先翻一下 ISO 5807:1985

2008-10-13 22:268999
用户头像

发布了 225 篇内容, 共 75.5 次阅读, 收获喜欢 53 次。

关注

评论

发布
暂无评论
发现更多内容

2025 简易Scrum指南(简体中文版)

ShineScrum

敏捷

YashanDB|数据文件损坏怎么查?教你用 dump + rowid 快速定位!

数据库砖家

数据库

YashanDB|一文读懂 Outline 功能实战验证:绑定、失效、主备、升级全覆盖!

数据库砖家

数据库

初探 YashanDB 共享集群:重新定义高可用数据库的新范式

数据库砖家

数据库

AI智上 | 数智报告:500强央企集团合并报表领先实践

用友智能财务

用友 数智化 智能财务 合并报表

YashanDB|decode 子查询被多次执行?性能骤降的真相找到了!

数据库砖家

数据库

安全企业内部im,BeeWorks即时通讯

BeeWorks

即时通讯 IM 私有化部署 企业级应用

AI与无人零售:如何通过智能化技术提升消费者体验和运营效率?

天津汇柏科技有限公司

人工智能 AI

本地部署阿里通义千问Qwen3:一键远程访问,还能解决Ollama安全隐患

贝锐

AI 内网穿透 通义千问 Qwen3

利用通义灵码和魔搭 Notebook 环境快速搭建一个 AIGC 应用 | 视频课

阿里巴巴云原生

阿里云 云原生 通义灵码

利用通义灵码和魔搭 Notebook 环境快速搭建一个 AIGC 应用 | 视频课

阿里云云效

阿里云 云原生 通义灵码

浅析金仓数据库KingbaseES自治事务

金仓技术

KingBase 金仓数据库

YashanDB|执行计划突然变差?小心统计信息时间戳不一致!

数据库砖家

数据库

YashanDB|OCI 接口快速上手指南:从环境配置到代码实战,一文带你搞定!

数据库砖家

数据库

初学者视角下的思考|YashanDB 安装流程能不能再友好一点?

数据库砖家

数据库

再这样玩下去,以太坊就是离心机,就是吸血魔

ChainFlash链訊

区块链 以太坊

SEO与国际化

溪抱鱼

SEO

TextIn MCP Server正式发布,无代码搭建智能文档处理Agent!

合合技术团队

人工智能 算法 #大数据

从 0 到 1 开发梦精灵提示词管理器:我的全栈开发实战记录​

龙正哲

DataWorks Copilot 集成 Qwen3-235B-A22B混合推理模型,AI 效能再升级!

阿里云大数据AI技术

Copilot MoE Dataworks MCP Qwen3

如何让 MCP 集成 API 更顺畅、无烦恼

数据追梦人

RAG vs. MCP: 你不知道你需要的 AI 充电接口

数据追梦人

怎么做好质量管理?质量管理怎么做到高效又保质?

积木链小链

质量管理 数字化转型 智能制造

YashanDB|Windows 下如何配置 ODBC 跟踪日志?三步搞定!

数据库砖家

数据库

画好Web流程图_最佳实践_郭晓刚_InfoQ精选文章