设计师如何建立自己的 AIGC 工具箱
上周三，一位从事UI设计5年的学员小张找到我，满脸焦虑：“老师，我花了三个月学Midjourney，但现在只会生成‘赛博朋克风格的城市’——这跟我做B端后台界面有什么关系？老板说我做的AI图根本没法用，连抠图都不如PS快。”
这不是个例。很多设计师把“学AI”等同于“玩SD/MJ”，结果发现：生成100张图，能用的不到3张；想用在项目中，从尺寸到图层结构全得重画。真正的AIGC工具箱，不是让你变成“提示词工程师”，而是帮你把AI变成可落地的生产力模块。
今天，我将用火星人教育AIGC设计课的真实案例，带你从零搭建一套可复用的工作流。这套方法已经帮助超过200名学员将设计产出效率提升3-5倍。
一、核心思维：AIGC不是工具，是“设计引擎”
在开始搭建前，必须明确一个认知：AI不是替代你执行，而是替代你“试错”。
传统设计流程：需求分析 → 头脑风暴 → 草图 → 精细稿 → 修改 → 输出。其中“头脑风暴”到“草图”阶段，设计师要花40%的时间在“画废稿”上。AIGC的核心价值是：把“画”的过程压缩到秒级，让你把精力集中在“判断”和“决策”上。
基于此，我们的工具箱分为三个层级：
- 基础层：图像生成与处理（Midjourney / Stable Diffusion / Photoshop Beta）
我们重点讲前两个层级，因为这是设计师最需要掌握的核心能力。
配图1：AIGC设计工具箱三层架构图
—
二、实操案例1：用Stable Diffusion生成“可复用的UI组件”
场景：你需要为一款健康管理App设计一套“运动打卡”界面，但公司没有3D建模师，也没有图标库。
传统做法：去图标网站找素材 → 用PS调色 → 拼凑 → 被PM吐槽风格不统一。
AIGC做法：用Stable Diffusion + ControlNet生成精准的UI组件，直接拖入Figma使用。
步骤1：搭建本地环境（推荐配置）
步骤2：编写“可用性提示词”
很多设计师失败是因为提示词太抽象。“一个好看的按钮” → AI会生成带火焰特效的魔幻按钮。正确的写法是：
正面提示词：
UI button, flat design, rounded corners, gradient from #4A90D9 to #357ABD, white text "Start Workout", 24px font, no background, centered, high contrast, vector style, white background, 4k resolution负面提示词：
text, watermark, blurry, low quality, distorted, 3d render, photorealistic, shadows, reflections
关键参数（在WebUI左侧面板设置）：
步骤3：使用ControlNet精准控制布局
直接生成往往位置不对。我们需要用线稿控制布局：
1. 在Figma画一个简单的矩形框（按钮位置）
2. 导出为PNG（白色背景，黑色矩形）
3. 在WebUI中启用ControlNet，上传这张图
4. 选择Preprocessor：Canny（边缘检测）
5. 选择Model：control_v11p_sd15_canny
6. 设置Control Weight：1.0（完全遵循布局）
点击生成，你会得到一张与线稿位置完全一致的UI按钮图。重复这个过程，你可以批量生成图标、卡片、导航栏。
步骤4：用Photoshop Beta进行后期
生成的图片可能带有轻微噪点或边缘锯齿。打开Photoshop 2024（v25.9），使用生成式填充：
—
三、实操案例2：用Midjourney + Recraft实现“风格统一”的商业插画
场景：你需要为电商App的“双11活动”设计一套系列插画，包含首页Banner、商品详情页插画、弹窗插画——要求风格完全统一。
传统做法：找外包插画师 → 沟通风格 → 等稿3天 → 改稿5天。
AIGC做法：用Midjourney生成风格参考 → 用Recraft转化为矢量 → 在Figma中微调。
步骤1：用Midjourney建立“风格锚点”
不要直接描述“插画风格”，而是用参照图锁定风格。
1. 在Midjourney Discord（v6版本）中上传你喜欢的插画（比如韩国设计师的扁平风）
2. 使用命令：`/describe` → 上传图片 → 得到4组风格描述词
3. 选择最接近的一组，加上你的场景：`–sref [图片链接] –sw 100`
– `–sref`：风格参考（Style Reference）
– `–sw`：风格权重（0-1000），100表示70%参照原风格
例如：
/imagine prompt: a cute girl doing yoga, flat vector illustration, pastel colors, minimal details, white background --ar 3:2 --sref https://example.com/style.png --sw 100
步骤2：用Recraft转化为可编辑矢量
MJ生成的图是像素格式，无法直接缩放或改变颜色。用Recraft.ai（免费版够用）解决：
1. 登录Recraft.ai，选择“Vector”模式
2. 上传MJ生成的图片
3. 点击“Recraft” → 选择“Flat Vector”风格
4. 等待30秒，得到SVG格式文件
5. 下载后导入Figma，所有元素都是可编辑的路径
关键技巧：在Recraft中，可以修改Color Palette（调色板）和Stroke Width（描边粗细）。比如把描边从2px改为4px，让插画更有“卡通感”。
步骤3：批量生成系列插画
有了第一个“风格锚点”，后续生成不需要再上传参照图。只需在MJ提示词末尾加上：
--sref [第一张图的种子ID] --sw 100
种子ID可以通过在MJ中右键图片 → “Add Reaction” → 选择信封图标获得。这样第二张、第三张插画会自动保持完全一致的风格、配色和笔触。
步骤4：在Figma中进行“AI辅助”的微调
即使AI再强，商业项目总有细节需要调整。推荐安装Figma插件Magician AI（v2.0）：
这套流程下来，原本需要3天的插画工作，现在3小时完成。
—
四、进阶建议：构建你的“AIGC资产库”
很多设计师做完项目就删掉了AI生成的素材，这是最大的浪费。建议建立三个文件夹：
1. 风格锚点库：收集MJ、SD中生成的好风格，保存参数截图（包括seed、CFG、sampler等）
2. 提示词模板库：按场景分类（UI组件/插画/图标/3D模型），每个模板包含正面/负面提示词
3. ControlNet姿态库：保存常用的线稿、深度图、OpenPose姿态图，方便快速复用
推荐工具：Notion（免费版）建立数据库，每条记录包含：
这样下次遇到类似需求，直接搜索标签，复制参数，5分钟出图。
—
五、总结：从��会用AI”到“用好AI”
最后，给各位设计师三个建议：
1. 不要追求“一次性生成完美结果”。AI是迭代工具，先出草图，再逐步细化。我通常：先MJ出10张 → 选2张 → SD精修 → PS调整 → 完成。
2. 学透一个工具再学下一个。不要同时学MJ、SD、Firefly、DALL-E。建议顺序：MJ（快速出概念）→ SD（精准控制）→ Firefly（Adobe生态整合）。
3. 每周固定1小时“工具实验”。比如本周专门研究ControlNet的Depth模型，下周研究Recraft的矢量转化。持续积累，比突击学习有效百倍。
AIGC不会淘汰设计师，但会用AI的设计师会淘汰不会用的。你的工具箱，决定了你的竞争力。
—
常见问题 FAQ
Q1：我的电脑配置不够，能不能用云端Stable Diffusion？
A：可以。推荐RunDiffusion（按小时计费，RTX 4090约$0.5/小时）或Google Colab Pro（$10/月，自带T4显卡）。注意：云端使用时要关闭“保存到本地”以外的所有插件，防止内存溢出。
Q2：Midjourney生成的图有版权问题吗？
A：MJ v6默认允许商业使用，但要注意：如果你使用了“风格参考”（–sref）上传了别人的作品，生成的图可能涉及版权。建议只用自己的原创图作为参考，或使用MJ内置的“艺术风格”参数。
Q3：AI生成的UI组件，怎么保证像素级精确？
A：SD生成的图分辨率有限。推荐两步法：先用SD生成512×512的组件，然后用Upscale功能（内置在WebUI的Extras标签页）放大到2048×2048，缩放算法选择R-ESRGAN 4x+（专为UI优化）。最后在Figma中调整尺寸。
Q4：Recraft免费版有什么限制？
A：免费版每月可生成50次矢量图，分辨率限制在1024×1024，不支持批量导出。建议先用免费版测试风格，确认后再升级Pro版（$12/月，无限次数，支持SVG/PDF导出）。
Q5：有没有不需要学习提示词的工具？
A：有，但牺牲控制力。Adobe Firefly（Photoshop内置）支持“文字直接编辑图像”，比如选中一个区域输入“变成绿色”就能改色，无需提示词。但复杂场景（如精确布局、风格统一）仍需MJ/SD。建议“简单任务用Firefly，复杂项目用MJ+SD”。
评论(0)