异步用户界面设计

Question

我一直在致力于一个集成，它提出了一个有趣的用户界面难题，我想要的建议。

用户界面显示在第三方产品中。接口的状态是通过调用我编写的服务来提供的。由于第三方对状态的轮询，更改用户界面的实际状态之间可能会出现较小的延迟。

当用户与用户界面交互时，请求将被发送回我的应用程序。这将影响到状态，下一个状态轮询请求将更新用户界面。

问题是按下按钮和看到用户界面更新之间的延迟可能是1到2秒，在可用性测试中，我可以看到人们在用户界面更新之前再次单击，认为他们没有在第一次正确地单击。

考虑到这些约束(我们只能通过轮询机制更新用户界面--如果我们在他们单击时更新它，轮询可能会返回并覆盖导致不可预测/不理想结果的更改).我们能做些什么使用户体验更好。

我目前的想法是在几秒钟内显示一条消息，让人们知道他们的点击被接受了，消息不会受到州投票的影响，所以不会过早地删除/覆盖等等。我肯定还有其他的想法，我也相信有人有更好的想法！

Answer 1

为了子孙后代的目的，我将分享这个解决方案。

种族条件

这里的问题是轮询机制每n毫秒发生一次，当用户单击时请求可能处于正常运行状态，从而导致竞争情况。

快乐路径(启用按钮，然后禁用并保持这种方式)：

• 投票
• 响应(启用按钮)
• 单击(禁用按钮)
• 投票
• 响应(禁用按钮)

竞赛条件路径(启用按钮，然后按钮禁用，启用，禁用-令人讨厌的闪烁状态)：

• 投票
• 单击(禁用按钮)
• 响应(启用按钮)
• 投票
• 响应(禁用按钮)

解决方案:状态版本关联

当用户与UI交互时，会生成一个新的状态版本(即GUID、时间戳等)。

此状态版本与每个请求一起发送，并在响应中返回。

当收到响应时，会比较状态版本，而不匹配的则被丢弃。

示例

幸福之路：

• 民意测验(v1)
• 响应(启用按钮) (v1)
• 单击(禁用按钮) (v2)
• 民意测验(v2)
• 响应(禁用按钮) (v2)

种族状况路径：

• 民意测验(v1)
• 单击(禁用按钮) (v2)
• 响应(丢弃) (v1)
• 民意测验(v2)
• 响应(禁用按钮) (v2)

Answer 2

立即显示一些反馈:改变按钮的视觉状态，显示动画的跳动。

如果应用逻辑允许，一旦按下按钮就禁用它，当答案到达时启用它。

一旦答案到达，显示真正的反馈:更新控件，删除throbber。