网站用户体验设计流程


用户体验设计流程 Contents 功能需求取舍1 交互设计优化2 视觉色彩优化3 前端代码优化4 用户体验原则制定5 用户体验5要素 1.表现层【视觉呈现】 2.框架层【布局】 3.结构层【交互。如何、可以、应该… 】 4.范围层【对需求的整合】 5.战略层【自身目标与用户需求】 功能需求取舍 以娱乐的心态取舍功能需求,只给最需要的不给最强悍的。 当收集到大量需求时,其中可能有主要需求与次要需求,客观判断哪些是首先要完 成的,哪些是可以放到2期来做的,并制定标准需求优先级与对应时间节点,这样可 以保证项目按期完成。 • 用户档案 • 文本环境分析 •可用性目标设定 • 平台功能和约束 • 通用设计指南 取舍功能需求的几个基础点 交互设计优化 在经过纸上原型设计之后,交互设计师要与产品规划师、可用性工 程师迅速沟通,优化纸上原型。交互设计师会根据纸上原型确定的 功能点与信息框架,通过Axure制作出低保真的交互设计原型 DEMO。 Axure制作交互设计原型的原则 : •构建信息架构 •页面的命名要有统一的规范标准。 •避免纠结复杂的交互控件实现 •少一点色彩与布局,多一点标注与说明 •Axure交互物也要注意可读性、可及性 •交互设计原型不是必须生成HTML文件并能动态交互 视觉色彩优化 色彩选择,决定了人们在第一眼看到网站时的感觉 视觉优化,风格上通常会支持企业的品牌,目标上传达出一种强烈的品牌 信息。但是品牌识别不止是图标和广告 词,它遍布在项目产品设计、网 站,以及材料中——事实上,品牌对配色方案的选择、字体、图形、词汇 表,体现在各个方向。 视觉色彩优化 视觉设计需要考虑的因素 颜色 - 让色彩更具有可读性,少一点颜色,多一点价值。 排版 - 根据字体的选择,文字颜色的选择,再看内在的、情感上的因素来布局。 规模 - 避免空间过度拥挤。 角度和形状 - 尖锐的角度、线交叉点或多个线条汇聚的地方,使用这些焦点把用 户的眼光引导到你希望的地方去。 重复出现的视觉主题 - 角落处理模式可以给用户带来视觉旋律。 文本 -选择形散,神不散的字体与文本颜色。 图片 - 节制性的使用装饰性图片,在功能性GUI里谨慎使用,因为会分散用户注 意力。 文化因素 - 如果要表达明显的文化含义,考虑下将要面对的受众。 前端代码优化 文件越大,用来下载和显示页面的时间就越长 (文件总体积,指的是构成 Web页面的所有文件,包括:HTML、外部CSS、外部JavaScript、图像、 声音以及视频在内的文件的大小 ) 对文件体积做事先的规划 • 把大部分的CSS和JavaScript文件放入外部文件 • 重复使用不同页面的图形、音频和视频 • 不要使用不必要的图形、动画或声音 • 在可能的情况下,使用小尺寸图像,而不是大尺寸图像 • 尽量减少特殊导航按钮 无论何时,页面打开速度是给用户的第一印象,也是提升用户对网站满意 度的重要因素,并且前端代码的优化将会给用户带来舒适地操作体验! 用户体验原则制定 在设计前我们要遵从一种通用性的用户体验设计原则,在设计后我们要能 总结归纳出只适合此产品的用户体验规则。 在设计前,我们会参考大量的通用性设计原则;在设计后,我们才会发现: 对于项目有针对意义的原则也就很少的几条。这个时候需要靠设计师自己 的逻辑归纳能力,把最重要最迫切的用户体验设计原则抽象出来。 用户体验原则制定 1. 以用户为中心的设计:设计必须是满足用户需求的、可行的,其次才是可产生商业价值的。 2. 操作入口明确:任何一个产品都要有明确、合理的入口。 3. 不歧视特殊人群:色盲、肢体残疾人士可以完成基本操作。 4. 任务可被完成:任务在无外界影响下可以被完成。 5. 问题可被解决:用户在任务中出现的问题,在无外界影响下可以被解决。 6. 简洁自然,清晰易懂:用简洁、自然、用户可理解的形式表达信息。 7. 突出重点,一目了然:用户的第一关注,将是设计中要表达的重点信息。 8. 导航明晰、有效:导航明确清晰、有效,分类彼此独立、完全穷尽。 9. 避免迷路:任何位置都能明确“我在那里?这里有什么?从这里能去哪里?”。 10. 深广度平衡:单个页面上可见菜单项的数目与层级结构中级别的数目平衡。 11. 习惯延续,必要延伸:用户的操作习惯必须延续,在用户可接受的范围之内适当延伸与引导。 12. 符合用户心智模型:用户对功能的预期与实际操作的结果保持一致。 13. 操作一致性:相同类型的命令或操作产生同样的效果。 14. 及时、有效、友好:第一时间针对用户的操作作出有效、友好的反应。 15. 避免出错:针对用户可能出现的错误,通过系统来避免错误的发生。 用户体验原则制定 • 一次点击:尽可能减少完成任务所需要的操作次数。 • 别让我思考:用户的第一反应所产生的操作正确、有效。 • 最小记忆负担:避免用户需要记忆5条以上的数据。 • 最简化:帮助信息精简,准确描述,段落不超过3段,句子不超过30字。 • 适时帮助:当用户需要帮助的时候才提供帮助。 • 二倍、一个:方案设计数量增加两倍或减少到单位数量时,仍可适用该设计方案。 • 以简化繁:尽量使用简单、原生的交互方式解决复杂的用户交互行为。 • 符合栅格:页面布局符合栅格系统标准。 • 符合标准设计模式:交互控件符合DPL设计模式标准。
还剩11页未读

继续阅读

下载pdf到电脑,查找使用更方便

pdf的实际排版效果,会与网站的显示效果略有不同!!

需要 6 金币 [ 分享pdf获得金币 ] 0 人已下载

下载pdf

pdf贡献者

landiao

贡献于2016-01-06

下载需要 6 金币 [金币充值 ]
亲,您也可以通过 分享原创pdf 来获得金币奖励!
下载pdf