vivo Sans


111日,2023 vivo开发者大会成功举办,OriginOS 4正式发布。作为OriginOS 4的一大亮点,正式亮相了全新的品牌定制字体——vivo Sans


2023 vivo 开发者大会


在刚刚结束的vivo X100系列新品发布会上,vivo Sans作为vivo品牌形象设计的重要组成部分,已正式应用于品牌传播中,在视觉上为新产品注入更多的个性与魅力。


vivo Sans在vivo X100系列新品海报中的应用


vivo Sans由vivo与方正字库携手打造,首度搭载笔画级“动态视觉字号”与符号级“智能排版引擎”,通过视觉字号与字重的二维可变,以及最专业易读的排版呈现,给用户带来更加自然和愉悦的屏幕阅读体验。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101165842_3319.jpg



https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101165901_5392.jpg


vivo Sans选择回归文字阅读本质,摒弃华丽的装饰,通过细致的雕琢,让文字以最舒适清晰的形式呈现,让用户在阅读时能专注于信息本身。




字体结构 ▽


91%的大字面率,保证了文字基础的易读性与易识别性;均匀的布白设计、和谐的部件比例,以及巧妙的笔画避让,使得vivo Sans具备了阅读字体应有的品质。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101165959_1683.jpg


曲线设计 ▽


为了确保文字在不同屏幕素质和尺寸下的阅读效果都能得到提升,双方设计团队还充分考虑了整体字形的质感与美观度。vivo Sans在笔画处理中融合了一定的书写特征,流畅的字体线条为其增添了独特的人文气质,连续平滑的曲线设计使得字体更具视觉韧性。

https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170058_8284.jpg

笔画设计 ▽


vivo Sans的勾画采用趋平式设计,笔画线条更加贴合屏幕像素分布;笔画末端采用简单利落的直线切角,切线角度随笔画位置的不同而灵活调整。平钩笔画和智慧切角的处理,令字体在满足舒适阅读的需求同时,能够在千篇一律的黑体中脱颖而出。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170017_2676.jpg


简约设计 


作为全新的品牌定制字体,vivo Sans竭力通过字体细节上的删繁就简,最大程度实现用户的高效阅读。部分笔画相交和折笔处进行了减省、去锐处理,风格上现代简洁,识读效率显著提升。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170238_5474.jpg



https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170249_7833.jpg


vivo Sans首次采用笔画级“动态视觉字号”设计,同时搭配字重轴无级可变,在保证基础字形满足易读性和易识别性前提下,捕捉每一个文字微弱的形态差异,实现不同阅读场景和信息层级下字体平滑连贯的动态变化,确保全系统每一处文字信息,都能适应用户的自然阅读节奏。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170317_3165.gif


视觉字号


系统界面涉及的字号大小、文字层级关系的配搭更仆难数。为了确保多种字号在不同界面尺寸下均有最佳显示效果,vivo Sans采用了“动态视觉字号”设计。


通过对OriginOS的界面的梳理分析,我们发现10-22sp的字号范围可以覆盖OriginOS内大部分应用场景。根据这一特点,vivo Sans配置Display、Text、Micro三档视觉字号,其中,Display档对应22sp及以上字号,此档字号匹配较小的中宫,字体精致耐看,用于标题展示环境下更能彰显其风格;Text档对应16sp字号,以适中的中宫和合适的间距,满足正文文本的可读性需求;Micro档对应10sp及以下,更加细致地考量了小字号下的阅读显示效果,采用较大中宫和更为宽松的字体间距。vivo Sans的视觉字号设计采用了可变字体技术,支持在Display-Text-Micro之间进行无级变换和动态调节。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170447_1967.jpg


vivo Sans的西文字符同样匹配了视觉字号设计,不同字号范围下,字体的字高、字宽、字怀以及字间距均进行了相匹配的调整,在保持中西文视觉一致性的前提下,优化西文的显示效果。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170513_7611.gif


vivo Sans的动态视觉字号设计,更是具备自主动态优化的性能。我们将视觉字号与系统实际字号大小相匹配,系统可以根据文本的字号大小,自动切换相应的视觉字号,以此充分满足各种阅读场景的显示效果需求。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170540_9228.jpg


细节处理 


vivo Sans的动态视觉字号设计,重点关注了Micro字号应用于屏幕小字阅读时的整体效果。为了让小字号显示不再成为屏幕阅读的掣肘,Micro字号的笔画交叉处特别进行了“交叉减细”和“离散避让”的处理,做到无损文本的可读性。





https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170629_2564.jpg


vivo Sans的西文延续了中文的设计风格和笔触细节,保留现代的外观设计与不同角度、大小和距离下易读的字体特性;同时,应对手机系统相同的西文字符在不同场景和页面,有特征显示优化的思考,配备了无限的西文变体设计。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170654_1154.jpg


西文设计 ▽


vivo Sans的西文采用简洁现代的无衬线设计风格,字体x高较高,字腔均匀开阔,呈现出充盈挺括、饱满舒张的视觉效果;字符宽度协调、间距节奏均匀,传递出稳重平衡、中性普适的风格特点。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170713_1976.jpg





变体设计 ▽


vivo Sans西文包含了Compressed、Condensed、Standard、Expanded四种宽窄变体,每种宽窄均配备了对应的斜体字形。完备的字符设计,为vivo Sans创造出强大的表现力。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170819_2198.jpg


针对标志性的vivo影像,vivo Sans专门开发了适配的影像场景字体vivo Sans Camera,更具机械感、几何感的字体风格,为用户带来更独特的影像场景视觉体验。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170917_2610.jpg


vivo Sans不仅应用于系统,也会在品牌营销传播中得到充分运用。为此,设计团队为营销场景设计了专属的数字字形,并为营销端量身打造了一款专属字库。这不仅进一步加强了品牌端与系统端字体风格的统一性,也为营销场景提供了优质的解决方案。vivo Sans旨在提供一个更协同,更整体的品牌体验。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101170943_1093.jpg


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101171008_7619.png


为了配合vivo全球化市场和OriginOS系统多语言适配,vivo Sans还在进行包含中文繁体(BIG5)、阿拉伯文、西里尔文等文种在内的多语言字库开发设计,敬请期待。



特殊性能 ▽


针对vivo Sans在OriginOS不同界面特性的实际应用,在设计之初,双方团队就十分重视字体表现力的拓展。部分西文和数字字符配备了相应的替换字形,能针对不同界面特性和根据不同显示场景调用最合适的字形。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101171032_4275.gif


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101171045_5378.jpg



https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101171105_9369.jpg


针对系统的标志性场景,vivo Sans除基础的中西文及变体、数字、符号外,还专门增加了部分符号化汉字和OriginOS系统图标等特殊符号,用于系统标志性场景的信息显示。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101171128_7355.gif


vivo Sans在字符设计上兼顾了特定应用场景的显示性能,并对此进行了字符特性上的专门优化:例如,在日期、时间的显示中,可以进行非等宽数字与等宽数字的切换,数学运算中,使用到的运算符号、冒号等,可以自动调整至视觉垂直中心处。使用者可以通过手动触发字符特性,享受自定义带来的乐趣。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101171206_4362.gif



https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101171138_7989.jpg


vivo Sans的初衷,在于让用户在字体行间体验前所未有的自然和愉悦,字体每一处设计细节,都希望能够充分兼顾用户阅读的流畅度。为了进一步优化阅读体验,vivo Sans特别搭载了动态排版引擎,实现文本从字符间距到段落对齐的整体排版质量提升。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101171323_2822.gif



https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101171241_8033.gif


系统显示 ▽


vivo Sans作为全新的品牌定制字体,将会随着OriginOS 4的推出,为用户带来更加自然和舒适的阅读体验。


OriginOS 4界面


品牌应用 ▽


vivo Sans还将用于vivo品牌各营销场景中,无论是海报、广告、宣传册,还是产品包装,都能通过专属的视觉语言,为vivo品牌带来独特的风格和视觉感受,更好地传达品牌形象和价值观,与消费者建立互动和共鸣。


https://cdn1.foundertype.com/Public/Uploads/img/customcase_attach_20241101171501_8371.jpg