AIGC如何应用到UI设计工作全流程？来看58的实战案例！

扫一扫
官方手机版

扫一扫
AI创作程序

扫一扫
木子公众号

扫一扫
AI公众号

一、前言

UI 设计是一门结合了美学、技术和用户心理的艺术，它的目标是创造出既美观又易用的界面，从而提高用户的满意度和忠诚度。然而，UI 设计也是一项耗时耗力的工作，它需要设计师不断地进行创意、绘制、测试和修改，以适应不同的业务需求和用户反馈。有没有一种方法，可以让 UI 设计变得更简单、更快、更美呢？答案是：AI 人工智能！本文将介绍如何将 AI 技术应用于 UI 设计的全流程中，以及这种结合对业务和团队的价值。无论你是一名经验丰富的 UI 设计师，还是一名对 UI 设计感兴趣的新手，你都可以从本文中学习到一些有用的知识和技巧，让你的 UI 设计更上一层楼。

更多AIGC实战案例：

AI绘画实战案例！赶集直招如何用AI提高83%的出图效率？

随着 AI 技术不断的发展，AI 也给设计师的工作方式带来了全新的机遇与可能。

二、AI设计调研方法

前期调研对于 UI 设计过程至关重要，它能让设计师掌握客户和市场的需求和趋势，为设计方向和策略提供依据。前期调研需要分析大量的资料，如用户画像、用户人群划分、用户真实需求、用户审美偏好等，以便在设计时充分考虑，实现用户体验和视觉调性的精准设计升级，达到数据转化的最终目标。chatgpt、NewBing 等辅助工具可以为设计师提供丰富的文字信息，帮助他们快速确定设计方向，并学习解决问题的方法。chatgpt 使用门槛高而 NewBing 亲测可以平替 chatgpt。无需注册直接使用！！

NewBing，是微软刚推出的一款基于人工智能的聊天机器人。使用 NewBing 帮我做一个家政类 APP 的竞品分析。通过提出问题得到同类型产品竞品分析，在提问时可以尝试用表格进行列举这样对比更清晰。并且从用户画像的角度为你分析用户的审美偏好，为前期视觉调性的设计定义大致的方向。如通过分析得知家政类的用户更注重生活品质，喜欢清晰、简洁、易用的页面。

三、AI设计流程与落地

MidJourney 是一款基于 GAN 技术的 AI 绘图工具，具有高度的可定制性和多样性，画面注重细节的构建和表达；可生成不同风格和色彩的图像。Prompt 关键词描述是 MidJourney 中与 AI 沟通创作的媒介，通过描述文本内容告诉 AI 理解听懂你的指令从而生成满意的画面。具体的描述方法如下：

「主题内容」+「环境、背景」+「构图、镜头」+「风格化」+「参考方向」+「渲染方式」+「图像设定」

主题内容：是指你要画个什么东西？比如是人、动物、地点、物体等。

环境、背景气氛：例如指定的地点或者物件、背景设计。比如是城市、森林、海滩、工作场景、室内、室外等，也包括画面的光线、氛围等方面。

构图、镜头：这里强调画面的构图和镜头处理，比如是透视、鸟瞰、特写等视角，以及画面元素的排布、层次、比例等方面。

风格化：指画面的风格特点，比如是现代风格、传统风格、卡通风格等。

参考方向：比如说艺术家的名字或者直接将图像风格写出来，比如 dribbble

渲染方式：指画面的渲染方式，比如是光线追踪、阴影、反射等渲染方式。

图像设定：指画面的一些基本设定，比如是画面尺寸、分辨率、图片质量等。

核心关键词是生成高质量图片的关键，为了便于生成高质量的 UI 图片，为大家收集了一些提升画面质量的关键词，大家可以根据需求添加并尝试。直到达到自己想要的画面效果。

更多关键词干货：

效率出图！5种效果超好的 Midjourney 优质提示词

大家好，这里是和你们一起探索 AI 绘画的花生。

四、风格探索与实践

我们在设计方案时，会有许多创意想法。我们可以用 Midjourney 快速模拟出概念方案，满足提案的要求，并根据业务需求进行及时的迭代。低成本的实现方案方向的确立。再也不用因为没有灵感而苦恼。

在 UI 设计中，当我们遇到新的风格改版时候，首先是确定设计的方向，产品风格，为后续的产品方向制定基调。也是我们常用的情绪版设计。利用 midjourney。以 58 到家家政类 APP 为例，我们通过前期用户分析得出用户更注重生活品质，喜欢清晰、简洁、易用的页面，通过输入关键词来输出大量的情绪板。我们可以控制风格更倾向于用户的审美基调。控制颜色更贴近品牌的表达

图标的设计是 UI 设计中日常工作，使用 AI 让我们图标设计过程更加有趣，生成的结果也可以很方便的运用到实际的场景里。我们可以运用 knolling 的提示词把与主题相关的物品整齐地排列在一起。通过排列的图形为我们后期绘制图标提供灵感。

同样我们也可以根据某一个单独的图标进行绘制，给出 white background，白色背景的提示词能帮助更好的得到一个边缘清晰完整的 icon 图标

在对用户的分析中，用户更注重服务的品质，真实的服务场景能得到用户在情感上的共鸣从而选择平台上的服务。场景图片的真人拍摄需要花费大量的时间和模特成本。我们可以尝试用 midjourney 垫图的方法通过基础图片生成大量服务人员和场景图片。这些场景图片可以作为 SKU 的封面图，也可以作为专题栏目的入口封面图

在空状态页面的设计上，准确、直观、高效是空页面设计的原则。扁平插画风在 UI 设计中应用广泛，既能直观表达又简洁美观。输出状态页面的插图主要是关键是在场景的精准描述（主题内容：一个人在房间打扫卫生 环境：在绿植环绕的环境中 风格定义：扁平化、极简风格、多细节等）

五、AI对团队的帮助

AI 绘画对设计团队有着巨大的帮助，主要体现在以下几个方面：

创意辅助：AI 绘画能够利用智能算法快速生成多样化的元素和图案，激发设计师的灵感，拓展创意的可能性。

效率提升：AI 绘画能够通过自动化处理、批量操作、快速修图等方式，减少设计团队的重复繁琐的工作，提高生产效率。

素材丰富：AI 绘画能够通过人工智能技术生成基础素材、辅助绘画效果，提高设计团队的素材库的质量和数量。

内容优化：AI 绘画能够通过智能化的方式协助设计团队进行色彩、构图和设计细节等的优化，减少内容制作流程中的缺陷和错误。

方法沉淀：AI 绘画能够通过智能算法分析和学习历史设计作品的生成规则和工作流程，让设计团队在工作实践中形成更加深入的设计思考和理论体系。

总之，AI 工具不仅为设计团队提供了强有力的支持，同时也激发了人类设计的创新潜能，让设计作品更具有创意性和艺术性，推动了设计领域的不断创新发展。

欢迎关注「58UXD」的微信公众号：