1 / 71
文档名称:

互联网交互设计方法 (5).ppt

格式:ppt   大小:1,283KB   页数:71页
下载后只包含 1 个 PPT 格式的文档,没有任何的图纸或源代码,查看文件列表

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

分享

预览

互联网交互设计方法 (5).ppt

上传人:taoapp 2022/7/26 文件大小:1.25 MB

下载得到文件列表

互联网交互设计方法 (5).ppt

文档介绍

文档介绍:互联网交互设计方法
臭鱼

交互设计重要,但却不知要怎么做。

交互设计是什么?
交互设计是一个设计工作。
交互设计是一门技术。
交互设计在目前阶段的主要使命是提高产品可用性
练****QQ空间日志
新的需求:
添加私密记事本
添加QQ心情
原有的日志需保留
结构图法
任务走查法
优化现有产品的方法。成本低,见效快。对产品整体上影响小。
以用户任务为线索,以可用性准则为依据。
可用性准则
页面表达原则+信息构架原则+视觉表现规范
任务走查法
视觉表现规范
滚动条看上去应该象滚动条
表单的对齐方式
重要的内容显示在第一屏
导航应出现在第一屏上半部分
尽量避免使用装饰性的图标
避免内容看上去象广告
光标样式
Tab需要有三种状态而不是两种
红色表示警示,绿色表示ok,黄色表示提示
灰色通常表示“暂不可用”(disabled)
任务走查法
具体操作
第一步. 分析并总结所有任务
第二步. 根据任务进行走查
评估中需要注意:
1. 不影响任务的问题不记录
2. 被记录的缺陷是有根据的,而不是根据自己的感觉。
任务走查法
实例:QQ秀快速换装
任务走查法
实例:QQ秀快速换装
第一步. 任务分析
换一套新形象
换表情
换心情
随便逛逛
换一个自己以前的形象
任务走查法
实例:QQ秀快速换装
第二步. 走查
问题1
副标题表意不明确
描述
这句说明仍旧没能说明“这里是什么功能”。如果能通过这句话说明:“在这里添加文字内容,显露您的心情”,说明的效果会更好。至于“让好友都知道!”这几个字几乎是没有用的,没有传达任何信息量。
依据
页面表达原则:信息的表达应该清楚、明确、直接。
修改建议
任务走查法
实例:QQ秀快速换装
第二步. 走查
问题2
“请输入心情秀”表意不明确
描述
“请输入心情秀文字”其实是第二层要表达的信息,第一层应该是:“这里还没有输入文字”。没有第一句,直接是第二句,需要用户花些时间来推断,推断出,这里显示“请输入心情秀文字”是因为自己没有写文字进去。
依据
页面表达原则:信息的表达应该清楚、明确、直接。
修改建议
任务走查法
实例:QQ秀快速换装
第二步. 走查
问题3
拖动预览中的心情秀时的光标使用错误
描述
拖动预览图中的心情秀时,光标为
应该使用十字箭头。
依据
视觉表现规范:光标样式
修改建议
任务走查法
实例:QQ秀快速换装
第二步. 走查
问题4
“心情秀”概念不清
描述
“心情秀预览”暗示出,“心情秀”是指外框+文字内容。
“换心情秀”功能只是换框,这意味着“心情秀”是指外框。
措辞上的含混使得同一个概念出现两种不同的定义,不易于理解。最直接的反应是:“既然心情秀是指外框+文字内容,那么当我点击 下一个 后,其中的文字内容是不是也会变化?”
依据
页面表达原则:措辞统一
修改建议
任务走查法
实例:QQ秀快速换装
第二步. 走查
问题5
换心情秀外框操作不便
描述
“上一个”“下一个”的操作不方便。无预览图,无法确定当前选项在全部“框”的列表中所处位置。
依据
页面表达原则:操作结果不可预知
修改建议
任务走查法
实例:QQ秀快速换装
第二步. 走查
问题6
“预览”按钮视觉效果不佳
描述
预览按钮视觉样式比较象disabled
依据
灰色通常表示“暂不可用”(disabled)
修改建议
任务走查法
实例:QQ秀快速换装
第二步. 走查
问题7
“脱掉”按钮不易找到
描述
“脱掉”按钮在框的有下角,很多时候看不到,并且文字超小。
依据
页面表达原则:信息的表达应该清楚、明确、直接。
修改建议
任务走查法
练****QQ秀 照相馆
任务走查法
练****QQ空间 心情
任务走查法
最后最后的总结
交互设计的主要任务是:
表达。
通过清晰、准确、简洁的表达进而实现人机交互。
最后最后的总结
“互联网产品的交互设计应该怎么做?”
“互联网产品应该如何去表达?”
Let’s talk
Let’s talk
Let’s talk
Let’s talk
Let’s talk
Let’s talk
谢谢~~
臭鱼

葄祄鋙坂鐺涇帐秒淇茷啹倻艱鴇宝鸒癮硰焏蘬头笑蟎鶸娯壺欅嘨釩岆幾闕跴蜚诳嗋襷榝蓀堳纛埨瀹鈴鋾甚撑褜凷瞧睧朮衫皺鄪貧池蕬哓釢隗扩抬