在这个领域摸爬滚打了18年,我喜欢回想起2000年代初到中期那些美好的旧时光,当时网络上创意迸发。它感觉新鲜而不受约束,人们期待着不断突破界限,而且他们也做到了。这主要归功于一件事,对有些人来说是噩梦般的事物——Flash!当然,它本身存在一些重大缺陷,但无论爱它还是恨它,它确实帮助铺平了道路,让我们对开放网络有了期待。当然,这可能比我们希望的要耗时更久,但随着过去几年里一些野蛮的新进步,我现在感觉事情真的开始变得非常有趣了。
现在,在网页设计和开发方面,有几件事让我感到兴奋,一些现在已被广泛采用,比如 SVG(尽管从技术上讲已经很老了)和 WebGL 动画,它们与 Flash 时代有一些明显的相似之处。当然,CSS Grid 挺身而出,并让自身为人所知,从高处大声宣告布局的束缚现在已经成为过去。感谢 Rachel Andrew 和 Jen Simmons 等优秀人士为此做出的巨大努力,他们帮助我们这些凡人更容易理解和接受这个领域,使学习曲线和采用变得更容易。
环顾四周,你可以看到像 Grid 这样的进步如何帮助提升了更多非对称布局的兴起,像 Brutalist 设计这样的设计风格在过去一年左右的时间里经历了一段时间的流行。但随着时间的推移,感觉排版可能在推动网络发展取得的其他所有成功中有点退居次席。现在,可变字体登场了 🥳
可变字体在过去一年左右的时间里确实引起了我的兴趣。它们不仅为我们带来了明显的性能提升,与我们都注入页面中的 Web 字体包相比,它们具有更少的 https 请求和更小的尺寸,而且我们还获得了对排版方面可读性和可访问性的更多控制。告别在 CSS 中俏皮地添加模糊的牺牲性伪粗体或斜体样式吧!
更进一步,我觉得可变字体真正为我们打开了通往新的创意可能性的大门,而我们目前仅仅触及了皮毛。能够在轴的不同值之间进行插值,这简直是在呼唤动画。我们有一套标准化的 5 个注册轴,如 font-weight
、font-stretch
、font-style
等,这些都足够容易理解,但当涉及到通过 font-variation-settings
使用自定义轴时,事情就开始变得疯狂有趣了。字体设计师可以使用自定义轴中的插值来创建一些真正超乎寻常的东西,超越……文本。只需查看Typearture 的出色可变字体实验,你就会明白我的意思。
几个月前,我有幸被邀请试用和测试 Greensock 新发布的GSAP 3,我也对此感到非常兴奋。它拥有一个新的简化 API 和 50 多个新功能,但文件大小却只有先前版本的一半左右。不过,我现在最喜欢的是:在 CodePen 中将 GSAP 叠加在可变字体上,以在 DOM 中创建一些可爱的动态排版。这种魔法,我想直到现在,更多地归因于 WebGL、Processing 和 After Effects。现在,再次在上面添加一些 GSAP 插件,你绝对可以创建一些非常酷和独特的东西。但是,我建议你谨慎使用这种动画化可变字体的新创意能力,无论你用什么方式使用它,因为回流可能会导致卡顿问题。
我很期待看到人们在未来一年里使用可变字体创建什么,因为它将得到更广泛的采用。不仅限于布局中的排版处理,还包括动画和微交互方面。对于设计师来说,创建这样的字体看起来是一项巨大的工程,但要为他们点赞。我相信我们会更加感激。感谢提前的字体设计师!
2000 年代初到中期?
嗨,Harry,是的,那是我个人感觉事情真正开始加速的时候。我从 2000 年开始,同年 ActionScript 引入 Flash,随后几年互动性和设计的水平似乎有所提升。它变得非常有趣,界面互动性和参与度方面进行了大量的实验。后来,其中很多开始使用开放技术(如 JavaScript 等)进入主流,尤其是在 Greensock 将其 ActionScript 动画平台移植到 JavaScript 之后。