界面設(shè)計中的省略號的五種用法

原作者:John Saito? 翻譯者:Puddinnng

本教程為翻譯教程吠各,原文地址為:https://medium.com/@jsaito/the-mighty-ellipsis-6c2c00ddc864#.fmktmfw4r


當(dāng)我說聋迎,「省略號是有史以來最神奇的標(biāo)點(diǎn)〉昀郑」朋友都把我當(dāng)瘋子魏割。你也這樣想嗎廊勃?聽我解釋…

設(shè)計師用省略號向用戶傳達(dá)信息已經(jīng)很久。你將看見搬男,在極小的空間中這三個點(diǎn)能傳達(dá)多少信息拣展。

看完這篇文章后,你一定會對這小卻重要的標(biāo)點(diǎn)產(chǎn)生新看法缔逛。

1.省略號=「這兒還有后續(xù)操作」

Window 3.1中的省略號給了我最初的印象备埃。那是我第一臺電腦。一些按鈕和菜單選項(xiàng)上出現(xiàn)的省略號褐奴,意味著點(diǎn)擊按鈕后按脚,還要進(jìn)行后續(xù)操作。

省略號在這很有用敦冬,它讓我知道操作不會立馬生效辅搬。當(dāng)我改變主意時,可以隨時取消操作脖旱。

Windows 和 MAC 上這個模式依然存在堪遂,但現(xiàn)在用得很少。

看看二十年間經(jīng)歷了什么:

Windows NT(1993):到處都是省略號萌庆!
Windows 8 (2013):省略號都去哪兒啦溶褪?

Google 的?Material Design 指南建議去掉省略號。大概因?yàn)榧眨凑芏嗖僮鞫夹枰罄m(xù)操作猿妈,滿屏省略號只讓界面變凌亂。

這個模式雖已過時巍虫,卻在這些年人們做決定時彭则,僅僅使用三個點(diǎn)就發(fā)揮了巨大作用。

2.省略號=「在這輸入」

近年垫言,許多產(chǎn)品使用省略號指示文本框贰剥。這是股熱潮。

不知這個趨勢何時開始筷频,但我能找到最早的例子,在2008年 Facebook 頁面上前痘。

為什么如此使用省略號凛捏?我猜測省略號在這發(fā)揮兩種功能:

視覺功能:有時文本框很難發(fā)現(xiàn)。省略號讓文本框更醒目芹缔,吸引你注意坯癣。

心理功能:一般來說,省略號代表了省略的文字——這里缺了些什么最欠。如此說來示罗,省略號在催促你用文本來完整這空白區(qū)域惩猫。

一些樣式指南甚至建議,每個文本框都使用省略號蚜点。Salesforce Style Guide?就是個好例子轧房。本人不喜歡這樣使用省略號,但這種做法明顯很火绍绘。

并不需要大肆宣傳奶镶,省略號順利地成為了「在此輸入」的代號。

3.省略號=「更多操作」

越來越多的應(yīng)用開始使用省略號來指示具有多個操作的菜單陪拘。它意味著厂镇,「嘿,點(diǎn)這里你還能做許多事噢~」

在 Android 應(yīng)用中左刽,你也能發(fā)現(xiàn)表達(dá)相同意義的垂直省略號捺信。

這樣做會將重要操作隱藏起來,所以有人不喜歡欠痴。無論你喜歡與否残黑,不能否認(rèn)這個圖形早成為 UI 設(shè)計中一股浪潮——有些像之前流行的漢堡按鈕

我打賭斋否,以前沒人會將省略號和“更多操作”聯(lián)系起來±嫠現(xiàn)在,省略號突然扛起來這一新的職責(zé)茵臭,并越走越遠(yuǎn)疫诽。

界面設(shè)計師大多力求簡潔,所以省略號可能會越來越多見旦委。

4.省略號=「等等噢」

省略號另一個常見用法是指示某個操作正在進(jìn)行中奇徒。「加載中…」「連接中…」「上傳中…」你可能已經(jīng)見過上百次了缨硝。

想想如果沒有省略號會發(fā)生什么吧摩钙。我們太習(xí)慣于看到省略號來代表進(jìn)行中的進(jìn)程了,看不到它查辩,我們會覺得哪里出錯了胖笛。

是不是有些別扭?至少我看來宜岛,省略號能讓我確信某件事正在發(fā)生长踊。缺少它會讓我覺得有東西卡住了。

許多設(shè)計指南建議在用戶需要等待的時候使用動畫萍倡。但如果用戶只需要等待幾秒身弊,我認(rèn)為省略號可以被當(dāng)成另一個有用的指示器,來表明系統(tǒng)正在做什么。

反正文字后的三個點(diǎn)阱佛,讓我確信操作正在進(jìn)行——即使它們只是三個點(diǎn)帖汞。這不是很神奇么?

5.省略號=「更多文字」

文本太長時凑术,省略號也用來縮短文本翩蘸。這用法叫做截斷(Truncation)。當(dāng)文檔名字太長時同樣會出現(xiàn)省略號麦萤。

早些年鹿鳖,長文件名在末端被截斷。現(xiàn)在壮莹,許多 app 和操作系統(tǒng)在中間截斷名字翅帜,便于你看到最后幾個字母。這很巧妙命满,因?yàn)槲募凶詈髱讉€字母往往最重要涝滴。

如果我們不加截斷,文本就會到處重疊胶台。謝天謝地歼疮,省略號拯救了我們,讓界面不至于一片混亂诈唬。

沒有省略號的話我們的界面會是這樣韩脏。多可怕啊~

小卻重要

現(xiàn)在你知道了省略號在界面設(shè)計中不同的用法,你同意它是有史以來最神奇的標(biāo)點(diǎn)了嗎铸磅?誰能想到這小小的點(diǎn)能代表這么多意思赡矢?

我甚至都還沒研究省略號在表格和對話文本中的用法呢,那又是個長長的故事了…

下次把省略號放進(jìn)界面時阅仔,請帶著我對他的愛意吹散。他可能是最被低估的符號了~

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市八酒,隨后出現(xiàn)的幾起案子空民,更是在濱河造成了極大的恐慌,老刑警劉巖羞迷,帶你破解...
    沈念sama閱讀 218,755評論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件界轩,死亡現(xiàn)場離奇詭異,居然都是意外死亡闭树,警方通過查閱死者的電腦和手機(jī)耸棒,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,305評論 3 395
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來报辱,“玉大人,你說我怎么就攤上這事“郑” “怎么了幅疼?”我有些...
    開封第一講書人閱讀 165,138評論 0 355
  • 文/不壞的土叔 我叫張陵,是天一觀的道長昼接。 經(jīng)常有香客問我爽篷,道長,這世上最難降的妖魔是什么慢睡? 我笑而不...
    開封第一講書人閱讀 58,791評論 1 295
  • 正文 為了忘掉前任逐工,我火速辦了婚禮,結(jié)果婚禮上漂辐,老公的妹妹穿的比我還像新娘泪喊。我一直安慰自己,他們只是感情好髓涯,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,794評論 6 392
  • 文/花漫 我一把揭開白布袒啼。 她就那樣靜靜地躺著,像睡著了一般纬纪。 火紅的嫁衣襯著肌膚如雪蚓再。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,631評論 1 305
  • 那天包各,我揣著相機(jī)與錄音摘仅,去河邊找鬼。 笑死问畅,一個胖子當(dāng)著我的面吹牛娃属,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播按声,決...
    沈念sama閱讀 40,362評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼膳犹,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了签则?” 一聲冷哼從身側(cè)響起须床,我...
    開封第一講書人閱讀 39,264評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎渐裂,沒想到半個月后豺旬,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,724評論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡柒凉,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,900評論 3 336
  • 正文 我和宋清朗相戀三年族阅,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片膝捞。...
    茶點(diǎn)故事閱讀 40,040評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡坦刀,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情鲤遥,我是刑警寧澤沐寺,帶...
    沈念sama閱讀 35,742評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站盖奈,受9級特大地震影響混坞,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜钢坦,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,364評論 3 330
  • 文/蒙蒙 一究孕、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧爹凹,春花似錦厨诸、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,944評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至宇植,卻和暖如春得封,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背指郁。 一陣腳步聲響...
    開封第一講書人閱讀 33,060評論 1 270
  • 我被黑心中介騙來泰國打工忙上, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人闲坎。 一個月前我還...
    沈念sama閱讀 48,247評論 3 371
  • 正文 我出身青樓疫粥,卻偏偏與公主長得像,于是被迫代替她去往敵國和親腰懂。 傳聞我的和親對象是個殘疾皇子梗逮,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,979評論 2 355

推薦閱讀更多精彩內(nèi)容