UI设计学什么?
UI设计(或称界面设计)是指对软件的人机交互、操作逻辑、界面美观的整体设计。UI设计分为实体UI和虚拟UI,互联网常用的UI设计是虚拟UI,UI即User Interface(用户界面)的简称。
好的UI设计不仅是让软件变得有个性有品位,还要让软件的操作变得舒适简单、自由,充分体现软件的定位和特点
模块 | 课程 | 学习内容 |
美术训练营 | 艺术素养 | . 素描速写训练; . 三大构成原理; . 透视、构图、造型训练; . 应用美术发展趋势; . 综合案例:拥有基础艺术素养,为之后的设计学习打下基础; |
色彩设计 | . 色彩属性、对比与调和、色彩的混色配置; . 设计色彩的表述体系; . 色彩的装饰美感及色彩的表现方法; . 综合案例:掌握色彩心理和色彩搭配; | |
手绘基础 | . 学习形式美通用法则的量化标准,能够快速获得程式审美能力; . 掌握视觉分割的发生原理,进行经典案例分析,了解黄金比例等在设计中的应用; . 手绘基础:掌握手绘技巧,利用手绘完成UI的基本构图; . 当下流行风格:拟物化、扁平化、写实等绘制技巧; . 综合案例:利用手绘+构图,绘制各类UI图标; | |
字体设计 | . 了解与认识字体,学习字体风格; . 字体设计技法、字体变形、字体效果处理; . 综合案例:掌握字体的设计和选择; | |
软件基础 | Photoshop平面设计 | . 学习Photoshop软件界面构成与计算机图像设计的基本知识; . 掌握各种图像处理工具的使用和位图图像的处理技巧; . 综合案例: |
Illustrator应用技能 | . 学习AI的基本功能及应用范围; . 掌握AI常规操作、 创建基本图形、 创建并编辑路径、 创建符号和图表、 创建和编辑文本、 图层与剪切蒙版、 效果与滤镜等; . 矢量图形绘制的技巧和矢量图形的注意事项; . 综合案例:掌握AI在标志 、字体、各类UI图标设计中的制作手法和应用手段等等; | |
InDesign应用技能 | . 通过报刊杂志设计,掌握排版中的页码设计、页面模板设计、文本和样式、图形图像、表格工具、自适应目录等; . 掌握印前与输出的相关应用,书籍与长文档的制作; . 掌握深入挖掘工具背后隐藏的技巧,应用软件教学规范化设计; . 综合案例:杂志、报纸、书籍; | |
CorelDRAW应用技能 | . 了解CorelDRAW软件的特性并掌握CorelDRAW的基本操作; . 矢量图形绘制的技巧; . 掌握CorelDRAW和打印排版中的相关知识点; . 综合案例:利用CDR完成VI(企业视觉传达系统)、画册排版、海报等的制作; | |
综合项目实战 | . 通过教员的指导与学员的练习,每位学员在规定的时间内完成一套完整移动设备或穿戴设备上的界面设计,公益、商业海报各一份并制作成品。 . 综合案例:移动设备界面设计、海报设计制作, | |
UI设计规范 | 产品设计流程及规范 | . 了解产品设计的流程及规范; . 理解产品设计流程中各环节分工及终效果之间的关系; . 掌握多系统产品设计的方法; |
用户中心设计 | . 理解何为商业化设计、实现企业与个人的双赢; . 用户需求分析及用户需求挖掘; . 利用大数据对用户体验进行分析总结; . 了解现阶段的人工智能设计; | |
UI设计 | 图标设计 | . 学习图标的分类,图标的设计与制作规范; . 理解不同类型图标的设计特征; . 设计制作多系统图标(剪影、扁平化、2.5D、超写实、3D等); . 综合案例:设计PC、移动的各类小图标; |
移动APP | . 基础知识:APP开发与设计流程,屏幕尺寸与分辨率介绍及常用的单位介绍; . 平台规范:iOS、Android、IPad、Windows Phone7系统特点与标准,文字标准,框架标准; . 界面设计:移动产口页面分析,页面风格分析,APP页面制作,适配、标注与切图规范; . 综合案例:安卓、IOS图标制作、界面制作; | |
WebUI | . Banner设计:banner的种类与风格,banner的设计方法,banner的构成思路; . 网页设计流程及规范:网页的设计流程,网页构成元素与规范,网页的布局模式; . 页面分析:网站的类型与风格,主流行业网站分析,不同网站的布局与排版方式; . 专题页设计:专题页头图设计,专题页板块设计,各类型专题页分析与制作,专题页设计思路,专题页实战练习; . 综合案例:商业网页整站设计; | |
多媒体界面设计 | . 智能手机界面设计:苹果 iOS 界面设计、谷歌 Android 界面设计、谷歌 Android 界面设计; . 智能电视、机顶盒界面设计:苹果 Apple TV 界面设计、谷歌 Android 智能电视界面设计; . 智能穿戴设备界面设计:苹果 WatchOS 界面设计、谷歌 Android Wear 界面设计; . PC 端软件界面设计:应用软件界面设计、游戏软件界面设计; . 综合案例:了解各种多媒体界面设计规范、设计原理和设计方法; | |
产品切图与优化(Cutter Man) | . 了解产品效果图与上线页面之间的关系; . 理解产品切图的原则与规范; . 掌握主流切图软件的使用和优化; . 综合案例:制作出符合开发人员要求的切图素材; | |
Dreamweaver PC网页制作 | Web前端网页设计基础标签 | . 网页设计基本流程和工作内容; . WEB页和移动页面的设计规范,网页的风格和色彩; . 网页的基本结构、元素构成(文本、多媒体元素)、标签的组合; . 案例:各类风格的商业网站赏析、新闻页排版、广告业排版; |
表格表单框架 | . 表单的设计及引用; . 表格及其修饰:宽、高、位置、颜色、背景,行列合并、结构修改、线合并等; . 案例:各类报名表的制作、简历表的制作、房产活动页面制作、游戏页面制作、登陆页面、留言页面制作; | |
DIV+CSS页面布局 | . 常见的DIV布局案例,DIV的浮动和定位; . CSS的选择器及属性详解:文字、文本、背景、定位、布局、边框、补丁和补白、浮动等详解; . CSS:导航等各类CSS; . 案例:学校网页、*网页、商业网页、电商网页的DIV+CSS布局; | |
移动端响应式页面制作 | HTML5+CSS3 | . HTML5移动端页面设计的基本流程、设计原理、设备支持; . HTML5新增元素、文档结构、音频和视频处理、存储、离线Web应用讲解; . CSS3新增属性详解:文本、背景、边框、动画等详解; . 案例:利用H5+CSS3的制作页面; |
Bootstrap前端框架 | . Bootstrap布局容器和栅格系统; . Bootstrap排版、表格、表单、按钮、图片等 . 案例:Bootstrap布局设计制作Web页; | |
架构移动端网站 | . Swiper实现触摸滑动轮播; . 媒体查询实现响应式页面设计 . 案例:制作移动端响应式星巴克Web前端网站 |