首页

奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?

鹤鹤

导读
: 欧洲杯余温尚在,巴黎奥运会开幕在即,体育赛事总是跨越着时间与地域,将观众们的情绪紧紧相连。
除了精彩纷呈的竞赛本身,各大体育赛事的视觉表达也总能引起热议。徽标设计、赛场新貌、信息文字……它们不仅沉淀着历史基因,还传达着关乎当下的特色表达,而其中字体的选择也是关键要素。
本文聚焦 8 项全球顶尖体育赛事的徽标及官网设计,感受字体如何在其中构建起富有表现力的场域。
 
1|奥林匹克运动会
奥运会的徽标设计总是引人注目,往往融合了前瞻的设计理念及丰富的地域特色,其中图形设计与文字信息的和谐搭配亦至关重要。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
即将到来的 2024 巴黎奥运会会徽融合了金牌、奥运圣火与象征国家的玛丽安娜元素,以此致敬女性运动员。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
而下方文字则是设计团队特别定制的 Paris2024 Font 可变字体,风格简约,线条动感,蕴含装饰艺术风格。这款字体不仅运用到了印刷物料中,也在巴黎奥运会官网中用以呈现信息。
历届奥运会徽标设计常常采用手写字体或是定制字体以更好地匹配概念核心,但也有不少徽标采用了现成的字库字体。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
 
例如 2004 雅典奥运会徽标采用了 Gill Sans,组委会表示这款字体的字母形状与大量的希腊古代石刻铭文有异曲同工之妙。2020 东京奥运会使用了 DIN,其严谨细致的字体基因与祖市松纹图案搭配和谐。
 
2|澳大利亚网球公开赛
Font:Sharp Sans
网球四大满贯赛事之一的澳大利亚网球公开赛(简称澳网),创办至今已有 100 多年的历史,是每年四大满贯中最先举行的一个赛事,亦是最年轻的大满贯。
左:旧徽标         右:新徽标
左:旧徽标 右:新徽标
 
澳网于 2016 年推出了新徽标,使用了 Sharp Type 字体公司旗下的 Sharp Sans(现已加入蒙纳家族)。相比于旧徽标,这款几何风格无衬线体为徽标增添了更多时尚简约的现代气息。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
澳网官网也使用了 Sharp Sans,既保证了视觉风格的统一,也通过这款适应度极高的字体实现了良好的信息传达。
 
3|温布尔登网球锦标赛
Font:Gotham
同为网球四大满贯赛事之一的温布尔登网球锦标赛(简称温网),创办于 1877 年,历史悠久、声望丰厚。独特的草地场地也是温网的特色之一,为比赛增添了独特的观赏性和挑战性。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
目前的温网徽标自 2011 年起启用,代表草地颜色的绿色部分有两个交叉的球拍和一个网球,外侧紫色环形部分则用 Gotham 字体标注了温网名称。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
这款经典的美系无衬线体也应用到了温网的数字呈现中,既权威直率,又蕴含轻盈优雅。
 
4|NBA 美国职业篮球联赛
Font:Knockout
左:旧徽标         右:新徽标
左:旧徽标 右:新徽标
 
NBA 的徽标也经历了多重的焕新,2017 年,维持了长达 48 年的徽标有了小幅度更新,核心部分维持不变,色彩略微调深,字母变得更窄,强化徽标在品牌数字资产中的醒目度。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
NBA 官网则是选择了 Hoefler & Co. 旗下的 Knockout 字体。这款字体是对与 19 世纪末美国活版印刷商各种无衬线字体的一种总结诠释,打破了现代主义的传统,传递出更为经典的美式风格基因,与网站整体视觉风格相得益彰。
 
5|英格兰足球超级联赛
Font:蒙纳定制字体 Premier Sans
作为欧洲足球五大联赛之一,也因节奏快、竞争激烈、强队众多而商业表现极为突出的足球联赛,英超联赛在 2016 年启动了品牌升级,适配更多元化的媒介。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
 
左:旧徽标         右:新徽标
左:旧徽标 右:新徽标
 
 
蒙纳应 DesignStudio 委托,为英超联赛定制了品牌字体 Premier Sans。品牌升级前,英超联赛一直使用一款全大写的字体;时过境迁,英超需要一款更清新、亲切的字体,适配各种媒介。此外,欧洲职业足球联赛的品牌营销竞争激烈,字体也需要在营销上发挥作用。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
最终,Premier Sans 这款字体不仅在大字号下确保了良好的展示,还适应表格这样布局密集的版面,并配备了窄体来显示较长的球员名字,从而适用于多种媒介,从屏幕、球衣号码、再到电视节目、排名表等等。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
6|世界摩托车大奖赛
Font:蒙纳定制字体 MotoGP Font
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
国际摩联(FIM)公路赛车的各项赛事中,世界摩托车大奖赛(MotoGP)最受关注。MotoGP 始创于 1949 年,是历史最久的摩托车大奖赛,每个赛季覆盖四大洲的 16 个国家。
作为顶级的摩托车赛事,MotoGP 集结了全世界最优秀的车手与最先进的摩托车型。2020 年,MotoGP 商业权利持有方 Dorna Sports 决定与 Fontsmith(现已归入蒙纳)合作,设计一款活力、高端、迷人的品牌字体。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
该款字体不仅框架清晰,并且融入了赛事元素,如开放的车道形状,因而兼备摩托车工业感的曲线和优美的视觉意味,个性鲜明且富有动感,从而使 MotoGP 的品牌形象和力度都得到提升。
 
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
目前,这款字体不仅应用于 MotoGP 的各类实体物料,也呈现在各类数字媒介和转播画面中,鲜明一致地传达出赛事风格。
 
7|伦敦马拉松
Font:ITC Avant Garde Gothic + Proxima Nova
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
伦敦马拉松诞生于 1981 年,于每年 4 月下旬举办。伦马也是世界六大马拉松赛事之一,但不同于其他赛事,伦敦马拉松是一个慈善马拉松,大约三分之二的跑者都是通过慈善捐款的方式获得参赛资格。
伦马的徽标左侧字体颇具优雅的曲线感,而右侧则使用了一款现成的字体:ITC Avant Garde Gothic。
这款字体以 Avant Garde 杂志的 logo 字体为基础而设计,并逐渐由设计师团队经手优化为完整的字体家族;具有强大而现代的外观,是平面设计师用于标题及短文本的理想选择。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
伦马的官网标题字体也沿用了 ITC Avant Garde Gothic,正文则选择了易读性更强的的 Proxima Nova,兼具力量感与现代性。
 
8|全英羽毛球公开赛
Font:Neue Haas Grotesk Display + DIN
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
全英羽毛球公开锦标赛是世界上历史最悠久、最负盛名的羽毛球锦标赛,由 1898 年在英国吉尔福德成功举办的世界上第一场羽毛球公开比赛发展而来。
伦敦创意机构 Monopo London 于 2023 年为全英赛打造了忠于基因却也更为活力的视觉升级。更为平面的图案设计、全新的配色方案等都带来了更温暖、舒适、愉悦的感官体验。
奥运会、温网、NBA……顶尖赛事的字体选择,如何带来惊艳视觉?
 
 
 
在字体应用方面,此次视觉升级也颇有考量。
官网标题字体选用了 Neue Haas Grotesk Display(这款字体正是 Helvetica 的前身),正文字体则是蕴含着德系干净严谨基因的 DIN。两款字体相辅相成,既展现年轻、现代的外观,又清晰鲜明地呈现大篇幅文字信息。
结语
体育赛事往往历史悠久,蕴含着深厚的品牌基因,也随着时代的发展进行视觉升级。字体在其中亦占据重要的视觉核心,不仅奠定了表达基础,也在赛场、网页、宣传广告等多种媒介上完善信息的呈现。
活力、坚韧、愉悦、希望……无论是使用字库字体抑或定制字体,更灵活、更大胆的字体策略,能将品牌声音传达更远,触达更多,设计表达与创意的可能性也正在于此。
 


作者:Monotype蒙纳
链接:https://www.zcool.com.cn/article/ZMTYyODM4NA==.html
来源:站酷
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
 

蓝蓝设计(www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计B端界面设计桌面端界面设计APP界面设计图标定制用户体验设计交互设计UI咨询高端网站设计平面设计,以及相关的软件开发服务,咨询电话:01063334945。我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

WechatIMG27.jpg

关键词:UI咨询UI设计服务公司软件界面设计公司、界面设计公司、UI设计公司UI交互设计公司数据可视化设计公司用户体验公司高端网站设计公司银行金融软件UI界面设计能源及监控软件UI界面设计气象行业UI界面设计轨道交通界面设计地理信息系统GIS UI界面设计航天军工软件UI界面设计医疗行业软件UI界面设计教育行业软件UI界面设计企业信息化UI界面设计、软件qt开发软件wpf开发软件vue开发

 

干货!简化和改进网站UI设计的7个技巧

lanlanwork




你对自己的网站当下的UI设计效果满意吗?如果不知道如何改进的话,那么这篇文章或许对你有很大的帮助。

据统计,成年人平均每天在手机上花费3到4个小时。尽管大家不懂如何创建APP或网站,但却能明显感知一个产品设计的好坏。这可以很明显的映在产品使用时间上,并且很大程度可以归结为直观的用户体验和可能被忽视的UI界面。

如今,UI设计是建立网站或应用程序用户信任的重要组成部分。优秀的UI设计,带有清晰、熟悉的图标,一致的调色板,尺寸大小,可以让用户快速、轻松地浏览页面内容。

修改现有的网站或应用程序设计可能会面临很多障碍,但你完全可以做一些小事情,让UI设计达到一个新的水平。无论是在你的图形、调色板、网站导航工具、图标、字体大小和间距上,你的UI设计总有需要改进的地方。

在本文中,站长之家将跟大家分享7种简单的方法,让你的应用程序和网站UI设计经过简单的调整之后,在视觉上更吸引力。

字体的使用要克制

使用的字体并不是越多越好,最好只使用一种字体。我们建议使用无衬线字体,如Helvetica。因为它更易于阅读,并且在小屏幕和大屏幕上的展示都比较良好。

通常可以在不同位置进行调整。例如,标题(H1)可以是粗体,或者采用比常规文本(p)更粗的字体,而常规文本则采用普通字体,也以尝试用颜色来区分和建立层次。

当然,你还可以在设计中使用两种字体(一种用于标题,一种用于其他文本,比如段落,标题等等)。我们很少在设计中看到两种以上的字体,但出现这种情况时,是有一定原因的。

比如下图中,使用字体过多,导致页面观感混乱。

1.jpg

内容的可读性

如果页面上的文字和背景图片在颜色上过于相似,那就无法突出文字内容。结果就是不利于用户阅读,要么就是快速浏览,要么干脆跳过这部分内容。

2.jpg

而这个问题很容易解决。首先,在图片上添加一个覆盖层,根据字体颜色,调整背景图片的明亮程度,也可以通过调整图像的透明度来达到类似的效果。实现这一点的另一种方法是在文本周围添加阴影。

检查内容的对齐方式

在决定如何阅读内容时,,对齐起着至关重要的作用。大家很少会看到长格式文本居中或向右对齐,博客类或长文本内容更是如此。统一将文本左对齐是一个比较稳妥的做法,而不是选择居中方式。

3.jpg

请注意,在某些情况下,居中文本仍然是合适的。一些例子包括小标题或段落,引用等等。

颜色使用需谨慎

虽然颜色在传递信息方面非常有用,但要谨慎使用,而且只在你试图传达内容中最重要的部分时使用。

例如,对于一篇博客文章,你不会将所有文本都设置为亮绿色。颜色对于定义设计层级是非常重要的,比如可以降低不太重要的文本的饱和度,从而突出想要抓取眼球的内容。

4.jpg

最后,我们建议设计之前,要保持颜色的一致性和定义调色板。颜色的组合有数百万种,你可以花几个小时来测试哪种灰色比较好看,或者哪种紫色比较适合你的设计页面。虽然这可能很耗时,但值得去尝试,如有必要的话,就作出改变。

留白跟内容是一样重要的

留白对于内容的可读性非常重要。过于聚集的文本和图片会让用户感到不适,而过多的空白会导致读者需要过多的滚动,从而在无法快速浏览并产生挫折感。

5.jpg

要给内容足够的呼吸空间。在页面发布之前,请确保在不同的设备上测试留白,以确保可读性。

对于大多数字体来说,1.5到1.625的行高是一个比较稳妥的选择。

设计模式要为品牌标识起补充作用

在界面创建一个全新的点击或滚动模式是不必要的,通常不会给用户留下深刻印象。

6.jpg

应该使用用户熟悉的模式,例如在网站顶部添加导航栏(在大多数网站上都能看到),而不是在底部列出网站的功能,让用户需要滚动才能找到这些功能。

设计保持一致性

应该保证你的设计在所有渠道都保持一致性——包括网页,应用程序,移动端,社交媒体账号等等。

7.jpg

当用户访问你的网站或查看社交媒体资料时,应该给他们一致的熟悉感。尽量保持颜色和字体的一致性,这会让受众更好地联想到你的产品和品牌。也可以确保用户在点击你的网站时不会感到困惑。

总而言之,在UI设计方面,可以经常问自己这些问题:

  • 用了多少种字体?

  • (如果超过一种字体)是否可以简化网站,或者在页面上限制字体效果更好?

  • 图片上的文字是否易于阅读?可以在不同的设备上读取吗?如果答案是否定的,那么给图像添加一个覆盖层。

  • 网站的哪些部分居中?把它移到左边是不是更好看?(要注意的是,要根据设备调整对齐方式。比如在手机端上居中效果可能比较好,但在较大的显示器上左对齐可能比较好。)

  • 用了多少种颜色?一个个尝试使用更多或减少颜色,并尝试限制彩色文本的使用。

  • 段落和图片间隔空间是否合理?尝试增加或减少留白的数量,以改进原有的设计。

  • 所有的页面或帖子都有相同的导航吗?尽量让滚动和单击模式在整个面板上保持一致。

  • 所有的页面设计是一致的吗?如果不是,试着保持所有页面的颜色和布局一致。

以上就是改进UI设计七个要点,希望对你能有所帮助。

注文章由站长之家编译自medium

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务



优作|南非开普敦MUTI工作室设计赏析

博博

优作|南非开普敦MUTI工作室设计赏析 

 BIGD

如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里

MUTI是一家位于南非开普敦的创意工作室,他们的业务范围非常广,为许多品牌企业都提供过服务,运动品牌如耐克,服装品牌如优衣库,手机品牌如三星,杂志如Monocle 杂志、西捷航空杂志等等都有过他们的影子,同时他们的设计能力综合,从插画到字体设计再到Icon图标设计都十分强大。


WestJet Magazine

The Hound and The Hare

Brown Coffee & Bakery

World Wildlife Magazine

John Hopkins Magazine

Knight Time

Forbes Japan

Georges Magazine

WestJet Magazine

Lonely Planet Magazine

Flying High

Lonely Planet Magazine


蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务

2017年德国IF设计大奖金奖出炉了,都有哪些精彩的设计?

涛涛

好奇心日报-徐佳辰:虽然奖项名目越来越繁杂,但依然可以从这里看见是什么样的产品在塑造我们现在和未来的日常生活。

于 1953 年由德国汉诺威工业设计论坛设立,每年举办的 IF 设计奖是全球范围内工业设计和产品设计的权威类奖项。

它的初始概念可以追溯回二战后的德国,以陶瓷生产商 Rosenthal 家族的 Philip Rosenthal 为首,一群集合商人、制造商和设计师的行业人士希望通过追寻包豪斯设计风格及一种“优质形态”——结合优美的外形和良好的道德品质的工业产品,为德国树立起新的品牌形象。

现在,随着 IF 的知名度和商业运转规模扩大,其奖项中的作品分类由最初的产品设计、传达设计和包装设计三类,拓展到了包括室内设计、建筑设计、服务设计和概念性设计的七类。

2017 年,IF 大奖共收到了来自全球 59 个国家的 5575 份作品投递。包括的苹果 Macbook Pro、iPhone 7 plus、宝马 5 系列在内的 75 件设计获得了最终的金奖。以下是我们在大奖名单中筛选出的其他有趣作品。

精选国外创意独特的平面广告设计欣赏

蓝蓝设计的小编

我不停的寻找,油腻的师姐在哪,如果一个广告只是激发了观众的尿点,那只能说这个广告实在是太low了。有创意的广告同时也是智慧的体现,比如下面这些。



公益广告:鲨鱼可怕,消失更可

现代创意茶几

蓝蓝设计的小编

创意设计师的灵魂,一款独特视觉的创意作品不仅使人赏心悦目,还可以是营造气氛的好帮手。在讲求收纳的今天,节省空间成为众多设计师的灵感源泉。下面与大家分享一下这些独到的创意作品,我们日常生活中的茶几,简约而个性化。

设计是一种心境的传达

蓝蓝设计的小编

xiaoxian大学的专业是工业设计,目前从事UI设计。刚毕业的时候我做过一些吉祥物之类的平面设计,之后有心去做游戏UI,但阴差阳错地做了网页设计,最终发现UI设计更契合自己的喜好。前几年的积累是为现在的职业打下基础,也顺应了移动互联网的发展。

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档