关于答题小程序倒计时结束如何交互的设计分析
发布于 3 年前 作者 jingcheng 4216 次浏览 来自 分享

关于答题小程序倒计时结束如何交互的设计分析

~

之所以写这篇文章，是因为如下的场景出现造成一些目前的问题，对这些问题而进行的一系列思考

~

图1

~

图2

~

在目前的超时场景里面，提示了用户超时之后，在逻辑层面会自动将该条答题记录写入数据库，没有跟用户确认是否交卷

~

同时存在的一个问题是，

倒计时在用户离开页面的时候没有清理掉，也就是说如果用户暂时离开，倒计时会默认执行然后交卷，这个逻辑就比较严重了

用户可能有事临时离开，但是再回来发现已经交卷这是不被允许的

结果就导致，我今天不断清理得分为0的数据

~

后面我想应该从以下几方面来改进

1、倒计时结束，给用户交卷确认的弹窗，用户同意那么交卷；

2、用户离开页面时，清理计时器，这里对离开的定义要好好斟酌，可以是onhide，也可以是onUnload；

所以要对倒计时采用服务端时间进行计时，每次用户切回小程序要重新开始倒计时

这个地方略微复杂一些

3、其他优化

~

1 回复

‘用户离开页面时，清理计时器，这里对离开的定义要好好斟酌，可以是onhide，也可以是onUnload；’

这里其实可以改为，每次进入页面使用倒计时前，清理下计时器 就好了。不用判断用户是onHide还是onUnload.

// 执行倒计时
  countDown(times) {
    clearInterval(timer)
    timer = setInterval(() => {
      if (times === 0) {
        clearInterval(timer)
        this.initData()
      } else {
        times -= 1
        this.timestamp(times)
      }
    }, 1000)
  },
回到顶部