正在加载陈远的个人网站

光棱坦克:用 Web 构建可交互 3D 军械图鉴

以红色警戒坦克为载体,展示 Agent 如何用 Web 组织 3D 视图、标注、状态面板与镜头交互。

Agent 工程前端工程

来源摘录

最近一直在探索 agent 借助 web 技术来表达场景交互的界限在哪里 最后得到的答案是没有界限 光棱坦克,启动! https://t.co/hcutxItqvn

在 X 上查看原视频

深度解析

是什么 这不是单纯把坦克模型放进网页,而是一个以《红色警戒》世界观为语汇的交互式 3D 军械图鉴。左侧用车辆索引建立内容入口,中间用蓝图式视窗承载模型,右侧补充当前对象与遥测,底部提供镜头和图层控制;第三帧进一步展示部件选择与结构说明。

核心设计 作品把“看模型”拆成可理解、可操作的浏览路径:车辆切换负责对象导航,编号引线把三维部件映射到文本标签,正交缩放、预设视角和拖拽环绕降低空间理解成本,Explode、Animate、Static 则把同一资产变成结构讲解、状态展示与动效演示。深蓝网格、细线边框、等宽小字和蓝白对比,统一了技术档案、游戏 HUD 与工程制图的视觉语言。

关键洞察 “没有界限”并非意味着功能堆叠,而是 Agent 可以把叙事、视觉层级和交互状态一起编排成场景。可复用的框架是:对象索引—中心画布—上下文信息—直接操控,让复杂 3D 内容兼具沉浸感与明确任务路径。

边界与风险 难点在性能、移动端可用性、键鼠与触控映射、模型版权及实时数据真实性。若只追求蓝图质感,可能牺牲可读性;还应补充加载失败状态、无障碍语义和低性能设备降级。