1. Ios 应用交互行为--页面切换方式
移动设备应用因载体硬件屏幕尺寸的缩小，相对于传统设备，在应用的交互流程中也会
涉及到更多的页面切换，除传统的页面切换形式之外，更多的应用采用了动画的展现形式，
其中是否有一些规律可寻，我对市面上 iOS 应用中出现的页面切换方式，浅显的进行了整理
与分析。
1. 传统页面切换形式
沿袭于 PC 端的点击--同页面内容显示的传统页面跳转方式，如无需数据下载，则即时显示
所切换至的页面内容，如有数据载入，则页面显示载入进度，逐步显示新页面内容。
传统跳转为 iOS 中最常见的页面跳转方式，常见于 Tab 标签的点击切换，且多数 Tab 切
换均采用此种页面切换形式，内容显示迅速直接，正因页面显示为即时显示，如所切换页面
之间视觉感受(界面风格/色彩)差距较大，易造成切换瞬间的视觉突兀感，另外，如何处理好
数据载入过程中的界面效果，也需要进行考究。
Trailers
QQ 2012

2. 2. 卡片翻转的切换方式
卡片切换为动画切换的一种常见方式，也是模态视图的一种延展显示方式，通过从中轴
--卡片右侧翻转来显示另一页面内容，常用于应用内部不同类型内容属性页面的切换，切换
过程一般适宜保持在 0.5S 左右(求教：是否有这方面的研究数据)，切换过程中两页面内容同
时显示，常用于关于/设置等页面的显示。
卡片翻转的页面切换方式，视觉点不会随动画的显示效果做大幅度偏移，保持了视觉中
心的留存，让用户即时掌握信息切换的交互流程，避免了传统页面切换方式的突兀感。
iOS Weather

3. 3. 横向切页的切换方式(求教：是否有专属名词)
横向切页的切换方式为较常见的切换方式之一，通过现有页面滑动左/右移，同时
新页面出现，多见于 iOS 平台的应用中，标准控件常见于表格视图中渐近指示器和详情
渐进按钮的页面切换，以及跨级页面(一级到二级/查看详情)的跳转。
Iphone setting App store
Gowalla
4. 纵向覆盖(mode view)的切换方式
纵向覆盖的切换方式，同卡片切页方式一样为模态视图的一种延展表现形式，新页面由

4. 屏幕底部纵向切入覆盖当前页面，一般为独立于当前页面的子任务，且主界面中无此种
任务执行方式，至完成新页面任务后返回前页面。其覆盖式切入的动画显示方式，契合
临时任务的任务属性，在交互行为上达到统一。一般应用常见于登陆/注册等采用此种
方式。
Twitter
Oink

5. 5. 扩展弹出式切页方式
扩展弹出式切页方式常见于图标至页面的切换中，点击图标后新页面由图标中扩展向屏幕四
边弹出，直至页面显示完全。最常见的是 iOS 由主屏 launcher icon 进入应用时的页面切换
形式，同时应用内部由九宫格图标进行页面切换时也会采用这种形式。
Launcher icon –app

6. 大众点评的九宫格客户端界面也采用这种页面切换方式
6. 其他小众动画效果的页面切换
iOS 应用中还有其他并非经常常见的页面切换的动画效果，在应用拼交互创新、拼动画效果
的时代，着实能带来不一样的体验惊喜。
Twitter
点击 Sign up，界面从页面中间以开门/开窗的形式展开，同时新页面由远及近的浮出。与
welcome page 图片形成了场景契合。
Good guide

7. Goodguide 的首页采用了形态组合的方式，首页 item 进入二级页面的页面切换则以形态拆
分的动画方式(goodguide 中涉及动画交互的设计比较多)。
magazine 财经
翻页的动画效果多见于阅读类应用，财经在页面中的页面切换形式中大量使用了翻页动画作
为页面切换方式。

8. 商业价值
商业价值的推荐 item 进入内容页采用了三维的动画翻转的页面切换效果，在形式上有创新
性，但整体翻转效果较为笨重迟缓，内容页也需点击 返回 同样以此种切换方式到上级页面，
对于此处的切换方式稍感诧异。
以上对市面上现有 iOS 应用的的页面切换方式进行了粗略的总结，发现并在交互体验
的过程中采用合适的表现形式，有很多值的探索。