技能GET:如何使用流程图描述一个典型的APP启动功能?

43 评论 44812 浏览 518 收藏 7 分钟

在产品设计的过程中,产品经理需要根据用户使用场景,逆向思考其背后的实现逻辑,并通过流程图来表达操作过程及信息交互,以便工程模型的实现。开发工程师则通过流程图理解产品经理思路,评估相应的技术方案和实现过程。

作为产品实现过程中的两大重要角色,产品经理和开发工程师的工作是完全不同的。而我认为,流程图是他们的共同语言。在产品设计的过程中,产品经理需要根据用户使用场景,逆向思考其背后的实现逻辑,并通过流程图来表达操作过程及信息交互,以便工程模型的实现。开发工程师则通过流程图理解产品经理思路,评估相应的技术方案和实现过程。流程图可以直观地表现出逻辑的严谨性和流程的合理性,是产品设计中必不可少的环节。本文选择了“APP启动”这个常见的功能,使用Visio工具,对APP启动到进入首页的功能,做完整的需求描述。

需求:用户启动APP进入首页

这是每个APP都存在的一个需求,点击图标然后打开APP,看起来非常简单,当然,也非常重要,涉及到产品的视觉印象和首次体验。

需求分解

  • 展示APP的品牌形象;
  • 根据业务需要展示广告;
  • 向新用户展示APP引导;
  • 启动完毕进入首页时的良好体验。

流程绘制

能实现流程图设计的工具有很多种,常用的有Visio、亿图,powerpoint也可以做,现在还有在线版的Process On。但对于工具的选择,原则是简单、通用。由于Visio是windows自带office套件中的工具,普及面广,操作简单易上手,其图示含义也是通用的,故选择visio。

第一步:确定流程的节点与走向

根据上述原始需求以及初步分解,我们得知几个关键节点:软件启动、启动页、广告页、引导页、首页,他们的走向用visio流程图表述如下:

第二步:寻找流程中的影响因素

首次启动:此时需展示引导页而不展示广告

软件启动时,判断是否首次启动,如果是首次启动,则打开启动页,停留2秒后进入新手引导,完毕后进入软件首页。

网络状况:考虑到网络状况对数据传输的影响,一般的网络状况分为三种:

  1. 无网络时,不加载广告,但加载数据缓存;
  2. 2G网络时,因传输速度慢,不加载广告,但可更新首页数据;
  3. 3G/4G/WIFI时,传输速度快,可加载广告并更新首页数据。

流程表述如下:

数据缓存:指上次使用后缓存到APP本地的数据。

APP保留数据缓存的目的,是减少网络数据传输,提高APP的运行效率。根据缓存状况,可分为缓存数据首页和最新数据首页。

第三步:根据影响因素的顺序整合流程

上面提到影响该流程的因素有网络、首次启动、广告,数据缓存,在系统设计中,应该以提高流程效率和不影响用户体验为前提,逐个去假设这些因素的先后顺序。

如果先判断网络,系统会消耗网络运行时间,而且会失去一部分网络暂时不佳的用户;如果先判断启动,系统会根据启动状态分别进入不同流程;如果先判断广告,也需要网络;如果先判断缓存,则不符合显示启动页、广告页的流程。综合分析,应先判断首次启动。

第四步:绘制完整流程

根据各节点及其先后顺序的研究,整理全部流程如下:

流程描述

  1. 软件启动时,APP自检测是否首次启动;
  2. 首次启动时,进入启动页,停留2秒后进入新手引导,用户可跳过引导,或操作引导后,进入软件首页,此时做网络判断,如果无网络,则打开该APP原始的静态首页;
  3. 非首次启动时,若当前无网络,则进入启动页,停留2秒,此过程中调用上次使用后本地保存的缓存数据,进入APP缓存首页;
  4. 非首次启动时,若为2G网络状态,则进入启动页,停留2秒,在此过程中更新首页数据,并打开最新首页;
  5. 非首次启动时,若为3G/4G/Wifi网络,则检测是否有最新的广告数据,并请求返回本地显示广告页。广告播放时间为2-3秒,用户可选择跳过,或自动播放完毕进入首页。此过程中APP请求首页数据返回,进入最新数据首页。
  6. 在首页数据更新时,android环境下,对比本地版本与数据库版本,若版本不一致,弹出版本更新提示。

 

本文由 @林元从 原创发布于人人都是产品经理。未经许可,禁止转载。

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
评论
评论请登录
  1. 我想问下,静态首页是什么意思?

    来自浙江 回复
  2. 不错。

    来自上海 回复
  3. 流程图不对呀

    来自北京 回复
  4. 流程是错的

    来自北京 回复
  5. 很有启发

    来自山东 回复
  6. 按照稳重的流程,如果是非首次启动,有广告的情况下,由于存在广告加载的过程,用户必然经过一段白屏的时间,用户会略懵逼。饿了么,是县打开启动页,后加载广告,而搜狐等大部分app是将启动页和广告合在一个页面里的。

    来自广东 回复
    1. 这不属于本文讨论的流程范畴,应该属于提高用户体验的补充。即在有4G/wifi环境下,自动检测广告更新,如果有更新,下载到本地广告缓存。

      来自海南 回复
  7. 在广告页和首页数据更新这一步是否也需要一个网络判断流程

    来自广东 回复
  8. 确实以前都没想到在不同网络状况下还有优先加载or判断的流程,学习了

    来自重庆 回复
  9. iOS的启动页还能控制么?

    来自北京 回复
  10. 请教一下,广告是否每次都要网络请求,广告图片是否会有本地缓存,应为看一下其它的app在无网络下也会显示广告图片。

    来自广东 回复
    1. 这个属于另外一种方式,即在上次使用的时候,APP进程自动下载广告数据到缓存

      来自海南 回复
  11. 感谢前辈分享

    回复
  12. 首次启动就应该先检测网络吧

    来自上海 回复
  13. 小小一个启动原来这么多学问!

    来自上海 回复
  14. 首页数据自动更新不太好吧,网慢的话更新要好久,也行用户并不关心首页的推送,只是想搜个东西之类的,手动刷新更好点

    来自北京 回复
  15. 6666

    来自上海 回复
  16. 感谢前辈分享

    来自上海 回复
  17. 『由于Visio是windows自带office套件中的工具,普及面广』,不开玩笑?

    来自广西 回复
    1. 表述确实不够严谨,感谢指正!

      来自海南 回复
    2. 我能说axure更新到8以后,画流程图简直是利器吗。矩形图形你想怎么变形怎么变形,箭头想怎么指就怎么指,超级好用。考虑到visio安装的麻烦,我渐渐已经让它退出历史舞台了。

      来自北京 回复
    3. 赞同,axsure画出简单的任务流程图还是比较好用的,但是对于复杂的业务用它就不好表述了,感觉画起来比较臃肿。

      来自广东 回复
  18. 图三和最后一张流程图貌似有点问题:就算是3G/4G网络,是否也应该要先到启动页,再去判断运营后台是否有配置广告?而不是3G/4G网络就略过启动页直接到广告页?

    来自福建 回复
    1. 你这么做的话,不管有没有广告,都要出现启动页。相当于启动页2秒,广告3秒,一共5秒了。这是不可接受的。要么出现启动页,要么出现广告。现在的广告页一般都包含了APP形象标识了。

      来自海南 回复
    2. zaker新闻,就是启动页+广告页,时间太久确实影响体验

      来自福建 回复
  19. 满满的都是干货,收藏,点赞加订阅,希望从哥能多多分享相关的经验干货,作为一名产品新人,感谢前辈的分享 😉

    来自江苏 回复
  20. 支持下虫哥😄

    回复
  21. 干货

    来自北京 回复
  22. iOS首次启动还要考虑下网络权限申请吧

    来自浙江 回复
  23. 果断收藏

    来自广东 回复
  24. 非常感谢分享啊,好棒

    回复
  25. 顺便问下,首次启动的流程,有网络状况分支下,是不是存在两种情况,一种是刚安装,是最新版本,不需要新版本更新;一种是已经安装过,没有及时登录,存在版本更新。

    来自北京 回复
    1. 存在两种情况没错,但都是要系统判断是不是最新版本吧?版本新不新,这是你的主观意识,但机器就不懂,所以需要判断。这两种情况,是可以用同一个流程去处理的,具有通用性,效率也高。

      来自海南 回复
    2. 恩,谢谢

      来自北京 回复
  26. 好文,学习了

    来自北京 回复
  27. 期待人人都是产品经理多出现一些这样高质量的文章,真的很涨知识

    来自北京 回复
  28. 123

    来自北京 回复
  29. GET,把一个完整的流程按分析的步骤拆分,然后从简单到复杂的一步步完成,学习到了~以前都没有考虑过APP从启动到首页的一个完整流程。

    来自浙江 回复
  30. 很清晰很细致,收下啦

    来自江苏 回复