关于 SVG 配图、Design Profile，和一个被忽略的信号
by Sagasu · 2026年6月
「没赚到钱」是一个系列，记录那些做出来了、跑起来了，但就是没赚到钱的产品。不是复盘，不是总结教训，就是把当时怎么想的、判断依据是什么、最后停在哪里，如实写下来。
一、提示词比文章还长
起点很具体。
我在写文章，需要配图。当时 GPT Image 2 还没出来，用的是 Nano Banana Pro 这类模型。问题是你要写大量提示词来控制输出变量——颜色、构图、风格、细节——写到后来提示词比文章内容还长，改一个细节就要重新跑，跑出来还不一定是你要的。
有一次在和 Claude 聊别的事，它顺手生成了一段 SVG 动画。视觉上还挺炫，但更重要的是那是代码——颜色是 #2D3748，不是「深灰色」；位置是 x=120 y=80，不是「左上角偏一点」。你要改什么就改什么，改完结果可预期。
然后想到一件事：人写 SVG 很痛苦，但让 AI 写 SVG 是甜点。AI 对代码的控制能力远比对图像生成的控制能力稳定，让它用 SVG 来出配图，等于把「图像生成」这件事转化成了「代码生成」，绕开了文生图不可控的根本问题。
马良就是从这里开始做的。maliang.sagasu.art，文章封面加段落配图，全套跑在 Cloudflare 免费套餐上，唯一的成本是 Claude 的 $20 订阅。
二、SVG 能做什么，不能做什么
做之前先把 SVG 的能力边界想清楚，把平面设计场景分成三层：强项区、挑战区、硬边界。
强项区很清楚：Icon、Logo、封面配图、数据可视化。SVG 就是为向量图形生的，这些场景里它比任何图像生成模型都稳，输出可复现，文件极小。
挑战区有代价但能做：几何插画、UI 原型、交互动画。当时专门测了一个完整的移动端 App 交互 demo，用 HTML + CSS + SVG 跑出来了屏幕切换、底部弹层、Toast 通知，视觉上过得去。代价是越复杂越需要 JS 参与，SVG 本身只负责「画」，交互逻辑要另外写。
硬边界很明确：写实人像、摄影级材质、皮肤光影。SVG 是向量格式，没有像素密度，用大量路径可以「模拟」真实感，但文件会爆炸，结果还不如直接用 PNG。这条线不要碰。
这张能力地图后来成了马良选择场景的判断依据——封面和配图在强项区里，先做这个。
三、AI 能看懂自己画的东西吗
做完那个 App 交互 demo 之后，顺手想了一个问题：AI 自己能理解这个 demo 里的视觉效果吗？它看代码和人看渲染结果，理解程度一样吗？
让 Claude 做了一个自我评估：代码结构和逻辑理解大概 95%，视觉感知大概 40%，意图理解大概 70%。
那 40% 是什么意思——它能从代码里推算出 border-radius: 380px 对应的是很圆的角，但它感知不到这个圆角在渲染出来之后是不是「看起来顺眼」。动画时长写的是 380ms，它知道这个值，但它感知不到这个速度在人眼里是「流畅」还是「卡顿」。
人做的是感知判断，AI 读的是精确规格。缺的那 30% 恰好是设计评估里最重要的那部分。
这个结论影响了后来对马良的定位：它不是设计师，它是执行层。审美判断这件事还是要人来做。