惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Y
Y Combinator Blog
Jina AI
Jina AI
雷峰网
雷峰网
有赞技术团队
有赞技术团队
WordPress大学
WordPress大学
美团技术团队
V
V2EX
酷 壳 – CoolShell
酷 壳 – CoolShell
小众软件
小众软件
博客园 - Franky
博客园 - 三生石上(FineUI控件)
月光博客
月光博客
博客园 - 叶小钗
大猫的无限游戏
大猫的无限游戏
爱范儿
爱范儿
Hugging Face - Blog
Hugging Face - Blog
宝玉的分享
宝玉的分享
Last Week in AI
Last Week in AI
Apple Machine Learning Research
Apple Machine Learning Research
量子位
IT之家
IT之家
人人都是产品经理
人人都是产品经理
博客园_首页
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com

Red Blob Games: latest blog posts

Red Blob Games: English: a vs an Red Blob Games: Differential heuristics Red Blob Games: Responsive design calculator Red Blob Games: Academic citations Red Blob Games: Highlighting interactive code blocks Red Blob Games: Optimizing page size Red Blob Games: Writing a guide to SDF fonts Red Blob Games: URLs with trailing punctuation Red Blob Games: What I did in 2025 Red Blob Games: Goodbye Sass Goodbye Sass Red Blob Games: RotMG map seeds Red Blob Games: Mapgen4 Mapgen4's use of WebGL2 Red Blob Games: Mapgen4 river shader Red Blob Games: Mapgen4 renderer Red Blob Games: Harnessing ChatGPT hallucinations Red Blob Games: Let Let's write a search engine, part 2 of 2 Red Blob Games: Let Let's write a search engine, part 1 of 2 Red Blob Games: Hexagon conversions Red Blob Games: Mapgen4 trade routes Red Blob Games: De-optimizing mapgen4 Red Blob Games: Hexagon spiral coordinates Red Blob Games: Thoughts on Flash Red Blob Games: What I did in 2024 Red Blob Games: Hexagon page animations Red Blob Games: SDF Halos SDF Halos
Red Blob Games: Font Distortion
2024-06-01 · via Red Blob Games: latest blog posts
Blog post: 31 May 2024

I had previously blogged about text effects, and how I accidentally discovered that I could alter the personality of the font by rendering a distorted shape. At the time, I was focused on text effects and didn’t want to get distracted by this discovery. So I wrote it down for later.

Well, later came, and I decided to explore it:

Here’s the regular text rendering (with some spacing issues unrelated to this exploration):

Original text

Here’s the effect I liked:

Bottom-heavy variant

I had suspected that the problem was the way I turned a rectangle into two triangles, and some comments I got confirmed that. I wanted to see it for myself, so I painted the two triangles in different colors, and I added a grid:

Trapezoid is two triangles

This diagram confirmed that the distortion was indeed because of the triangulation. I made an interactive test page where I could try out different triangulations to see the effects, and I found another I liked:

Spooky variant

Try out the interactive test. There’s still more to explore, like what happens with serif fonts, or what happens with non-linear distortions.