V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
gkiwi
V2EX  ›  分享发现

sublimetext 首页动画制作原理

  •  
  •   gkiwi · 2015-04-23 19:17:21 +08:00 · 2476 次点击
    这是一个创建于 3501 天前的主题,其中的信息可能已经有所发展或是发生改变。
    刚刚看canvas相关,结果了解到这个:
    http://www.zhihu.com/question/20449279
    大概意思就是找图这些帧图片间的不同,然后切割出来拼出一张新的图片,在html通过js反向解析渲染.
    思路极佳,棒极了!

    英文介绍文章:http://www.sublimetext.com/~jps/animated_gifs_the_hard_way.html
    对应lib库:https://github.com/sublimehq/anim_encoder

    跑了下例子,13张70kb的图,拼接后大概有131KB的大小,还是蛮划算的!
    同时作者提供了一个抓图的功能,全套就齐备了:)
    7 条回复    2015-05-10 05:43:47 +08:00
    Septembers
        1
    Septembers  
       2015-04-23 21:26:30 +08:00
    抓图可用屏录软件录制下来,然后再利用ffmpeg导出成png序列
    NemoAlex
        2
    NemoAlex  
       2015-04-24 08:30:05 +08:00
    这是3年前的事情啦
    现在其实不用管那些老浏览器,直接用 Video 就好啦
    gkiwi
        3
    gkiwi  
    OP
       2015-04-24 12:45:00 +08:00
    @Septembers
    库里自带啦:)

    @NemoAlex
    嗯嗯.其实这个还有个好处就是文件小(不确定video压缩起来会咋样),不过现在的带宽都还不错,这个影响都不算不太大了:)
    Septembers
        4
    Septembers  
       2015-04-24 13:59:19 +08:00   ❤️ 1
    @gkiwi
    刚刚测了下用ScriptPNG对最终的example_packed.png可压缩到32KiB
    整体发布的整体大小在40KiB以内
    gkiwi
        5
    gkiwi  
    OP
       2015-04-24 14:43:58 +08:00
    @Septembers

    http://css-ig.net/scriptpng 这个么?暂时打不开.
    不过看到其他资料了,学习了:)

    @NemoAlex 也来瞅瞅这个:)
    Septembers
        6
    Septembers  
       2015-04-24 15:25:35 +08:00
    @gkiwi 恩 我是使用的"[8] PNG8+A"选项
    eeeeeeve
        7
    eeeeeeve  
       2015-05-10 05:43:47 +08:00
    @NemoAlex 现在没有必要用那种方法了么?
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2734 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 12:37 · PVG 20:37 · LAX 04:37 · JFK 07:37
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.