[自译]强大的省略号-为什么三个小点表达如此丰富

原文链接:The Mighty Ellipsis - How 3 little dots can say so much

原文作者:John Saito

1476692927-3656-658161-a61657264567ab5e

每当我告诉人们省略号(...)是最让人惊奇的字符时,大多数人都像看疯子一样看我。在你给我打上这个标签之前,让我试着给你们解释一下。

几十年来,界面设计师一直使用省略号来向用户传递各种各样的细节。正如你所见,这三个小点能在有限的空间里表达出很多的含义。

让我们一起来看看,省略号在过去几年的界面设计中的五种用法。到最后,你会对这个强大的字符有新的认识。

1.省略号=“这里有后续的操作”

我记得我第一次在界面中看到省略号是在Windows 3.1中。那是我的第一台电脑,界面中展现了一些按钮和菜单选项,这意味着在我点击它之后还有一些后续操作要做。

1476692926-7948-658161-ef5d5c14cc508c82

省略号在这里非常有帮助,因为它保障了我的操作不会立即造成影响,我可以开始行动,但是如果我改变了主意,也能够取消它。

这个省略号在今天的Windows和Mac下仍然存在,但是用的少了很多。

看看我们在20年里走了多远:

1476692928-2144-658161-753ea7f71d82786a

1993年的Windows NT,省略号无处不在

1476692927-3803-658161-84462881910b706d

2013年的Windows 8,省略号去哪了?

Google的Material Design 的设计指南建议从菜单项和按钮中移除省略号。这可能是因为大量的选项需要一个后续操作,使用省略号会让界面看起来繁杂。

这样的省略模式可能过时了,但是他在过去的那段时间里很好的帮助人们去作出决定-仅仅是使用了三个小点。

2.省略号=“在这里打字”

近年来,许多产品使用省略号来表示文本字段,现在它使用的十分流行。

1476692928-7813-658161-08d7fd5ddb8278e6

我不知道是谁引领了这种趋势,但是我能够找到的最早的例子是在2008年的Facebook:

1476692927-9182-658161-4628f6d47c6a84d8

为什么会有人这样使用省略号?按我的猜测是,这里的省略号有两个目的:

视觉效果:有时候很难在一个页面上去注意到一个文本字段,所以一个省略号的添加,能从视觉上凸显出来,吸引你的注意。

心理作用:传统的认知上,一个省略号表示词的省略。这意味着一些缺失,在某种程度上,省略能够促使你在空白区域填写内容,输入你的语言。

一些风格规范也会推荐在文本段落中使用省略号,Salesforce的风格指南就是一个例子。我个人不喜欢使用省略号,但是很显然它是一个设计的趋势。

悄悄地,省略号已经迅速的成为了“在这里打字”的象征。

3.省略号=“更多操作”

现在更多的应用使用加粗的省略号来表示一个菜单中有更多操作,这基本上意味着“嘿,这里有更多你能做的事情”。

1476692929-6923-658161-d3621e198ca5ab75

在很多的Android应用中,你能过看到竖着的省略号,表达相同的意思。

1476692929-4382-658161-7415212f8547d964

有些人不喜欢这个设计,因为他可能把重要的操作隐藏起来。但是你不能否认,它在UI设计中已成为一个热点趋势-就像几年前的汉堡按钮一样。

从前,我敢打赌没有人会想到一个省略号可能意味着“更多操作”,然而近几年来,省略号突然有了这样一个新的作用,现在已经成为了共识。

为了让界面看起来更多的简约,这些省略号可能会应用的更加广泛。

4.省略号=“等待几秒钟”

省略号的另一个常见用途就是显示一个动作正在进行中。“加载中…”、“连接中…”、“上传中…”你可能好几百次看过这些了。

1476692930-5396-658161-61401d556bcf1b1f

现在想象一下,如果我们不使用省略号会发生什么。因为我们习惯了看到省略号表示一个持续行动。当我们看不到省略号时,我们可能会认为是错误的。

1476692934-6913-658161-9217f8e0c98a5899

这些看起来不觉得有什么不对嘛?至少在我眼里,使用一个省略号能够让我放心,我知道后台正在运行,缺少一个省略号会让我感到困惑。

许多设计指南都会在用户需要等待的时候推荐使用动画,但用户只需要等待几秒钟的话,我认为一个省略号可以是一个有效的指标来暗示系统正在做的事情。

使用三个点跟随在一个单词后,可以暗示一个操作正在运行中-尽管它们只是三个静态的点,这简直太神奇了,不是吗?

5.省略号=“更多字符”

省略号也会在文本太长的时候用来缩短文本。这应该叫做截断,你会经常在处理长文件名中看到这个。

1476692934-6352-658161-3a5aed8879e7029e

早期的时候,长文件名通常都会在后面被截断。如今更多的应用程序和操作系统会在中间截断,这样你仍然能够看到最后几个字符,这是一个很聪明的做法,因为最后几个字符通常是一个文件名中比较重要的。

如果我们没有截断,我们到处都会是重叠的文本,值得庆幸的是,省略号帮助我们从混乱的界面中脱离了出来。

1476692935-1797-658161-a22161f14467ad92

如果没有省略号,我们看到的可能会是这样的,真糟糕

小而强大

现在你已经了解了许多省略号用于界面设计中的方法,你是否同意省略号是最让人惊奇的字符呢?我的意思是,谁知道几个小点可能意味着这么多?

我还没有引申那些省略号可以用于聊天和文本的对话当中,那都是一些后话了...

当你下次将一个省略号应用在你的界面中时,请好好待它,它可能是在你的故事中最被低估的字符了。

文/ShusQ(IAMUE小编)

原创文章,作者:ioued,如若转载,请注明出处:https://www.iamue.com/17961/

(0)
iouedioued
上一篇 2016-09-29 13:49
下一篇 2016-10-17

相关推荐

  • 【腾讯讲堂】交互原型设计公开课推荐

    腾讯讲堂交互原型设计公开课推荐哦,因为小编看到这个课比较适合新手们,关键是免费,哈哈哈~~好魔性的笑声。 废话不多说,点击去学习吧:UI交互原型设计公开课。 课程内容如下:  

    2016-01-20
  • 【用户体验.春节特辑】一本相册(总第269期)

    亦可访问www.koushutianxia.com了解详情编家谱   修家史   留视频建祠堂   亲互动   传万代总第269期我的发小蔡廷是我们这座江南古镇的一位”达人”,这并非他有什么才气,而是他的行为举止与这座千年古镇淳朴温和的民风相违和。天气刚有点热他便剃了个秃瓢,赤裸着上身,永远穿着条军裤,再热也不换装。腹部有两条贯腹的伤疤,象两条粗大赤红的蜈蚣僵卧其上。他从不拉帮结派,依附于任何人,不欺行霸市,不欺凌老弱,但是蛮不讲理。他...

    2018-02-20
  • 设计只在需要时 —— “暂停”按钮的消失又出现

      很多时候,不好的设计往往是因为思考的不充分或者思考的太多;而好的设计则正是因为它出现的恰到好处,哪怕它可能是在对传统习惯做出的挑战。以下我将通过现实产品中“暂停”按钮的消失又出现来说明这一点。
      对于现实中的声音播放工具,大家应该不陌生吧。录音机、walkman、CD随身听,虽然这是上个世纪甚至上上世纪的名字,但是也不至于让现在沉溺于虚拟世界的人们彻底忘记(90后除外)。我们只是去回味这些古老工具的播放控制按钮,也是能够品味出优良的设计思想的。

    2017-08-04
  • 关于Axure8.0中继器的使用1

    废话少说,请开始你的表演!!!1.拖入一个中继器,将中继器多余的行删除;2.在中继器中添加三列(可以直接双击编辑),分别命名:name、sex、age;3.双击拖入的中继器会跳转类似动态面板的“(中继器)(page2)”新页面;4.在(中继器)(page2)中再添加两个和已有矩形大小一直的矩形,分别命名:name、sex、age;关于中继器的准备工作完毕,因为中继器需要存放动态数据,所以需要在页面增加动态数据的输入入口。5.回到拖入中继...

    2018-03-10
  • 心得分享:正确对待所面临的一切

    前面一直在和大家分享我在自学的过程当中所学到的知识,其实每次在写文章之前,我都会自己提前做好准备工作,然后再整理出来一个完好的结果呈献给大家,但是自从结束实习到回到学校的这段时间,产出率几乎为零,今…

    交互设计 2015-08-24
  • 做你家孩子,用户体验真差

    静静的读书,岁月不会骗你回复“晚安”,告诉你一个真相上周末去一个前辈家做客,她儿子才八岁。我去的时候他坐在书房写作业。看到我来了,前辈立马把他召唤出来,让他弹钢琴给我看。他缩着脖子在钢琴前坐下,小心翼翼的弹完了整首曲子,然后在前辈的示意下,回房间继续做作业。哪有一点八岁孩子的蓬勃朝气!前辈却非常得意,说:“我这个儿子,非常争气听话。他每周末要学钢琴、学画画,上两个少儿英语培训班。虽然他不乐意,但我不能让他输在起跑线上。”“我知道比起别的...

    2018-04-18
  • 19.怎样绘制用户体验的地图 | 打造产品思维30讲

    19.怎样绘制用户体验地图来自时间前哨00:0015:06这一节讲用户体验地图和用户故事。用户体验地图就是通过画一张图,用一种讲故事的方式,从一个特定用户的角度出发,记录下他与产品或者服务进行接触、进入、互动的完整过程。开始做产品经理的人容易犯的错误,就是用管理员的视角来规划产品。我经常看到这种全局型的产品设计图,复杂、全面、没重点,这肯定是错的。我一般会告诉这种产品经理,请按照一个用户使用的路径,把这个产品设计图再画一遍。从一开始用户...

    2018-03-20
  • 50个国外设计机构网站设计欣赏

    Web设计灵感总是帮助我们走在新趋势, 设计结构、颜色和总体设计过程。有很多灵感的网站列出的主题就是我想要这一个是不同的。所以在这个今天的帖子我收集了50个国外设计机构网站设计欣赏,为你找设计的灵感。

    2017-06-03
  • 动起来才好玩——创意交互设计景观

    设计是靠亮点征服人,吸引眼球,大部分方案构思雷同,建成后风格水平都差不多,如何让场地更加吸引人而脱颖而出,这就需要在新、奇上下功夫。电子梦幻天幕世贸天阶最著名的“全北京向上看”的“超豪华LED天幕”,这座天幕将为整条商业街带来富于梦幻色彩和时尚品位的声光组合,成为一座吸引人潮的世界级奇观。建成之后,人们在这里可以欣赏缤纷悦目的日夜景观,感受现代科技带来的富于梦幻色彩和时尚品位的声光艺术。而且游客可以把想说的话发送短信到平台号码,天幕上就...

    2018-02-03
  • 【实习精选】网易、中信、博彦科技、雅培、太平洋证券等名企实习汇总(04-02)

    序列               实习单位工作地1德国电信咨询北京2腾讯北京3中信研究部北京4东亚银行(中国)有限公司上海5雅培中国上海 嘉兴6太平洋证券上海7广州越秀金融控股集团有限公司广州8广东南方都市报经营有限公司广州9国金证券股份有限公司深圳10博彦科技股份有限公司西安11网易雷火游戏部杭州12科锐国际大连01德国电信咨询一、企业和团队介绍德国电信国际咨询公司(DETECON),德国电信集团的全资子公司,是全球领先的ICT行业专...

    2018-04-08