“返回”与“关闭” 在APP中怎么合理的运用？微信这次改版好在哪里？

 前言 

小按钮大学问

今天带大家解析“返回”与“关闭”按钮的合理运用，留心的朋友会发现微信的最新版本6.6.7有了很大的改变，其中跳转网页的“返回”与“关闭”按钮也做了更贴切的使用调整，这也是写这篇文章的原由，下面就分享几个案例，让你充分了解这两个按钮的使用奥妙。

 案例分析 

反例

在我的设计生涯中遇到过几次类似这样的产品，当我需要建立一个任务时，点击创建任务，左上角是个返回按钮，点击下一步，左上角依旧是返回按钮，最后一步时因为没带身份证无法提高身份证照片，所以需要退出，这时候左上角还是返回按钮，后来我点了三次“返回”按钮才退出了此次任务。

当时我就跟这个APP急眼了

暂且不说填写资料的体验上如何，就这个返回按钮用的真的真的很差劲！完全不符合产品逻辑！

下面就结合案例分析这个产品问题出在哪里，并找到合理解决方案，让你充分了解“返回”与“关闭”两个按钮的使用场景，保证让你豁然开朗、醍醐灌顶、茅塞顿开、恍然大悟等等。（词穷了！）

苹果iOS系统“信息”页面

iOS系统“信息”页面架构的“返回”与“关闭”按钮，当用户点击查看条目信息，左上角是“返回”按钮。

创建信息则没有“返回”按钮，而是右上角的“取消”按钮。（注：取消、关闭、X图标都是一个性质）

iOS“信息”页面这样设计的原因：

浏览信息，是一种随机浏览状态，查看后返回是种很自然的操作状态，属于非模态页面。

创建信息，是一种任务状态，需要创建或编辑，属于模态页面，“取消”更符合场景。

注：模态页面不一定都适用“取消”按钮，非模态也不一定都适用“返回”按钮，主要还是看产品架构。

知识拓展，为什么“取消”按钮不在页面的左上角而是右上角？

原因是操作惯性，创建信息图标按钮在右上角，取消也在右上角，这样不仅实现了惯性操作，而且也更容易记忆创建任务操作流程，同时也很好的区别了返回按钮。

通过上面案例的思考给出的优化方案。

改后（这样就不会急眼了）

微信6.6.7“返回”“关闭”的优化

旧版微信，当打开公众号一篇文章时，左上角是“返回”按钮。

新版则换成了“关闭”图标

微信这次改版更贴近了产品的使用场景，因为点开一篇公众号文章时，其实已经跳出了微信的原生页面，换成了html页面。换一种说法就是已经进入了另一个模块中。所以关闭更适合。

这样的设计还解决了用户以往查看手机网页的一个痛点！

被我言中了记得文章末尾给点个赞！

若在文章中点击链接跳转了页面，旧版就会出现两个按钮。新版6.6.7则做出了一个合理的优化。

用户再也不用因为这两个按钮在一起，常常点错或点击前有思考犹豫了。

接下来在微信强大产品势能的带动下，可能会有更多的产品优化这方面交互。 

微信6.6.7亮点功能

微信6.6.7版本的改版最大的亮点还是阅读文章与聊天场景交互的优化。

微信新版6.6.7功能

在旧版中同样的位置是“在聊天中置顶”，回到聊天页面会在顶上出现，若要关闭必须回到文章“取消置顶”，用起来有些许繁琐。

这次的优化是一次非常好的创新。

 总结 

“返回”按钮适用于一个模块中的页面跳转或随机浏览页面中运用。

“关闭”按钮适用于创建任务的模态页面，或者跳转到另一种形态或模块中。

其实在产品设计过程中只要多结合产品构架思考用户使用场景，就会很有效的避免很多问题。

最后希望这篇文章给你带来帮助，期待下一次与你分享更多的设计知识！

有料、有内涵、关注“互联网设计帮”，定期分享设计干货

长按下方二维码关注“互联网设计帮”

原文始发于微信公众号（互联网设计帮）：“返回”与“关闭” 在APP中怎么合理的运用？微信这次改版好在哪里？