用户体验要素 | 框架层

框架层

用户体验的第四个要素是框架，当从结构层确定了交互结构与信息层级之后，接下来要做的，就是确定每个界面的布局，绘制线框图，产出原型

image.png

在框架层，需要明确的问题：

如果结构层所定义的是哪个功能应该在哪些页面上完成，那么框架层需要解决的是这些功能在页面上如何被实现，即原型的设计要素是什么？

如何促进用户与功能产生互动（让用户做什么）——界面设计
如何促进用户理解信息架构（让用户去哪里）——导航设计
如何促进信息的有效传达（怎样让用户去理解）——信息设计

框架层的产出物——原型，线框图不是一个可随意进行临摹的框架设计，而需要整合界面设计、导航设计、信息设计，即包括安排和选择界面元素、识别和定义核心导航系统、放置与排列信息组成部分的优先级等：

界面设计

界面设计所对应的是任务流，确定交互设计中更具体的功能点，为用户想完成的任务选择正确的界面元素，使易于使用，迅速理解

界面设计的内容：

• 布局区域，比如手势热区、手势死角区
• 相关的界面控件，比如弹窗、表单、单选框、复选框等
• 相关组件的样式，比如搜索框的形状、大小、位置等

导航设计

导航设计所对应的是信息流，在信息架构的大系统里，为用户设计的导航体系能使用户在结构中能了解来去方向，自由穿行，而不迷失方向，手足无措

导航系统的类型

• 全局导航
• 局部导航
• 辅助导航
• 上下文导航
• 友好导航
• 网站地图
• 索引表

导航设计的内容

• 定义网站跳转方式
• 传达元素与内容间的关系
• 传达内容与页面间的关系

信息设计

信息设计贯穿于任务流与信息流之间，目的是以一个良好的信息设计，来支持并促进用户行为的发生，使信息易于理解，产品易于使用

信息设计的类型

# 视觉设计

确定视觉上的最佳展示效果，饼图vs柱状图，望远镜vs放大镜

# 信息分组

• 信息分类一
• 信息分类二
• 信息分类三

# 提示信息

• 错误信息
• 说明信息

# 指示标识
常与导航设计相结合，现在常见的有使用向导，新手指引等

两个验收标准

• 是否能反映用户的思路
• 是否能支持用户的任务与目标

在框架层，产品基本已经成型，在这个阶段处理了放置问题与更精准的细节问题，形成了最终的产出物，原型。接下来要做的也是最后一步，进入表现层，在原型的基础上，进行视觉设计，使产品更容易被用户所感知