用AI给微信公众号制作做SVG动画

职场   2024-10-20 18:59   北京  

今天看到一个公众号叫“空格的键盘”,以时间为主题写的Prompt,

感觉挺有意思的,作者在coze国际站上做了一套工作流:

https://www.coze.com/store/agent/7424349693641064456?panel=1&bid=6e50ps0p46g0i

然后输入以下提示词就生成了上面的SVG图。

完整提示词见
https://mp.weixin.qq.com/s/BOMOQVGQ5hvd8dDaKwb18A


然后突然想到很久之前给公司做公众号动画的时候,每次都是修改别人家的代码,自己做不到创作,有了cursor,claude,v0这些AI 代码工具,制作公众号里的SVG动画是一点问题也没有了。

下面是我逐步改进的过程:

1. 我用作者提供的coze网址制作了下面的SVG图表:

青蛙🥚0天蝌蚪🐸7天幼蛙🦎21天成年蛙🐸60天

2. 感觉有点单调,然后用bolt.new生成svg代码,复制到公众号里生成下面图表:

🥚卵在水中孵化🐟蝌蚪蝌蚪在水中游泳🐸幼蛙开始长出后腿🐸蛙蝌前腿出现,尾巴缩短🐸成蛙完全变态,离开水域0天7天14天21天2月图例:蝌蚪幼蛙

3. 感觉还是差点意思,复制到cursor中继续创作,增加动画效果:

青蛙的一生🥚0天从小小蛙卵到青蛙成长🐟蝌蚪7天蝌蚪在水中游泳🐸幼蛙14天开始长出后腿🐸蛙蝌21天前腿出现,尾巴缩短🐸成蛙2月完全变态,离开水域图例:蝌蚪幼蛙蛙蝌成蛙

4. 为了更好演示,我把动画做成循环效果:

可直接复制代码到自己公众号看。

青蛙的一生🥚0天从小小蛙卵到青蛙成长🐟蝌蚪7天蝌蚪在水中游泳🐸幼蛙14天开始长出后腿🐸蛙蝌21天前腿出现,尾巴缩短🐸成蛙2月完全变态,离开水域


这样任何样式都不是问题了。


关于作者


做一只爬的最久的乌龟,保持学习保持好奇,即使慢一点,遇到一点困难,只要最后能到达终点,又有什么关系呢。
毕竟人生没有白走的路,每一步都算数。



前端程序设计
专注前端最前沿技术,数据可视化,web3d。偶尔插播生活和艺术。
 最新文章