UI界面教学大纲

1、课程名称界面（UI）设计课程编号课程类别必修课程学时48课程学分3课程实施方式（即教学组织形式、采用的教学方法及手段）考核方式考查开设时间第二学期使用教材创意UIPhotoshop玩转图标设计，Arteyes设计工作室编著，人民邮电出版社2015年1月内容简介通过案例的方式介绍了如何使用Photoshop进行图标设计。从轻松迈向图标王国、掌控图标创意原则、图标设计与软件操作、扁平化图标设计、质感图标的设计、涂鸦风格图标设计到玩转图标应用和附录逐一讲解，使读者由浅入深，逐步了解使用Photoshop制作图标的整体设计思路和制作过程。课程的目的与任务1、知识目标通过对本课程的学习，使学生从心理学、

2、人机工程学、设计艺术出发，掌握硬件人机界面与软件人机界面方法、理论与设计实例，探索新的交互技术。2、能力目标通过本课程的学习，学生应该掌握软件的基本操作，并初步具备：UI界面设计能力；3、素质目标通过本课程的教学，我们重要的是培养学生观察生活、体验生活、体验、审美能力、吃苦精神和激发学生的创造能力的方法和手段。课程学习指导UI设计是艺术设计专业（平面设计方向）的专业核心课程，是在图形图像处理、企业VI、标志设计课程基础上的延续和提高。课程几乎涉及到了平面设计专业基础课程的各个方面，课程实践中注重对各专业基础课程如图形设计、编排设计、字体设计、构成设计等课程的统合和整体应用。UI界面设计是一门新

3、的学科，也称之为当代的新媒体，它是跨学科的学术领域，是在各门相关学科中提取相关的内容要素而综合起来的系统学科。在教学过程中，应立足于加强学生实际操作能力的培养，采用项目教学，以工作任务引领提高学生学习兴趣，激发学生的成就动机。教学过程中教师应积极引导学生提升职业素养，提高职业道德。课时分配表章次内容学时第一章轻松迈向图标王国6第二章掌控图标创意原则6第三章图标设计与软件操作6第四章扁平化图标设计6第五章质感图标的设计6Aye、.V7-.第八早涂鸦风格图标设计6第七章玩转图标应用1248课程内容与基本要求第1章轻松迈向图标王国1.1图标入门1.1.1什么是图标1.1.2图标与标志的区别1.1.3

4、常见移动应用图标1.1.4常见电脑应用图标1.2图标设计的意义和作用1.2.1什么是图标1.2.2图形内在含义1.2.3图标设计的作用1.3图标的像素分辨1.3.1 Windows操作系统的图标像素分辨1.3.2 WindowsXP操作系统的图标像素分辨1.3.3安卓操作系统的图标像素分辨1.3.4iOS操作系统的图标像素分辨1.4常见图标的标准尺寸1.4.1常见移动操作系统的图标标准尺寸1.4.2常见电脑操作系统的图标标准尺寸1.5图标的设计要素和结构1.5.1图标型的把握1.5.2图标型的把握1.5.3透视、光源与阴影1.5.4元素的组合1.5.5视觉均衡1.6那些你不知的图标分类1.6.

5、1 PNG格式图标1.6.2 ICON格式图标1.6.3 ICL格式图标1.6.4 IP格式图标1.7制作图标的常用软件1.7.1 PhotoshopCS61.7.2 IllustratorCS6第2章掌控图标创意原则2.1图标制作的原则2.1.1可识别性原则2.1.2差异性原则2.1.3合适的精细度和元素个数原则2.1.4风格统一性原则2.1.5原创性原则2.2图标的创意2.2.1界面需求2.2.2图标的创意元素2.2.3创意图标的特点2.3图标设计草图的绘制和渲染2.3.1图标的设计方法及技巧2.3.2图标视觉分析2.3.3最终草图定稿2.3.4草图渲染2.4图标的视觉分析和效果2.4.1

6、用户体验2.4.2图标的可识别性2.4.3图标设计的连续性第3章图标设计与软件操作3.1基础图形绘制图标中的元素3.1.1圆形图标的绘制3.1.2方形图标的绘制3.1.3圆角矩形图标的绘制3.1.4组合图形图标的绘制3.1.5自定义形状图标的绘制3.2让人过目不忘的简单生活图标3.2.1移动设备电池图标绘制3.2.2安卓系统启动图标3.2.3 iOS系统启动图标3.2.4 Windows系统启动图标3.3具有设计性的图标制作3.3.1具有设计性的开关图标3.3.2具有设计性的音乐旋钮图标3.3.3具有设计性的导航栏图标的绘制3.4色彩斑斓的图标3.4.1粉嫩色系图标3.4.2蓝绿色系图标3.4

7、.3暖色调图标第4章扁平化图标设计4.1纯色形状扁平化图标实战1应用类纯色形状扁平化图标实战2生活类纯色形状扁平化图标4.2 Windows系统中的扁平化图标实战1Windows操作系统的扁平化图标实战2WindowsXP操作系统的扁平化图标4.3 iOS系统中的扁平化图标实战1线条扁平化图标实战2图形扁平化图标第5章质感图标的设计5.1质感立体图标设计实战1立体透明图标制作实战2立体毛绒图标制作5.2质感写实图标设计实战1逼真质感图标实战2逼真食物图标实战3金属质感写实图标实战4逼真生活物品图标第6章涂鸦风格图标设计6.1矢量涂鸦风格图标实战1矢量牌游质感风格图标实战2矢量趣味涂鸦图标6.2

8、可爱动画涂鸦风格图标实战1可爱游戏涂鸦风格图标实战2可爱动画涂鸦风格图标6.3手绘涂鸦界面图标实战1手绘涂鸦界面图标实战2手绘相机应用图标实战3手绘导航应用图标第7章玩转图标应用7.1移动应用和图标实战1手机App应用和图标实战2苹果手机App应用和图标实战3移动iPad应用和图标7.2电脑桌面应用图标实战1电脑桌面图标实战2矢量插画电脑应用和图标学生自学内容重要思考题1. 完成简单数字图标设计2. 完成电脑，手机APP图标设计参考书目1、教材名称：认知与设计理解UI设计准则主编：美JeffJohnson著张一宁译出版社：人民邮电出版社出版时间：2011年9月第1版2、人机界面设计罗仕鉴，朱上上，孙守迁著机械工业出版社2002年9月3、人本界面