Back to Projects
ASCII 动态字符画
交互式 Web 应用,将图像转换为动态 ASCII 字符画、拼豆画、像素画或 Minecraft 方块画,支持 AI 图像生成。
Creative Tools
★ Featured
Tech Stack
TypeScript
Google Gemini API
Canvas
Web Audio
Project Details
ASCII Motion Art
一个强大的交互式 Web 应用程序,可将图像转换为动态的 ASCII 字符画、拼豆画、像素画或 Minecraft 风格的方块画。利用 Google Gemini API (Imagen 3) 根据文本提示生成源图像,并提供高度可定制的实时渲染引擎。
核心功能
| 功能 | 描述 |
|---|---|
| AI 图像生成 | 使用 Google Imagen 模型通过文本提示词生成独特图像 |
| 实时转换 | 即时将本地上传或 AI 生成的图片转换为艺术画 |
| 四种渲染模式 | ASCII / 拼豆 / 像素 / Minecraft 方块风格 |
| 动态动画 | 波浪、果冻、扫描线/故障等多种动画效果 |
| 全面定制 | 控制分辨率、单元格大小、对比度、字符集和颜色 |
| 一键导出 | 将生成的 ASCII 文本直接复制到剪贴板 |
渲染模式
- ASCII:经典的文本字符画,支持自定义字符集密度
- 拼豆艺术 (Bead Art):多彩的像素风格圆形网格
- 像素画 (Pixel Art):清晰的网格化像素渲染
- Minecraft:具有 3D 倒角边缘的体素方块风格渲染
动画效果
- 波浪 (Wave):正弦波扭曲动画
- 果冻 (Jelly):摆动弹性效果
- 扫描线/故障 (Scanline/Glitch):复古 CRT 显示器风格
技术架构
| 模块 | 技术栈 |
|---|---|
| 核心语言 | TypeScript (96.3%) |
| AI 集成 | Google Gemini API (Imagen 3) |
| 渲染引擎 | HTML5 Canvas 2D |
| 构建工具 | npm / Node.js |
使用方式
- 上传或生成:拖放图片文件,或输入提示词通过 AI 生成
- 选择风格:在侧边栏切换 ASCII、Bead、Pixel 或 Minecraft 模式
- 配置参数:调整分辨率以控制细节水平
- 应用动画:选择 Wave 或 Jelly 等模式,实时扭曲和动画化图像