Axure网站与App原型设计（全彩慕课版）（AxureRP10）- 教案 第7-12章 用Axure链接动作制作交互效果-产品经理的职能

PAGE2PAGE第7章用Axure链接动作制作交互效果课程名称Axure网站与App原型设计（全彩慕课版）（AxureRP10）项目名称用Axure链接动作制作交互效果任务名称用Axure链接动作制作交互效果课时4项目性质□演示性□验证性□设计性√综合性授课班级授课日期授课地点教学目标知识目标1．了解当前窗口、新窗口、弹出窗口、父窗口、关闭窗口链接动作。2．熟悉“在框架内打开链接”动作，了解内联框架和父框架的使用方法。3．掌握“滚动到元件（锚链接）”动作的使用方法。4．了解自适应试图功能，根据计算机、手机等不同尺寸的终端显示不同的内容。能力目标1．可以以各种方式打开页面。2．可以设置“滚动到元件（锚链接）”动作。3.可以设置自适应视图，根据不同尺寸终端显示不同内容。素质目标1．培养创新思维和创业精神。2．培养敬业精神。教学内容打开链接和关闭窗口动作在框架内打开链接动作滚动到元件（锚链接）动作设置自适应试图小结教学重点打开链接和关闭窗口动作、在框架内打开链接动作、滚动到元件（锚链接）教学难点滚动到元件（锚链接）教学准备1.装有Windows10系统的电脑2.教学课件PPT3.教材：Axure网站与App原型设计（全彩慕课版）（AxureRP10）人民邮电出版社作业设计实现京东首页返回顶部操作教学过程教学内容与过程（教学内容、教学方法、组织形式、教学手段）做好课前“5分钟”教学管理（多媒体、实训室），做好上课前的各项准备工作（打开电脑、打开课件、打开软件、打开U盘中的素材位置、打开授课计划、教案等），吸引学生注意力。【课前说明】分别从打开链接、关闭窗口、在框架内打开链接等方面来对其进行介绍，为实际应用打开链接打下基础。【目的】使学生从了解本章节的学习目标、学习重点、考评方式等方面明确学习本章节知识的要求和目标。一、打开链接和关闭窗口动作1.当前窗口打开链接2.新窗口打开链接3.弹出窗口打开链接4.父窗口打开链接5.关闭窗口二、在框架内打开链接动作1．内联框架2．父框架三、滚动到元件（锚链接）动作页面侧面悬浮一块区域，单击悬浮区域的链接，页面会滚动到相应位置，比如页首、页尾。四、设置自适应试图设计的原型，可以支持在不同的终端下显示不同的内容。同步训练：“滚动到元件（锚链接）”动作。本章主要讲述了各种打开链接的方式，使用链接动作制作交互效果，实现原型页面跳转、长页面定位的全场景交互的功能。通过本章的学习要学会当前窗口打开链接、新窗口打开链接、弹出窗口打开链接、父窗口打开链接、关闭窗口，学会使用在框架内打开链接、使用滚动到元件（锚链接）、配置自适应视图功能。本节课主要运用案例教学法，介绍了打开链接的核心知识点。通过实例的方法加强对相关知识点的理解，达到能够独立熟练运用其功能解决实际问题的能力。教学评价方式以小组为单位，以完成案例的质量为评价标准，形成任务驱动，小组协作，质量与速度并存的课堂评价方式，促进学生的自主、创新学习的方式。第8章用Axure元件行为制作交互效果课程名称Axure网站与App原型设计（全彩慕课版）（AxureRP10）项目名称用Axure元件行为制作交互效果任务名称用Axure元件行为制作交互效果课时4项目性质□演示性□验证性□设计性√综合性授课班级授课日期授课地点教学目标知识目标1．熟悉“显示/隐藏”行为。2．熟悉“设置文本”“设置图片”行为。3．掌握“设置选中”“设置选中下拉列表选项”行为。4．了解“启用/禁用”“移动”“旋转”行为。5.掌握“置顶/置底”行为。6.熟悉“获取焦点”“展开/折叠树节点”行为。能力目标1．可以设置各种交互行为。素质目标1．培养个人文化素养。2．培养用于探索未知领域的能力。教学内容1.显示/隐藏行为2.设置文本和设置图片行为3.设置选中行为4.设置选中下拉列表选项行为5.启用/禁用行为6.移动、旋转和置顶/置底行为7.获取焦点和展开/折叠树节点行为8.小结教学重点1.显示/隐藏行为2.设置文本和设置图片行为3.设置选中行为4.设置选中下拉列表选项行为教学难点设置选中行为、设置选中下拉列表选项行为教学准备1.装有Windows10系统的电脑2.教学课件PPT3.教材：Axure网站与App原型设计（全彩慕课版）（AxureRP10）人民邮电出版社作业设计实现京东商城手风琴式菜单的显示与隐藏效果教学过程教学内容与过程（教学内容、教学方法、组织形式、教学手段）做好课前“5分钟”教学管理（多媒体、实训室），做好上课前的各项准备工作（打开电脑、打开课件、打开软件、打开U盘中的素材位置、打开授课计划、教案等），吸引学生注意力。【课前说明】分别从显示/隐藏行为、设置文本/图片行为、设置选中行为、设置选中下拉列表选项行为、启用/禁用行为、移动/旋转/置顶/置底行为等基础知识来介绍设计和使用Axure元件行为制作交互效果的方法，具备设计各种交互行为的能力。【目的】使学生从了解本章节的学习目标、学习重点、考评方式等方面明确学习本章节知识的要求和目标。掌握Axure元件行为制作交互效果。一、显示/隐藏行为1.用切换方式控制元件的显示与隐藏2.用变量方式控制元件的显示与隐藏3.多个导航菜单联动效果二、设置文本和设置图片行为1.设置文本行为2.设置图片行为三、设置选中行为1.单选按钮选中行为2.复选框选中行为四、设置选中下拉列表选项行为1.一对一联动效果2.一对多联动效果五、启用/禁用行为默认情况下，拖曳到工作区域的元件是启用状态，有时需要禁用，支持对文本框元件、文本域元件、下拉框元件、复选框元件、单选按钮元件、主按钮元件等进行启用或是禁用。六、移动、旋转和置顶/置底行为1.移动行为2.旋转行为3.置顶/置底行为七、获取焦点、展开/折叠树节点行为获取焦点行为常用于文本框元件和文本域元件，展开/折叠树节点行为常用于展开或是收起树形结构。同步训练：各个小节的实战演练。本章节主要学习用Axure元件行为制作交互效果，包括显示/隐藏、设置文本、设置图片、设置选中、设置选中下拉列表选项、启用/禁用、移动、旋转、置顶/置底、获取焦点、展开/折叠树节点等行为，使用元件行为制作出高级交互效果。本节课主要运用案例教学法，元件行为制作出交互效果通过实战演练的方法加强对相关操作的理解，达到能够独立熟练解决实际问题的能力。教学评价方式以小组为单位，以完成案例的质量为评价标准，形成任务驱动，小组协作，质量与速度并存的课堂评价方式，促进学生的自主、创新学习的方式。第9章用中继器模拟数据库操作课程名称Axure网站与App原型设计（全彩慕课版）（AxureRP10）项目名称用中继器模拟数据库操作任务名称用中继器模拟数据库操作课时4项目性质□演示性□验证性□设计性√综合性授课班级授课日期授课地点教学目标知识目标1．了解中继器、中继器的数据集、中继器的项。2．熟悉中继器的布局设计。3．掌握将数据绑定到中继器的方法。4．熟悉新增数据弹出框的设计方法。5．掌握中继器的新增、删除数据操作。能力目标1．可以设计中继器页面、新增数据弹出框。2．实现中继器的新增数据操作。3.实现中继器的行内删除数据、全局删除数据操作。素质目标1．培养踏实的工作态度。2．培养分析问题的能力。教学内容1.认识中继器2.中继器绑定数据3.新增数据弹出框设计4.中继器新增数据操作5.中继器删除数据操作6.小结教学重点中继器绑定数据、中继器新增数据操作、中继器删除数据操作教学难点中继器绑定数据、中继器新增数据操作、中继器删除数据操作教学准备1.装有Windows10系统的电脑2.教学课件PPT3.教材：Axure网站与App原型设计（全彩慕课版）（AxureRP10）人民邮电出版社作业设计利用中继器元件来设计余额宝转入记录及余额宝界面布局，同时将数据绑定到中继器元件上并显示出来。教学过程教学内容与过程（教学内容、教学方法、组织形式、教学手段）做好课前“5分钟”教学管理（多媒体、实训室），做好上课前的各项准备工作（打开电脑、打开课件、打开软件、打开U盘中的素材位置、打开授课计划、教案等），吸引学生注意力。【课前说明】分别从中继器的数据集、中继器的项来初步认识中继器，再对中继器动态存储数据，模拟数据操作新增数据、删除数据进行详细介绍。【目的】使学生从了解本章节的学习目标、学习重点、考评方式等方面明确学习本章节知识的要求和目标。掌握中继器动态管理数据的方法。一、认识中继器中继器元件包括中继器的数据集和中继器的项。二、中继器绑定数据1.中继器布局设计2.中继器数据绑定三、新增数据弹出框设计新增数据时，会用弹出框来显示新增数据的页面。四、中继器新增数据操作利用中继器元件和新增数据的弹出框来实现新增数据的操作。五、中继器删除数据操作1.行内删除数据2.全局删除数据同步训练：员工信息管理。本章讲解了中继器的管理功能，了解什么是中继器、中继器的数据集和中继器的项。学会将中继器的数据集里的数据绑定到中继器上显示出来，利用中继器元件动态地新增数据、删除行内数据、删除全局数据。本节课主要运用案例教学法，通过实战演练的方法加强对相关操作的理解，达到能够独立熟练解决实际问题的能力。教学评价方式以小组为单位，以完成案例的质量为评价标准，形成任务驱动，小组协作，质量与速度并存的课堂评价方式，促进学生的自主、创新学习的方式。第10章美团App低保真原型设计课程名称Axure网站与App原型设计（全彩慕课版）（AxureRP10）项目名称美团App低保真原型设计任务名称美团App低保真原型设计课时2项目性质□演示性□验证性□设计性√综合性授课班级授课日期授课地点教学目标知识目标1．了解原型设计的思路及准备工作。2．熟悉原型设计的流程，包括母版设计、布局设计、交互设计。能力目标1．可以设计移动App的导航母版。2．可以设计移动App的页面布局。3.可以设计页面的轮播交互效果。4.可以设计页面上下滑动、页面切换的交互效果。素质目标1．形成严谨踏实的工作作风。2．树立正确的职业观。教学内容1.需求描述2.设计思路3.准备工作4.设计流程小结教学重点设计流程教学难点设计流程教学准备1.装有Windows10系统的电脑2.教学课件PPT3.教材：Axure网站与App原型设计（全彩慕课版）（AxureRP10）人民邮电出版社作业设计进行“外卖”页面内容的布局设计以及制作页面内容上下滑动的效果。教学过程教学内容与过程（教学内容、教学方法、组织形式、教学手段）做好课前“5分钟”教学管理（多媒体、实训室），做好上课前的各项准备工作（打开电脑、打开课件、打开软件、打开U盘中的素材位置、打开授课计划、教案等），吸引学生注意力。【课前说明】分别从绘制美团App低保真原型的需求描述、设计思路、准备工作、设计流程这几个方面对低保真原型设计进行详细介绍。【目的】使学生从了解本章节的学习目标、学习重点、考评方式等方面明确学习本章节知识的要求和目标。掌握低保真原型设计的制作方法。一、需求描述绘制美团App低保真原型的需求，包括底部标签导航、页面布局、海报轮播效果、上下滑动效果、页面切换显示效果。二、设计思路美团App低保真原型设计如下：整理需要用到的元件。避免重复制作需要设计底部标签导航母。用动态面板实现海报轮播、页面内容上下滑动效果。用打开链接方式实现页面切换交互效果。三、准备工作低保真原型设计不使用截图，颜色最好用黑、白、灰3种颜色。四、设计流程1.底部标签导航母版设计2.“美团”页面布局设计3.轮播效果制作4.“美团机票”页面布局设计5.“美团机票”页面上下滑动设计6.“美团”页面与“美团机票”页面切换显示效果同步训练：美团App低保真原型设计。本章节讲述了低保真原型设计的制作方法，包括需求描述、设计思路、准备工作、设计流程。通过美团App低保真原型实战掌握原型设计的流程。教学评价方式以小组为单位，以完成案例的质量为评价标准，形成任务驱动，小组协作，质量与速度并存的课堂评价方式，促进学生的自主、创新学习的方式。第11章去哪儿网站高保真原型设计课程名称Axure网站与App原型设计（全彩慕课版）（AxureRP10）项目名称去哪儿网站高保真原型设计任务名称去哪儿网站高保真原型设计课时2项目性质□演示性□验证性□设计性√综合性授课班级授课日期授课地点教学目标知识目标1．了解原型设计的思路及准备工作。2．熟悉原型设计的流程，包括母版设计、布局设计、交互设计。能力目标1．可以设计表单校验。2．可以设计倒计时交互。3.可以设计网站的页面布局。4.可以设计网站的导航菜单母版。素质目标1．培养快速定位问题的能力。2．提升灵活应变能力。教学内容1.需求描述2.设计思路3.准备工作4.设计流程小结教学重点设计流程教学难点设计流程教学准备1.装有Windows10系统的电脑2.教学课件PPT3.教材：Axure网站与App原型设计（全彩慕课版）（AxureRP10）人民邮电出版社作业设计设计去哪儿网站“酒店”页面的布局与交互。教学过程教学内容与过程（教学内容、教学方法、组织形式、教学手段）做好课前“5分钟”教学管理（多媒体、实训室），做好上课前的各项准备工作（打开电脑、打开课件、打开软件、打开U盘中的素材位置、打开授课计划、教案等），吸引学生注意力。【课前说明】分别从需求描述、设计思路、准备工作、设计流程这几个方面对去哪儿网站“酒店”页面布局与交互进行详细介绍。【目的】使学生从了解本章节的学习目标、学习重点、考评方式等方面明确学习本章节知识的要求和目标。掌握网站页面布局与交互的设计方法。一、需求描述制作去哪儿网站的高保真原型，包括注册表单、验证码倒计时、登录页面、导航菜单母版、首页搜索区域导航菜单悬浮效果。二、设计思路1.整理页面布局设计需要用的元件。2.设计注册表单验证时的交互效果。3.网站的顶部信息、导航菜单制作成母版。三、准备工作准备去哪儿网站登录/注册、首页页面的图片。四、设计流程1.网站注册表单的布局设计。2.网站注册表单校验。3.倒计时交互设计。4.“登录”页面布局与交互设计。5.导航菜单母版设计。6.首页搜索区域导航菜单悬浮效果设计。同步训练：去哪儿网站高保真原型设计。本章节讲述了高保真原型设计的制作方法，包括需求描述、设计思路、准备工作、设计流程。通过去哪儿网站高保真原型实战掌握原型设计的流程。教学评价方式以小组为单位，以完成案例的质量为评价标准，形成任务驱动，小组协作，质量与速度并存的课堂评价方式，促进学生的自主、创新学习的方式。第12章产品经理的职能课程名称Axure网站与App原型设计（全彩慕课版）（AxureRP10）项目名称产品经理的职能任务名称产品经理的职能课时1项目性质□演示性□验证性□设计性√综合性授课班级授课日期授课地点教学目标知识目标1．了解产品经理所需的基础能力：产品设计能力、编辑文档能力、沟通能力、项目管理能力。2．了解产品经理在产品设计、产品开发、产品测试、上线运营阶段的职能。能力目标1．可以分析需求、设计原型。2．可以编辑需求规格说明书等文档。3.可以管理项目、进行有效的沟通。素质目标1．培养团队协作和资源整合能力。2