《移动UI交互设计（微课版）（第2版）》教学教案.docx

移动UI交互设计（微课版）（第2版）教案No.1授课题目项目一初识Ul设计教学单元学时4知识目标:了解Ul设计概念、分类、原则及设计流程教学目标能力目标:能够利用问卷调查方法完成用户调研素质目标:培养学生具备合理的知识结构及运用知识的能力重点UI设计原则、设计流程难点设计调研问卷教学方法讲授法、分析讨论法能力训练（作业）完成某产品的用户调研问卷教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入MUI界面设计课程是服务于UI设计工作的必修课程，其前导课程是三大构成、数字平面制作技术，后续课程是交互设计。希望大家能够认真学习，为今后的就业打好基础。5,知识讲解一、课程要求1.课堂性质2 .课程要求3 .课程任务4 .课程达成的目标了解Ul设计原则、理念及规范，能够进行图标与主题界面、APP界面手绘设计，并使用平面设计软件来完成电子稿绘制。二、Ul设计概念1.什么是Ul5 .UI设计师的职能及就业前景6 .UI设计的分类7 .UI界面设计原则1）用户控制原则2）一致性原则3）简单美观原则4）布局合理原则30,课堂练习1.登录12306、金山软件网站，分析Ul设计的重要性2.阅读材料15,知识讲解三、UI设计的流程1 .需要调研阶段2 .设计制作阶段3 .方案修改阶段4 .测试改进阶段30,教学环节教学内容备注四、用户调研1 .用户调研的必要性2 .用户调研的方法3 .问卷调查法确定主题一设置问题一测试问卷一邀请调查对象一汇总调查结果布置任务拟开发一款小学数学学习App,利用“问卷星”平叶完成调查问卷教师操作演示30,拓展训练以小组为单位，拟定一个调查主题并完成调查问卷设计40，展示评价小组互评、教师总结性评价20，课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）结合评价，继续完善某产品的用户调研问卷5,No.2授课题目项目二主题图标设计任务1确定设计风格教学单元学时4教学目标知识目标:了解图标的概念、种类、原则及设计流程能力目标:能够正确评价图标设计的优劣确定图标的设计风格素质目标:培养学生的创新意识重点难点图标设计的原则图标设计流程教学方法讲授法、分析讨论法能力训练（作业）确定本组图标的设计风格教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入我们在使用手机、平板、智能手表等液晶显示设备的时候，会发现大量的图标。这些图标比文字描述直观、漂亮，可以携带更多的视觉感，提升软件、功能的可用性，极大地提升了视觉效果。本次课，我们就来学习图标设计的相关知识5,知识讲解一、图标的概念二、图标的分类1 .按功能：启动图标、应用图标和功能图标2 .按照设计风格：剪影图标、扁平化图标和拟物化图标20,课堂练习打开手机，引导学生区分图标的各种分类形式15,知识讲解三、图标设计的原则（展示案例并分析）1 .可识别性原则2 .差异性原则3 .合适的精细度4 .风格统一30,课堂练习展示不同图标效果，引导学生结合设计原则地图标进行评价30,知识讲解四、图标设计的流程1 .确定图标风格2 .图标草图绘制3 .计算机制图4 .主题界面制作五、图标的设计风格40,教学环节教学内容备注展示不同风格的图标，并讲解布置任务以小组为单位，通过网络、手机收集不同风格的图标小组讨论，并确定本组主题图标的设计风络30,课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）确定本组图标的设计风格5,No.3授课题目项目二主题图标设计任务2图标草图绘制教学单元学时4教学目标知识目标：了解草图的重要性及绘制方法能力目标：能够完成图标草图的绘制素质目标：培养学生的设计能力、想象能力重点难点草图绘制的方法将创意用草图表现出来教学方法演示法、讲授法、分析讨论法能力训练（作业）完成图标草图的绘制教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入在确定了图标风格之后，就可以进行草图绘制了。为什么要绘制草图？可不可以省略呢？5,知识讲解一、草图的重要性手绘是设计师表达情感、表达设计理念、表诉方案结果的最直接的“视觉语言”。二、草图的绘制要求要把握好型体、空间、明暗关系。三、草图的绘制方法用素描的表现手法绘制草图。20,课堂练习查看二维图标、三维图标等形式的草图，分析绘制方法15,知识讲解四、手绘完成创意的具体表现（举例说明）20，5,18教学环节教学内容备注课堂练习小组讨论，在本组图标设计风格的基础上如何用手绘表现15,布置任务1内容（设计某手机主题图标，最少为24个，参考如下）（1）系统图标拨号，短信，浏览器，日历，时钟，邮件，计算器，联系人，音乐，视频，图库，相机，文档，下载，应用中心，设置，天气，个性化中心，游戏中心，录音，地图，便签，画板，安全中心，阅读，系统升级（2）常用图标QQ,支付宝，百度地图，淘宝，饿了么，微信2要求：a可以是2D,3Db风格统一10,课堂练习组内分配任务，进行草图绘制教师巡视指导85,课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）完成图标草图的绘制5，No.4授课题目项目二主题图标设计任务3计算机制图（一）教学单元学时4教学目标知识目标：了解常用的图标制作软件及图标制作规范能力目标：能够使用软件完成图标的计算机制图素质目标：培养学生的软件操作能力和认真的态度重点难点软件的应用能够学会各种材质的表现教学方法演示法、分析讨论法能力训练（作业）完成主题图标的计算机制图2-4张教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入完成了手绘草图，就可以使用电脑完成图标的电脑效果图制作To那么，使用什么软件完成制作？在制作中需要注意哪些问题呢？5,知识讲解一、图标制作软件1 .PhOtOShOP和IIIUStratOr2 .两款软件的区别3 .两个软件在制作图标中的优势20,课堂练习选择2-3个不同材质的图标，操作演示软件制作方法，学生练习110,fry二、图标设计制作规范1.ioS系统图标制作规范2.Android系统图标制作规范教学环节教学内容备注三、需要注意的问题1.光源方向统一2,裁切区域和安全区域课堂练习分析教师展示的图片，判断是否符合制作规范15,课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）完成主题图标的计算机制图2-4张5,No.5授课题目项目二主题图标设计任务3计算机制图（二）教学单元学时4教学目标知识目标：熟悉常用的图标制作软件及图标制作规范能力目标：能够使用软件完成图标的计算机制图素质目标：培养学生的软件操作能力和认真的态度重点难点软件的应用能够学会各种材质的表现教学方法分析讨论法、任务驱动法能力训练（作业）完成主题图标的计算机制图教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入复习提问：1 .常用的图标设计软件是什么？2 .图标制作的规范有哪些？5,作品评价展示各组已经完成的计算机制图1 .小组互评2 .教师总结性点评15,布置任务1 .结合教师评价，修改已经完成的计算机制图2 .在此基础上，小组内分工，完成共它主题图标的计算机制图教师巡视，并指导实践150,课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）完成主题图标的计算机制图5，No.6授课题目项目二主题图标设计任务4主题界面制作教学单元学时4教学目标知识目标：了解手机主题的定义及主题界面的制作方法能力目标：能够结合图标设计风格完成主题界面的设计制作素质目标：培养学生的软件运用能力和设计能力重点难点主题界面的设计制作设计风格的统一教学方法讲授法、分析讨论法、任务驱动法能力训练（作业）完成主题界面的制作教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入在完成图标的设计制作之后，依据不同手机系统的尺寸要求，我们可以设计与图标相配套的主题界面效果图，这也是手机主题包中需要完成的设计内容。那么，什么是手机主题呢？5,知识讲解一、手机主题1 .相当于一个程序包2 .更换主题，可能会同时更换个性主题的图标、壁纸、屏保、开关机动画等等二、主题界面1 .主界面2 .锁屏界面3 .解锁界面4 .短信界面5 .拨号界面20，课堂练习分析展示的主题界面是如何做到风格统一的15,知识讲解三、界面包含的元素1 .状态栏的元素2 .界面中的元素四、需要注意的问题1 .图标的大小2 .字体的运用20,操作演示界面的制作过程，学生练习下午6；00：、产SnS一依1T；三PltM12-J.o天气日历系统更新电子件惜Itle在做文件Itll时管下0市第课堂练习?三C安全中心蝴收畲机计U8830,0-口SffmSw乐生展市场电话JS他aMAXtSM®0为戏指南“SIM*应用市通®<SX电话短信H系人满此H布置任务结合本组图标设计的风格，完成主题界面的制作教师巡视并指导70，教学环节教 学 内 容课堂小结总结本次课所学知识，指出重点、难点5,能力训练完成主题界面的制作5,（作业）No.7授课题目项目三界面设计教学单元学时4教学目标知识目标:了解界面设计的概念、内容及要点能力目标:能够完成App的启动图标和启动页设计素质目标:培养学生的创新思维、创新意识重点难点界面设计的要点启动页的设计教学方法讲授法、分析讨论法能力训练（作业）完成本组的启动图标和启动页教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入手机应用程序简称为App,用户通过APP的界面完成操作，实现相应的功能。如何设计手机APP的界面呢？在设计中需要注意什么？从这次课开始，我们就进入界面设计的学习。5,知识讲解3一、界面设计的概念1 .界面是人与机器之间传递不互动的接口2 .浏览信息，在手机界面上讲见各种操作二、界面设计的发展历史1 .开始于软件设计之后2 .通过实例讲解，界面的变4cm,VatPreMb*三-CA,E”i三-A"3EkAEUMAxn4,，«，*'1760Aflr-K-rA*d*V>*aHBlt4tt*aMU>XfLIX*tf1p-Jl>r"H,-<>Sb篁I.期.9-t1交换信7点击、'二实现易,氐上息的媒介，是人与机器符动、拖拽等方法来实用性、简洁性B一*xMM,QWXMBBMVMMMMMMB-a*aM*MMNM-«BMWMBMMWM<MMMMBMW.sw-it*BaMUBW0.W*MM4aMHMw*MI3B.MM420,»：w>jF«&m，gMLUL>UKU<1ACnS”XUXS3.3MM1,.¾匕.:>.,c-a-屏MA?r：g>*二L.”CJU-CHux*2？j?*W¾LLT.yT1Ma-11就腐*UMa4«*TMLAraaMaaMBa«««WW三WOMMA*VM，M*MAMM4MMB*«*<VUMl-1三M-1一i-1-f-lWIt)课堂练习查看资料，进一步理解界面的易用性简洁性15,教学环节教学内容备注知识讲解三、界面设计的内容1 .启动图标和启动页1）启动页的作用2）启动页的表现形式2 .框架设计1）手机界面组成2）框架设计的内容3 .控件设计1）控件的含义2）控件的效果表现20,课堂练习结合案例，引导分析框架设计和控件设计的重要性15,知识讲解四、界面设计注意要点（结合案例讲解）1 .适用性2 .易用性3 .友好性20,布置任务以小组为单位，拟定一款APP主题（后续界面设计也以此为主题），设计启动图标和启动页教师给定一个系统规范60,教学环节教学内容备注任务评价1.小组互评2.教师总结性点评15,课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）结合评点结果，修改完成本组的启动图标和启动页5，No.8授课题目项目三界面设计任务1主界面设计教学单元学时4教学目标知识目标:了解主界面的定义、布局及表现手法能力目标:能够结合App的功能完成主界面的设计素质目标:培养学生的思考能力、设计能力重点难点主界面的布局主界面的表现教学方法讲授法、分析讨论法、任务驱动法能力训练（作业）完成本组主界面的设计制作教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入什么是主界面？主界面有哪些常用的表现手法？有哪些常见的布局方式呢？在制作时需要遵循哪些设计规范呢？5,知识讲解一、App界面的分类1 .典型界面2 .特殊界面二、主界面的定义三、界面的表现手法（结合实例讲解）1 .唯一主色调2 .多彩色3 .数据的可视化4 .内容至上5 .大视野背景图20，课堂练习分析给定界面采用了何种表现手法，进一步明确表现手法的重要性15,知识讲解三、界面的布局方式1 .九宫格式2 .列表式3 .手风琴式4 .侧滑式5 .混合式20,教学环节教学内容备注课堂练习结合给定的案例分析，布局方式与界面功能的关系15，知识讲解四、界面的系统规范1. iOS界面设计规范2. AndrOid界面设计规范五、制作规范1 .颜色2 .布局3 .图形样式15,布置任务延用上次课确定的APP主题，设计制作本组的APP主界面教师讲解颜色方案及制作需要注意的问题65,任务评价1 .小组互评2 .教师总结性点评15,课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）结合评价，继续完成本组主界面的设计制作5,No.9授课题目项目三界面设计任务2详情界面设计（一）教学单元学时4教学目标知识目标：了解详情界面的分类及功能能力目标：能够完成本组App的查看界面设计素质目标:培养学生的分析能力和创新能力重点难点详情界面的分类结合界面功能完成设计教学方法讲授法、分析讨论法、任务驱动法能力训练（作业）完成3-4张查看界面的设计制作教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入本次课，我们开始进行详情界面的设计。那么，什么是详情页？它的布局方式有哪些？在设计时需要注意什么呢？5,知识讲解一、详情界面的定义二、详情界面的分类1 .查看界面2 .编辑界面15,课堂练习引导分析详情界面与主界面的区别，及其实现的功能10,知识讲解三、查看界面设计分析1 .购物类APP2 .新闻类APP3 .音乐类APP四、常用的设计法则1 .接近法则2 .相似法则20,课堂练习查看资料，了解更多的设计法则15,布置任务延用本组确定的APP主题，选取1-2张有代表性的查看界面，完成设计制作教师讲解制作需要注意的问题85,教学环节教学内容备注任务评价1.小组互评2.教师总结性点评15,课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）结合评价，完成本组3-4张查看界面的设计制作5，NoJO授课题目项目三界面设计任务2详情界面设计（二）教学单元学时4教学目标知识目标：进一步了解详情界面的设计方法能力目标：能够完成本组App的编辑界面设计素质目标:培养学生的分析能力和创新能力重点难点编辑界面与查看界面的区别编辑界面的表现教学方法分析讨论法、任务驱动法能力训练（作业）完成3-4张编辑界面的设计制作教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入复习提问：1 .详情界面的分类？2 .查看界面的特点？5,作业总结总结作业完成情况，指出各组作品存在的问题10,作品修改结合作业点评，修改完善本组查看界面的制作效果30,知识讲解一、编辑界面的功能二、编辑界面设计分析1 .购物类APP2 .新闻类APP3 .音乐类APP20,布置任务延用本组确定的APP主题，选取2张有代表性的编辑界面，完成设计制作教师讲解制作需要注意的问题90，任务评价1 .小组互评2 .教师总结性点评15,教学环节教学内容备注课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）结合评价，完成本组3-4张编辑界面的设计制作5,No.11授课题目项目三界面设计任务3弹窗界面设计教学单元学时4教学目标知识目标：了解弹窗界面的定义和功能能力目标：能够完成本组App的弹窗界面设计素质目标:培养学生的分析能力和创新能力重点难点弹窗界面的功能弹窗界面的表现教学方法分析讨论法、任务驱动法能力训练（作业）完成3-4张弹窗界面的设计制作教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入本次课，我们要完成弹窗界面的设计。那么，什么是弹窗界面？它有哪些常见的形式呢？5,知识讲解一、弹窗界面的定义二、弹窗界面的功能1 .确认信息2 .选择和设置3 .提示和广告4 .分享25，课堂练习查看不同的App,进一步了解弹窗界面的功能10,知识讲解三、弹窗界面常用的表现形式1 .黑色半透明图层2 .弹窗的形状3 .出现的位置4 .弹窗的结构表现15,课堂练习收集各种形式的弹窗，分析优缺点15,教学环节教学内容备注布置任务延用本组确定的APP主题，选取1-2张有代表性的弹窗界面，完成设计制作教师讲解制作需要注意的问题85,任务评价1 .小组互评2 .教师总结性点评15,课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）结合评价，完成本组3-4张弹窗界面的设计制作5,No.12授课题目项目四交互设计任务1用户画像与竞品分析教学单元学时4教学目标知识目标:了解交互设计的概念、流程能力目标:能够分组完成用户画像、竞品分析素质目标:培养学生的观察能力、思考能力重点难点交互设计的流程用户画像和竞品分析方法教学方法讲授法、分析讨论法、任务驱动法能力训练（作业）完成产品的用户画像和竞品分析教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入随着网络和新技术的发展，各种新产品和交互方式越来越多，人们也越来越重视对交互的体验。以用户体验为基础的交互方式会使用户感到愉悦，本次课开始，我们来学习交互设计。5,知识讲解一、交互设计的定义二、交互设计团队组成1 .产品经理2 .UX设计师3 .交互设计师4 .UI设计师5 .技术工程师6 .测试工程师三、交互设计要素四、交互设计流程1 .前期准备阶段2 .中期设计阶段3 .后期跟进阶段30，课堂练习查看资料，进一步了解交互设计师的工作内容10,知识讲解五、需求分析1 .定性与定量分析2 .用户画像用户画像的作用及形式3 .竞品分析1）竞品分析的重要性2）分析方法25，教学环节教学内容备注功能与内容视觉与品牌交互与操作市场与价格布置任务以小组为单位，研究确定拟开发APP的名称及面向用户群1 .完成用户画像2 .完成竞品分析表教师讲解制作需要注意的问题85,任务评价1.小组互评2.教师总结性点评15,课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）结合评价，完成产品的用户画像和竞品分析5,No.13授课题目项目四交互设计任务2产品结构图教学单元学时4教学目标知识目标：了解产品结构图的概念、制作方法能力目标：能够制作某款应用程序的产品结构图素质目标：培养学生的归纳能力、创新意识重点难点产品结构图的作用产品结构图的制作教学方法讲授法、分析讨论法、任务驱动法能力训练（作业）完成本组产品结构图的制作教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入在前期准备的基础上，进入中期设计阶段，这个阶段主要包括制作流程图、低保真原型和高保真原型。首先，我们来完成流程图的设计制作。那么，什么是产品结构图？如何来绘制呢？5,知识讲解一、流程图的定义二、流程图的分类1 .任务流程图2 .产品结构图三、绘制产品结构图1 .手绘2 .电脑绘制25，课堂练习参考教材，学习Xmind软件的使用教师巡视指导40,布置任务以小组为单位，在上次课的基础上，完成产品结构图1 .整理、归纳产品的功能点2 .确定各层级功能教师讲解制作需要注意的问题85,任务评价1.小组互评2.教师总结性点评15,教学环节教学内容备注课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）结合评价，继续完善产品结构图5,No.14授课题目项目四交互设计任务3低保真原型教学单元学时4教学目标知识目标：了解低保真原型的作用及注意事项能力目标：能够完成本组的低保真原型图素质目标：培养学生的总结能力、动手能力重点难点低保真原型的作用低保真原型的制作教学方法讲授法、分析讨论法、任务驱动法能力训练（作业）完成本组的低保真原型图教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入在产品结构图的基础上，根据各界面的功能，开始设计低保真原型。那么，什么是低保真原型？它有什么作用？应该如何绘制呢？5,知识讲解一、低保真原型的定义二、制作方法1 .手绘2 .电脑制作三、低保真原型的作用1 .结合功能布局2 .节约开发成本3 .便于沟通四、需要注意的问题25，课堂练习参考教材，学习墨刀软件的使用教师巡视指导40,布置任务以小组为单位，在本组产品结构图的基础上完成低保真原型1 .整理界面数量2 .完成部分典型界面的低保真原型图教师讲解制作需要注意的问题85,教学环节教学内容备注任务评价1.小组互评2.教师总结性点评15,课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）结合评价，继续完成本组所有的低保真原型图5，No.15授课题目项目四交互设计任务4高保真原型（一）教学单元学时4教学目标知识目标：了解Ul设计规范能力目标：能够完成本组的In设计规范手册，并开始进行视觉设计素质目标:培养学生的创意设计能力、遵守制作规范重点难点明确制作规范手册的作用Ul设计规范手册的制作教学方法讲授法、分析讨论法、任务驱动法能力训练（作业）完成本组的UI规范手册及1-2张高保真原型图教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入接下来，我们进入高保真原型的设计制作。那么，什么是高保真原型呢？应该如何来制作呢？5,知识讲解一、高保真原型的定义二、Ul设计规范的重要性15,课堂练习查阅某手机系统的Ul设计规范，进一步明确设计尺寸10,知识讲解三、规范手册1 .规范手册的作用1）统一产品的视觉设计风格2）保证工作顺利交接3）规范第三方的品牌塑造和接入2 .规范手册的内容3 .制作方法1）PPT2）瀑布流25，布置任务以小组为单位，完成规范手册的制作1 .确定颜色方案2 .确定视觉元素设计风格教师讲解制作需要注意的问题90,教学环节教学内容备注任务评价1.小组互评2.教师总结性点评15,课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）结合评价，完成产品的规范手册，在规范手册的基础上，完成1-2张高保真原型。5，No.16授课题目项目四交互设计任务4高保真原型（二）教学单元学时4教学目标知识目标：了解规范手册及高保真原型之间的关系能力目标：能够完成本组的高保真原型图素质目标：培养学生的创意设计能力、认真踏实的工作态度重点难点高保真原型的制作界面风格的统一教学方法讲授法、分析讨论法、任务驱动法能力训练（作业）完成本组的高保真原型图教学体会授课班级授课时间及地点年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室年月日（星期）第节，楼室注：教学体会一般在课后填写，授课时间须按上课先后顺序依次填写。教学环节教学内容备注课程导入复习提问：1 .规范手册的作用？2 .界面设计原则？5,展示各组高保真原型图，指出存在的问题作业点评30,各组结合评价情况，对高保真原型图进行修改二、制作注意事项1 .规范手册的使用2 .界面设计原则的运用3 .风格的统一以小组为单位，完成本组的高保真原型图布置任务1.启动图标和启动页90,2.所有界面的高保真原型图教师巡视指导教学环节教学内容备注任务评价1.小组互评2.教师总结性点评15,课堂小结总结本次课所学知识，指出重点、难点5,能力训练（作业）结合评价，继续完成本组的高保真原型图5，