《图形创意（微课版）》 教案 课题8 UI设计-天气预报App图形创意

任课教师专业日期年月日教学课题UI设计—天气预报App图形创意课时6课时所选教材《图形创意（微课版）》教学班级一、教学目标1.学习目标（1）熟悉UI设计基本内容；（2）掌握UI设计图形创意规范；（3）完成天气预报App UI图形创意实践。2.素养目标（1）培养在UI设计中严谨细致和以用户体验为主的设计态度；（2）培养在UI设计中合理规划界面的逻辑思维。二、教学重难点1.教学重点（1）UI设计基本内容；（2）UI图形设计规范；（3）天气预报App图标制作；（4）天气预报App界面制作。2.教学难点（1）天气预报App图标制作；（2）天气预报App界面制作。三、教学方式与资源1.教学方式课堂讲授+案例分析+课堂讨论+拓展案例+综合实训+知识拓展2.教学资源一体化教室、外网、PPT、笔记本、笔。四、教学过程教学流程活动设计案例展示【第一、二节课】1.课前讨论（10分钟）UI设计的整体视觉效果会受到界面图形、布局、配色、字体排版等多方面的综合影响，请扫描书稿中“图片：课前讨论”二维码，欣赏其中列举的不同天气预报类App界面，思考以下问题。（1）每个作品中的图形主要有哪些？（2）你认为这些图形对UI设计的整体视觉效果有怎样的影响？2.先讲解本堂课需要了解的项目描述和项目目标。（10分钟）3．然后讲解本项目需要的知识准备（70分钟）（1）UI设计基本内容①图标设计图标设计是指将某些实体活动以及真实、幻想或抽象的动机做成图形符号的过程，用于帮助用户理解与吸引用户视线，是用户成功进行交互和提高用户体验的关键一环，也是UI设计中的图形创意重点。②手机界面设计手机界面是用户与手机系统、应用交互的窗口，手机界面设计必须基于手机设备的物理特性和系统应用的特性，针对手机中的各种页面，以及用户在手机上的浏览习惯，进行界面设计。手机界面的组成包括状态栏、导航栏、内容区域和标签栏组成，每个区域对应的内容不同。③网站页面设计网站页面设计则是根据集合内容和不同使用需求对网站页面进行规划和美化，网站页面中的图形设计应该风格统一，每个页面干净直观，以一个主色调为主，配上合适的文字和图形，让用户流畅、舒适，愉快地接收信息，与网站页面进行交互。④应用软件界面设计应用软件界面设计主要是指针对应用软件的不同界面功能进行设计。设计师在设计应用软件界面时，应统一不同界面的风格，并在不同界面中保留相同的图形元素，使界面之间互有关联。（2）UI图形设计规范①图标设计规范②按钮设计规范1.老师围绕UI设计提出问题，学生展开讨论，老师解答学生讨论过程中产生的问题2.老师在讲解过程中通过案例辅助说明UI设计的相关知识，加强学生对知识点的理解与应用1.中国农业银行App界面2.Monsters网页（ByAfterglow）3.某数据平台应用软件界面4.某应用程序的启动图标5.美团界面的功能型图标6.某APP的修饰型图标7.各种按钮的标注8.不同状态按钮的视觉效果【第三、四节课】1.课前回顾（10分钟）先对前一堂课所讲述的内容进行回顾，让学生巩固已学知识。2.讲解项目实施（80分钟）（1）先讲解天气预报App图形设计构思启动图标设计构思天气预报设计图标构思气象图标设计构思建议信息图标设计构思（2）然后讲解天气预报App原型图绘制（3）最后讲解天气预报App图标制作1.老师提问学生，让学生回答上一堂课所讲述内容2.理论讲解的过程中配合案例步骤进行说明，加强学生对知识点的巩固与训练，提升学生的实操能力1.启动图标设计构思2.天气预报图标设计构思3.气象图标设计构思4.建议信息图标设计构思5.天气预报App原型图【第五、六节课】1.课前回顾（5分钟）先对前一堂课所讲述的内容进行回顾，让学生巩固已学知识。2.继续讲解项目实施中的天气预报App界面制作（40分钟）3.项目实训（45分钟）本项目要求为旅游网制作登录页，要求用新颖的插画风格进行登录页图形创意，需要根据下方提供的设计任务单进行分析、收集素材、绘制草图、图形创意制作，然后制作出符合要求的网页页面设计作品。项目名称旅游网登录页UI设计项目背景长假即将来临，某旅游网站想重新设计登录页，使登录页效果更加简约、生动、美观，更能吸引用户注册、登录，增加用户对该旅游网的好感作品主题旅游网登录页作品规格1920px×1080px效果要求①风格：扁平插画风格，简约、清新②字体：宜选择易识别、简洁、端正的字体③图形创意：符合旅游行业属性，以现实中的自然风景素材为图形创意灵感，运用图形创意构图方式和表现手法，设计出符合形式美法则的图形，需要能带来舒适的视觉感受，让用户对该旅游网站留下好印象④色彩：采用清爽的、与大自然相关的色彩，如蓝色、绿色等1.老师提问学生，让学生回答上一堂课所讲述内容2.理论讲解的过程中配合案例步骤进行说明，加强学生对知识点的巩固与训练，提升学生的实操能力3.学生自主展开项目实训，独立自主完成任务操