欢迎来到合肥浪讯网络科技有限公司官网
  咨询服务热线:400-099-8848

交互规划心得收拾

发布时间:2019-12-27 文章来源:本站  浏览次数:2561

交互规划的流程

如果一提到交互规划,你就想到画线框图或原型图,那你只对了五分之一。交互规划是一个进程,从开端到结束有一套体系的流程。原型图仅仅其间的一个环节。

当接到一个规划项目,怎么开端?都应该做哪些作业?怎样尽可能的保证交给物满意既定的功用以及用户体会层面的易用性?

第一步,是使命剖析,列出界面所要完结的一切使命。第二步按各使命确认页面流程,树立信息架构。接下来是创立统一的页面布局包含分区等。然后在页面布局的基础上进行原型规划,能够是低保真和高保真的原型图。最终编写规划阐明。

下面以规划一款动感相册界面为例,逐步讲解各个环节。

1. 使命剖析

第一步使命剖析。这儿要做的是关于将要规划的这个新界面的一切使命的剖析,也便是用户在界面上能进行的一切操作。这个剖析在功用需求的基础上进行,需求方一般供给一个功用点的列表。

使命剖析最常见的是使命列表,别的有使命流程和使命场景等。下面以使命列表为例。

列出一切主要使命,以及每个主要使命的子使命。再把子使命细分到各个进程。构成下面这个列表。

主要使命1

子使命1

进程1

进程2

子使命2

进程1

进程2

主要使命2

以动感相册为例,使命剖析列表如下:

1.阅读相册

1) 阅读相册列表

2) 挑选相册

3) 阅读相片

2. 创立新相册

1) 添加相片

a) 挑选已有相册

b) 挑选相片

c) 摆放次序

d) 添加字幕文字

e) 挑选动画效果

2) 添加模板

a) 阅读模板

b) 挑选模板

3) 添加音乐

a) 阅读音乐列表

I. 试听音乐

II. 挑选音乐

b) 添加新音乐

I. 打开本地文件

II. 挑选音乐

4) 预览(略)…

5) 命名(略)…

6) 保存(略)…

3.修改相册(略)…

使命列表包含一切功用点,并对每一个功用点的逻辑联系进行整合。必要时会对各使命的使用频率和其它影响规划的重要因素进行剖析,这儿不做解说了。

2. 页面流程

使命剖析完结后,进入规划的第一步,即规划页面流程。页面流程是规划的开端,也是重要的一环。它决议整个界面的信息架构和操作逻辑。

页面流程是上一步使命剖析的自然转化。一般来说,一个主要使命便是一个页面,其它子使命也能够转化为页面。

以动感相册为例,页面流程如下:

交互规划心得收拾(图一)

页面几乎是把使命剖析照搬过来了。所以上一步做好了,这一步很轻松,并且越往后越轻松。

注意这个流程图应该包含一切将要规划的新页面,一个不少,一个不多。它不仅确认页面内容,页面数量,还确认各页面之间的联系。如果在后来规划具体页面原型时,发现这个流程图多了或少了页面,或许页面联系发生了改变,阐明你的功夫不到家(这个比较难,我一般不苛求咱们的规划师)。根据原型图来创立或许修改页面流程图,不是在做规划,而是在写规划阐明。

3. 页面布局

第三步页面布局是具体页面规划的开端,在上一步知道有哪些页面需求进行规划后,这儿对页面进行划分,对内容进行安排。最重要的一点是确认页面分区。

以动感相册为例,页面布局如下:

总布局,即通用布局,适合一切页面。

交互规划心得收拾(图二)

具体页面布局,在不与总布局冲突的情况下,有更细节的布局。

交互规划心得收拾(图三)

页面布局赋予零碎的内容以逻辑性,以分区的形式把页面各区域所对应的功用区确认下来,减少具体规划时的随意性。这是规划谨慎与否的体现所在。把相似的操作放在一起,关于用户来说是能够预见的,用户能够判别哪个操作在哪个区域,减少盲目寻觅带来的困难和疑惑。

4. 原型规划

这一步是咱们熟知的,即具体页面的规划。这一步规划把一切的界面元素体现出来。能够有低保真和高保真原型图。低保真即是线框图,高保真多是接近最终效果图。

下面是动感相册的低保真原型图。

交互规划心得收拾(图四)

5. 规划阐明

最终一步需求做的是对一切页面进行具体的描述,包含对页面上一切元素进行阐明,比如默许状况,跳转页面,字号字体,尺寸等。这儿就不解说了。这是交给开发人员的文档,以及测验人员进行测验的根据。

小结

交互规划是一个进程,它不仅仅是画线框图。交互规划最关键的两个环节是页面流程和页面布局,前者树立明晰的架构和紧密的逻辑,后者整合零星的信息并确认清楚的主次联系。这一切都是为了咱们的终极目标——让咱们的界面契合用户的预期,不带给他们任何的意外。一切都在用户的意料之中。

上一条:网页规划的按钮评论...

下一条:干货:网站建造图片需求留...