工业和信息化“十三五” 人才培养规划教材
APP 移
动 端
UI
设计与交互基础教程
MOBILE APP UI DESIGN AND INTERACTION BASIC COURSE
吴丰 编著
01
APP UI设计与交互概述
本章从职业发展角度出发，立足职位需求，向读者介绍有关UI设计与 交互所涉及到的入门知识。
1.2 如何学习UI设计
1.2.2 “UI设计师”设计理论知识储备 1．色彩理论知识储备
色彩和形象是用户视觉感知中最快也是最直接的元素，无需语言和文字， 色彩会在第一时间通过眼球反馈到大脑，触发感受，影响情绪。 2．心理学与交互理论知识储备
在做产品设计和交互设计时，通常从人的感知、注意、记忆、思维、动机 等方面出发，直接剖析认知心理，才能全面深入了解目标用户。
界面的交互过程。
1.1 UI设计行业的发展前景
1.1.1 认识相关概念 4．移动端UI的操作系统 （1）Android （2）iOS （3）Windows
1.1 UI设计行业的发展前景
1.1.2 就业前景
1.2 如何学习UI设计
1.2.1 “UI设计师”常用软件介绍
1．Photoshop 2．Illustrator 3．Axure 4．MockingBot（墨刀） 5．Sketch 6．Cutterman 7．PxCook（像素大厨） 8．Ps Play
1.4 APP页面分类及其作品欣赏
1．引导页 APP应用在启动时
会有一小段时间的初始 化过程，开发者可以利 用这个初始化的过程使 用引导页的方式传递给 用户一些品牌信息之类 内容.
1.4 APP页面分类及其作品欣赏
2．主页 （1）以浏览引导为主型 （2）提高浏览效率为主型 （3）信息展示为主型
1.4 APP页面分类及其作品欣赏
单色是单一色系的搭配，它在色彩的深浅、明暗或饱和度上有所调整而形 成明暗的层次关系。 3．饱和度
相近色的配色方案是选取相互不冲突的相关色彩，一种色彩用作主色，而 其它色彩用于辅色丰富该方案。
1.3 UI设计理论基础
1.3.2 UI设计配色基础 4. 配色方案——补色 在色环中，两个对立的颜色称之为补色。 5．配色方案——自定义配色 创建自定义配色方案最简单的方法是将一个明亮的主色添加到一组中性色中， 这种处理方法最能够引起视觉冲击。
3．菜单导航
Hale Waihona Puke 1.4 APP页面分类及其作品欣赏
4．详情页
1.4 APP页面分类及其作品欣赏
5．注册登录
1.5 浅析APP产品开发流程
1.3.2 UI设计配色基础 1．团队成员及其作用
（1）产品经理 （2）设计师团队 2．开发流程
1.6 职场经验分享
1. 别让设计成为“井底之蛙” 2. 尽量快速融入团队 3. 负责到底 4. 不要过于追求完美 5. 适当补充程序开发基本知识
谢谢观看！
1.1 UI设计行业的发展前景
1.1.1 认识相关概念 1．UI（User Interface）用户界面
1.1 UI设计行业的发展前景
1.1.1 认识相关概念 2．ID（Interaction Design）交互设计 交互指的是人和机器互动的过程，交互设计通过了解人的心理、目标和
期望，使用有效的交互方式来让整个过程可用、易用。 3．UE（User Experience）用户体验 UE是指用户使用一个产品时的全部体验，这种体验主要来自用户和人机
1.3 UI设计理论基础
1.3.1 色彩三要素 1．色相
色相指的就是色彩的品相。 2．明度
明度指的是色彩的“明亮程度”。 3．饱和度
饱和度是指色彩的鲜艳程度，也称色彩的纯度。
1.3 UI设计理论基础
1.3.2 UI设计配色基础 1．APP中一般包含多少颜色
经研究，大多数人更倾向于仅依赖2～3种色彩的简单色彩组合。 2．配色方案——单色