PS创作果冻跳动GIF动画photoshop教程

PS创作果冻跳动GIF动画photoshop教程

PS创作果冻跳动GIF动画-photoshop教程

PS,果冻跳动GIF动画,GIF动画,photoshop,PS教程,,教程

PS创作果冻跳动GIF动画photoshop教程插图我的爱 · 创-WODEAI.NET|3D打印机创意智造

吹灯夜游神

比如我们常见的效果:

PS创作果冻跳动GIF动画photoshop教程插图1我的爱 · 创-WODEAI.NET|3D打印机创意智造

比如说UI中国的这版logo设计,高光、反光、透明度等因素创作出来的一种效果。

PS创作果冻跳动GIF动画photoshop教程插图2我的爱 · 创-WODEAI.NET|3D打印机创意智造

针对这些效果,我们今天就创作一个超简易的动效设计:

首先,在网上找个果冻图,然后把图片导入PS

PS创作果冻跳动GIF动画photoshop教程插图3我的爱 · 创-WODEAI.NET|3D打印机创意智造

把果冻抠出来,用钢笔工具选出果冻的区域>点击Ctrl+J,得到一个果冻命名为0。如果懒得抠图可以直接在网上找已经抠好的png图片

PS创作果冻跳动GIF动画photoshop教程插图4我的爱 · 创-WODEAI.NET|3D打印机创意智造

暂时隐藏抠好的果冻,复制背景图层:点击背景图层>Ctrl+J

PS创作果冻跳动GIF动画photoshop教程插图5我的爱 · 创-WODEAI.NET|3D打印机创意智造

用你超强的原画能力把果冻给【擦掉】,注意不需要处理的十分精细,只要果冻边缘处雨背景相融就行

PS创作果冻跳动GIF动画photoshop教程插图6我的爱 · 创-WODEAI.NET|3D打印机创意智造

完事以后点亮刚才的果冻看一下效果,如果看起来比较自然,那背景的创作到这就算是完成了

PS创作果冻跳动GIF动画photoshop教程插图7我的爱 · 创-WODEAI.NET|3D打印机创意智造

再复制三个果冻按三次Ctrl+J,分别命名为-1、1、2

PS创作果冻跳动GIF动画photoshop教程插图8我的爱 · 创-WODEAI.NET|3D打印机创意智造

接下来我们来看一下动效原理:

我们将果冻Q弹的效果比作是一个心动中的人,那么它的行动路径就应该是下图的0、-1、1、2再回到0

PS创作果冻跳动GIF动画photoshop教程插图9我的爱 · 创-WODEAI.NET|3D打印机创意智造

现在开始创作果冻的弹跳效果

Ctrl+R创作标尺,首先沿着果冻的上边缘拉一根参考线视为【0】然后再拉三根距离相等的线(0上两根,0下一根)

注意:线与线之间间距不能太大,会很假

PS创作果冻跳动GIF动画photoshop教程插图10我的爱 · 创-WODEAI.NET|3D打印机创意智造

选中-1图层Ctrl+T向下拉到下面那根线的位置点击回车

PS创作果冻跳动GIF动画photoshop教程插图11我的爱 · 创-WODEAI.NET|3D打印机创意智造

以此类推分别创作1和2的图片

PS创作果冻跳动GIF动画photoshop教程插图12我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS创作果冻跳动GIF动画photoshop教程插图13我的爱 · 创-WODEAI.NET|3D打印机创意智造

做到这一步果冻就已经完成了

接下来我们让它动起来:窗口>时间轴>创建时间轴(记得一定要创建帧动画)

PS创作果冻跳动GIF动画photoshop教程插图14我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS创作果冻跳动GIF动画photoshop教程插图15我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS创作果冻跳动GIF动画photoshop教程插图16我的爱 · 创-WODEAI.NET|3D打印机创意智造

点击帧下面的时间,设置时间为0.1s

PS创作果冻跳动GIF动画photoshop教程插图17我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS创作果冻跳动GIF动画photoshop教程插图18我的爱 · 创-WODEAI.NET|3D打印机创意智造

点击三下创建帧按钮再建三个帧

PS创作果冻跳动GIF动画photoshop教程插图19我的爱 · 创-WODEAI.NET|3D打印机创意智造

点击第一帧,熄灭所有果冻的小眼睛

PS创作果冻跳动GIF动画photoshop教程插图20我的爱 · 创-WODEAI.NET|3D打印机创意智造

然后就是重点啦,当第一帧是仅点亮图层0,第二帧时仅点亮图层-1,以此类推第三帧时仅点亮图层1,第四帧时仅点亮图层2。(注意一定确保每次只能有一个果冻被点亮)

PS创作果冻跳动GIF动画photoshop教程插图21我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS创作果冻跳动GIF动画photoshop教程插图22我的爱 · 创-WODEAI.NET|3D打印机创意智造

完成以后就可以预览一下啦

PS创作果冻跳动GIF动画photoshop教程插图23我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS创作果冻跳动GIF动画photoshop教程插图24我的爱 · 创-WODEAI.NET|3D打印机创意智造

如果没什么问题那么就完成啦,接下来导出:Ctrl+Alt+Shift+S存储为gif

PS创作果冻跳动GIF动画photoshop教程插图25我的爱 · 创-WODEAI.NET|3D打印机创意智造

PS创作果冻跳动GIF动画photoshop教程插图26我的爱 · 创-WODEAI.NET|3D打印机创意智造

存储结束后我们就又可以自恋得欣赏一番啦。

PS创作果冻跳动GIF动画photoshop教程插图27我的爱 · 创-WODEAI.NET|3D打印机创意智造

常见问题
疑难问题可以发起提问
通过导航菜单中的,创客问答-问题发布,进行提问,让更多的朋友看到并回答你的问题。
分享模型或FDM用机技术
可以通过,创客问答-技术分享,发布你的模型或技术知识,获得更多朋友的支持和点赞。
造机工坊分享机器图纸与固件
想制作同款FDM打印机的朋友,可以通过这个栏目下载机器设计图纸,BOM表单,源码固件等等,自行安装3D打印机了。
分享知识内容不收费!!!
本站始于爱好,止于收费,本站下载内容都不收费,感谢您的访问!
原文链接:https://www.wodeai.net/681568.html,转载请注明出处。如有侵权请联系邮箱:lianzhi0000#163.com (#=@) 删除,谢谢!
0
分享海报

评论0

请先
没有账号?注册  忘记密码?

社交账号快速登录

微信扫一扫关注
如已关注,请回复“登录”二字获取验证码