当前位置:首页 > 经验学习 > 交互设计

交互设计的方法

所属栏目:交互设计 时间:2013-12-26 来源: 作者:不详 点击:

长期以来我就有对几年来交互设计的心得进行总结整理的想法。回到中国来亲身体会到不少同行,主要是交互设计师和视觉设计师对于交互设计的困惑,以及其他行业对于交互设计的误解和滥用。后来我在小范围内开设了一个关于交互设计的讲座;现在把它整理成文,希望与同行切磋,共同进步。
这篇文章是我几年来在美国从事交互设计工作的一个经验总结。当时我们遵循以用户为中心(User-Centered-Design, 简称UCD)的设计原则,每一个项目都是不折不扣的按所有UCD的步骤进行。下面总结的交互设计的方法,是从UCD的过程中提炼出来,也就是说,同样适用于任何非UCD的设计过程。


交互设计的流程
如果一提到交互设计,你就想到画线框图或原型图,那你只对了五分之一。交互设计是一个过程,从开始到结束有一套系统的流程。原型图只是其中的一个环节。
当接到yi(一)个设计项目,怎么开始?都应gai(该)做哪些工zuo(作)?怎样尽ke(可)能的保证交付物满足既定的功能以及用户体验层面的易用性?
第一步,是任务分析,列出界面suo(所)要完成的所有任务。第二步按各任务确定页面流程,建立信息架构。接下来是创建统一的页面布局包括分区等。然后在页面布局的基础上进行原型设计,可以是低保真和高保真的原型图。最后编写设计说明。
下面以设计一款动感相册界面为例,逐步讲jie(解)各个环节。
1. 任务分析
第一步任务分析。这里要做的是对于jiang(将)要设计的这个新界面的所有任务的分析,也就是用户在界Mian(面)上能进行的所有操作。这个分析在功能需求的基础上进行,需求方一般提供一个功能点的列biao(表)。
任务分析最常见的是任务列表,ling(另)外有任务流程和任务场景等。下面以任务列表为例。
列出所有主要任务,以及每个主要任务的子任务。再把子任务细分到各个步骤。Xing(形)成下面这个列表。
主要任务1
子任务1
步骤1
步骤2
子任务2
步骤1
步骤2
主要任务2





以动感相册为例,任务分析列表如下:
1. 浏览相册
1) 浏览相册列表
2) 选择相册
3) 浏览照片
2. 创建新相册
1) 添加照片
a) 选择已有相册
b) 选择照片
c) 排列顺序
d) 添加字幕文字
e) 选择动画效果
2) 添加模板
a) 浏览模板
b) 选择模板
3) 添加yin(音)乐
a) 浏览音乐列biao(表)
I. 试听音乐
II. 选择音乐
b) 增加新音乐
I. 打开本地文件
II. 选择音乐
4) 预览(略)…
5) 命ming(名)(略)…
6) 保Cun(存)(略)…
3. 修改相册(略)…
任务lie(列)表包括所有功能点,并对每一个功能点的逻辑关系进行整合。必要时会对各任务的使用频率和其它影响设计的重要因素进行分析,这里不做解释了。


2. 页面流程
任务分析完成后,进入设计的第一步,即设计页面流程。页面流程是设计的开始,也是重要的一环。它决定整个界面的信息架构和操作逻辑。
页面流程是上一步任务分xi(析)的自然转化。一般来说,一个主要任务就是一个页面,其它子任务也可以转化为页面。
以动感相册为例,页面流程如下:

页面几乎是把任务分析照搬过来了。所以上一步做好了,这一步很轻松,而且越往后越轻松。
注意这个流程图应该包括所有将要设计的新页面,一个不少,一个不多。它不仅确定页面内容,页面数量,还确定各页面之间的关系。如果在后来设计具体页面原型时,发现这个流程图多了或少了页面,或者页面关系发生了变化,说明你的功夫不到家(这个比较难,我一般不苛求我们的设计师)。根据原型图来创建或者修改页面流程图,不是在做设计,而是在写设计说明。


3. 页面布局
第三步页面布局是具体页面设计的开始,在上一步知道有哪些页面需要进行设计后,这里对页面进行hua(划)分,对nei(内)容进行组织。最重要的一点是确定页面分区。
以动感相册为例,页面布局如下:
总布局,即通用布局,适合所有页Mian(面)。

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

请站长喝杯咖啡?

站长一直坚持白天工作、晚上熬夜更新素材,付出了巨大的精力和时间,其中的辛酸难以言述。

坚持免积分、免登录、无任何限制下载!如果本站素材对你有用,不妨考虑请站长喝杯咖啡鼓励一下!

标签:

你应该也喜欢这些吧

共有 0 条评论

给个评价吧

验证码: