Driven by pure curiosity about LLMs' ability to generate SVGs, I built this benchmark project. I picked
Pokémon across different dimensions, had the LLMs output pure SVG data directly via APIs, and finally
ranked them through manual evaluation.
I designed both the frontend and backend completely from scratch, which also taught me a ton about how test
suites and evaluation workflows actually work. Honestly, a lot of the tiny details were way trickier than I
expected.
The generated data itself turned out to be super interesting, so I went ahead and made a "Who's that
Pokémon?" mini-game. All the SVGs are displayed as black silhouettes for users to guess who's who. But since
the generated SVG structures can be a bit chaotic, massive solid backgrounds would often pop up and block the
Pokémon's outline. To fix this, I added a quick review page in the admin panel where I can just input the
number of layers to hide, stripping away those bottom color blocks. I'm honestly pretty proud of myself for
using this little trick instead of overengineering some complex recognition algorithm.
Built with Svelte + Cloudflare.
出于对 LLM 生成 SVG 能力的好奇,我制作了这个 benchmark 项目。选用不同维度的宝可梦,让 LLM 通过 API
直接生成 SVG 数据,最后通过人工评估来排行。
前台和后台都是从零设计的,藉此也了解了测试集和评估的流程。很多细节上没想象的那么简单。
生成的数据本身也很有意思,所以我又做了个「Who's that Pokemon?」的小游戏。所有 SVG
显示为黑色剪影,让用户来猜本体是谁。由于生成的 SVG
结构不稳定,很容易出现大块实色背景从而遮住宝可梦轮廓。我在后台专门有个审查页面,负责输入隐藏的图层数,从而达到隐藏底部色块的目的。我很高兴我想到了这个小技巧而不是复杂的识别算法。
背后使用了 Svelte + Cloudflare.