這篇文章將為大家詳細(xì)講解有關(guān)App中應(yīng)用圖標(biāo)標(biāo)記的示例分析，文章內(nèi)容質(zhì)量較高，因此小編分享給大家做個參考，希望大家閱讀完這篇文章后對相關(guān)知識有一定的了解。

創(chuàng)新互聯(lián)建站堅持“要么做到，要么別承諾”的工作理念，服務(wù)領(lǐng)域包括：成都網(wǎng)站設(shè)計、做網(wǎng)站、成都外貿(mào)網(wǎng)站建設(shè)公司、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù)，滿足客戶于互聯(lián)網(wǎng)時代的費(fèi)縣網(wǎng)站設(shè)計、移動媒體設(shè)計的需求，幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴！

1、概念

應(yīng)用圖標(biāo)標(biāo)記，稱為Badge App Icon。

Badge，徽章，具象來說，

就是佩帶在身上用來表示身份、職業(yè)的標(biāo)志。

它有著悠久的歷史，起源最早可以追溯到原始社會氏族部落的圖騰標(biāo)志。

在UI設(shè)計里，是應(yīng)用的徽章，長得就沒這么具象了，抽象為圓形。

它，有這么些稱呼:

應(yīng)用圖標(biāo)標(biāo)記;

App包含標(biāo)記圖像;

Badge App Icon;

小紅點;

紅點。

iOS系統(tǒng)在"設(shè)置"--"通知"，可以找到設(shè)置的地方，屬于"通知"的一種形式.

通知的另外3種形式:

聲音

橫幅Banners:

        將顯示在屏幕上方并會自動消失

提醒/提示Alerts:

        需要選擇動作才能繼續(xù)

Android官方控件沒有Badge。

iOS最開始設(shè)計并沒有通知中心（iOS5.0之后才有通知中心），僅靠桌面圖標(biāo)上的Badge表示App是否有新消息；

而Android設(shè)計之初就有通知中心，可在通知中心內(nèi)聚合查看所有App的通知，所以沒有官方?jīng)]有使用Badge提示用戶有新消息。

Badge其實是屬于系統(tǒng)級的通知，App們，把它應(yīng)用到了app內(nèi)的通知，提示用戶有未讀消息。

從Badge的歷史發(fā)展，

Badge作為系統(tǒng)消息的作用，提示用戶app共有幾條未讀消息，

在app內(nèi)反而應(yīng)少量使用，作為點綴，甚至不使用為佳。

2、Badge的設(shè)計形式

有2類，

一類是僅是一個紅點，

另一類是結(jié)合數(shù)字，或其他文字。

設(shè)計數(shù)字紅點時要合理把控數(shù)字上限，比如將上限設(shè)定為9，則 9 以上顯示 9+；將上限設(shè)定為 99，則 99 以上顯示 99+。

如果在app內(nèi)使用，可以有各種顏色的變體。

比如ColorBadges:

讓提醒角標(biāo)隨 App 圖標(biāo)變化

ColorBadges是一款Cydia插件，這款插件的作用就是讓應(yīng)用程序的角標(biāo)顏色和應(yīng)用程序圖標(biāo)顏色相一致

形式的創(chuàng)新，也許可以從具象的徽章里找到一些設(shè)計元素，

可以參考下身著祥云圖案、腳踏虎頭鞋的賣萌米奇。

3、Badge的交互動畫

Badge的交互動畫主要是消除動作，

很多app的忽略這一點，我查找了些資料，發(fā)現(xiàn)qq的消除動作做得蠻有趣的

消除小紅點有很多種方式，比如說：

方案一，通過搖一搖把小紅點抖落；

方案二，通過對著手機(jī)吹一下，把小紅點吹掉；

方案三，把小紅點拖拽下來，不喜歡哪個拽哪個；

比如 QQ 的拖拽小紅點清除等有趣的動態(tài)交互平衡消除小紅點的千篇一律和無聊。

關(guān)于App中應(yīng)用圖標(biāo)標(biāo)記的示例分析就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，可以學(xué)到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。