备课笔记-网页交互的低保真呈现.doc

编号09-01【web产品交互设计开发制作】 编号09-01 学习任务三、网页交互的低保真呈现 一、课程说明与要求 1.课程说明 本阶段课程分为三个部分，第一部分为制作产品原型时要注意什么，介绍了Axure原型设计注意事项；第二部分为提高Axure设计效率的建议，介绍如何高效率设计交互原型；第三部分为Axure低保真常用功能实现，重点说明网页交互中的功能Axure低保真的实现；通过学习Axure设计注意事项和低保真交互案例，学生可以全面、深入、透彻地理解Axure原型设计工具的使用方法，提高产品设计能力和项目实战能力。 2.工具材料准备说明 本课的作业作品实践需要同学们提前准备一些工具和材料，教师提供软件下载链接。 工具材料 备注 Axure 每台电脑安装 二、学情分析与课程导入 1.学情分析 本课程为效果实现课程，需要能深入掌握Axure各个元件的使用，然后将低保真原型效果实现出来。需要学生在学习过程中，结合实际的网页交互案例进行操作感受。在进行原型设计效果制作的同时，要不断思考原型设计效果的逻辑，思考如何做到与最终成品一致的效果，这是非常重要的。此外，这时一门实践性较强的课程，需要学生在平时学习时不断的思考各个实际案例中交互效果实现的方式方法，提高自己制作交互原型的效率。 2.课程导入 我们之前学习了Axure交互工具的使用规范。而想要把一个低保真交互效果制作出来，需要知道Axure交互原型设计的注意事项，这样才能提高交互设计效率。那么，本节课将通过对网页中的交互在Axure中实现低保真的效果，来对Axure实现交互原型设计有更深入的了解。 三、理论知识讲解 （一）制作产品原型时要注意事项…………………【思政融入（从使用时注意事项，提高团队完成任务的工作效率，领会原型制作各个要点的有机统一，体现自我在集体中的价值）】 1.页面结构完整，展示页面流程 展示了页面流程之后，不仅可以看到这个产品中的具体页面，还可以看到是如何从过一个页面跳转到另一个页面。我们一个就能知道有哪些页面，页面和页面之间的关系是如何，在辅以必要的说明，可以增强沟通的效果，提高工作效率。 编号09-02 编号09-02 2.功能框架的划分要明确、合理 产品由很多功能组成，如何将这些功能划分到不同的模块里面，这是非常重要的。同时，功能框架划分明确，也能够方便产品团队的成员理解产品经理的思路和意图，和产品经理一起更好的完善产品设计。明确合理的功能框架也能够让用户在使用的时候体验更好。 3.功能结构完整、流程清晰 清晰的产品流程，能够帮助用户快速的了解产品希望解决的问题及解决问题的方式；同时，也能够方便梳理产品的功能结构是否完整，是否有遗漏的环节。简单来说，功能流程清晰、结构完整的产品原型，能够帮组用户快速的了解到“完整”的产品是什么样的，在此基础上，用户就能够更好的理解和思考产品的功能细节。 4.色彩的合理应用 （1）增加明暗对比 做好明暗对比之后，我们可以明确地看到，需要突出的内容是哪一部分，或者重点和非重点之间的分别。 （2）不使用不必要的颜色 在制作线框图的时候，个人的建议是不要使用过多色彩，除了已经定下来的主调色和点缀色，其他的色彩尽量少使用。如果使用了过多色彩，会在产品设计的时候带来干扰。 5页面布局 （1）设置好第一屏的高度 第一屏的高度至关重要，尤其是在网页中。最重要的内容、尤其是重要的操作按钮尽可能在第一屏内显示完全，否则用户体验会较差，从而对很多方面造成影响。 （2）内容切忌堆叠 过多的堆叠内容，会让页面变得非常拥挤，没有美感，同时也不能突出重点。对后面的工作也有比较大的影响，可能需要重新布局排版、或者调整所有版块，大大增加了工作量。 【那么在这部分的学习中，请大家思考一下如何提高Axure制作原型交互的效果】 （二）提高Axure设计效率的建议 ………………………………………………………………【重点】 1.用一个控件就可以完成的事永远不要用两个控件 编号09-03 编号09-03 2.不要复制对象，而是把对象转成母版 当你使用任何操作次数超过一次的时候。当发现自己一直在复制和粘贴一组控件，可以将对象创建一个母版。 3.保持项目的组织性和命名的清晰性 4.养成使用全局辅助线和网格的习惯 辅助线顾名思义就是用于辅助页面进行排版布局的线，辅助线可以帮助我们在页面设计之初，对页面结构、内容排版、间距大小进行合理的划分，在Axure中包括全局辅助线和页面辅助线两类。与此同时，一个团队成员将在一个共享项目中看到这些全局辅助线，使用网格可以帮助你保持设计的整洁和结构化。 编号09-04 编号09-04 5.导入功能 在大多数项目中，人们制作的元素对其他项目也都是有用的。不需要重新发明轮子，而是重复使用那些在过去工作中使用过的元素。 6.不要设计