设计理论:网页气球状提示用户体验设计

Balloons(气球状提示)

问题摘要

气球状提示(Balloon)是一个小型的弹出窗口,用于通知用户出现非关键性问题或控件处于某种特殊情况。

实例

图1

  • 注:气球状提示由图标、标题、正文文本组成,且所有这些部分都是可选的。
  • 注:当用户试图提交操作的时候,任何未处理的问题都必须由其所有者用户界面来处理。
  • 注:气球状提示通常与文本框或其他使用文本框来改变值的控件一起使用,如组合框、列表视图、树形视图等等。
  • 注:保持控件之间的一致性。当发现不一致性出现时,气球状提示不再适用。
  • 注:如果其他类型的控件已经进行了很好的约束,就不再需要气球状提示来给出额外的反馈。

何时使用

  • 注:该信息描述的是一个问题或者特殊情况。
  • 注:当正在输入时或所有者控件失去焦点时,该问题或特殊情况能被立即检测到。
  • 注:这些问题并非很关键。
  • 注:对于那些特殊情况,本身是合法的,但很可能并不是用户期望的。
  • 注:该问题或特殊情况能用准确的语言进行描述。
  • 注:这些信息描述的并非是鼠标当前指向的控件。
  • 注:这些信息与用户当前的活动相关。在默认情况下,气球会在 10 秒后消失。
  • 注:这些信息具有单一、确定的来源。

输入发生之前使用

1、例如大写锁定键(Caps Lock)开启状态,密码框的气球状提示(参见图1)。所有者控件处于某种影响输入的状态,该状态可能不是用户所期望的,但用户也许没有意识到其输入所受的影响。当出现特殊情况时(如超过最大输入字符数或大写锁定被启用等),在第一时间使用气球状提示进行警告可以防止用户产生挫败感。它在给出反馈信息的同时,不改变输入焦点,不强迫用户进行操作。这一点非常重要,因为这些特殊情况有可能是故意为之的。这些气球状提示对于密码框尤为重要,因为用户在密码框中输入时只能得到很少的反馈。此类气球状提示带有警告图标。

2、输入提示:只接受数字输入的文本框,最好在输入前给予提示当焦点移动到文本框内时,出现气球状提示(如图2)。

图2

这里用于报告非关键性用户输入错误的气球状提示。使用气球状提示显示错误信息不会改变输入焦点,即使当所有者控件拥有输入焦点时,它仍然非常醒目。 为了解决问题,用户可能需要进行更改或重新输入。但如果所有者控件忽略错误的输入,用户也许可以完全不用修改。由于 问题并非关键,因此不需要使用错误图标。

时间: 2024-11-29 12:20:24

设计理论:网页气球状提示用户体验设计的相关文章

以用户为中心的设计:网页确认框的用户体验设计

文章描述:以用户为中心的设计:网页确认框的用户体验设计. 确认框,顾名思义,对关键的用户行为进行确认,比如"询问是否删除","告知已删除".根据网上的观察,发现有的网站对确认框的设计缺乏合理性.本文谈谈自己的思考. 类别 根据触发目的,确认框分为两类:询问和告知. 询问 转推的确认框 询问,类似 Javascript 里的 confirm(),即:是否去做? 告知 Flickr 的告知 告知,类似 Javascript 里的 alert(),即:做的状态. 必要性

网页中图片幻灯片用户体验设计小细节

图片幻灯片是网页中最常见的一种效果,功能几乎差别不大,可很多网页设计师可能都没有考虑过这种最常用的幻灯片其中所涵盖的用户体验思想,本文通过国内外几家大型网站中的幻灯片来分析他们各自的设计小细节及给我们带来的体验 1.卓越亚马逊的首页轮换图片,每刷新一次,都是随机不同的顺序显示,这样的设计解决了对于较多图片轮换而靠后的图片信息很少被看到的问题,这点对于电子商务等时效性不是很讲究的网站来说尤其重要: 2.最初的时候是点击照片跳转到下一张,再然后是点击照片的左边是上一张,点击照片右边是下一张,当我们习

网页设计可用性研究:9个提高用户体验设计方法

现在,比较牛的设计师和开发者都认识到了可用性在他们工作中的重要性.可用性好的网站会极大地提高用户体验,并且好的用户体验会让用户更加快乐.用聪明的设计决策取悦并满足您的访客,而不是阻挠和激怒他们. 下面是9个网站经常面临的可用性问题 ,以及对于这些问题的推荐解决方案. 您可能还对下面的文章感兴趣: 1. 太小的链接点击区域 设置超文本链接的目的是被点击,确保它们很容易点击才有意义.下面的示例中的链接实在是太小了;点击它们的难度太高. 这些是 评论中的链接,Hacker News 是一个社会新闻的网

用户体验设计案例:移动社交的Path用户体验设计

文章描述:卓越用户体验的5个共同点. 如果你已经在用移动社交的Path,你一定会非常享受其卓越的用户体验.Path拥有非常精致的设计,而且非常易于使用.换句话说就是Path拥有非常棒的用户体验.这不是一个高科技产品是否需要采用的决定性元素,但确是能够决定多少用户来使用的重中之重. 1. 典雅的UI 好的用户体验是离不开UI的,而且作用很大.尽管我不是一个合格的Path用户,但是当打开的时候,我还是会浏览一遍.顶端的5个笑脸图标更是很有爱.这也正是facebook没有意识到的地方. 2. 离不开(

网页游戏页面的用户体验设计的细节问题

文章描述:浅谈游戏WEB设计的一些细节问题. 本期特约:海外美术团队 Lyson 1.浏览器的差别跟用户分辨率差别是我们首先考虑的问题: 2.游戏页面设计,需贴主题.游戏背景等主线关系: 3.布局跟文案很重要: 一.浏览器的差别跟用户分辨率差别是我们首先考虑的问题: 首先在这里想要再次为新人提下,现在霸占互联网最小分辨率的还会是1024用户(特别是中国),加之IE.FF主流浏览器的比例,由此特地整理了一个解说小图. 在这张示意图上我们能比较清晰的看出一个网页在1024分辨率显示器下的效果.由此我

设计心得:网站搜索的用户体验设计

上图A:IE上google的搜索框设计,鼠标移动到"搜索"触发操作. 上图B:火狐中google的搜索框设计,用放大镜标识触发. 上图C:IE上搜索框设计,用按钮的方式标识触发操作. 网页教学网在多处进行操作习惯的调研,比如名站论坛.QQ群1(非互联网活跃用户).QQ群2(大多是做HCI的)等.针对不同的用户群体提出了同样的问题: 哪种搜索最易用,是我最期望的,为什么? 普通用户(对快捷操作不熟悉,不是资深的网民): 心理上需要安全感,觉得全部显示出来是最安全的.设计要明确的给出&qu

起底六种最常见的用户体验设计错误

  越来越多的同学开始着迷UX/UI设计,这个领域的高手和爱好者也越来越多.于是大量新的想法.设计流程.设计手法以及形形色色的"原则"开始出现在这个领域当中,用良莠不齐这个词来形容UX领域其实非常恰当.用户体验设计需要你作出艰难的决定,成为优秀的设计师并不容易,你需要从错误中不断汲取经验教训,成就自己.人们总是犯着类似的错误,新的思路听起来很不错,但是并不足以成为用户体验设计的标准,但是也正是这些错误的修正,造就了真正优秀的设计. 许多概念看起来炫酷,但是稍加推敲就会发现它的谬误.还有

《破茧成蝶——用户体验设计师的成长之路》一1.2 邂逅用户体验设计

1.2 邂逅用户体验设计 破茧成蝶--用户体验设计师的成长之路 用户体验是什么?抛开那些晦涩难懂的专业术语,用一句话概括就是:你在使用一个产品时的主观感受.那用户体验设计又是什么呢?自然就是为了提升用户体验而做的设计了. 既然用户体验是感性的,那么设计师该如何去做,才能满足用户主观的使用感受呢?这也是让很多设计师头疼的问题. 来看看网络上很火的一些设计案例. 图1-3左边这个场景是否会让你感到似曾相识且痛恨无奈?而右边这个设计,则很好地解决了这个问题. 图1-4这个案例来自国外:在小便池上放了一

《UX设计之道——以用户体验为中心的Web设计(第2版)》一第1章 用户体验设计之道1.1 什么是用户体验设计

第1章 用户体验设计之道UX设计之道--以用户体验为中心的Web设计(第2版)好奇心+激情+同理心 重要的是要永远保持质疑.好奇心自有其存在的理由.当人们思索永恒.生命和现实中不可思议的神秘事件时,难免会心生敬畏.每天能够尽点力去理解这些神秘点滴就已足够. --阿尔伯特·爱因斯坦 好奇心是大自然最早的学校. -Smiley Blanton 激情和目标携手同行.当你确定目标时,你会发现你对事物满怀激情. -Steve Pavlina 上天赐予了人类一份重要礼物,即我们拥有同理心(empathy)的