💖**主题:AIGC实操案例设计思路-活动预热闪屏设计**
⌛️**时间:2024.7.24下午3点**
🧑🏻**分享人:SA九五二七**
需求分析
咱们今天的实践案例:活动预热闪屏设计
本次创作的内容,旨在实践AIGC在实际工作环境中的压力测试
设计的需求文案:难道我是创作天才?动漫新人夏日创作赛
受众人群:Z时代的年轻用户、新人漫画创作者
用途:是活动预热宣传
需求重要等级:不重要紧急
属于一个比较棘手要快速出图的活
预计完成时间是 一个工作日内完成
同时会可能出现临时有其他修改调整类的需求插入
所以实际执行时间是差不多3-5个小时左右,300分钟内完成
除去拉屎、抠鼻屎、发呆神游、喝水宕机、轻度老年痴呆,也就是全神贯注3小时内完成需求设计
好,了解完需求情况之后哈,咱们接下来分析一波
简洁明了的信息
闪屏时间有限,标题和重点信息要突出,方便用户快速获取核心信息,视觉吸引力
确保闪屏的视觉元素具备:直观传达活动氛围和特点
突出夏日和创作氛围,色彩鲜明,吸引用户注意力
风格统一,与平台整体视觉风格一致
那么根据以上的初步分析哈
可以考虑目前比较热门的小红书风格形式,作为参考方向
具体分析小红书的风格特性
咱们来具体分析一下小红书的风格特性
1.简洁清新
小红书设计风格以简洁清新为主,色彩柔和,视觉效果干净利落;视觉信息比较集中在主要元素上,信息非常突出
2.风格独特
以独特的鬼畜创意造型和设计感很强的排版为核心视觉卖点,能给人留下深刻的视觉印象,同时趣味性拉满
3.视觉亲和力强
设计风格注重用户体验,整体设计比较洞察年轻人的心理,让用户感到舒适和愉悦,重点是看着比较轻松,审美上不累
4.易于阅读
注重信息传递的高效性,直观易懂
排版简洁、层次分明,重要信息一目了然
有助于观众快速获取关键信息
头脑风暴
经过比较科学的分析之后,可以进行头脑风暴的思维发散了
根据思维发散,提炼出一些比较重点的关键词信息
比如:小红书风格、比赛、夏日
设计工具的使用包括
AI类工具:Midjourney:describe、imagine、vary(region)
辅助类工具:提示词网站
设计执行类工具:illustrator+photoshop
AI工具使用介绍
这次AI工具中,主要的功能是
/imagine 是 Midjourney 中的核心功能之一
根据提供的文本提示(prompts)来生成高质量的图像
第二是功能:Midjourney中的垫图功能
垫图功能(Overlay or Blend Images)
第三个功能:Prompt注意事项
提示词,基础prompt可用简单单词、短句完成
注意一下哈,简单、简短的去描述,用来生成头脑风暴,提供灵感思路
高级prompt
有多个描述文本词组及一个或多个控制变量参数
参数放在prompt末尾,用来还原具体想法,把控生成画面
官方标准编写规则:主题+风格+环境+照明+颜色+情绪+构图
如图的编写提示词为例
一只正在睡觉的黑猫 | 在点缀黄色花朵的绿色草地上 | 自然阳光,室外,高饱和度 | —s 750—ar 1:1
这是功能的基本玩法,详细的运用过程
大家请自行实践哈
prompt书写权重,最佳长度20个词,词越靠前权重越高
优先级:0-5>6-20>21-40
prompt书写禁词
黄色、暴力等令人愤怒不安的内容,包括成人内容和血腥内容,Midjourney不会识别此类词汇,所以注意不要踩红线
好勒,有了AIGC功能的初步了解,大家应该发现,prompt(提示词)是控制生成图片的关键要素,也是核心功能玩法;所以为了更好的配合生产图的品质,就需要借助一下辅助提示词网站
辅助提示词网站
网站介绍:
Moonvy的OpenPromptStudio (OPS) ,是一个用于可视化编辑和管理AI生成提示词的工具
使用方法:打开 OPS页面
在这里我们可以看到,默认界面里左侧是两个基础工作区
中间是对prompt的翻译与分析,右侧提示词词典展开后,则是质量、绘画、画面效果、容貌、构图、命令的相关prompt
提示词典生产了很多专业的词组
还有一个方法是,使用可视化编辑器进行提示词的编写和修改
比如,从discribe中拿到了一个图片的描述,拿词条1来举例,黏贴并查看prompt
A cute green slime wearing blue shorts and white shoes, smiling with black eyes and two thick eyebrows. The character is holding flowers in both hands while doing the thumbs up gesture on an all-white background. In the style of Nintendo game design. A star-shaped yellow outline surrounds its head. There should be no shadows or reflections on his face. He has four fingers instead of five for each hand.
将词条复制粘贴在工作区,查看词条内容,可以看到此时prompt内容长质量低,不符合编写规则,此时需要将词组梳理一下
分段处理方式
首先将句尾换成“XXXX”将段落分为短句
分解并细化段落,可以看到没有修改的“XXX”部分无法分为短句,在进一步提炼专业化词组
将句子修改为词组并查看,只保留关键描述词组,去掉不需要的描述,例如删除特定穿着描述
可以看到点击后灰色无效部分在下方输出框已经删除
可以点击替换按钮替换文本,比较方便修改
最终获得的提示词组,就比较精炼了
A cute green slime, wearing blue shorts and white shoes, smiling, black eyes, two thick eyebrows, holding flowers in both hands, doing the thumbs up gesture, all-white background, the style of Nintendo game design, A star-shaped yellow outline surrounds its head, no shadows, four fingers for each hand
这组prompt就是比较精准的出图结果了,保存下载关键词图片
复制此prompt网页链接可随时点击查看,理论上是可以作为常驻的prompt素材库来用的
原理类似设计参考图的素材库搭建方式
好勒,说完功能点之后,咱们才算正式开始做设计执行
设计执行部分
主元素生成思路
将参考图的人物抠图处理,简化画面元素
discribe命令描述,将简化后的造型用Midjourney中的discribe命令描述
可以看到生成了4条prompt
查看并修改prompt,这里用到了一个网站,提示词工作室
适合查看prompt并进行调整优化,选取合适描述词,放入提示词工作室网站进行查看并修改
这里选择的是描述4的版本词组,因为在描述 4 中出现了更多接近需求表达的词组
例如扁平设计,矢量轮廓,极简主义插画等
而 123 相对来说需要的词组更少一些
可以看到描述4版本里边,也不全是能用的,有很多不合适的词
通过筛选后,保留了一些关键词组
Create 3D render of Cartoon Network character(3D卡通造型)
with all elements devoid of shadows,no obstructions behind or below the characters to ensure a clear three-dimensional view.(所有元素都没有阴影,人物背后或下方没有障碍物,以确保清晰的三维视图)
并根据提示词典,新加入了一个关键词组
blind box toy style(盲盒玩具风格)
会给生成的图片,一种不太拟真的玩具质感,比较类似小红书的粗建模视觉形式
这点很关键,一定要记下来
/imagine生成基础变体
这里用的是/imagine功能的垫图功能,在prompt前方加入了素材图的地址,随机三次结果
垫的图就是之前的参考图
prompt拆解
:::warning Create 3D render of Cartoon Network characters,two Paintersholding an gold medal floating above him,Include scattered drawing gear like brushs and easel and books around him,white background,with all elements devoid of shadows,no obstructions behind or below the characters to ensure a clear three-dimensional view. Render in the distinctive style of Cartoon Network animations, blind box toy style
Create 3D render of Cartoon Network characters:创建卡通的3D渲染
two Paintersholding an gold medal floating above him:两位画家手持金牌
Include scattered drawing gear like brushs and easel and books around him:像刷子、画架、书的绘画设备分散围绕
white background:白色背景
with all elements devoid of shadows:所有元素没有阴影
no obstructions behind or below the characters to ensure a clear three-dimensional view:没有障碍物在周围和后方,有干净的三视图
Render in the distinctive style of Cartoon Network animations:以独特的卡通风格进行渲染
blind box toy style:盲盒玩具风格
:::
一起组成了一套生成词组
生成结果
筛选标准:
人物造型舒展,向上举起奖杯
人物无明显变形,无低龄化,并带有设计工具
图片分析:
前两张图中,生成不稳定,有1~3个人物生成,且出现了人物玩偶化的情况,人物的年龄相比之下有些低龄化
第三张中,右下作为下一轮变体素材,是三张生成图里面相对比较合适的,进一步优化生产造型,生成的结果
在这一轮中,左上人物没有和设计工具互动,仅仅是元素放置在周围
右上中人物视线朝向左上方,并不面向观众视线
左下和右下虽然人物都符合筛选标准,但左下人物出现了托举奖牌的动作,也有拿画笔的动作
人物手部造型较为清晰,所以最终选择左下为下一轮变体素材
优化prompt
进一步优化调整
在这一轮中,重点是优化prompt
将奖牌修改为奖杯,加入了黄色底座
母体图
变体结果
左上,左下,右下虽然都生成了黄色底座,但人物造型不符合预期效果
右上人物造型舒展,人物比例稳定,且与工具在动作和视线上有所互动,所以选择右上来进行调整
使用Vary(region)功能微调画面
框选住奖杯和手部,在不修改prompt 的情况下调整造型
生成结果
图一中,奖杯造型得到了改善,但是人物手部动作无明显变化
但是明显图二中的生成结果效果更好,右上图中出现了明显的托举动作,所以人物造型都很好
使用ps调整造型,优化细节
在ps中,优化了人物手势,调整了部分衣服颜色及细节
优化前
优化后
好勒,到这里为止,AIGC工具的使用部分就算结束了
背景绘制阶段
下一步开始背景的绘制,为画面简单添加蓝黄渐变背景,并添加星星和云朵素材作为装饰补充,同时星星是 app 书籍评分中非常重要的一环,在奖杯后方烘托背景点题
标题绘制
使用手绘风格字体进行变形处理并调整
加入斜面与浮雕效果,增加手绘元素的装饰感
字体:义启童真体(非商用)
组合优化
将人物,背景,标题组合后啊,为画面加入少量手绘辅助图形
同样使用标题同款斜面与浮雕效果,加入副标题赛事的搜索引导
调整尺寸,优化画面
将画面尺寸由11252436调整为11251995
方便适配各种版本机型
在顶部加入聚光灯射线,丰富顶部细节
下方加入台阶,契合竞赛主题
此处东奇大佬友情教学一把,极大的强化了画面的信息层次
标题通过强烈对比突出“创作天才”,提炼标题信息
“作”和“天”的比划对称延伸,造型舒展简洁,整体减少比划的复杂感,起到标题作用的同时作为插画的一部分融入画面
主元素部分的优化
选择人为的搭建颁奖平台,背景干净清爽
突出人物造型,辅助图形发散式分布四周,画面饱满有张力
主体元素调整了饱和度
辅助元素在阴影部分使用同色系深色作为阴影
画面整体通透感强
最终效果呈现
结果验证,这次模拟需求的设计,用时超出3小时
创作时间在4-5小时左右,最后如果没有经验丰富的老司机指导完善
最终的成品效果是不尽如人意的,加上下场指导的时间,差不多接近一个工作日
如果能充分利用Midjourney的各种功能,熟练掌握风格的实践设计和审美的话
高效完成APP闪屏的设计工作是完全可以的
最快应该能在120分钟内完成本次需求