作者: Jared Liu
在线体验 关于项目
Drawing to 3D 把「一张手绘怎么变成 3D 模型」做成了当场可玩的体验：首页三个示例——花瓶、机器人、蘑菇小屋——全部由 Tripo 图生模型从真实手绘稿生成，与原稿并排对照，可拖拽旋转、滚轮缩放。
上传自己的画，通过人机验证后自动进入匿名生成队列：等待时页面播放线稿重建动画，完成即可在线端详白模、下载 GLB；想要 8K 贴图和更高精度，一键带着结果进 Tripo Studio 继续。全站免注册、六种语言、纯静态部署，Tripo 凭证收在 Worker 里不见光。
体验要点
- 花瓶、机器人、蘑菇小屋三个示例全部由 Tripo 从真实手绘稿生成，配原稿对照，可拖拽旋转
- 上传一张手绘（PNG/JPG/WebP），通过人机验证即自动进入匿名生成队列，无需注册
- 等待时播放「线稿到体积」的扫描重建动画，完成即在线旋转白模并下载 GLB
- 每台设备每天一次免费生成；要 8K 贴图和更高精度，一键带着结果进 Tripo Studio
技术解析
示例出件 · Tripo v3 图生模型
三个示例模型用 Tripo API v3 图生模型（v3.1）从原始手绘稿直接生成：开精细几何 + PBR 纹理、5 万面上限，仓库里保留每个任务的 ID、积分消耗与出件文件 SHA-256 作溯源。网页版保留 H 系列几何、只把内嵌纹理从 4096px 降到 2048px——在约 500px 的观察窗里画质不变，纹理显存省约 75%。
匿名生成 · 免注册白模管线
浏览器只持有公开配置，Tripo 凭证全部收在 Cloudflare Worker 调度器里。Turnstile 人机验证加设备指纹换一个匿名额度（每设备每 UTC 日一次）：创建任务 → 上传原图 → 每 4 秒轮询（连续失败指数退避到 30 秒）→ 下载 GLB blob 就地渲染白模；关页时用 sendBeacon 主动弃单，队列租约兜底清理。
等待即剧场 · 裁剪平面重建动画
生成期间不放转圈动画：模型带两份材质，实体材质被一张水平裁剪平面从下往上逐渐揭示，线框材质反向从上往下消隐，橙色扫描环跟着平面同步移动——把「AI 正在从线稿重建体积」直接演出来。感知进度条按任务状态映射区间平滑推进，prefers-reduced-motion 用户则看到静置姿态。
SEO 优先 · 六语言静态站
Next.js 16 全静态输出，英文、繁中、日、韩、西、葡六种语言各自有独立路由、canonical、hreflang 与站点地图条目；所有跳转 Tripo Studio 的链接由同一个模块统一生成 UTM 署名，utm_content 精确到每一个 CTA 或所选示例。
