AIGC辅助动态启动页

用户头像
上海/UX设计师/2年前/38546浏览
AIGC辅助动态启动页
AIGC辅助动态启动页(图ZMzYzODcxNDU2) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
前言
这是AIGC应用系列教程,之前给大家详细介绍了AIGC做海报和微信红包,这一篇给大家介绍AIGC辅助动态启动页设计的全流程!
直接上干货,手把手保姆级教程保证轻松完成。
一、AIGC设计探索
目前AIGC在设计中的可行性相比去年更为广泛,在平面设计、运营活动、数字人、传媒广告视频,你可以利用AIGC制作个人头像,微信红包,绘本漫画,3D场景,动画电影,创意海报,角色设计,运营活动等等。这次利用AI设计APP动态启动页设计,会使用AI绘画工具和最新的AI视频工具。
AIGC辅助动态启动页(图ZMzYzODcxNzYw) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
二、前期准备
Step1 设计拆解
启动页也被称为闪屏页,是用户打开APP时看到的第一个页面。其主要功能包括:品牌展示、加载缓冲、运营活动推广、功能预告、节气氛围等。
在设计启动页时,需要拆解为画面视觉设计、活动主题文字排版两个部分的设计。
Step2 收集风格
关键词提取:这次是设计「春日出行」运营启动页,可以收集春天、花朵、出行、美好生活等作为关键词的图片。
AIGC辅助动态启动页(图ZMzYzODcxMDI4) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
Step3 设计工具
这次用到的主要是WHEE的文生图、AI提高画质、AI扩图来设计视觉主图,figma进行主题文字排版设计,AI视频工具来制作动态画面。更多AI视频教程可以查看我的公众号「姚十八设计」里面有系列教程。
AIGC辅助动态启动页(图ZMzYzODcxMDQ4) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
AIGC辅助动态启动页(图ZMzYzODczNjU2) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
三、AIGC启动页设计步骤
3.1 确定主题
初步制定主题为「春日计划」的旅行主题,接下来使用AI工具帮我写主题文案,之前我在《四招搞定运营设计》中给大家介绍 ChatGPT 写提示词和文案,其实国内很多产品在写文案和策划上更加方便好上手,这次我使用「文生一言」大模型,写这次的主题文案。
在生成的主题中,我选择「春日计划,追寻诗和远方」符合这次以旅行为切入点的品牌特征,相比「探访古迹」、「穿越山水」「漫步云端」,「诗与远方」更具旅行地址的广泛性。
AIGC辅助动态启动页(图ZMzYzODcxMDUy) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
3.2 生成主图
春日出行启动页,这次主要选择火车、周围是美丽的春光,整体画面是鲜艳明亮充满生机的感觉。这次控制提示词相同,选择不同模型生成的图片效果,比如:默认大模型、微距视觉、云朵模型、风景3D模型、风景山水画模型、3D春天户外场景,然后等待生成后,我选择「3D春天户外场景」啦。
提示词:一辆轨道上的火车,鲜花环绕,绿草如茵,梦幻般的视觉效果,明亮的颜色,大胆的形状,捕捉瞬间。具体参数说明可以查看我上一篇文章《AIGC辅助春节海报设计》里面有详细对比介绍。
AIGC辅助动态启动页(图ZMzYzODcxMTQ0) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
3.3 后期调整步骤
AI分辨率提升
为了让画质更加高清,可以在图片左侧工具栏使用「分辨率提高」功能,可以看到图片分辨率直接从1280变为2560,直接翻倍。目前新出了「AI超清」功能,也可以提升图片分辨率,下次仔细说说「AI超清」功能。
提高画质之后图片左上角都会出现「超分」的提示,你就知道这个已经是超级高分辨率了,已经提升过分辨率的就不能再提高一次啦。
AI扩图
在生成图片过程中,当发现喜欢的图片周围画面缺失一块或者想修改尺寸就可以在图片左侧工具栏使用「扩图」功能。我希望生成的火车占据画面比例缩小,使用扩图功能生成画面的四周,不需要写另外的提示词,AI会直接帮你扩充图片内容。
AIGC辅助动态启动页(图ZMzYzODcxMTQ4) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
3.4 设计排版
对生成的图片进行排版,分为主题文案排版、背景融合两部分。拉出渐变图层,进行视觉拼接和光感处理,把主题文案「春日计划 追寻诗和远方」配合英文「spring plan」一起排版后,把主视觉背景、视觉元素、文案等进行融合。
AIGC辅助动态启动页(图ZMzYzODcxMTU2) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
3.5 系列启动页设计
在AI绘画中,使用相同的提示词,替换主体「火车」替换为「飞机、大巴、自行车」等,保持画面风格一致性,在制作过程中可以使用提高分辨率和扩图功能对图片四周进行补充,这样就得到系列「春日计划」系列的主视觉图片啦。
AIGC辅助动态启动页(图ZMzYzODcxMjIw) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
四、
AIGC动态设计步骤
接下来重要的一步,使用AI视频来做动态效果,在AI创作工具中找到「AI视频工具」。
AIGC辅助动态启动页(图ZMzYzODcxMjI0) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
4.1 两种模式
打开后可以看到两种模式,图生视频和文生视频。目前AI视频工具还在内测,图生文中很多参数无法调节,所以更加推荐大家先在AI绘画中生成完图片后,再使用「图生视频」来创作哦。
点击按钮
在主操作界面中,可以选择直接上传图片,把制作的「春日计划」图片上传进来。
查看视频
提供修改尺寸的参数,点击「生成」等待就可以啦。右边可以看到生存的记录。可以看到生成的视频中火车驶出的效果还是很不错的!
4.2 基本参数
可以使用默认参数,直接生成视频。如果你想让视频更加符合你的尺寸要求,可以修改为3:4、1:1、9:16、3:2、16:9等。在图生视频时,我的火车图为默认尺寸为9:16,分别修改尺寸参数为1:1、3:4、9:16和16:9,发现尺寸裁剪是正中心裁剪,所以需要裁剪尺寸的时候要注意画面的处理。
AIGC辅助动态启动页(图ZMzYzODcxMjMy) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
4.3 生成效果
目前生成为4s视频,整体画质和控图效果都算稳定,对于启动页来说效果完全满足啦。
现在分别利用「图生视频」和「文生视频」生成两组效果进行对比。火车都可以完成正常行驶的动效,但是文生视频不能使用风格模型、不能放大分辨率、不能改图等,目前还是「图生视频」效果更好。
AIGC辅助动态启动页(图ZMzYzODcxNzg0) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
4.4 后期剪辑
把AI生成好的视频和设计排版的图层一起放到剪辑软件中,把卡帧和模糊的视频剪辑掉,加入火车行驶的音效和春天鸟语花香的音效,至此动态启动页设计完成!
AIGC辅助动态启动页(图ZMzYzODcxMjYw) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
3.6 设计步骤总结
回顾整个动态启动页设计流程。
第一步使用AI生成图片:生成主视觉「春日计划」,确定提示词,主视觉元素等。对图片进行修改体高分辨率和扩图。
第二步使用设计工具排版:对主题文案「春日计划 追寻诗和远方」进行排版,加上渐变背景,融合整个图片。
第三步使用AI视频生成动态效果:目前生成为4s视频,整体画质和控图效果都算稳定,对于启动页来说效果完全满足啦。更多视频教程可以查看「姚十八设计」公众号里面系列教程查看。
AIGC辅助动态启动页(图ZMzYzODcxMjgw) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
、轻松完成动态启动页设计
按照以上步骤轻松完成六个动态启动页设计。
AIGC辅助动态启动页(图ZMzYzODcxMzAw) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
AIGC辅助动态启动页(图ZMzYzODcxODE2) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
AIGC辅助动态启动页(图ZMzYzODcxODIw) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
结语
春天来袭,赶紧利用AI绘画和AI视频来设计动态启动页吧!操作简单易上手,让你轻松完成。
快来跟我一起学习AI绘画吧!让我们保持学习,2024年脱颖而出。
喜欢就点个赞吧~
AIGC辅助动态启动页(图ZMzYzODcxNDEy) - APP界面 - 站酷设计师yaoyao设计师原创素材 - 站酷ZCOOL
收藏
1198
举报
|
2228
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
加载中
推荐素材
APP界面//暂无消息页面/暂无预约页面
必胜
界面图片上传编辑
APP界面/空状态页面
手机交互概念素材
我的钱包-UI界面设计-app
简约风箭头方向指引矢量元素
2.5d插画
户外旅行男孩拇指便车顺风车
欢迎页插画
户外骑行矢量素材
App界面设计/UI设计展板
户外旅行飞机情侣假日出行
户外旅行露营野外体验玩乐
app界面插画(欢迎界面)
手机,扫码,支付,手机付款,检查,插画 , 扁平 , 引导页,开屏页,开机动画 , app , 可爱风格 , 漂亮插画 , 界面 , 山 , 月亮 , 风景插画,互联网 , 互联网插画 , 商务 , 项目 ,  网页插画 ,
拜师
消息图标
地图图标
app/web背景素材
户外旅行驴友探险社媒照片
以笔为剑,纵情挥洒的东方气韵|御林铭心 颜体
订单页面图标
APP界面//暂无数据页面/暂无收藏页面
人工智能家居app控制界面和笔记本电脑,电脑还有智能手机。智能家居自动化助理概念。
你可能喜欢
相关收藏夹
海报
海报
海报
海报
大家都在看
登录注册