• 优质范文
  • 工作总结
  • 工作计划
  • 作文大全
  • 心得体会
  • 述职报告
  • 实习报告
  • 写作方案
  • 教案反思
  • 演讲稿
  • 发言稿
  • 读书笔记
  • 精美散文
  • 读观后感
    • 当前位置: 博通范文网 > 工作计划 > 正文

    效标类型 [四个移动界面最常见的动效类型]

    时间：2018-08-16　来源：博通范文网 本文已影响 人 博通范文网手机站

    这两天有一款动效神器Hype 3特别受欢迎，借这股动效的劲头，今天胡痴儿(腾讯用户体验设计师)给同学们科普一下动效的类型 >>>

    一、动效起源于什么?

    iOS 6(视觉表层&信息的外观)→ iOS 7(动效&信息的运作方式)

    二、动效是用来干什么的?

    表现视觉层级关系的

    是几种UI元素之间的相互转换

    四个移动界面最常见的动效类型1

    三、动效如何分类?

    四个移动界面最常见的动效类型2

    一个元素如何能够填满整个页面?

    如何引导用户的视线?

    一、Icon → Page

    iOS 镜头运动&焦点移动

    四个移动界面最常见的动效类型3

    icon即APP&文件夹本身。

    高级视图 → 细节视图

    Z轴，镜头向icon图层做相向运动，视野缩小，视野中物体变大;

    XY轴，icon放大变成app&文件夹，切换为app界面&文件夹

    四个移动界面最常见的动效类型4

    (iOS的视差效果&镜头运动&空间深度)

    APP的 icon → 全屏APP界面

    APP的空间态：

    四个移动界面最常见的动效类型5

    启动：

    四个移动界面最常见的动效类型6 四个移动界面最常见的动效类型7

    二、list → Page

    四个移动界面最常见的动效类型8 四个移动界面最常见的动效类型9 四个移动界面最常见的动效类型10

    Android

    四个移动界面最常见的动效类型11

    1. 涟漪反馈 → 旧页面Fade：

    四个移动界面最常见的动效类型12

    2. 新页面上浮：

    四个移动界面最常见的动效类型13

    涟漪纹

    List上浮，展开Detail View

    四个移动界面最常见的动效类型14 四个移动界面最常见的动效类型15

    三、Button → Page

    iOS

    四个移动界面最常见的动效类型16

    四、Tilte → Page

    五、page → 多任务

    iOS：

    APP的时间态：单任务&全屏界面 —— APP在空间上无法跳转→(APP间不能同时呈现而只能用)时间先后次序选择。

    X轴水平排列，APP间共处于同一平面

    镜头向图标图层做反向运动则视野扩大，APP界面缩小

    四个移动界面最常见的动效类型17

    Andriod：

    XY轴，垂直，上下排列，高低叠加

    APP的Page和其他APP同在Z轴空间

    四个移动界面最常见的动效类型18

    Safari：Z轴&镜头从平视变为俯瞰：

    四个移动界面最常见的动效类型19

    Chrome：Y轴，被拉下去了：

    四个移动界面最常见的动效类型20

    锁屏界面：

    若锁屏前是icon界面：

    镜头穿过icon图层，向icon界面做相对运动

    四个移动界面最常见的动效类型21

    若锁屏前是APP界面

    镜头则向APP界面做相对运动

    四个移动界面最常见的动效类型22

    临时图层：

    当锁屏界面收到通知&密码解锁&拉出通知中心&拉出控制中心，表明有”临时“图层覆盖，则：

    毛玻璃&背景虚化&浅景深&距离感&层次感

    前景“浅景深”

    背景“视差”

    附一张图

    四个移动界面最常见的动效类型23

    推荐访问:最常见 界面 类型 四个移动界面最常见的动效类型 移动端动效 手机界面动效

    • 读/观后感
    • 精美散文
    • 读书笔记
    • 演讲
    • 反思
    • 方案
    • 心得体会

    最新文章

    推荐访问

    小学生阅读红色经典书籍读后感 小学生红色经典读后感 小学红色经典读后感 小学生必读红色经典读后感 小学生读红色经典书籍心得体会 小学生红色经典读物读后感 小学生红色经典阅读读后感 小学生红色经典书籍读后感 小学生读红色经典心得体会 小学生红色经典阅读书籍读后感 学硬骨头六精神连心得体会 硬骨头精神起源于抗战的某师六连 请你谈谈对硬骨头精神的理解 践行硬骨头精神的事例 硬骨头精神人民日报 硬骨头精神是哪个连队 硬骨头精神是哪支部队 硬骨头精神给了我们哪些人生启迪 硬骨头精神的精神内涵 硬骨头精神的感悟 领导干部廉洁从业方面 领导干部廉洁从政准则心得体会 党员领导干部廉洁从业心得体会 干部廉洁从业教育心得 领导干部廉洁从政心得体会 领导干部廉洁从业心得体会范文 违法违规典型案例心得体会 违法违规典型案例警示心得体会 违规违法典型案例心得体会 解放思想大讨论心得体会2019