Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >FlipaClip——人人都是灵魂画师

FlipaClip——人人都是灵魂画师

作者头像
灵魂画师牧码
发布于 2019-07-11 02:33:22
发布于 2019-07-11 02:33:22
10.4K0
举报
文章被收录于专栏:灵魂画师牧码灵魂画师牧码

一直以来很多人都在问我,算法题解的图是用什么软件画的?

在这里隆重的介绍一下:

我是在iPad上用FlipaClip这个软件画的,推荐配合Apple Pencil一起使用,IOS和Android平台均可下载该软件。

为什么选择FlipaClip?

FlipaClip是一款绘制动画的软件,通过一帧帧的图像最后合成动画。就像小时候的动画片一样,靠着无数张图画构成了动起来的动画。

FlipaClip主要支持以下功能:

  • 基本的画笔、橡皮、套索、油漆桶和文字
  • 格尺功能,可以画直线、方形和椭圆
  • 拷贝粘贴,可以通过套索复制一小部分内容或者一帧的内容
  • 网格和洋葱皮,支持一帧多个图层
  • 可以置入视频和图片,可以导出图片、gif或mp4格式

同款类型的软件其实不少,我都进行过试用和测评,其中主要包括以下几款:

  1. 动画桌:动画桌给人一种很专业的感觉,里面的画笔种类和动画功能十分丰富。不过使用起来复杂繁琐,对于我这种非专业人士来说功能过多不是件好事儿。
  2. Folioscope:这个软件更像是为小朋友准备的,整体界面比较粗糙,功能也较为匮乏,比如导出图片、网格对齐、复制图像等十分重要的功能都没有。
  3. PicsArt Animator:这个软件很让人无语,我最开始认为它最符合我的要求,但是居然在导出图片时闪退,而且无解,所以弃疗了。

怎么用FlipaClip?

为了向大家展示下这个软件有多么的好用,我将以身试法,通过三部分来讲解软件的妙用!

第一部分:软件界面

首先进入软件,可以看到以前的绘制列表

进入软件

点击新建项目,其中画布尺寸指的是画布的宽高像素与比例,帧率指的是每秒钟播放几张图片

新建项目

进入项目后则可以看到各种功能,下图进行了简介

界面简介

第二部分:绘制静态图

总算毕业了,拿自己的硕士毕业照开心一下,首先导入图片

毕业照

新建图层,进行描边

描边图

隐藏图片图层,上个色,看下整体效果,哇哦~~

整体效果

看到了这张图片的效果,我觉得不是很开心了,有点直击我的灵魂底线了。。。

照片可以丢了

当然,这只是个静态图描边的用法,下面我将重新来过,向大家展示下如何绘制动画

第三部分:绘制动画

本动画一共有6帧,我先将6帧的静态图都画了出来

第一帧是小猫准备吃西瓜

准备吃

第二帧是小猫咬了一口西瓜

咬一口

第三帧是小猫开始咀嚼西瓜

咀嚼

第四帧是小猫用力的咀嚼西瓜

再咀嚼

第五帧和第六帧是三四帧的循环

我们最后将帧率设置为6,这样的话1秒钟就能将6幅图播放完毕,看起来小喵喵就比较真实了,导出gif文件

导出文件

最后就是在炎炎夏日下可爱的猫咪吃西瓜动图,可爱的绝对可以让你忘记那张毕业照~~

猫咪吃西瓜

这个软件是不是很棒呢?欢迎大家一起使用FlipaClip,绘制出你的灵魂画作!

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2019-06-27,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 牧码啦 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
腾讯自主研发动画组件PAG开源
PAG (Portable Animated Graphics) 是一套完整的动画工作流。它提供从AE导出插件,到桌面预览工具,再到各端的跨平台渲染SDK,助力于将AE动画方便快捷的应用于各平台终端。PAG目前是公司AVGenerator OTeam开源协同小组的核心组件之一,广泛应用于公司内外40余款主流APP或业务,涵盖UI动画、视频编辑、特效模板、服务端特效渲染等多个场景,于2022年1月开源至GitHub。 PAG(Portable Animated Graphics)是腾讯自主研发的一套完整的动画
腾讯技术工程官方号
2022/01/17
4.9K0
【Flutter 专题】134 图解动画小插曲之 SVGA 动画
和尚之前尝试了 Flare 和 Lottie 动画,实现效果都很高效;今天和尚尝试另一种思路 SVGA 动画;SVGA 是一种同时兼容 iOS / Android / Flutter / Web 多个平台的动画格式;
阿策小和尚
2021/08/25
1.5K0
手淘互动动效的探索
摘要 现在的营销活动,用一张简单的图片去吸引消费者已经远远不够,必须要有能给消费者带来视觉冲击的东西,或者在动画过程中提供更好的引导部分。手淘的前端团队经历了从Gif、视频到CSS Animation
IT大咖说
2018/04/03
2.8K0
H5动画开发快车道 - AnimateCC与createjs开发实践
前言 以往做一些H5的运营项目,都是动画设计师使用Animate cc(原来的Flash)先设计好动画原型,然后交给我们UI开发来实现。做过动画开发的童鞋都知道动画开发都是比较耗费时间精力的,而且还要高质量的还原动画设计师设计好的动画,来回沟通成本也非常高。 那有没有一种高效的方法来改善这种流程,提高开发效率的同时还能完成高品质的动画呢? 经过一段时间的摸索,发现AnimateCC(就是原来的Flash)可以导出canvas动画,而且是基于createjs这个开发轻量级游戏的js库的,非常适合用来做移动
腾讯ISUX
2018/06/29
3.6K0
【源码分析】Lottie 实现炫酷动画背后的原理
自我在内网发布了一篇关于 Lottie 的重点原理分析的文章之后,就不断有同事来找我询问关于 Lottie 的各种东西,最近又有同事来问,就想着可能对大家也会有所帮助,就稍作处理后分享出来。
程序亦非猿
2019/08/16
2K0
【源码分析】Lottie 实现炫酷动画背后的原理
从设计师和开发的角度使用 lottie
lottie 是一个可以轻易的给各种 native app 添加高质量动画的类库。可以在 iOS、Android 和 React Native 实时渲染 After Effects 动画,就像使用静态图片一样容易。上图即为 lottie 的 logo。
零式的天空
2022/03/28
3.5K0
从设计师和开发的角度使用 lottie
UWP 手绘视频创作工具技术分享系列
开篇先来说一下写这篇文章的初衷。     初到来画,通读了来画 UWP App 的代码,发现里面确实有很多比较高深的技术点,同时也是有很多问题的,扩展性,耦合,性能,功能等等。于是我们决定从头重构这个产品,做一个全新的 “来画Pro” 出来,历经三个月的世间,这个产品终于正式上架。 (做个小广告,在 Windows 应用商店搜索 “来画Pro” 就可以找到,目前公司定位为收费应用,但是有一个月试用期,如果大家感兴趣,可以跟我要免费代码。这里是 IT之家的报道:https://www.ithome.com/h
Shao Meng
2018/04/28
1.3K0
UWP 手绘视频创作工具技术分享系列
AI绘画第七课:局部重绘的应用
第七课:局部重绘的应用 *喜欢的话可以一键三连 笔记下载看这篇专栏cv25267334 🚩00:01前言
yuanshuai
2023/11/17
1.8K0
AI绘画第七课:局部重绘的应用
根本停不下来!给它一个轮廓,TensorFlow还你一只完整的喵 (附论文下载)
大数据文摘作品,转载要求见文末 作者:Aileen,姜范波 微信后台(非评论区)回复“画猫”获取相关原文论文。 说起人工智能,最经常被人提起的案例就是可以训练机器分辨图片哪些是猫那些是狗。这两天人工智能圈继续拿毛孩子们搞事情,火了一个叫做edges2cats的玩意儿。一个叫Christopher Hesse的人用大约2000张猫的图片和从这些图片自动产生的边缘线进行训练,做了一个网页版小应用:只要画出一个轮廓,人工智能就能自动根据你给出的轮廓画出喵星人来。作者本人亲自示范如下,是不是可爱炸了!? 这个插件
大数据文摘
2018/05/25
6340
前端-狙杀页面卡顿 —— Performance 工具指北
今天介绍下 Chrome dev tools 家族的一个小兄弟,它在 Chrome 57 之前叫作「Timeline」,而现在换了个更长的马甲 —— 「Performance」,毕竟名字要「长~~~~~~~~~」更能吸引注意。
grain先森
2019/03/29
3.3K0
前端-狙杀页面卡顿 —— Performance 工具指北
H5动画开发快车道
前言 以往做一些H5的运营项目,都是动画设计师使用Animate cc(原来的Flash)先设计好动画原型,然后交给我们UI开发来实现。做过动画开发的童鞋都知道动画开发都是比较耗费时间精力的,而且还要高质量的还原动画设计师设计好的动画,来回沟通成本也非常高。 那有没有一种高效的方法来改善这种流程,提高开发效率的同时还能完成高品质的动画呢? 经过一段时间的摸索,发现AnimateCC(就是原来的Flash)可以导出canvas动画,而且是基于createjs这个开发轻量级游戏的js库的,非常适合用来做移动端的
前朝楚水
2018/04/03
5.3K0
H5动画开发快车道
进阶|你的css经不住这层考验,就是失败...
前端爱好者的知识盛宴 今天的技术提供者是鹅厂的chokcoco. chokcoco是一位用css用得贼6的大神. 文末会有他的博客链接... 欢迎各位前端爱好者去他博客游玩下... 供稿者认为仅仅... 在PC 端、移动端的 Web 动画... 还需要经得住在盒子端的考验! 甚至达到60 FPS的快感... 跟着供稿者的思路... 你会锻炼出一种解决问题的方法论... 欢迎留言、转发! 以及提问供稿者! 马上去片! 流畅动画的标准 理论上说,FPS 越高,动画会越流畅... 目前大多数设备的屏幕刷新率为
用户1097444
2022/06/29
7060
进阶|你的css经不住这层考验,就是失败...
盒子端 CSS 动画性能提升研究
对于 Web 动画的性能问题,仅仅停留在感觉已经优化的OK之上,是不够的,想要在盒子端跑出高性能接近 60 FPS 的流畅动画,就必须要刨根问底,深挖每一处可以提升的方法。
Sb_Coco
2018/01/15
2.3K9
盒子端 CSS 动画性能提升研究
Flash软件应用项目(三)
打开 Flash,新建 ActionScript 3.0,就新建了大小为 550×400 像素大小的纸张。
设计者
2022/12/20
7650
Flash软件应用项目(三)
做了一只哈基米桌宠
小时候的电脑里,总有些奇奇怪怪又让人爱不释手的玩意儿,比如能陪你聊天的微软小助手 Clippy,或者是蹦来蹦去的小浣熊宠物。如今虽然操作系统越来越精简高效,但也未免显得太过冷清了。
繁依Fanyi
2025/05/02
2500
Lottie动画原理
导语:Lottie动画是Airbnb开源的一个支持 Android、iOS 以及 ReactNative。通过AE导出的JSON文件+Lottie库可快速实现动画绘制。本文主要讲述从AE的bodymovin插件导出的JSON文件到OC的数据模型,再将数据模型拆解成独立图层,并为图层添加动画的过程。 Lottie动画原理概述 上图是Lottie动画库从AE导出动画到绘制到客户端屏幕的过程,第一阶段是JSON到Model(OC数据模型)的转换过程,主要是将JSON转成OC语言可以识别的数据模型Model,
QQ音乐技术团队
2020/07/03
6.1K0
Flutter 自定义 View 介绍
对于一些复杂或不规则的UI,我们可能无法使用现有的 Widget 组合去实现,比如需要一个带动画的进度条,
CatEatFish
2020/07/09
1.2K0
Flutter 自定义 View 介绍
Photoshop软件应用项目(一)
今天我们在 PS 软件上,制作一个简单的帧动画,方便以后和 Flash 动画效果,做对比,我们会多做几个案例,更加熟练的掌握 PS 帧动画原理,这样在接触 flash 动画时,就能够很明显的区分两个软件在动图领域的优缺点。
设计者
2022/12/20
8580
Photoshop软件应用项目(一)
现代浏览器探秘(part3):渲染 [每日前端夜话(0x12)]
这是关于浏览器内部工作原理系列的第3部分。 之前,我们介绍了多进程架构和导航流程。 在这篇文章中,我们将看看渲染器进程内部发生了什么。
疯狂的技术宅
2019/03/27
1.5K0
现代浏览器探秘(part3):渲染 [每日前端夜话(0x12)]
Lottie : 让动画如此简单
本文介绍了在Android开发中,使用Lottie动画库实现更高效、更简洁的动画效果,同时避免了XML布局的繁琐和冗余。通过实例展示了如何在Android应用中使用Lottie动画,并总结了一些关于Lottie动画在实际应用中的使用经验和技巧。
QQ音乐技术团队
2017/09/11
30K4
Lottie : 让动画如此简单
推荐阅读
相关推荐
腾讯自主研发动画组件PAG开源
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档