第1 篇 你真正了解UI 行业................................... 1
第1 课 UI 名词的由来..................................................................1
第2 课 UI 的分类.........................................................................3
第3 课 图形界面发展史................................................................8
3.1 电脑操作系统界面................................................................................... 10
3.1.1 Windows 操作系统........................................................................................ 10
3.1.2 苹果操作系统................................................................................................... 13
3.2 手机与系统界面....................................................................................... 14
第4 课 UI 行业发展前景............................................................ 17
4.1 UI 设计师薪酬等统计数据..................................................................... 18
4.2 三大手机APP Store 数据...................................................................... 19
4.3 未来UI 新领域......................................................................................... 20
第2 篇 必需的UI 装备你有吗.............................. 23
第5 课 常用软件介绍................................................................. 23
第6 课 设计师必备技能 ............................................................ 25
6.1 了解UI 设计师职业规划 ....................................................................... 26
6.2 必须掌握的3 个基本技能 ..................................................................... 26
第7 课 UI 设计工作流程 ........................................................... 29
7.1 自主软件产品开发流程 .......................................................................... 30
7.2 外包公司开发流程 .................................................................................. 30
7.3 网站推出流程 .......................................................................................... 31
7.4 什么在影响着你的设计 .......................................................................... 31
第3 篇 设计看似很简单...................................... 34
第8 课 图标设计....................................................................... 34
8.1 图标设计的基础理论............................................................................... 35
8.2 36 种图标概念设计的灵感来源............................................................. 36
8.3 像素图标的绘制....................................................................................... 37
8.4 剪影2D 图标............................................................................................ 39
8.5 扁平化图标................................................................................................ 41
8.6 写实图标.................................................................................................... 42
8.7 3D 图标..................................................................................................... 43
8.8 手机系统主题图标................................................................................... 45
第9 课 界面设计........................................................................ 46
9.1 界面设计之APP ..................................................................................... 47
9.2 界面设计之Web 设计............................................................................ 56
第10 课 系统控件设计.............................................................. 66
10.1 为何要有控件......................................................................................... 67
10.2 常见的控件元素 .................................................................................... 70
10.3 桌面主题风格......................................................................................... 71
10.4 经验分享................................................................................................. 72
第11 课 LOGO 和Banner 设计............................................... 73
11.1 黄金分割................................................................................................. 74
11.2 LOGO 设计............................................................................................. 74
Ⅰ
11.3 Banner 的元素...................................................................................... 76
第12 课 产品包装设计.............................................................. 78
第13 课 质感表现精讲............................................................. 81
13.1 光线对物体表现的影响........................................................................ 82
13.2 9 类材质表现.......................................................................................... 82
第14 课 色彩与构图精讲.......................................................... 86
14.1 色彩.......................................................................................................... 87
14.2 构图元素................................................................................................. 95
14.2.1 设计中的构图要素......................................................................................... 95
14.2.2 视觉引导......................................................................................................... 97
14.3 色彩与构图范例..................................................................................... 99
第15 课 元素风格精讲............................................................ 100
15.1 网页UI 常用风格.................................................................................101
15.2 游戏UI 常用风格.................................................................................103
第16 课 优秀案例赏析 ........................................................... 108
第17 课 扁平化UI ................................................................. 113
17.1 什么叫UI 扁平化.................................................................................114
17.2 为什么要用UI 扁平化........................................................................114
17.3 其他类型的UI 设计 .....................................................................114
17.4 UI 扁平化未必适合所有产品.............................................................115
17.5 UI 扁平化的趋势..................................................................................116
第4 篇 与我一起升华UI 之道 ........................... 117
第18 课 产品需求分析 ........................................................... 117
18.1 需求分析...............................................................................................118
18.1.1 需求的基本概念...........................................................................................118
18.1.2 5W3H（八何分析法）.............................................................................119
18.1.3 思维导图（MindMap）...........................................................................120
18.2 如何做竞品分析...................................................................................121
第19 课 交互设计入门 ........................................................... 123
第20 课 用户体验入门 ........................................................... 128
20.1 用户体验的定义及其最终目的..........................................................129
20.2 头脑风暴与故事板...............................................................................130
20.3 积极与消极的用户体验......................................................................131
20.4 用户分类...............................................................................................132
20.5 潜在用户心中的疑问...........................................................................133
20.6 用户测试...............................................................................................134
20.7 数据可视化...........................................................................................134
20.8 SEO 优化（Search Engine Optimization）..............................134
第21 课 交互动态特效........................................................... 137
第22 课 Android 和iOS 平台规范 ........................................ 141
22.1 Android 平台 .....................................................................................142
22.2 iOS 平台 ..............................................................................................147
22.3 WIN METRO 风格设计 ....................................................................151
第23 课 手机应用APP 的设计 ............................................... 156
目录
CONTENTS
Ⅱ
23.1 写在3 个实践篇之前 .........................................................................157
23.2 APP 的UI 设计 ...................................................................................160
第24 课 专题网站的UI 设计 .................................................. 167
24.1 操作步骤 ..............................................................................................168
24.2 与客户沟通的步骤 .............................................................................169
第25 课 什么人闯进UI 设计 .................................................. 171
25.1 关于UI 设计师 ....................................................................................172
25.2 关于UI 的20 个问题 ........................................................................172
第26 课 不得不说的秘密 ........................................................ 179
附录 ...................................................................................... 184
光盘目录
UI 设计基础 （总时长09:55:16）
1.........................................................自我介绍： 00:09:23
2.............. UI 设计所在公司运营内容及职能： 00:08:23
3.......................................UI 设计师必备技能： 00:11:30
4.......................................UI 设计师常逛网站： 00:09:42
5..........UI 设计师具体工作内容及职业规划： 00:10:13
6....................... UI 产品设计流程和影响因素: 00:11:55
7...............................................PS 画剪影图标： 00:15:58
8............................. 做好扁平化的10 条建议： 00:10:40
9................................做好拟物化的6 条建议： 00:11:50
10..............................关于抄袭、临摹与借鉴： 00:09:23
11...............................关于色感和用色技巧1： 00:08:55
12...............................关于色感和用色技巧2： 00:09:14
13..........................关于竞品分析和交互架构： 00:09:24
14............. 光对材质表面和纹理质感的影响： 00:10:19
15............. 设计思维的形成和人脑记忆结构： 00:08:41
16.. 历史对UI 风格的影响，做有故事的设计： 00:09:35
17.......................................... 切图的概念讲解： 00:06:31
18..............................效果图、平台和分辨率： 00:09:03
19.......................................... 实际的切图案例： 00:07:48
20.......................................................开关控件： 00:08:27
21...............................................两个扁平图标： 00:13:22
22...............................................糖果质感按钮： 00:03:13
23.......................................................黑板图标： 00:07:18
24.......................................................简约相机： 00:13:34
25...............................................酷炫耳机图标： 00:06:12
26.......................................................彩虹加载： 00:04:12
27...................................................荧光加载圈： 00:03:12
28.......................................... 立体小房子图标： 00:07:29
29.......................................................宝石质感： 00:05:38
30...............................................可爱冰棍图标： 00:07:02
31...................................................拟物望远镜： 00:16:34
32.......................................................铅笔图标： 00:03:39
33...................................................小黄鸭图标： 00:19:07
34..............................3D 扁平APP 商城图标： 00:11:40
35...................3D 天气LOWPOlY 风格图标： 00:13:05
36............. 网页界面设计需要做的前期工作： 00:09:45
37............. 网页界面设计需要做的中期工作： 00:09:06
38............. 网页界面设计需要做的后期工作： 00:10:07
39.................................. 网站资源源文件展示： 00:05:01
40..............................活动页和电商产品页面： 00:09:13
41.................................. 优秀的网页交互赏析： 00:06:06
42............................... 响应式WEB 交互设计： 00:10:42
43..............................任务流程和线框图跳转： 00:09:42
44..........................用户分类及用户调研手法： 00:10:19
45......................................APP 设计注意事项： 00:09:22
46...................... 电商瀑布流AXURE 线框图： 00:10:44
47.................. 购物车列表AXURE 线框原型： 00:10:44
48.................. 小楼老师的AXURE 部件加载： 00:06:31
49................ AXURE 加载iOS7 部件库方法： 00:06:05
50............................. APP 扁平圆形导航页面： 00:09:58
51..............................................APP 聊天界面： 00:15:15
52......................................APP 界面图片模糊： 00:06:10
53..............................................APP 登录界面： 00:07:38
54............................APP 页面METRO 风格： 00:09:54
55...........................餐馆点评APP 界面设计： 00:05:45
56...........................蛋糕订购APP 界面设计： 00:07:23
57...........................即时通信APP 界面设计： 00:06:55
58...........................清透登录APP 界面设计： 00:09:23
59...........................可爱摄影APP 界面设计： 00:13:42
60...........................音乐播放APP 界面设计： 00:15:51
61.........LOGO 和BANNER 设计注意事项： 00:09:27
62.................................. 产品包装和新手指引： 00:09:35
基础软件操作（总时长01:40:23）
1..................... 做UI 需在PS 软件中的设置： 00:05:07
2................ PS 钢笔路径形状图层布尔运算： 00:08:15
3...................... 图层蒙版路径蒙版剪切图层： 00:08:24
4..................................... PS 选区的巧妙运用： 00:06:36
5...........................图层命名规则图层文件夹： 00:05:07
6.......................................图层属性图层样式： 00:12:17
7........................................... 如何标坐标切图： 00:03:58
8........................................ CTRL_T 网格变换： 00:03:58
9...............................液化涂抹加深减淡工具： 00:06:52
10.............................边缘透明度和精确对齐： 00:06:50
11....................................... PS 制作GIF 动画： 00:03:41
12.............................曲线色相亮度调节技巧： 00:06:28
13................................................PS 常用滤镜： 00:04:58
14.............................AI 和PS 协同路径作业： 00:08:07
15....................................AI 里网格渐变功能： 00:05:48
· · · · · · (收起)