移动APP设计中：常见手势翻页交互效果和优点

我们都知道移动APP设计中，除了继承传统PC端的翻页模式之外外，还引入了特有而方便的单手势操作的设计模式。如果你是一名移动APP的爱好者，肯定知道有哪些比较酷的APP翻页交互效果。

今天要介绍的之前25学堂介绍过的APP设计中用户体验比较好的“跳转”效果汇总。有点类似或者说雷同！侧重点不一样。希望对你们有所收获！

在web中，页面的跳转基本都是通过A标签来实现的。

当然也有一些是按钮，js，弹窗等等跳转效果。但是今天，我们需要阐述的就是关于APP界面设计中的“跳转”动作。

下面跟随25学堂的小编来跟大家一一了解哪些常见的手势翻页交互效果吧！

1、左右滑动

这种方式比较常见，页面指示器的翻页模式，就是结合了左右滑动的手势操作。

APP左右滑动翻页交互特效实例

经典APP案例：tinder-卡片化滑动设计App成功案例。

2、上下滑动

在查看文章、邮件详情时，可通过上下滑动手势直接进入下一篇、上一篇，这样避免用户返回列表页再选择，减少操作次数。

APP上下滑动翻页交互特效实例：

第一个例子：163的印象笔记iOS7新版，介绍印象最前线的翻页方式。

在当前文章顶部继续下滑，显示上一篇的文章标题，用户可点击标题进入上一篇，也可点击半透明的空白处回到当前文章。同样的，在划到当前文章底部后，继续下滑，可显示下一篇的文章标题。

sparrow 在某个邮件顶部下拉进入上一封、底部上滑进入下一封。

知乎回答的翻页，下滑到底部、继续滑动会加在下一条回答（右滑手势，返回上一级）

Flipborad 订阅网站、文章列表的翻页,手势上下滑动，类似翻看日历的效果，页面下半部分折起 遮盖 上半部分（右滑手势，返回上一级）

当然一个完整的APP翻页交互效果肯定是由多种方式并存的。比如左右，加载更多，下一页，上一页等等。

下面我们重点讲解：使用手势翻页交互操作的优点：

1、尽量与用户的使用习惯保持一致，符合APP触控操作设计原则；

2、同一页面内，手势操作的取舍;尽量不要多用几个手势操作。

比如现在侧边栏导航非常流行，如果一个应用的某个页面，左滑可呼出侧边栏导航、也可返回上一级，这个时候用户就会很迷糊，操作时会对预期的结果有个怀疑。

3、同一应用内的操作逻辑需要统一，减轻用户的记忆负担和学习成本，不要用同一种手势用于实现不同的操作

4、引入手势操作，增加用户操作的趣味性和便利性

5、使用良好的手势操作，提高APP的阅读体验和成交率