客户常说：“做个 3D 页面，让访客自己换颜色、改尺寸就行。”听起来像几个按钮，做起来却像给产品装了一套线上选装系统。尺寸一改，支架可能不匹配；材质一换，成本也跟着走；客户点完以后，销售还得知道这套方案到底由哪些部件组成。
我做 3D产品配置器 时，会先把模型、选项规则和报价方式捋清楚。顺序不能乱，少一张资料表，后面就可能多几轮返工。
先确定是展示页面还是在线选装
标准产品只需要旋转、缩放、看细节，可以参考 Web3D网站开发 的做法，把模型放进产品详情页。
定制家具、灯具、户外用品和汽车配件就不同了。客户会选尺寸、颜色、配件，最好还能看到一份预计价格。这已经是 3D在线配置器，需要把选项保存下来，再交给询盘表单、CRM 或 Shopify 购物车。
模型要为网页重新整理
客户给来的文件可能是 CAD、FBX、OBJ，也可能只有几张手机照片。源文件不能直接塞进网页，面数太多会卡，贴图太大又拖慢加载。
通常要先减面、整理材质、压缩贴图，再导出 GLB 或 glTF。部件也要拆开并命名。一张桌子可以分成桌面、桌腿、抽屉和拉手；一盏灯则把灯罩、灯杆、底座分开。前端找得到部件，后面换颜色和配件才不会“牵一发，动全身”。
没有现成模型不代表做不了。多角度照片、长宽高、孔位、颜色样本和材质细节，都能给建模师当依据。资料越清楚，模型确认得越快。
配置规则最好先做成表
我会让客户用 Excel 列一张规则表。开发人员照着实现，销售也能一起核对：
| 选项 | 页面变化 | 业务规则 |
|---|---|---|
| 颜色 | 替换部件材质 | 标准色、加价色、停产色 |
| 尺寸 | 修改参数或比例 | 最小值、最大值、步进 |
| 配件 | 显示或隐藏部件 | 必选、互斥、依赖 |
| 数量 | 更新价格和交期 | 起订量、阶梯价、库存 |
壁挂支架和落地底座不能同时选，页面就直接把冲突项置灰，顺手写明原因。客户不用反复试错，销售收到的询盘也更干净。
颜色、尺寸和配件要一起变化
颜色切换不是单纯换色块。木纹、喷涂、金属拉丝、透明亚克力，使用的贴图和材质参数各不相同。网页色卡只能参考，实物仍要以样品为准。
尺寸输入要有上下限。宽度填 9999mm 时，模型不能被拉长后还显示一个正常报价。若尺寸会影响承重、包装或运输，系统应提示人工确认。
配件还有兼容关系。某个电机只能配指定尺寸的柜体，换了底座后脚轮可能要取消。这些判断放在配置器里，客户当场就能发现问题。
报价规则放后台更好维护
参考价可以按这个方式算：
基础价格 + 尺寸差价 + 材质差价 + 配件价格 - 数量折扣 = 预计价格
小项目放在前端计算没问题。正式业务更适合让后台或报价接口返回结果，销售调整汇率、运费和批量折扣时，不必重新发布网页。
外贸订单还可能有税费、运输地区和认证要求。页面写“预计价格”更合适，最终金额再由销售确认。客户提交配置后，系统可以保存 SKU、选项编码、数量、地区和时间，销售打开询盘就能还原整套方案。
平台不同，接法也不同
Shopify 常见做法是把配置结果写入商品变体或购物车属性；WordPress 则在产品页嵌入 Web3D 组件，把数据发到表单或 CRM。需要复杂选配逻辑的企业，可以看看 3D产品定制系统 和 Web3D项目开发。
璇玑动画接项目时，会先确认客户的平台、模型资料和销售流程，再决定使用嵌入式组件还是定制开发。先把数据怎么走说清楚，后面的维护会省很多事。
上线前，按客户的手点一遍
我会用手机走一次完整流程：换颜色、改尺寸、添加配件、取消冲突选项，然后提交询盘，检查销售收到的字段是不是齐全。
模型加载速度、浏览器兼容、异常输入和断网重连也要测。先选一款组合最多的产品做样板，跑通以后再扩展到其他产品线。
常见问题
1. 没有 3D 模型，还能做产品配置器吗？
可以。提供多角度图片、尺寸、孔位和材质信息，建模师就能制作网页用的 GLB 模型。若产品结构复杂，最好再补充拆解图或 CAD 文件。
2. 3D 配置器能直接显示最终成交价吗？
能不能直接显示，要看业务规则。税费、运费、汇率和定制工艺经常变化，页面显示预计价格更稳妥，最终报价交给后台或销售确认。
3. Shopify 一定要开发独立系统吗？
不一定。选项较少时，可以用商品变体和购物车属性承载配置结果；如果涉及复杂互斥规则、动态报价或 BOM，就需要定制接口或独立配置模块。
3D产品配置器连接了模型、产品规则和报价流程。客户选得明白，销售接得住，页面才不只是一个会旋转的模型。
