简立方博客 SimpleUX Talker：AI在视觉设计流程中的应用

随着ChatGPT发布，AI进入爆发期，短短两年内涌现出众多AI产品，让人难以选择。接下来，我们将了解一些主流的AIGC产品。

1.文本生成式AI

文本生成式AI的产品有非常多，比较主流的有比如国外的 ChatGPT、Claude、LaMDA 等，国内的文心一言、豆包、Kimi 等。当然，最为强大并受到大多数人认可的必然是开启AI爆发期的ChatGPT。。

2.图像生成式AI

3.视频生成式AI

二、AIGC在视觉设计工作中的应用

在在UI设计中，我们的工作流程始终从需求分析到参考搜集再到初稿设计。使用AI工具并未改变流程，只是提升了出图效率和效果。结合设计背景、语言定义和范式提炼，AI在UI设计中的应用尤为突出。

1.项目前期-需求分析

1）了解项目背景

明确业务需求后，我们可以将产品背景和定位告诉AI，让其分析需求或解释相关概念。此外，AI还可以帮助寻找设计灵感，提供排版、图形、色彩和文字等方面的建议。

2）解析产品业务

图片来源「胡柚」

除此之外，还可以让AI帮助我们提炼一些设计关键词，我们就能基于想要的关键词去衍生映射物、收集意向图，建立图形情绪板。

3）关键词散发

图片来源「胡柚」

2.设计前期-视觉探索

1）探索定义设计语言

设计语言包含了色彩、字体、图形质感等多个领域，根据调研，发现目前AI广泛用于以下几点：

定义色彩方案

我们可以尝试与AI沟通，让它基于1个或多个颜色生成配色方案，AI是能给出相应的建议供我们参考。如果在对话中添加更多关于设计背景介绍以及图片风格的定义，得到的答案也会更加完善。

图片来源「胡柚」

除此之外，一些AI工具也能为我们提供帮助，比如AI Colors 可以通过关键词的输入生成多样的配色方案，同时还支持对单个颜色进行修改，并且提供了手机端、仪表盘、落地页等结果效果的预览。

定义字体

定义图形、质感

设计系统文档

3.设计中期-辅助设计

图像生成式AI是视觉设计行业的重要工具，不仅能快速生成参考图帮助定义风格方向，还能高效生成复杂设计元素，大幅提升工作效率。

现阶段，Stable Diffusion以高可控性和多样性成为强大的工具，但因学习成本和设备要求高，使用门槛较高；相比之下，Midjourney凭借简单易用和高质量的图像输出，成为大多数设计师的首选，尽管可控性不及Stable Diffusion，但其开发者正持续优化功能，为设计工作提供更多支持。

1）人像/摄影图

在UI设计中，寻找高质量摄影图常因版权、成本和筛选耗时等问题而受限，而Midjourney通过高质量图像生成，能快速生成符合需求的各类人像、风景和建筑图，质量媲美专业摄影作品，有效解决设计中的素材难题。

-人像

我们就以“客服”这个职业举例，先来看看我们用Midjourney生产出来的效果图：

怎么做到的呢？首先为了更加准确的操作 Midjourney 生成更为准确的图片，我们在输入咒语时，要记住以下五个方面：

人物视图：就是指我们想要生产的人物是“正面”还是“侧面”等；

摄影风格：比如写实、肖像、艺术风格，这个是保证我们生产出来的人物是写实的摄影图，而不是卡通形象；

相貌特征：我们想要生产的人物是什么“性别”、“表情”、“所在区域”等；

构图：所呈现构图方式，比如“黄金分割”、“中心构图”、“对角线构图”等等；

其他描述：补充的描述，比如一些照片质量等其它要求。

接下来就可以按照上面说的五个方面分别的构思这五个方面的“关键词”，最后把他们组合在一起就是一段完整的咒语，我们以一些最简单关键词的为例：

相貌特征：

A Young Lady from China, long black hair,Customer service staff in professional attire, Wearing headphones.,With a smile, pure white background

（一位来自中国的年轻女士，黑色长发，穿着职业装的客服员工，带着耳机，面带微笑，纯白背景）

人物视图：

Upright view（正视图）

摄影风格：

professional photography, business picture, in the style of subtle morno chromatic tones, professional portrait lighting, Hyperrealism

（超写实，专业摄影，商业图片，采用微妙的 Morno Chromatic T 风格，专业的人像照明）

构图：

A novel shooting angle, Golden section（新颖的拍摄角度，黄金分割）

其它描述：

Very detailed, Ultra-high detail, 16K

（非常详细，超高细节，16K）

以上就是五个方面各自的关键词，都是一些比较简单的，如果大家有需求，可以进行一些更加详细的描述，我们把它们组合在一起生产出来看看：

A Young Lady from China, long black hair, Customer service staff in professional attire, Wearing headphones., With a smile, pure white background, Upright view, professional photography, business picture, in the style of subtle morno chromatic tones, professional portrait lighting, A novel shooting angle, Golden section, Very detailed, Ultra-high detail, Hyperrealism, 16K

最后我们挑选出我们认为合适的一张（注：如果没有你觉得合适的，可以多次生成抽卡，也可以在网上找你一张你觉得合适的，进行垫图再加上咒语生成），最后把我们选择的图片下载下来进行抠图再放上我们的设计图，就完成了。

-摄影图

摄影图的生成方式其实与人像相差不多，注意的还是那五个方面，只不过要把相貌特征换成我们的风景或者建筑的主体。

摄影角度：就是指我们想要生产图片是以什么角度拍摄的；

摄影风格：比如写实、艺术风格，这个是保证我们生产出来的人物是写实的摄影图，而不是卡通风格；

主体：我们想要生产什么样的“风景”、“建筑”、“场景”等等；

构图：所呈现构图方式，比如“黄金分割”、“中心构图”、“对角线构图”等等；

其他描述：补充的描述，比如一些照片质量等其它要求。

如果有同学懂得一些摄影方面的知识，那可能操作的更加得心应手了，可以在咒语里加入一些摄影圈的专业名词，可以帮助Midjourney更加出片。

举例：

主体：

A snow-capped mountain with towering clouds on its top, Xinjiang Tianshan

（一座山顶上云层高耸的雪山，新疆天山）

摄影角度：

long shotTelephoto shots, Upright view

（远景镜头，正视图）

摄影风格：

landscape photography, CONTENTF 11, ISO 100, kodak colorplus, realistic, in the style of light white and dark maroon

（风景摄影，光圈CONTENTF 11，感光度ISO 100，胶卷柯达ColorPlus，现实主义，以浅白色和深色 MAR 的风格）

构图：

Line composition（线条构图）

其它描述：

detailed imagery，4K –ar 3:2 –c 4 –s 250

（详细的图像，4K，宽高比3:2，多样性4，风格化250）

组合起来：

A snow-capped mountain with towering clouds on its top, Xinjiang Tianshan, long shotTelephoto shots, Upright view, landscape photography, CONTENTF 11, ISO 100, kodak colorplus, realistic, in the style of light white and dark maroon, Line composition, detailed imagery, 4K –ar 3:2 –c 4 –s 250

如果想要生成的图片更加的符合你的目标，可以加上你想要景点的真实图片作为垫图，例如我这里想要的是新疆天山的风景图，我们可以在网上找到一张真实的新疆天山摄影图垫图生成：

2）背景元素

除了具象的摄影图和人像之外，Midjourney还非常擅长生产一些抽象的图形，这些抽象的图形图片我们可以拿来作为PPT或者banner的背景等。

生成的图片较为抽象，因此无需过于详细的描述。在这个阶段，可以通过图生图的方式让Midjourney自主创作，选择blend模式或使用垫图加咒语也很简单。公式不固定，但需要注意“材质”关键词的理解。接下来，我们简要拆分一下：

主体：就是指我们想要的抽象背景图是以什么形式展现，比如“线条”、“粒子”、“飘带”、“方块”等等；

色彩：我们想生成出来的图片整体偏什么样的配色，如果对配色没有要求，可以不填；

材质：这是最关键的，关乎到我们生产出来的质感和质量，如“毛绒”、“金属”、“PVC”、“透明玻璃”等等；

其他描述：非必要的补充描述，比如一些照片尺寸质量或者镜头、风格等其它要求，如果对细节要求高，可以多加一些光照和风格的关键词，比较考验关键词储量。

示例：

主体：蓝色飘带的抽象背景，简单，超简单外观，条纹；

色彩：蓝色渐变，明亮，鲜艳的颜色；

材质：磨砂玻璃；

其它描述：虚幻引擎，8K，宽高比16:9，风格化180.

abstract background with blue streamers on light blue background, simple, ultra-simple look, stripes, Blue gradient, bright, bright colors, frosted glass, Unreal Engine, 8k –ar 16:9 –s 180

由于描述简单，Midjourney的创作空间很大，生成的图片差异也较大。如果对细节要求不高，可以多次生成直到得到满意的结果；如果有细节要求，可以加入更多风格化关键词来增强细节。

例如：

long exposure style, G.D. Lam Pak background, light shadows, abstraction, clear smoothing color, modern minimalism, industrial design, studio lighting, zoom shot

（长曝光风格，G.D. Lam Pak 背景，灯光阴影，抽象，清除平滑颜色，现代极简主义，工业设计，演播室照明，缩放快照）

现在加上这些风格化的关键词我们再来看下效果：

这个时候会发现比之前的更有细节了，这时候我们发现第二张似乎比较符合我们的要求，我们就可以点击“V2″，在第二张图的风格上生产出更多的可能：

就这样在一步步的选择和抽卡中，我们选择最为满意的一张就可以下载下来作为我们的背景了！

我们现在就在这套公式上尝试下修改：

Abstract background of particle waves, simple, ultra-simple look, stripes,Blue and black, bright, bright colors, Particle spatial texture, long exposure style, G.D. Lam Pak background, light shadows, abstraction, clear smoothing color, modern minimalism, industrial design, studio lighting, zoom shot, Unreal Engine, 8k –ar 16:9 –s 180

主体：abstract background with blue streamers on light blue background, simple（蓝色飘带的抽象背景）➡️Abstract background of particle waves（粒子波浪的抽象背景）

色彩：Blue gradient（蓝色渐变）➡️Blue and black（蓝黑色）

质感：frosted glass（磨砂玻璃）➡️Particle spatial texture（粒子空间质感）

在之前的公式上，我们修改了主体、色彩、质感，然后我们再来看看效果：

这套公式可以直接拿来用，当然这个公式并不是唯一，在后面的资源库里我们会放入更多的公式供大家直接使用，修改大家想要的主体和质感、色彩就可以了。

3）插画

插画是AIGC对设计师的极大助力，Midjourney可快速生成高质量插画，省时省力。尽管需要一定的语言描述和英文表达能力来定义细节，但即使生成结果不完全匹配，也能提供灵感，或通过PS微调优化。对于细节要求不高的插画需求，更能充分发挥其强大的AI绘画能力。

在了解怎么生产出这么漂亮的插画前，我们得先记住两个关键的命令：

–niji 6 (这个命令是代表的是选择Midjourney的动漫模型，这个模型生成出来的插画风格更加的细腻，当然你也可以直接选择niji机器人为你生成，就不用在咒语后面加入–niji 6命令了）

–sref（这个命令代表着风格趋向，在这个命令后面我们可以接上我们参考风格图片的链接，这样生成出来的插画风格就会向你参考图片链接的风格靠齐，也可以在命令后面直接接入风格代码，如–sref 203140091，后面这串数字就是风格代码，每一串数字都代表着不同的风格，使用风格代码比关键词出来的插画风格会更加准确，后面我们有风格代码库，大家可以直接使用）

掌握了这两个命令后，可以专注于插画主体和场景的详细描述。这一步需要较强的语言描述能力，因此在开始之前应先构思好插画场景，且可以在生成过程中不断优化描述。举例：

我们先把我们脑海里构造的场景通过关键词的方式表述出来：

（雨季中连绵的大雨，飞翔的燕子，远方的山脉与河流，一尊娃娃骑于水牛背上，山脚小屋中的绽放花儿，轻盈的淡绿渐变天空）

然后加上一些风格和视角的辅助关键词：

（古色古香的中国图案背景，整体色彩基调以绿、黄为主。这幅插图的风格线条细腻，曲线流畅，给人以神秘之感。高清细节描绘，鱼眼镜头，一点透视法，超高清，超级细节）

我们把他们柔和到一起翻译成英文然后在结尾加上–niji 6看看效果：

Traditional Chinese pattern background, heavy rain in the rainy season, flying swallows, distant mountains and rivers, a doll riding on the back of a buffalo, blooming flowers on a small house at the foot of the mountain, light green gradient sky, the overall color scheme is mainly green and gold. The illustration style has delicate lines and smooth curves, giving it a sense of mystery. Illustration style HD details, fisheye lens, one point perspective, ultra high definition, super details –niji 6

Midjourney非常强大，如果对插画风格要求不高，可以通过关键词定义大致风格并抽取满意的图像，再在PS中调整细节。若有风格要求，可以在咒语后添加风格代码。

我们可以从风格代码库中选择合适的代码进行生成对比，生成的图可能有瑕疵，因此需要耐心，不断优化咒语和抽卡，直到获得满意的插画。

同理，介绍一个工作中的案例。如下图：

输入/describe命令把想要的参考图放进去，系统自动生成对应的文案，然后用翻译软件翻译为中文；再根据需要的图修改文案里面的细节重新翻译成英文；再把参考图垫一次输入文案最后生成；生成后用ps或figma微调细节，就完成了一个APP的头图片。

以下就是最终生成的插画：

4）ICON

AIGC的出现让3D图标设计变得更高效便捷，不再需要设计师熟练掌握建模软件，也大幅缩短了制作时间。图标作为设计语言的关键元素，不仅传递信息，还能激发情感。通过Midjourney，设计师可快速生成多种风格的图标，从简洁线性到复杂3D效果，无论是功能性、装饰性还是定制化需求，都能轻松实现，丰富创意并提升设计效率。

以下案例均使用 Ai 产出：

图片来源「花瓣网」

来看看怎么做的吧：

其实整体过程跟插画差不太多，在这里我们也需要用到–sref这个风格命令，不过这时候后面就不太好插入风格代码了，因为现有的风格代码中很少有关于icon风格的，我们就需要插入我们参考图的链接，同时，–sref+参考图链接的方式也是保证我们生产一整套icon时，保证这一整套的icon风格是统一的。

不过需要注意的是Midjourney的可控性确实是一个软肋，可能大量的抽卡都没有能抽到我们觉得合适，所以除了–sref来定义风格之外，前面可以再垫图一张我们意向的参考图，可以帮我们节省很多时间，当然就算有垫图，因为icon的细节度，肯定也不是生成几张就能抽到我们满意的，我们需要记住一个命令–repeat+空格+数字，这是一个批量生产的命令，后面的数字就是我们需要生产图片的数量，输入多少数字，Midjourney就会自动帮我们生成多少张图，不需要我们一直去点重新生成，可以帮我们省下很多功夫。

实操前先了解下面 2 组命令：

① iw（image weight 图像权重）

方法：

垫图链接（空格）+ 描述语（空格）+ –iw（空格）数值

优势：将一张图片作为垫图（Prompt Image），输入到 Midjourney 中，然后基于这张图像的风格、构图或元素来生成新的图像。垫图可以帮助用户更直观地表达他们想要的图像效果，使得生成的图像更符合用户的预期。垫图的参数为 **iw(image weight)**，指令格式：–iw 权重范围因版本不同，权重范围亦不相同。v6版本最高权重为3

② sref（style reference 指定风格）

方法：

–sref（空格）图片链接（空格）+ –sw（空格）0-1000

–sw 需要配合–sref 一起搭配使用才能生效；

–sw 参数区间：为 0～1000，默认值为 100；

–sref 可以上传多张图片，进行多种风格的混合：–sref URL1 URL2 URL3

也可以图片分配不同的权重：–sref URL1::2 URL2::1 URL3::1

优势：多功能适用性。Sref 技术超越了传统限制，不仅完美适配 Niji 模型，还能广泛应用于各类 MJ 模型。这种广泛的兼容性为用户提供了丰富的创作可能性，满足不同设计需求；高度定制化：Sref 赋予用户前所未有的控制力，通过轻松调节参照强度，用户可以精准把握作品的匹配度，细致雕琢作品风格。无论是追求高度一致性还是独特创意，Sref 都能满足您对创作的精细要求。

sref出来前，我们都是垫图+iw控制权重来生成icon，现在看看当我们只运用了iw权重的效果。首先，假如我们需要生成一个礼物的icon，将想要的参考图喂给 AI，输入相对应描述语后，发现生成的风格并不贴合参考图。

上面的我们只输入了简单的主体咒语和视角咒语，结果发现就算垫图了，生产的图与我们参考图的差距也很大，而下面的除了主体和视角，我们还加入详细的材质描述，这时候发现生产出来的图还算可以，不过与我们想要的参考图依旧有差距。

这时我们尝试加入新出的风格控制命令 sref

格式：「参考图链接」+描述语+ sref「参考图链接」；

这时我们发现，不管加不加详细的材质咒语，生成的案列基本已经达到我们的预期了，当然加了材质咒语的会更加细致一点。最后通过 PS 优化掉不合理的地方，我们的图标就完成啦！

现在我们尝试用同一段咒语和Sref来生成一套icon试试：

大家可以看到，完全都是同一个风格的，每个icon我们也只是更换了垫图和主体关键词，因为生成的图像会参考垫图的图形形状，所以垫图也是必须更换的，可以更换成与我们主体关键词相符的图形。

（注：因为翻译的问题，有些主体关键词翻译成英文后也很难被Midjourney理解，所以就算有垫图，生产出来的图形也会与我们预料的差距很大，比如“文件夹图标”，这种情况可以sref和iw一起使用，通过调高iw数值来调整垫图和咒语的比重，使生产出来的图形尽量向着垫图的图形去靠拢，然后在大量的抽卡中去抽中那一张合适的）

同理，我们再介绍另一个工作中的案例。如下图，我们完成了一个会员中心的制作：

甲方说：你不觉得少了点啥吗？

设计师：好的，2 分钟搞定。

首先，我们找到想要的图形风格或者感觉，想要这里展示一个类似质感的 V 标识

使用 Midjourney 的风格识别功能，「- – sref」，把想要的风格样式喂给 MJ，后缀加上 – -sref+链接；

可以看到我们的咒语都是非常简单的：一个字母V，会员标志，干净的背景，绿色，3D，8K。最后加上我们的sref。

最终呈现：

我们再以相同方法扩展一下：

这里有一点需要注意一下，配色也属于风格的内容，所以生产出来的图的颜色也会向着风格参考图的方向，所以如果需要生成相同质感不同配色的多个图形，建议提前把参考图放入PS调整颜色后再换更风格参考链接。

如下图，完成了一个类似的会员弹窗制作：

图片来源「58UXD」

同样的方法，我们找到想要的图形风格或者感觉，想要这里展示一个类似质感的 V 标识

使用 Midjourney 的风格识别功能，「- – sref」，把想要的风格样式喂给 MJ，后缀加上 – -sref+链接；

图片来源「58UXD」

最终效果：

图片来源「58UXD」

5）IP形象

刚推出时，Midjourney多用于生成卡通形象，但较少用于IP形象制作，因其早期可控性较差且缺乏多图统一性，难以满足IP形象的细节要求和扩展性需求。当时设计师多将其作为参考，再手动绘制和建模。如今经过多次更新，Midjourney的可控性和统一性有所改善，但生成图片仍不易调整细节，适合对IP要求不高的客户用作创作参考或灵感；若需求简单，还可直接生成一整套IP形象。接下来看看具体生产步骤和咒语设置。

相貌特征：我们想要生产的人物是什么“性别”、“表情”、“所在区域”等；

人物视图：就是指我们想要生产的人物是“正面”还是“侧面”等；

人物风格：生产的IP形象的质感和风格是什么样的；

构图：所呈现构图方式，比如“黄金分割”、“中心构图”、“对角线构图”等等；

其他描述：补充的描述，比如一些质量等其它要求。

首先我们假设我们要生成一只柴犬形象的IP：

相貌特征：一只超级可爱的柴犬盲盒玩具，穿着蓝色连帽衫和红色裤子；

人物视图：前视图；

人物风格：chibi风格，简单的3D模型；

构图：全身照；

其它描述：白色背景，bannder，高分辨率，演播室照明。

看的出来，我们前期的要求还是比较简单的，拼凑成咒语：

a super cute blind box toy of a Shiba Inu, wearing blue hoodie and red pants, full body shot, chibi, simple 3d model, namely the front view, white background, blender rendering, high resolution, studio lighting –niji 6 –s 750 –ar 2:3

（注：后面的命令是使用动漫模型及图片宽高比例）

这时候我们发现第四张就很符合我们的预计，我们就可以把这张保存下来，当然，刚开始不一定都能抽到自己满意的，可以多抽抽，尝试使用批量生产的命令。

这时候我们发现我们需要扩展一些其它的动作来适应别的使用场景，怎么办呢？如果点击V4以第四张更改咒语重新生成肯定是不行了，会与我们选定的第一张图有所差距，看不出是一个Ip形象，这个时候就需要用到一个新出的命令了：

～cref （content reference 内容参考）

① 方法

–cref（空格）+图片链接（空格）+ –cw（空格）0-100

–cw 需要配合–cref 一起搭配使用才能生效；

–cw 参数区间：0～100，默认值为 100；

参数说明：通过调整 Cref 参数中的–cw（cref 权重），可以精细控制角色特征的还原程度。例如，将–cw 值设为 100 时，会尽可能地还原角色的面部、发型和服装；而将–cw 值设为 0 时，则只关注面部特征，适合在需要改变服装或发型时使用。

② 优势

保持角色形象的一致性：Cref 技术能够确保在不同场景或设计中，角色的面部特征、发型、服饰等保持一致，这对于品牌形象或系列作品中的角色设计尤为重要。

我们现在就来尝试一下，我们还是在最初的咒语上加上“骑着滑板车”，在咒语后面加上–cref+最初我们生成出来并选择的那张图的链接，并且加上–cw 20来控制权重变数：

这里要注意，如果在扩展的图上需要增加一些第一张图上没有的东西，比如“滑板车”“耳机”等等，则需要减少–cw的参数，不然参考图链接的权重太高，会覆盖咒语上新加关键词的内容，比如我们咒语上加入了滑板车，但是我们–cw权重100的话，可能生成出来的并没有滑板车。

我们继续以上面的办法，在原先的咒语上增加新的物品关键词或者动作表情关键词+上cref来试试生成一整套ip：

生成出来的套图虽然因为cref的原因看着很像，但是光线上可能会有些区别，这时候可以拖入ps里统一调整下颜色和明暗度。

三、Midjourney资源库

关键词库

收集到一些Midjourney关键词表格和网站，方便设计师们使用：

https://kdocs.cn/l/cuAJq9ffM6FA

https://www.uisdc.com/midjourney-13

https://www.uisdc.com/midjourney-18

四、好用的辅助工具推荐

1.PiXian.AI（AI抠图）

https://pixian.ai/

Midjourney生成的是带背景的图片，当我们只需要里面的主体的时候，就需要去除背景，这个网站就可以帮助我们快速的自动去除背景，保留主体。

2.OPS提示词工作室（可视化编辑咒语）

https://moonvy.com/apps/ops/

在使用Midjourney时，优化和调整咒语是生成满意图片的关键，但对英语不熟悉的用户可能有困难。这个网站可以将关键词自动生成完整咒语，或将咒语拆解成关键词，支持单独修改和重新排列，并提供实时翻译，帮助快速理解和优化咒语。

3.LanguageX（专业翻译器）

https://app.languagex.com/engine/config

由于Midjourney对中文识别不理想，我们仍需使用英文咒语，而业务中的专业术语对英语不熟悉的用户是挑战。相比传统翻译工具，这款产品整合了ChatGPT等AI模型，支持准确翻译行业术语和复杂语句，更加智能高效。

4.Vmake AI（AI扩图软件）

https://vmake.ai/zh-CN/workspace

Vmake是一款AI驱动的照片和视频编辑工具，提供视频和图像的背景移除、质量增强、对象删除、稳定性提升等功能，帮助用户快速进行内容创作和营销。