ASCII Motion

ASCII Motion 是一个基于浏览器的 ASCII/ANSI 艺术创作和动画工具，由动画师兼品牌设计师 Cameron Foxly 开发和维护。它允许用户从零开始绘制字符画、自动将图片和视频转换为 ASCII 艺术，或者在时间轴上逐帧构建动画。

这个项目最初是用 GitHub Copilot 配合 Claude Opus 等 AI 模型辅助编写完成的，开发者自嘲这是“氛围编程”的产物。虽然项目结构有些不太常规的地方，但功能已经相当完整，目前已经迭代到 2.x 版本。

ASCII Motion 采用双许可证模式。核心功能位于 packages/core/ 目录下，采用 MIT 许可证，用户可以自由使用、修改和分发，没有商业用途限制。高级功能如用户认证和云存储位于 packages/premium/ 目录下，采用专有许可证。

在技术架构上，ASCII Motion 使用 React 19、TypeScript、Vite、Tailwind CSS 和 Zustand 状态管理构建。项目是一个 monorepo，包含主应用、营销网站和文档站点三个可独立部署的部分。

官网入口地址

https://ascii-motion.app/

开源项目地址

https://github.com/cameronfoxly/Ascii-Motion

下载地址

ASCII Motion 是在线工具，无需下载安装，直接通过浏览器访问官网即可使用。开发者也可以从 GitHub 克隆源码进行本地部署，需要 Node.js 18 或更高版本，执行 npm install 和 npm run dev 即可启动本地开发环境。

功能介绍

网格化 ASCII 艺术编辑器
提供完整的绘图工具集，包括铅笔、橡皮擦、填充、矩形、椭圆、贝塞尔钢笔、文本、渐变等多种工具。可以在网格上逐字符绘制和编辑。

图片和视频转 ASCII
支持导入图片或视频素材，自动转换为 ASCII 艺术。提供精细的渲染控制和帧率匹配功能，转换效果可以调整。

自定义颜色和字符调色板
支持预设调色板，也可以导入和导出自定义调色板。用户可以根据创作需求灵活配置字符集和颜色方案。

效果和滤镜
可以对现有动画应用效果和滤镜，增强视觉表现力。

程序化动画工具
提供程序化动画生成功能，可以快速创建复杂的动画效果。

基于图层的时间轴
支持图层管理，包含关键帧插值功能，可以对位置、缩放、旋转和锚点进行动画控制。

多图层合成
支持多图层合成，具备 z 顺序、可见性、独奏、锁定和图层组等功能。

关键帧动画
提供三次贝塞尔缓动编辑器和预设，让动画过渡更加自然流畅。

多种导出格式
支持导出为图片（PNG、JPEG、SVG）、视频（MP4、WebM）、React 组件、CLI 组件（Ink、OpenTUI、BubbleTea）、纯文本、HTML 以及会话文件。

社区画廊
支持将作品发布到社区画廊，也可以浏览他人创作的作品，获取灵感。

MCP 服务器
提供 ascii-motion-mcp 服务器，支持 AI 辅助动画创作。

应用场景

技术文档与代码注释
在 README、终端输出或日志中加入动感的字符动画，提升可读性与趣味性。ASCII 艺术在开发者社区中有独特的亲和力。

社交媒体与论坛
在不支持图片的帖子里嵌入 ASCII 动画，吸引眼球。很多论坛和聊天工具对图片有限制，但 ASCII 文本可以正常显示。

教学与演示
通过字符画展示算法运行过程或数据变化，兼具视觉冲击和轻量化。适合在终端环境下进行演示。

终端界面美化
为 CLI 工具、终端应用添加 ASCII 动画效果，提升用户体验。

复古风格创作
ASCII 艺术自带复古气质，适合制作怀旧风格的内容，如模拟老式计算机界面效果。

表情包和趣味内容
制作 ASCII 动画表情包，在聊天中分享，增加趣味性。

使用方法

第一步：访问官网
在浏览器中打开 ASCII Motion 官方网站 https://ascii-motion.app/ 。

第二步：选择创作方式
可以从零开始绘制字符画，也可以导入图片或视频自动转换，或者在时间轴上逐帧构建动画。

第三步：编辑和调整
使用绘图工具进行编辑，通过时间轴控制每一帧的显示时长，调整字符密度、对比度等参数。

第四步：预览效果
编辑区同步显示字符画的渲染效果，可以即时看到参数变化带来的效果调整。

第五步：导出作品
编辑完成后，选择合适的格式导出，如纯文本、HTML、PNG、SVG、MP4、WebM 等。

服务支持

定价信息
ASCII Motion 的核心功能采用 MIT 许可证，免费，可以自由修改和分发，没有商业用途限制。高级功能如用户认证和云存储采用专有许可证，未来会加入付费选项。

数据安全
作为基于浏览器的工具，核心编辑功能在本地完成。高级功能涉及云存储时会使用 Supabase 服务。

开源贡献
项目欢迎对开源核心部分的贡献，包括新绘图工具、动画功能、导出格式、界面改进和 bug 修复等。贡献者需要遵循 TypeScript 严格模式，并通过测试和代码检查。

浏览器要求
需要支持现代 Web 技术的浏览器，推荐使用版本的 Chrome、Firefox、Safari 或 Edge。

技术栈
项目使用 React 19、TypeScript、Vite、Tailwind CSS v3、Shadcn/ui、Zustand、Lucide React 和 Vitest 构建。