交互设计师需要掌握的方法
关关 2018-05-21 来源 : 阅读 1224 评论 0

摘要:交互设计主要分为两块:信息架构和操作细节。交互设计的产出物(交付物)也应当包含这一静一动两块。希望本文对大家学习交互设计有所帮助。

JJg在《用户体验要素》中,将交互设计设置在结构层。

 交互设计师需要掌握的方法

一方面,交互设计恰恰处在抽象的战略向具体实现页面的转化过度阶段。从产品开发流程中,交互设计上从产品经理接到需求,分析需求并最终交付网站高保真的原型。要把“抽象”的点子和想法如实贴切用界面语言表现出来。满足公司商业需求。

另一方面,交互设计师的诞生某种程度是为了提升产品可用性。其实就是要满足产品使用者——用户的要求。

交互设计主要分为两块:信息架构和操作细节。交互设计的产出物(交付物)也应当包含这一静一动两块。

下面从交互设计不同阶段的产出物,来谈谈交互设计的方法:

 交互设计师需要掌握的方法

 

1.接需求

这个阶段主要是接到产品经理等拿来的需求,比如FRD文档。和产品经理讨论需求,了解重点。


2.需求分析——>翻译成界面语言

俗话说,Think first,Design next.对于接到的需求,第一件要做的事情就是仔细分析和讨论下需求的逻辑、内容和目的,而不是马上风风火火的开工。这个阶段的重点在于梳理用户逻辑+特殊需求,最好能高度概括成几点。

忍不住引用臭鱼博客的一个灰常贴切的案例:

交互设计师需要掌握的方法

一个需求文档。里面描述了页面需要承载的信息。

第一步. 概括信息

您选择了回邮方式办卡,概括解释这个办卡方式。

接下来您应该 下载申请表

回邮办卡的全过程是这样的…

一系列注意事项。

第二步. 排序

1. 您选择了回邮方式办卡,概括解释这个办卡方式。

2. 接下来您应该 下载申请表

3. 回邮办卡的全过程是这样的…

4. 一系列注意事项。

第三步. 翻译为界面语言

 交互设计师需要掌握的方法

对于单一的页面(并非整站,没有操作逻辑)的产品来说,需求分析完,交付物出线框图,后面视觉和开发静态页面足够了。


3.结构框架

实际产品往往复杂很多,在需求分析的时候要对产品结构进行梳理,表达出网站的层级结构。做出类似的站点地图(site maps)。这个除了可以把公司所提供的内容层梳理清晰,为全站导航也奠定基础。

 交互设计师需要掌握的方法


4.流程图(flow charts)

流程图的重要性在于从用户的使用逻辑来分析交互逻辑是否合理,走得通。 

交互设计师需要掌握的方法 

其实流程图分为单个用户流程图和多用户流程图。它不仅是提高可用性的利器,也是信息架构的好工具。具体详情可以看:利用任务角色来做信息架构。


5.线框图(wireframes):更像最终产品呈现的毛胚。简单来说,就是抛去配色、字体样式、图片等的原型设计。这个阶段包含具体操作细节。 

线框图这个阶段,除了把上一阶段流程图需要的要素包含好,最重要的要考虑如何在页面中排布这些信息,积极具体的操作细节、状态说明。
交互体验的一些参照原则:操作前,结果可预知。 操作时,操作有反馈,可停止。 操作后,操作可撤销。 

体交互细节的说明,包括focus状态,变化反馈条件等等。


6.检查check

这个阶段就是再次对线框图进行可用性的分析。第一时间,设计师可以把已有的可用性原则拿出来参照,是否出现问题。

《Don’t make me think》里有些说明,外加偶个人总结的常见排查点:

· 这是个神马网站?(站点名称、logo、适当的说明)

· 我在哪?(文章或page title)

· 主要栏目有神马?(导航、分类…)

· 我在导航的哪个位置?(导航反白、面包屑)

· 能回去么?(Home和返回或撤销)

· 需要搜索吗?(搜索框满足询问型用户,而不是浏览型用户的需求)

· 两个重要状态有吗?(第一次进来的新手引导,参见here+出错状态提示)

· 相同功能和文案的统一、一致表达。

回头看看,这几个阶段的交付物涵盖了交互设计的内容:信息架构和操作细节。当然,具体思考过程不会那么界限分明。可能兼顾两者,比如在流程图中既有细节又有架构。

 交互设计师需要掌握的方法

交互设计其实让机器“模仿”人和人沟通对话。交互和视觉最终要的是清晰表达信息。


计师都该有自己的一套设计方法,设计分析思路和习惯,找到适合自己和环境的方法才是重点。


本文由职坐标整理并发布,希望对同学们有所帮助。了解更多详情请关注职坐标设计创作交互设计频道!


本文由 @关关 发布于职坐标。未经许可,禁止转载。
喜欢 | 0 不喜欢 | 0
看完这篇文章有何感觉?已经有0人表态,0%的人喜欢 快给朋友分享吧~
评论(0)
后参与评论

您输入的评论内容中包含违禁敏感词

我知道了

助您圆梦职场 匹配合适岗位
验证码手机号,获得海同独家IT培训资料
选择就业方向:
人工智能物联网
大数据开发/分析
人工智能Python
Java全栈开发
WEB前端+H5

请输入正确的手机号码

请输入正确的验证码

获取验证码

您今天的短信下发次数太多了,明天再试试吧!

提交

我们会在第一时间安排职业规划师联系您!

您也可以联系我们的职业规划师咨询:

小职老师的微信号:z_zhizuobiao
小职老师的微信号:z_zhizuobiao

版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
 沪公网安备 31011502005948号    

©2015 www.zhizuobiao.com All Rights Reserved

208小时内训课程