1 / 13
文档名称:

交互设计精简.doc

格式:doc   页数:13页
下载后只包含 1 个 DOC 格式的文档,没有任何的图纸或源代码,查看文件列表

如果您已付费下载过本站文档,您可以点这里二次下载

分享

预览

交互设计精简.doc

上传人:wc69885 2015/9/26 文件大小:0 KB

下载得到文件列表

交互设计精简.doc

相关文档

文档介绍

文档介绍:一、交互模型的表示
用任务模型和状态转换模型对交互进行描述。
1、任务模型
任务就是人们希望做的事情、要起作用的事和想要知道的事。在图案设计中,一个任务可以是绘制一个复杂图形,可以是绘制复杂图形中的一个简单图形,也可以是绘制复杂图形中一个简单图形的一笔。任务不是原子的,是可以被分解为若干个子任务,子任务通过顺序、选择等关系完成整个任务。
子任务是对任务进行分解的产物。为了能更好的对任务进行描述,常常需要将一个大的任务分解为若干步骤,即为子任务。子任务仍然可以继续分解,形成层次的树状结构。
2、状态转换模型
在交互过程中,状态反映了当前的系统的情况。交互中的各个状态结合起来就组成了状态转换的集合,使用状态转换网(STN)进行描述。通过交互过程中的事件(鼠标、键盘等),状态沿着边跳转到下一个状态。
3、任务与状态转换图之间的关系
在上述介绍的层次任务树中,每一个中间结点对应一个子任务,每个叶结点对应一个状态转换图。状态转换图控制子任务的完成并记录交互数据。
4、任务模型的具体描述
这里使用图案设计系统中一个具体实例来介绍任务模型的定义。这个交互任务被描述为:首先,用户使用鼠标绘制一条直线。然后进入第二个阶段,在这个阶段中,可以任意选择绘制三种曲线之中的一种,分别是“曲线边界”、“圆弧边界”、“折线边界”。如图
三者无先后顺序,用户可以在绘制的过程中随意切换绘制的图案类型。绘制完一段后,用户可以连续的进行绘制直到用户指定绘制结束。当这段曲线绘制结束后自动回到整个任务的开始阶段,即用户可以再次绘制一条直线,然后绘制三种复合曲线。对任务进行分解得到如下的任务树。
进一步分析得到如下图
将上述任务进一步细化,使用xml进行描述
<tasktemplate>
<task name ="complicateInteraction" op = "seq" >
<subTask name = "drawLine" type = "diagram" executeTimes="1" multiExeStartStatus="" nextSubStartStatus="s
enondStatus" cursor = "singleLine" dataMember = "seg1" templateName = "lineDiagram" >
</subTask>
<subTask name = "drawPathTask" type = "task" executeTimes="-1" multiExeStartStatus="multiStart" nextSubStartStatus="" cursor = "pathBorder" dataMember = "seg2" templateName = "drawPath" >
</subTask>
</task>
<task name ="drawPath" op = "sel" >
<statusMapping>
<item name="m1" from="senondStatus" to="1" />
<item name="m2" from="multiStart" to="1" />
</statusMapping>
<subTask name = "drawCurve" type = "diagram" executeTimes="1" cursor = "mulBezier" dataMember = "points1" templateName = "drawCurveBorder" lastPointIndex="1" >
<trans name = "t1" eventType = "toArc" next = "drawArc" />
<trans name = "t2" eventType = "toPathLine" next = "drawPathLine" />
</subTask>画曲线
<subTask name = "drawArc" type = "diagram" executeTimes="1" cursor = "mulArc" dataMember = "points2" templateName = "drawArcBorder" lastPointIndex="1">
<trans name = "t3" eventType = "toCurve" next = "drawCurve" />
<trans name = "t4" eventType = "toPathLine" next = "drawPathLine" />
</subTask>画圆