UI/UX 实时应用程序设计

Question

最近我一直在使用 Meteorjs 开发应用程序，我注意到大多数 developers/designers 不会将不需要刷新浏览器的想法传递给用户。

在Meteor中，刷新浏览器完全没有用，数据变化直接推送到客户端。

什么 UI/UX 设计实践符合这种应用程序行为？

我想过在 UI 中添加一个刷新按钮，希望用户不要刷新浏览器，但这是一个糟糕的设计，不是一个诚实的设计。通过这种方法，我在欺骗用户。

Answer 1

我最近一直在处理这个问题，根据具体情况，我有几种不同的处理方法。

有时候，用户刷新对于用户体验来说并没有那么重要。通常，对于经常更改的数据，您可以使用 in this link about designing for realtime（由 larsbuur 的回答提供）中描述的方法让您的用户了解他们不需要刷新。一般的想法是使用不显眼但可见且清晰的提示来表明数据已更改。

如果没有多少 UI 状态无法从路由中恢复，刷新浏览器应该能达到用户预期的效果。通常，您不想尝试让浏览器功能以意想不到的方式工作。如果你想在刷新时保持 UI 状态，你可以尝试像 Meteor 包 u2622:persistent-session.

这样的东西

您还可以提醒用户在刷新后不需要刷新。例如，使用 web storage API:

Meteor.startup(function() {
  var reload = !!sessionStorage.getItem('reload');
  var manualReload = reload && !Session.get('hotReload');

  if (manualReload) {
    // Tell the user they don't need to manually reload the browser
  }

  sessionStorage.setItem('reload', true);
  Session.set('hotReload', true);
});

在某些情况下，更重要的是让用户了解他们不应该刷新。例如，在网络游戏中，您通常会有一个赛前大厅系统，可以调整游戏设置，而大厅领导是在大厅时间最长的玩家。如果大堂长刷新，他们就会失去位置。

可以通过设置重新连接时间 window 来使此工作正常进行，用户可以在该时间重新连接他们的位置，否则用户将在超时后失去他们在大厅中的位置。 mizzao:user-status 对此很有帮助。在我看来，这是最友好的 UX 选项，您甚至可以在用户名旁边显示一个旋转图标，以向其他用户表明该用户可能正在重新连接。然而，当涉及到数据 integrity/server 可靠性时，我尝试实现这一点已被证明有点错误和不可预测。

现在，我选择简单地使用 the beforeunload event，就像 Whosebug 在您输入时所做的那样。它不是很可定制，也不像透明 reload/reconnect 那样友好，但有时当您只是想警告用户为什么他们可能不想立即刷新时，这是最好的折衷方案。

UI/UX 实时应用程序设计

UI/UX Design in Real Time Applications

user-interface

meteor

real-time

user-experience