在这里我们介绍RPDC吊卡玩具店项目是如何落地的，主要使用了WebGL技术，项目实现经历了很多挑战，因此我们将主要流程记录在这里，供大家参考。

👀阅读预警：

本文精简了3D相关概念，建议有3D经验的设计师和研发小伙伴观看。

项目如何落地

实现方案的选择

本项目属于3D创意H5，交互复杂且3D场景较多。做完基本交互框架后，第一版本我们考虑用WebP、mp4 的方式实现。不过实现技术复杂，相关资源很多。

△Webp、Mp4实现方案的资源预估

并且在之前**小红书成长体系(RED CLUB)**项目中研发和设计侧已经总结一套WebGL项目的模型制作交付流程。基于此我们考虑用WebGL实现。

引擎的选择

我们考虑了一些WebGL引擎，最终选择了微软的 babylon.js 。

△调研使用后对各引擎的对比参照

3D侧设计落地流程