跳到正文
rewind· 来源· @rewind02 · X·· 3 小时前精选AI 评分75
推荐理由

原文拆解了从场景搭建到着色器实现的完整工作流,提供了可复用的技术路径。

正文 · AI 翻译

使用 Claude Fable 5.2 + Three.js 构建一个可步行的油画世界...

关键在于用笔触绘制世界,而不是对成品画面进行滤镜处理

以下是工作流程:

  • 步骤 1:Fable 5.2:提示它设置一个包含第三人称摄像头的 three.js 0.186 + WebGL2 场景
  • 步骤 2:Rapier:添加在地形上行走、冲刺和跳跃的物理效果
  • 步骤 3:MakeHuman:从 Patch Starter Kit 中放入基础角色模型
  • 步骤 4:Quaternius 动画库 + Patch 剪辑:添加待机、行走、奔跑和跳跃动作
  • 步骤 5:Fable 5.2 + 自定义 GLSL 着色器:将每个物体转化为带有 3 种绘画颜色的笔触
  • 步骤 6:GLSL 着色器:添加光照、雾效、飘落的雪花以及发光的极光
  • 步骤 7:Fable 5.2:用笔触构建雪岭、云杉和木屋
  • 步骤 8:http://patch.gg:发布可玩演示和开源代码

各部分职责分工:

Fable 5.2:编写场景和着色器
Three.js:在浏览器中渲染
GLSL 着色器:实现油画外观
Rapier:物理引擎
MakeHuman + Quaternius:角色及其动画
Patch gg:发布平台

笔触顺序绝不能依赖于摄像头。如果依赖,当你移动时,颜料就会爬行

来源:rewind · x.com