Hi 扁平化Photoshop扁平化用户界面设计教程

第1章 扁平化设计趋势
1.1 拟物化与扁平化
1.1.1　什么是拟物化设计
1.1.2　拟物化的优缺点
1.1.3　什么是扁平化设计
1.1.4　扁平化的优缺点
1.1.5　极简主义
1.1.6　扁平化设计的目的.
1.2　扁平化设计潮流
1.2.1　缓解审美疲劳.
1.2.2　设计更加简单.
1.2.3　使用更加高效.
1.3　扁平化设计技巧
1.3.1　设计元素简单化
1.3.2　强调字体的使用
1.3.3　色彩应用的重要性.
1.3.4　交互设计简化.
1.3.5　类扁平化设计.
1.4　为什么要选择扁平化设计.
1.4.1　快速而高效
1.4.2　信息突出
1.4.3　简洁清晰
1.4.4　方便修改
1.5　扁平化设计要点
1.5.1　精简
1.5.2　大胆
1.5.3　细致
1.5.4　酷.
1.6　扁平化设计所带来的问题.
1.6.1　iOS7的扁平化设计缺陷.
1.6.2　太扁平导致的可用性降低.
1.6.3　解决方案—类扁平化设计
第2章 扁平化图标设计
2.1　图标设计要求.
2.1.1　什么是图标
2.1.2　图标设计的作用和意义
2.2　扁平化图标设计原则
2.2.1　可识别性
2.2.2　差异性.
2.2.3　与环境协调性.
2.2.4　视觉效果
2.2.5　创造性.
2.3　不同扁平化图标设计风格.
2.3.1　基础
2.3.2　阴影
2.3.3　长阴影.
2.3.4　微渐变.
2.4　实战1 制作电话簿图标.
2.4.1　设计思维过程.
2.4.2　设计关键字：基础简易
2.4.3　 色彩搭配秘籍：红色、浅棕色、浅蓝色
2.4.4　实例步骤解析.
2.4.5　知识扩展
2.5　实战2 制作指南针图标.
2.5.1　设计思维过程.
2.5.2　设计关键字：阴影.
2.5.3　色彩搭配秘籍：蓝色、白色、红色
2.5.4　实例步骤解析.
2.5.5　知识扩展
2.6　实战3 制作记事本图标.
2.6.1　设计思维过程.
2.6.2　设计关键字：长阴影
2.6.3　 色彩搭配秘籍：橙色、浅黄色、蓝色.
2.6.4　实例步骤解析.
2.6.5　知识扩展
2.7　实战4 制作时间图标
2.7.1　设计思维过程.
2.7.2　设计关键字：微渐变
2.7.3　色彩搭配秘籍：黄色、灰色、灰蓝色.
2.7.4　实例步骤解析.
2.7.5　知识扩展
2.8　实战5 制作折纸风格扁平化图标
2.8.1　设计思维过程.
2.8.2　设计关键字：多色彩保持统一.
2.8.3　色彩搭配秘籍：红色、黄色、蓝色
2.8.4　实例步骤解析.
2.8.5　知识扩展
2.9　扁平化图标精选欣赏
第3章 扁平化手机界面设计
3.1　手机屏幕尺寸标准
3.1.1　手机屏幕相关术语.
3.1.2　Android系统手机常见尺寸标准
3.1.3　iOS系统手机常见尺寸标准.
3.1.4　Windows系统手机常见尺寸标准
3.2　扁平化手机界面设计特点.
3.2.1　简约大方
3.2.2　操作便捷
3.2.3　通用性强
3.2.4　合理布局
3.3　扁平化设计配色
3.3.1　常见的扁平化配色风格
3.3.2　常用扁平化设计颜色
3.3.3　使用Adobe Kuler生成扁平化配色方案
3.4　实战1 手机待机界面
3.4.1　设计思维过程.
3.4.2　设计关键字：简洁大方
3.4.3　色彩搭配秘籍：蓝色、深蓝色、白色.
3.4.4　实例步骤解析.
3.4.5　知识扩展
3.5　实战2 手机主界面
3.5.1　设计思维过程.
3.5.2　设计关键字：美观实用
3.5.3　色彩搭配秘籍：浅黄色、紫色、绿色.
3.5.4　实例步骤解析.
3.5.5　知识扩展
3.6　实战3 Nexus5手机主题.
3.6.1　设计思维过程.
3.6.2　设计关键字：简洁明朗
3.6.3　色彩搭配秘籍：蓝绿色、黄色、蓝色.
3.6.4　实例步骤解析.
3.6.5　知识扩展
3.7　实战4 iOS7日期界面.
3.7.1　设计思维过程.
3.7.2　设计关键字：简约鲜明
3.7.3　色彩搭配秘籍：蓝色、红色、白色
3.7.4　实例步骤解析.
3.7.5　知识扩展
3.8　实战5 iOS7天气界面.
3.8.1　设计思维过程.
3.8.2　设计关键字：同色系风格 
3.8.3　色彩搭配秘籍：蓝色、天蓝色、浅蓝色
3.8.4　实例步骤解析.
3.8.5　知识扩展
3.9　实战6 手机音乐播放界面.
3.9.1　设计思维过程.
3.9.2　设计关键字：复古风格
3.9.3　 色彩搭配秘籍：灰色、蓝色、灰粉色.
3.9.4　实例步骤解析.
3.9.5　知识扩展
3.10　扁平化手机界面精选欣赏.
第4章 扁平化平板APP设计
4.1　关于APP
4.1.1　什么是APP
4.1.2　平板与智能手机系统
4.2　APP布局说明.
4.2.1　Android系统APP布局.
4.2.2　iOS系统APP布局.
4.3　实战1 天气APP控件皮肤.
4.3.1　设计思维过程.
4.3.2　设计关键字：紧凑灵活
4.3.3　色彩搭配秘籍：深蓝色、蓝色、灰蓝色
4.3.4　实例步骤解析.
4.3.5　知识扩展
4.4　实战2 点餐APP界面
4.4.1　设计思维过程.
4.4.2　设计关键字：条理清晰
4.4.3　色彩搭配秘籍：黄色、红色、蓝色
4.4.4　实例步骤解析.
4.4.5　知识扩展
4.5　实战3 电台调频APP界面.
4.5.1　设计思维过程.
4.5.2　设计关键字：灵活方便
4.5.3　色彩搭配秘籍：紫色、灰色、白色
4.5.4　实例步骤解析.
4.5.5　知识扩展
4.6　实战4 平板音乐APP界面.
4.6.1　设计思维过程.
4.6.2　设计关键字： 个性舒适
4.6.3　色彩搭配秘籍：深蓝色、黄色、白色.
4.6.4　实例步骤解析.
4.6.5　知识扩展
4.7　实战5 社交APP界面
4.7.1　设计思维过程.
4.7.2　设计关键字：舒适简洁
4.7.3　色彩搭配秘籍：蓝色、棕色、朱红色.
4.7.4　实例步骤解析.
4.7.5　知识扩展
4.8　扁平化APP设计精选欣赏.
第5章 扁平化网页界面设计
5.1　了解扁平化网页界面设计.
5.1.1　什么是网页界面设计
5.1.2　网页界面设计要求.
5.2　网页界面构成元素
5.2.1　文字
5.2.2　图像
5.2.3　多媒体.
5.2.4　色彩
5.3　扁平化网页设计元素
5.3.1　图标
5.3.2　圆角
5.3.3　折角
5.3.4　标签
5.3.5　徽章
5.3.6　条纹
5.3.7　装饰元素
5.3.8　装饰背景
5.4　WordPress主题
5.4.1　了解WordPress主题
5.4.2　使用WordPress主题
5.5　实战1 扁平化导航菜单设计.
5.5.1　设计思维过程.
5.5.2　设计关键字：重点突出
5.5.3　色彩搭配秘籍：深灰色、浅灰色、蓝色
5.5.4　实例步骤解析.
5.5.5　知识扩展
5.6　实战2 扁平化登录页面.
5.6.1　设计思维过程.
5.6.2　设计关键字： 简洁大方
5.6.3　色彩搭配秘籍：紫色、浅灰色、橙色.
5.6.4　实例步骤解析.
5.6.5　知识扩展
5.7　实战3 设计产品介绍页面.
5.7.1　设计思维过程.
5.7.2　设计关键字：同色系对比、透明轻快.
5.7.3　色彩搭配秘籍：深蓝色、浅蓝色、黄色
5.7.4　实例步骤解析.
5.7.5　知识扩展
5.8　实战4 设计图形设计网站界面
5.8.1　设计思维过程.
5.8.2　设计关键字：简单形象
5.8.3　色彩搭配秘籍：红色、灰色、白色
5.8.4　实例步骤解析.
5.8.5　知识扩展
5.9　实战5 扁平化广告宣传网页界面
　……
第6章　扁平化软件界面设计
第7章　扁平化平面媒体设计