Wiki 知识库

全部文档 / 标签: Canvas

10 篇
清除

基于 Claude Code 的视频自动化剪辑指南

本文介绍如何用 Claude Code(Opus 5.5)实现视频自动化剪辑:将原始 MP4 或文章丢入本地文件夹,让 AI 一次性完成去水词、加字幕、绘制解说动效并合成导出 MP4。与传统扩散模型 AI 视频工具不同,该方法采用可编程视频渲染路线,通过 HTML Canvas + Playwright + FFmpeg + F5-TTS 用代码逐帧画出视频。作者分享了三个实操诀窍:用交付清单代替复杂提示词、截图投喂视觉参考、丢案例库网址进行逆向工程并沉淀为 SOP。文中还拆解了完整的工程级渲染管线,包括分镜对齐、本地语音克隆、字级音画同步与自动化视觉 QA,并附上可直接复用的完整 Prompt 模板及适用场景边界建议。

技术 › Claude Code 水族店刘老板 2026-10-1714.1 KB 12.2K 107 92

Motion Engineering: 用 Opus 5.5 搭建视频工作室

文章介绍如何围绕 Claude Opus 5.5 构建程序化视频生产系统。作者 rari 指出,大多数用 Opus 5.5 制作的demo千篇一律,差异不在提示词,而在模型周围的系统工程。核心思路是让模型编写帧函数,渲染器跨时间轴生成视频,从而实现可控、可修订的视频制作。文章提出工作室五层架构:导演(明确目标)、参考(视觉规范)、时间轴(叙事节拍)、渲染器(Canvas/SVG、Remotion、HyperFrames)和评审循环,强调把决策显式化,避免模型用默认视觉方案填充空白,最终产出可复用的视频生产流程。

技术 › Claude rari 2026-10-0517.6 KB 698.9K 1.1K 83

零基础入门Opus5.5做视频,万字拆解AI是如何用代码做视频的【提示词+Skill全开源】

文章系统讲解了如何用 Claude Opus 5.5 通过写代码的方式制作 AI 视频。作者指出 Opus 并不能直接生成视频,而是通过生成网页代码绘制每一帧画面,再截图合成为 MP4。文章详细介绍了七类实现方案:Canvas 2D、HTML/CSS/SVG、WebGL 着色器、Three.js、p5.js、HyperFrames/Remotion 和 Manim,并通过像素巫师、界面动效、游戏史短片、舞蹈视频、AI 发展史等五个案例拆解代码组合方式与提示词设计技巧,附完整提示词和开源 Skill,帮助零基础读者快速上手。

技术 › Claude xilo 2026-09-2932.7 KB 699.1K 2.6K 91

我用 Codex 复现了 Opus 5.5 的动画玩法

作者因 Claude 账号被封,无法使用 Opus 5.5 的代码动画玩法,于是尝试用 Codex 复现该路线:将参考视频交给 Codex 分析画法、编写剧本、拆分镜,最终用 p5.js 和 Canvas 生成动画并导出带中文旁白、配乐的 MP4。作者还将做法整理成开源 Skill(wtt-code-animation-studio),支持剧本编写、十种画风推荐与选择、配音、渲染导出等全流程,并验证了同一角色在扁平、沙画、粒子等画法下的多种组合,以及随机三种风格混合的新故事测试片。

技术 › Codex Wattter 2026-09-2710.7 KB 30.5K 117 82

开源了39种风格视频库后,我学会了如何用Opus5.5稳定出片

作者分享了用 Claude Opus 5.5 通过代码逐帧渲染制作视频的经验,并开源了包含 39 种风格视频样片的 Lemo-opuscar 库。库内包含导演方法(DIRECTOR.md)、技术方法(TECHNIQUE.md)和 39 份风格文档。文章阐述了如何稳定出片的关键:agent 手里要有成熟的方法论,用户需求要说到点上。作者详细讲解了需求表述的六个要点(主题、故事、节奏、导演能力、素材、审阅检验),并提供了万能提示词模板,还针对非 Opus 5.5 用户给出了降低难度、拆分步骤、强弱模型协作等替代方案。

技术 › Claude Lemomo 2026-09-2618.7 KB 157.5K 1.3K 93

Opus 5.5 直出秀到飞边子了

作者分享了使用 Claude Opus 5.5 直出生成程序化动画短片的完整提示词。目标是用代码构建一部 25-30 秒、具备电影质感的全程序化动画短片,串联角色、神经元、三棱镜色散、几何色彩、向日葵、螺旋星系、黑洞、宇宙隧道、地出等多个视觉意象,并要求场景间通过形状渐变、粒子过渡、镜头推进等方式自然形变衔接,形成连贯的意识流。技术栈选用 Vite、TypeScript、Canvas 2D 与确定性时间轴系统,避免 React 与重型依赖,风格为手绘插画质感的科普动画,附完整配色、场景与转场细节规范。

技术 › Claude XiaoLei Liu (@leo_xiaolei) 2026-09-2412.0 KB 77

小白也能看懂:iPhone Duo 网页交互效果是怎么制作的?

作者受苹果 iPhone Duo 官网折叠手机交互动效吸引,借助 Codex 复刻并拆解其实现原理。通过网页源码和网络请求证据,确认核心是实时 3D 渲染(Lotus 架构封装 Three.js),而非视频或图片序列。文章讲解了模型、贴图、场景配置、渲染引擎的组成,滑块 0 到 1 数值如何驱动铰链折叠与运镜,以及弹簧回弹、端点磁吸等物理拟真细节带来的「苹果高级感」,并分享了用 AI 辅助翻源码、复现交互和排错的完整学习方法。

技术 › 前端 卡尔森 2026-09-1013.9 KB 4.2K 18 83

还在用原始对话框?教你用 Obsidian Canvas 与 Agent 协作

本文探讨了传统线性对话框在处理复杂 AI 任务时的局限性,提出了基于 Obsidian Canvas 的非线性协作模式。文章结合学术研究(如 Sensecape、CanvasConvo)和商业产品(如 Copilot Pages、Cursor),展示了如何利用 Canvas 画布作为持久化工作台,让 Agent 理解项目结构而非仅保存聊天记录。作者还介绍了 Obsidian 社区中的 Canvas LLM 和 Cannoli 插件,并总结了如何通过定义颜色、空间和连线规则,实现人与 Agent 在知识库层面的高效协同。

技术 › Agent 阿哲Phil 2026-07-1323.7 KB 55.1K 90