如何用Midjourney生成B端页...

  • 经验类型经验/观点
  • 经验属性原创文章
  • 经验版权署名-非商业性使用-禁止演绎
3598 2 6 2023-05-10

Halo,这里是设计夹,今天继续分享「AI工具Midjourney」

在上篇文章中,我们讲到了如何利用MJ生成多种风格的APP界,这次更进一步来讲讲Midjourney在B端设计中如何发挥作用!

通过文本描述、图片描述两个AI方法,讲解在Midjourney中生成交互线框图、设计组件到B端页面的整个流程,如何助力UI/UX设计~

一、文本描述

文本描述是Midjourney中最重要的出图逻辑,在输入框中输入「/image+文本描述」来生成图像。

操作方法

如果我们想要生成一个B端界面,首先要清楚B端产品有哪些关键词可以使用。

先试着在Midjourney中输入一条简单的prompt提示:「SaaS dashboard」,就能得到一个深色的B端界面效果。

比如现在更流行简约浅色的B端设计风格,我们可以在prompt提示中加入“白色背景”描述,生成更加简约和流行的B端界面:「SaaS dashboard, UI, white background」

当然除了深色和白色,还可以继续尝试其他颜色,例如你负责的产品主色是紫色,想得到一个主题色为紫色的深色B端界面,使用这段提示:「SaaS dashboard, UI, purplr, black, white background, frontal」

Midjourney会根据关键词提示默认给出4张图像,图像下面有2行按钮,通过这些按钮能进一步控制生成的图像效果。

第一行的U是Upscale,代表放大图像提升细节,数字代表对应的图像U1, U2, U3, U4。

第二行的V是Variation,代表在基础上发生变化,数字表示对应的图像 V1, V2, V3, V4 。

选择你觉得第2张图效果不错,还想看更多类似的图像,就可以点击V2,再生成四个和第2张图相似的图像。

使用分析

文本描述虽然操作起来很便捷,但对于刚使用Midjourney的小伙伴来说容易导致两个问题:

一是无法准确描述出想要生成的图像需要哪些关键词提示;二是输入了很多关键词提示,但生成的图像和预想的效果不一致

对于一段关键词提示,可能调整两个字的前后顺序或者增删某一个字,都会对生成的结果产生很大的影响,从而导致产生很多废稿。

对于这种情况,为了能更快更好地控制输出效果,我们就可以使用下面要讲到的图片描述来AI创作。


二、图片描述

Midjourney中的图片描述可以理解为以图生图

把找到的设计参考图上传到Midjourney中,得到一个专属的链接,再使用「参考图链接+文本描述」的方式生成图像。

使用方法

例如我想得到一个带有交互流程的UI界面图,先把找好的素材图上传到Midjourney中。

在Midjourney中复制参考图的链接再加上文字提示:「参考图链接+node UI」,就能得到和参考图很类似的设计图。

如果想要纯正面、扁平效果的设计流程图,可以继续调整文字提示:「参考图链接+flat UI, node UI, frontal」

如果想要手绘风格、黑白风格的交互设计图,在文字提示中加入:「参考图链接+node UI, drawing style, frontal, black and white, flat UI,  2D, no shadow」

加入参数

Midjourney生成的图默认是正方形,如果想得到其他比例的图,需要在文字描述中加入特定的参数来做到这一点:「--aspect」或「--ar」

比例为9:16的设计图,使用提示:「参考图链接+node UI, black and white --ar 9:16」

或者16:9的图「参考图链接+node UI, --ar 16:9」


三、组件设计

Midjourney的作用不同于设计软件,利用AI能在几秒钟内得到很有创造力的图像,这些设计图能为后面的设计提供更多灵感。

除了生成整张的设计图,还可以扩宽思路,利用AI输出多种风格的设计组件,探索更多设计风格的可能性。

扁平组件系统

关键词:「UI kit, flat design, outline, --ar 16:9」

古驰风格按钮

关键词:「UI components, button, Gucci, --ar 16:9」

立体按钮

关键词:「UI components, button, concrete, --ar 16:9」

低保真线框按钮

关键词:「UI components, button, drawing, outline, --ar 16:9」

像素风格按钮

关键词:「UI components, button, pixel art, --ar 16:9」

HUD

关键词:「circular HUD interface」

最后

通过对于AI出图的持续探索能发现,Midjourney在UI/UX设计中能发挥的作用上限很高。小到一个图标、组件,大到整个页面、产品,都能为我们带来意想不到的创意灵感。

Powered by Froala Editor

全部评论:2

  • 2023-06-05 15:37

    前端能打死UI不

  • 166***2921

    2023-05-11 01:02

    是不是图片服务器崩了

更多作品

发表评论

取消

点击右上角
分享给朋友吧

分享到

取消

每人每天仅限5票,快给你心仪的作品鼓励的一票。

投票