王柯团队

创业项目
当前位置:王柯团队 > 网络创业 >

控件详解之「小红点+索引导航+分段控件」

2024-08-12 王柯团队

3 1 控件详解之「小红点+索引导航+分段控件」

 

Badge/徽标/小红点

「小红点」是这个控件在国内最通俗的称呼,正式的名称为「Badge」(徽标),Badge是指通常出现在图标或文字右上角的红色圆点、数字或者文字,表示有新内容或者待处理的信息。3 2 控件详解之「小红点+索引导航+分段控件」

 

如何使用

无数字和有数字Badge使用场景

Badge可以分为无数字和有数字两类,一般来说,如果只需让用户了解有更新或新内容必然只有一条时,使用无数字Badge,例如微信公众号更新和App版本更新采用无数字类型。如果需要让用户精确了解有多少条更新且新内容有多条,可使用有数字Badge,例如IM的未读消息、邮箱的未处理邮件。有数字的Badge给用户带来的心理压力会更大,也会更吸引用户注意力。

3 3 控件详解之「小红点+索引导航+分段控件」

 

注意数字的长度和上限

对于有数字的Badge,由于界面显示空间有限,因此要注意视场景和信息类型决定数字最长显示多少位,如果数字达到上限该如何显示。3 4 控件详解之「小红点+索引导航+分段控件」

 

谨慎在图标内运用红色圆点元素

红色小圆点这个视觉元素已经成为一种社会性语义符号,即用户看到红色小圆点就会认为这代表着有新内容,因此图标设计因谨慎使用红色圆点,例如魅族Flyme社区App里「我的粉丝」图标,红色的心型元素与图标主体间有留白,用户会误以为这表示有新的粉丝,实际上没有,只是图标本来的元素罢了。3 5 控件详解之「小红点+索引导航+分段控件」

微信扫码上方二维码,可领取2025年最新互联网创业项目!

项目收款截图

最新文章
咨询客服 领取项目