用户体验注意事项（小程序开发）
Posted 面包大虾
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了用户体验注意事项（小程序开发）相关的知识，希望对你有一定的参考价值。
写在前面
最近一直都在开发小程序，关于如何开发小程序的这里就不提了，因为有前端基础的人，看看官网文档就能写小程序了，这里总结我在开发小程序当中有关用户体验的一些问题。对于前端来说用户体验是非常重要的，技术在好的网页，用户体验没做好，也是枉费的。
具体注意事项如下
加载相关（加载动画是很重要的）
1. 所有的加载都需要加入加载动画，除非是个别接口是用户无感知的；
我们在项目中主要用到了两种加载动画，第一种全屏加载动画，见图一，放在屏幕中间显示，第二种底部加载动画，见图二，放在屏幕底部展示，具体怎么展示稍后会提
图一 图二
2.大部分页面首次进入需要加入全屏加载动画，接口请求完毕之后，展示内容
3. 如果一个页面需要加载多个接口，接口从上到下依次加载（不然一次全部请求，页面下面的先请求完毕会出现页面跳动），第一个接口显示现在全屏加载动画，其他所有的接口显示底部加载动画（但是不建议一个页面加载多个接口，尽量一个页面一个接口）
4.想订单列表这种每个tab下都有列表的页面，都用底部加载动画，tab下内容频繁变化的可以点击tab每次都重新请求，但是不建议这么做。不频繁变化的可以用变量保存下每个列表的内容，不做重复的请求。如果能够记录到用户上个tab停留的位置，用户回到上个tab的时候位置不变这样用户体验更好（大部分APP这么做的，目前我们小程序也在做这个事情）
5.点击按钮，如果需要请求接口，出现中间加载动画且按钮不可再点击，如我们小程序提交订单就要请求接口
6.加载过的接口不加载第二次，可以用一个变量保存起来，竟可能的少请求接口
7.进入页面能少加载一个接口就少加载一个，可以选择滑到底部加载或者用户点击然后加载
8.要有错误页面，当接口请求超时的时候要给错误页面，还是有很多情况下网络不好的，关键小程序是有缓存的，有时候进去不会重新加载，就会导致用户每次进去都看到的在家或者雪白一片（重要）
图片相关：
1.所有的图片都需要加七牛的参数，需要多宽参数就传多宽，因为七牛的参数会有一定的优化
我们公司用的七牛，其他的一些CDN应该也差不多，像又拍云
（2）https://image1.ichuanyi.cn/group7/M00/80/7B/CgAALlrXWteEVn8OAAAAAP-ZFzQ591.jpg
第一张图和第二张是同一张图，但是一个张图只有100K左右，第二种大于1M，第一张图的画质完全没有问题，所以这就提现出加七牛参数的重要性了
2.尽量少用 mode=\'widthFix\'，因为小程序中图片只有默认的高度的，withFix计算图片的高度需要一定的时间，这个时间图片就会发生抖动和变形，目前我们公司返回图片时，也会返回图片的高和宽
3. 如果图片变形了，那一定是写错了
4.图片都要有预加载的图片，不然图片没加载出来的时候一片雪白，用户会很惊讶
其他
1.点击区域做一定程度的放大，考虑一下小屏手机，地铁上还有很多人用iphone 5s
2.多收集用户的formId，小程序的推送必要要有formId才行，每次我们的小程序发推送，用户活跃度和订单就直线飙升
3.对于结果是确定的，优先展示结果给用户看，如收藏功能，点赞功能，购物车的删除等，这类优化给响应，然后再感知请求接口；
最后
附上我最近做的两个小程序的小程序码，有兴趣的可以一起看看讨论，然后所有的东西都是我自己总结的，如果有不对的地方还请见谅
以上是关于用户体验注意事项（小程序开发）的主要内容，如果未能解决你的问题，请参考以下文章