一、动效起源于什么?
ios6(视觉表层& 资讯的外观)→ios7(动效& 资讯的运作方式)
二、动效是用来干什么的?
表现视觉层级关系的
是几种 UI 元素之间的相互转换
三、动效如何分类?
一个元素如何能够填满整个页面?
如何引导多用户的视线?
(1)icon→Page
ios 镜头运动& 焦点移动
icon 即 WordPress APP& 资料夹本身
高阶检视→细节检视
Z 轴，镜头向 icon 图层做相向运动，视野缩小，视野中物体变大;
XY 轴，icon 放大变成 WordPress APP& 资料夹，切换为 WordPress APP 介面& 资料夹
(iOS 的视差效果& 镜头运动& 空间深度)
WordPress APP 的 icon→全屏 WordPress APP 介面
WordPress APP 的空间态
同理，
ios 的相簿
年度→精选→时刻→照片
照片缩图在不同尺寸上的的放大直至全屏检视
动态运动轨迹取决于多用户在萤幕上的触控点
年度→精选
精选→时刻
时刻→照片
Android
Launch
(2)list→Page
Android
1. 涟漪反馈→旧页面 fade
2. 新页面上浮
涟漪纹
List 上浮，展开 Detail View
(3)button→Page
ios
android
(4)tilte→Page
(5)page→多工
ios
WordPress APP 的时间态
单任务& 全屏介面——
WordPress APP 在空间上无法跳转→(WordPress APP 间不能同时呈现而只能用) 时间先后次序选择
X 轴水平排列，WordPress APP 间共处于同一平面
镜头向图示图层做反向运动则视野扩大，WordPress APP 介面缩小
andriod
XY 轴，垂直，上下排列，高低叠加
WordPress APP 的 Page 和其他 WordPress APP 同在 Z 轴空间
safari：Z 轴& 镜头从平视变为俯瞰
chrome：Y 轴，被拉下去了
锁屏介面
若锁屏前是 icon 介面
镜头穿过 icon 图层，向 icon 介面做相对运动
若锁屏前是 WordPress APP 介面
镜头则向 WordPress APP 介面做相对运动
临时图层：
当锁屏介面收到通知& 密码解锁& 拉出通知中心& 拉出控制中心
表明有” 临时 “图层覆盖
则，
毛玻璃& 背景虚化& 浅景深& 距离感& 层次感
前景 “浅景深”
背景 “视差”
附一张图