
曾几何时,建模工程师非常火,任务量很大,企业想要建模需要很长的实践。众所周知的原因,传统3D建模依赖专业设计师、建模软件与大量调优时间,门槛高、效率低,普通开发者与爱好者很难快速产出高精度3D资产。本文基于腾讯云AISkills生态,手把手讲解如何通过WorkBuddy智能工具联动混元生3D能力,零专业建模基础快速生成高精度美利达自行车3D模型,同时搭配Three.js实现GLB模型在线渲染、动态旋转预览、最后还可以生成一个可以拆解的模型,完整复刻从AI建模到Web端3D展示的全流程,为Web3D开发、数字孪生、虚拟素材制作提供轻量化落地方案。
随着AI生成式技术的全面落地,传统开发模式正在被重构,尤其是3D内容创作领域,长期存在门槛高、周期长、成本高、复用率低的痛点。3D建模需要熟练掌握3ds Max、Blender等专业软件,且模型拓扑结构、纹理贴图、比例校准都需要大量经验积累,对于普通IT开发者、前端工程师、轻量化项目开发者而言,很难快速产出合规、可用的3D数字资产。
腾讯云AISkills是腾讯云推出的AI技能生态服务平台,聚焦降低AI技术落地门槛,整合腾讯全系AI能力、工具组件与开发套件,将复杂的AI模型训练、推理、调用流程封装为标准化、轻量化的可落地技能。平台无需开发者深耕底层算法,通过可视化操作、一键部署、工具联动的方式,即可快速调用文生图、文生3D、智能创作、数据处理等各类AI能力,完美适配个人开发者学习、中小企业轻量化项目落地、行业场景快速迭代等多元化需求。
区别于传统单一AI工具,腾讯云AISkills主打生态化、组合式、低代码特性,支持各类AI技能自由搭配、工具联动,让AI能力不再孤立,能够快速搭建完整的业务流程,大幅降低AI+3D、AI+办公、AI+开发等场景的落地成本。如下所示:

大家可以在SkillHub上找到你感兴趣的场景分类,真的非常丰富,应有尽有,腾讯元AISKILL地址。

依托丰富的AI技能矩阵与灵活的工具联动能力,腾讯云AISkills已覆盖多个主流技术与行业场景,尤其在轻量化数字创作领域优势显著,核心应用场景如下:
混元生3D是腾讯云自研的高精度文生3D/图生3D生成模型,也是AISkills生态中3D创作场景的核心能力,专为轻量化、高效率3D资产生成设计,彻底解决传统AI建模细节模糊、拓扑混乱、纹理失真、模型不可用的痛点。
相较于市面主流3D生成工具,混元生3D具备四大核心优势:
本次实践核心依托混元生3D的文生3D能力,结合WorkBuddy的自动化工具编排,实现无需手动调试、一键生成合规可用的美利达自行车3D模型。

可以看到混元3D技能非常实用,包含了多种驱动方式,以及如何安装SKILL。当然也包括使用WorkBuddy来进行辅助生成。
本次实操全程基于腾讯云AISkills生态,基于本地环境配置,支持在线快速开通、轻量化部署,个人电脑均可流畅运行,以下是完整的环境搭建步骤。
第一步:账号注册与实名认证。登录腾讯云官网,注册个人账号并完成实名认证,腾讯云AISkills与混元生3D服务均需实名认证后才可开通使用,这是后续所有操作的基础。

第二步:进入AISkills技能平台。搜索进入【腾讯云AISkills】控制台,进入技能市场主界面,平台汇总了所有可开通的AI能力。
第三步:开通混元生3D基础服务。在技能市场搜索「混元生3D」,混元生3D,进入服务详情页,阅读并同意服务协议,点击一键开通,开通后自动获得基础调用权限与免费额度,足够完成本次模型生成实操。

第四步:获取密钥凭证。进入腾讯云账号密钥管理页面,获取个人专属 SecretId 与 SecretKey,后续WorkBuddy工具联动、接口调用均需要该密钥完成权限校验,需妥善保存,避免泄露。访问地址。

完成在线服务开通后,需安装对应AISkills技能组件,实现WorkBuddy与混元生3D的能力联动,具体操作如下:
1. 在AISkills控制台左侧菜单栏,进入【技能管理】-【可安装技能】;

在WorkBuddy中可以输入以下提示词,如下图所示:
请根据 https://skillhub.cn/install/skillhub.md,安装 @tencent-adm/hy-3d-generation。稍等片刻后就可以看到安装成功:

2. 筛选并选中「混元生3D联动技能」,点击安装,等待1-2分钟完成技能部署;
3. 安装完成后,需要配置两个重要的值,分别是TENCENTCLOUD_SECRET_ID和TENCENTCLOUD_SECRET_KEY
,命令如下;
$env:TENCENTCLOUD_SECRET_ID = "你的SecretId"
$env:TENCENTCLOUD_SECRET_KEY = "你的SecretKey"4. 绑定权限:将之前获取的腾讯云密钥填入技能配置面板,完成权限绑定,确保工具可正常调用3D生成能力。

除了在线可视化安装技能外,平台支持两种轻量化离线/本地部署模式,适配不同使用场景:

新手用户优先选择在线安装模式,零代码、零配置,快速上手实操。
WorkBuddy是腾讯云AISkills生态下的智能任务助手,核心作用是自动化串联各类AI技能,无需手动操作控制台、无需编写复杂调用代码,通过简单配置即可一键触发混元生3D能力,批量生成、优化3D模型,大幅简化操作流程。
首先完成WorkBuddy本地环境变量配置,实现工具与腾讯云AI服务的权限互通:
1. 下载安装WorkBuddy客户端,支持Windows、macOS双系统,安装完成后使用QQ/企业微信扫码登录,登录账号需与腾讯云实名认证账号一致;
2. 打开系统环境变量配置面板,新增两项核心环境变量,填入之前保存的腾讯云密钥:
3. 保存环境变量并重启WorkBuddy客户端,在客户端内置检测工具中验证环境配置,显示「权限校验通过」即为配置成功;
4. 额外配置模型生成参数:默认模型精度为标准版,可在WorkBuddy设置中开启「高清纹理渲染」,提升美利达自行车模型的细节质感。

接下来就开始使用自然语言来生成自行车模型,看在WorkBuddy中会发生什么:

为保障3D模型生成的精准度,需在WorkBuddy中开通对应创作数据包,适配交通工具类模型生成场景:
1. 进入WorkBuddy客户端【技能中心】,找到已绑定的「混元生3D」技能;
2. 点击【数据包管理】,在官方公共数据包中,点击一键开通数据包,免费额度内可直接启用,开通后自动加载至当前AI生成任务,这大概有100积分,是免费的,一年内有效,大家使用功能基本够了;

3. 输入精准生成Prompt,指导模型生成目标模型,本次实操Prompt如下:
生成一辆高精度美利达山地自行车3D模型,整体比例标准,车架、车轮、变速器、座椅、刹车系统细节完整,
哑光车身纹理,标准骑行姿态,无多余杂物,输出GLB通用格式;4. 在WorkBuddy中点击【一键生成】,等待3-5分钟,模型自动完成结构生成、纹理渲染、格式导出,全程无需人工干预。

通过WorkBuddy+混元生3D生成的美利达自行车3D模型效果优异,完全满足轻量化开发与展示需求:
当然,虽然系统生成了对应的三维模型,但是不能直接打开GLB格式的文件,可以先来看一下照片截图。

虽然这个模型不大,来看一下混元生3D的这一次模型生成耗费了多少:

这一次建模过程,花掉了20积分,虽然效果还行,但是积分消耗挺快的。
在生成GLB格式的美利达自行车模型后,我们为实现Web端可视化展示,计划结合Three.js框架完成模型加载、渲染、动态旋转效果开发,实现浏览器端在线3D预览。继续使用WorkBuddy的设计能力,输入以下提示词:
设计一个Threejs页面,用来展示glb模型腾讯云AI3D场景的轻量化前端开发,简化了Three.js的初始化、场景搭建、模型加载流程,适配AI生成3D模型的快速预览需求,集成步骤如下:
1. 搭建基础前端项目,引入Three.js核心库与GLB加载器,通过CDN快速引入,无需本地复杂配置:
<script src="https://cdn.jsdelivr.net/npm/three@0.158.0/build/three.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three@0.158.0/examples/js/loaders/GLBLoader.js"></script>2. 初始化Three.js基础场景,包含场景、相机、渲染器、灯光四大核心要素,适配网页全屏预览:
// 初始化场景
const scene = new THREE.Scene();
// 初始化相机
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
// 初始化渲染器
const renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
// 添加环境光与平行光,优化模型质感
const light = new THREE.AmbientLight(0xffffff, 0.8);
scene.add(light);3. 通过GLBLoader加载生成的美利达自行车模型,配置加载回调,处理加载成功、失败、加载中状态:
const loader = new THREE.GLBLoader();
loader.load('./merida-bike.glb', (gltf) => {
// 加载成功后将模型加入场景
const bikeModel = gltf.scene;
scene.add(bikeModel);
// 调整相机位置,适配模型展示
camera.position.z = 8;
}, (xhr) => {
// 加载进度监听
console.log('模型加载进度:', (xhr.loaded / xhr.total * 100) + '%');
}, (error) => {
// 加载错误捕获
console.error('模型加载失败:', error);
});为提升在线预览效果,添加自动旋转动画,实现模型360°循环展示,完整动画代码如下:
// 动画渲染函数
function animate() {
requestAnimationFrame(animate);
// 模型Y轴自动旋转
if (bikeModel) {
bikeModel.rotation.y += 0.005;
}
renderer.render(scene, camera);
}
// 启动动画
animate();
// 适配窗口大小变化
window.addEventListener('resize', () => {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize(window.innerWidth, window.innerHeight);
});完成代码部署后,直接打开HTML文件,即可在浏览器中查看自动360°旋转的美利达3D自行车模型,画面流畅、纹理清晰,支持全屏预览、窗口自适应,完美实现Web端轻量化3D展示效果。开发者可基于该基础代码,继续拓展鼠标拖拽旋转、缩放、模型点击交互、材质修改等进阶功能。
功能 | 说明 |
|---|---|
🖱️ 轨道控制 | 左键旋转、滚轮缩放、右键平移(带阻尼,手感顺滑) |
🌐 PBR 环境光 | 用 RoomEnvironment 做 IBL 反射,金属车架/橡胶轮胎质感更真实 |
🔄 自动旋转 | 默认开启,可调速度(0.5–6),交互时自动暂停 |
📐 自动取景 | 加载后自动计算包围盒、居中落到地面、适配相机距离 |
🔲 线框模式 | 一键切换线框,看结构很方便 |
🟦 地面网格 | 可开关的参考网格 + 软阴影 |
📸 保存截图 | 一键导出当前视角 PNG |
🎯 重置视角 | 回到最佳观察角度 |
📂 拖拽替换 | 把任意 .glb/.gltf 拖入窗口即可换模型 |
来看一下以下的效果,是不是特别赞,效果跟真实的自行车非常接近了。

通常三维场景的建模大抵到这里就足够了,GLB文件已经生成,通过Threejs也已经正常展示。那么在一些精细化的场景下,比如需要对模型进行分拆,看看模型是组合组装的,这里演示集中生成场景。
可以基于glb的模型实现车辆的各个部件进行拆解的视图吗来看下系统给出什么回应,如下图:

需要说明的是,使用混元生3D的能力,暂时不具备完全独立能力的组件分拆,因为模型都是通过绘制出来的,但是系统提供了按照车长、垂直和车款三个方向来对模型进行拆分。下面分别来看下实现原理和成果。
模型分解原理如下:

接下来看一下对完全生成的GLB模型的分拆能力展示:



从以上效果图可以看出,针对生成GLB的分拆,相比原生模型的单个零件建模。这里只能按照角度来分拆,仅演示效果。在拆解的过程中还发生了一点小插曲,拆分按钮无法点击:

针对这种问题,WorkBuddy快速的解决了,系统恢复正常。

本次实战完整落地了腾讯云AISkills+WorkBuddy+混元生3D+Three.js的AI 3D建模与Web渲染全流程,全程无需专业3D建模功底、无需高端算力设备,依托腾讯云生态的轻量化能力,快速产出可用的高精度美利达自行车3D模型,并实现网页端在线动态预览。
通过本次实践可以发现,腾讯云AISkills生态的核心价值在于打破技术壁垒、简化落地流程:将原本需要设计师数小时的建模工作,压缩至数分钟完成,同时通过工具联动、标准化格式输出、前端轻量化渲染,实现了从AI创作到Web落地的无缝衔接。
对于IT开发者、前端工程师、技术爱好者而言,这套方案具备极高的复用性,可快速迁移到汽车、家电、道具等各类3D素材制作场景,广泛应用于产品展示、数字孪生、虚拟场景、教学Demo等项目。未来可基于AISkills生态进一步拓展能力,结合AI贴图、AI动画、模型轻量化压缩等技能,打造更完整的AI 3D内容生产流水线。
后续大家可以基于本文教程,自由尝试自定义Prompt生成不同款式、不同配色的美利达自行车模型,结合Three.js拓展更多交互功能,挖掘腾讯云AISkills生态更多轻量化AI落地玩法。
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。