DEV Community

yi shen
yi shen

Posted on

Product content: glypho.app

用 AI 生成视觉素材时,我反复踩过的几个坑

最近在做一个独立产品,几乎每天都要出 logo、icon、插画。我试过用 AI 直接生成图片素材,结果发现这条路没有想象中那么顺。把过程写下来,给同样在用 AI 做视觉的独立开发者一点参考。

我原本以为能怎么用

最开始的设想很简单:写一句 prompt,让 AI 直接出整套视觉系统,包括 logo、空状态插画、营销图、社交媒体头图。几秒钟搞定,剩下时间专心写代码。

实际跑下来发现三个问题。

第一,分辨率对,但风格不可控。 AI 出的图看着像那么回事,但风格飘忽。这次给的是扁平,下次就变成了拟物风。整套素材放在一起,视觉完全不统一。

第二,输出格式不对。 产品里要嵌 SVG 图标,AI 出的 PNG 在 Retina 屏上糊,强行放大还出现锯齿。重新画矢量又回到原点。

第三,迭代成本高。 想改一个颜色,prompt 重写一遍,结果往往面目全非。

后来怎么解决

我换了一个工作流:先确定视觉方向,再批量出矢量素材。

关键点是把"风格"和"内容"拆开。风格先固定下来,比如选定 Notion 风格、极简线描、双色调这几种方向之一,再在这个方向里换不同的图标或插画主题。出来的素材统一度高,组合到产品里不会打架。

另一个关键是输出必须是 SVG。SVG 可以直接塞进 React 组件,也可以随时改颜色和尺寸,不用回去找源文件。

我自己在用 GlyPho 处理这一步。它的好处是风格预设比较明确,Minimal Outline、Notion Style、Line Art 这些方向是固定的,生成出来的素材在产品里拼起来不会违心。颜色变量也能直接在 SVG 里改,省掉一次重生成。

给独立开发者的具体建议

如果你也在用 AI 做视觉素材,有几个原则可以参考:

  1. 先定风格,再填内容。 不要一上来就让 AI"帮我设计一整套",先把视觉方向锁死。
  2. 矢量优先。 产品里能塞 SVG 就别用位图,后期改色和适配屏幕都更省事。
  3. 一次只改一个变量。 想调颜色就只动颜色,别把 prompt 整体推翻重写。
  4. 保留风格示例。 每次生成后挑一张满意的留下来当锚点,下一轮用"参考这张的风格"来约束。
  5. 把视觉系统当成代码管。 命名、分类、版本都按代码资产来管理,不要散落在聊天记录里。

可以带走的一个判断

AI 生成视觉素材最大的问题不是"能不能生成",而是"能不能用"。当你在产品里拼素材的时候,风格统一和格式可用比生成速度重要得多。工具选型的标准应该是"我能不能把输出直接放进产品",而不是"我能不能在 5 秒内拿到一张图"。

下一步可以做的事:打开你现在在用的 AI 视觉工具,试着锁定一个风格方向,生成 5 个同主题的图标,看它们放在一起是否协调。如果不协调,问题大概率出在你没有把风格作为约束条件写进 prompt 里。

Top comments (0)