请选择 进入手机版 | 继续访问电脑版

网络科技

    今日:86| 主题:284555
收藏本版
互联网、科技极客的综合动态。

[其他] 平切、递进、插入,应用中的页面跳转该如何设计

[复制链接]
雾里雾气 发表于 2016-10-17 13:24:50
299 4

平切、递进、插入,应用中的页面跳转该如何设计

平切、递进、插入,应用中的页面跳转该如何设计-1-网络科技-电脑显示屏,移动应用,产品设计,设计师,会员

  上周有位会员朋友发来信息,询问在移动端应用设计的过程中平级切换、层级递进、页面插入分别应该在什么情景下进行使用?
  首先这是一个非常好的问题,其次这也是一个非常容易被错误理解的问题。有很多设计师一直将平级切换、层级递进、页面插入作为在 app 设计中的动效来看待,所以一旦项目较大、涉及的逻辑较为复杂的时候做起来就会混乱。到最后在配合开发的时候发现自己都讲不清逻辑了。
  借这位会员朋友的机会,这一期周刊我们正好讲讲在移动应用中页面跳转的设计问题。
  什么是页面跳转?

  由于移动设备屏幕尺寸的限制,我们不得不将一个完整的产品流程“折叠”、“拆分”成若干小的流程展示给用户,尽可能保障用户能在那几寸屏幕上完成众多复杂的操作。
  而这也是移动应用相较于 Web 产品设计更为复杂的地方。

  除了持续的从业务逻辑上去尽可能简化产品,作为设计师的我们同样也需要从设计上来不断优化、降低用户使用成本。
  手持移动设备的屏幕再怎么变化也不可能达到电脑显示屏的标准,所以除了页面自身的设计我们还需要在流程的设计上动脑筋。
  下图示意中的平级切换、层级递进和页面插入就是我们在日常设计中最为常用的三种跳转方式。
  从表象上来看它们带给我们的直观感受无非就是 Tab 间的渐隐渐现、页面的左右推拉和页面的底部升起、消失。
  如果没有去仔细思考这背后的逻辑,我们很容易将它们理解为页面动效的设计。
  于是我们在产品设计的过程中往往过多的去关心这些页面间的动效该如何设计,忽略了它们背后的流程、逻辑。
  

平切、递进、插入,应用中的页面跳转该如何设计

平切、递进、插入,应用中的页面跳转该如何设计-2-网络科技-电脑显示屏,移动应用,产品设计,设计师,会员
  本文为 PinDesign 会员计划的付费内容,在本期主题的全文内容中,将会通过多个案例来讲解平切、递进、插入这三种页面跳转形式的差别和设计思路,以及如何从产品逻辑角度出发思考如何进行页面跳转的设计。
  加入 PinDesign 会员,获取本期主题「平切、递进、插入,应用中的页面跳转该如何设计」全部内容。
    https:// wap.koudaitong.com/v2/s howcase/promocode/fetch?alias=hc4o9ht    (二维码自动识别)
     本文谢绝一切形式转载
   

平切、递进、插入,应用中的页面跳转该如何设计

平切、递进、插入,应用中的页面跳转该如何设计-3-网络科技-电脑显示屏,移动应用,产品设计,设计师,会员
富贵勿相忘, 发表于 2016-10-17 13:33:15
路过的帮顶
回复 支持 反对

使用道具 举报

214186176 发表于 2016-10-17 13:33:26
2016-10-17楼主还是蛮拼的。
回复 支持 反对

使用道具 举报

傲珊 发表于 2016-10-18 04:00:39
有钱的捧个钱场,没钱的回家拿钱捧个钱场。
回复 支持 反对

使用道具 举报

何艳 发表于 2016-10-18 04:10:57
信雾里雾气,考试不挂科!
回复 支持 反对

使用道具 举报

我要投稿

回页顶回复上一篇下一篇回列表
手机版/c.CoLaBug.com ( 粤ICP备05003221号 | 文网文[2010]257号 | 粤公网安备 44010402000842号 )

© 2001-2017 Comsenz Inc.

返回顶部 返回列表