图8
这里触发条件是鼠标hover时,触发Balloons(气球状提示)。显示评论者的相关信息。这里的应用是信息提示,但却是应用了气球状提示的形式。在Amazon的商品评论里也有类似的提示,不过它不是气球状提示,在那里它承载了更多的交互和文字链。如图9。
图9
静下心来找,发现电子商务网站利用控件Balloons(气球状提示)的形式的也很多,例如EBAY首页的两块区域都有体现,如图10,11。
图10
图11
这种形象的提示大量的被应用在网页界面元素中,也体现了它的灵活与实用。作为帮助和辅助提示。控件Balloons(气球状提示)确实给我们很多不错的用户体验。
辅助功能:
仅显示与用户当前活动相关的气球状提示。
使提示文本尽可能简要。这对于视力不好的用户来说更容易阅读,且使得因屏幕阅读程序的阅读而产生的打断减到最小。
当问题或情况再次发生时重新显示气球状提示。
文本文案:
- 标题使用清晰、平实、简要、确切的语言作为标题文本,简要概括输入问题或特殊情况。
- 标题使用不带句末标点的文本片断或完整句子。
- 标题使用句子大写风格。(英文版)
- 标题使用不超过 48 个字符(英文)以适应本地化的需要。
- 正文文本的第一句话应当以与用户明确相关的方式陈述问题或情况。
- 正文第二句话应陈述用户如何做才能解决问题或恢复状态。
- 正文解释如何解决问题或恢复状态,即使这种解释显而易见,但应省略问题描述与其解决方案之间的重复。
- 正文使用包含句末标点的完整句子。
- 正文使用句子大写样式。(英文版)
- 正文使用不超过 200 个字符(英文)以适应本地化的需要。
小结:
总体来讲气球状提示,在表单中的应用是非常多的,首先它本身可以让用户参与交互也可以不参与,并没有强制性。显示时间可以控制,并且可以设置处理完错误后消失,这为它在表单提示方面的灵活性,做了很好的铺垫。由于它是浮动覆盖在页面上的,所以可以节省一定的空间。也是因为它是浮动覆盖在版面上,提示效果更明显,更容易引起用户的注意!虽然文中已经把气球状提示的每个状态与使用场景做了最详细的描述,由于实例笔者并没有找到更多特别有代表性的,使文章的解析效果并不明显,希望通过更多对Balloons(气球状提示)有思考和研究的读者给予更多的实例资源。谢谢大家的支持,笔者也将继续收集更多更好的实例与UED朋友分享!
文章TAG: