网页中的“交互设计表格”应用

网页中的表格我们都很熟悉，当将这种表格应用到交互设计那会产生怎样的效果，在本文中称之为交“交互设计表格”，在一些设计场景中使用其可以有效提高用户体验。

说：在一个房间里丢了一根针，你需要找到它，你会用什么办法?

答：扫把;吸铁;放大镜。。。粉笔。。。Ok，使用粉笔?请看下图↓

划分区块，每个找过的地方做个标志。可能不是很快找到，但绝对有效。表格能确保我们不遗漏。

说：2个山，能组成几个字 ?

答：出，屾，王。。。(我继续想想)

Ok，我们使用表格。

正常的应该都出来了吧。不是每个人都才思敏捷，但表格能帮我们穷举，得出正确结果。

回到主题，我们说说交互设计表格。

先说交互设计师的烦恼：

你是不是常常觉的状态没有考虑全，一遍一遍的琢磨?

你是不是常常觉的跟需求方交流费尽口舌，对方还糊涂?

你是否常常一个接一个的场景描述，且大部分都是重复的文字?

Ok，我们来看下交互设计表格能否解决我们的大部分烦恼。

表格说明：划分2个纬度——页面元素和用户行为。最左边一列是页面可见元素(包括光标);最上面一行，是用户的行为(尽量按操作流程)。中间交叉的为场景描述。

举例分析：客户端的二级登录

针对以上内容，交互设计表格(只针对交互内容)如下↓：

表格中提到的状态图如下：

↓图例1：未行动

↓图例2：请您输入用户名

↓图例3：X密码有误，请重新输入

↓图例4：正在登录

↓图例5：!超时，请重新登录!

此方式，在工作中，运行良好。利于检测和交流。ok，希望交互设计表格能对你也有帮助。

进入论坛参与讨论：http://www.missyuan.com/viewthread.php?tid=429361