我今天访问了
http://www.sublimetext.com,并对网站在其开幕页面上的截屏动画感兴趣。它看起来像是视频和幻灯片之间的混搭。我也看过他们在其他现代网站,但我认为这是一些HTML5视频标签欺骗。但是当我看到sublimetext网页的来源时,我感到困惑。
此页面上的动画在HTML5 2D画布上使用基本的PNG图像使用简单的JavaScript创建。每个幻灯片都是从PNG文件加载的。该动画通过仅从图像中修改少量像素来实现。动画JavaScript会定期在原始PNG上应用这些更改。您将在脚本中找到存储在* _timeline变量中的这些增量。
我的问题是什么工具可以产生这样的三角洲?怎么能记录一个桌面屏幕并创建这样的基础PNG动画三角洲?
我喜欢这种方法,因为它似乎是屏幕录像的最有效的格式,连续帧的变化是最小的。
更新1我知道有使用GIF(Check http://askubuntu.com/q/107726)实现这一点的技术,但是很酷的工具可以生成这个可以将PNG变量转换为动画的JavaScript代码。谷歌没有帮助我找到它。
更新2屏幕录像(和sublimetext)的作者在sublimetext论坛上回答了我的问题。他使用一个自定义的python脚本,并计划在http://www.sublimetext.com/forum/viewtopic.php?p=34252#p34252某个时候写一篇博文
解决方法
Sublime Text的创始人Jon Skinner撰写了关于
on his website的过程
他还出版了他编写的编辑器on GitHub