零基础靠AI硬肝！我从零做出一款AI建筑3D建模桌面工具｜可无脑复刻

前言

先说实话：我不算会编程，更不懂什么3D图形学。

之前一直觉得 Three.js、Electron、AI 建模这些东西门槛超高，只有专业开发才能做。但这次我全程靠AI辅助，一点点摸索、试错、调整，硬生生从零落地了这款AI建筑参数化建模桌面工具。

不用手写复杂底层代码、不用啃专业技术文档，纯靠思路拆解+AI帮忙写代码，就实现了「输入一句话，自动生成3D建筑场景」的功能。

这篇文章纯粹分享我一个零基础小白的完整踩坑过程、搭建思路、懒人复刻方法。大家跟我一样零基础的，照着步骤来，也能完整做出来。

一、我为什么想做这个工具？（纯小白真实想法）

1. 我踩过的建模坑

之前想做点简单的3D建筑效果图、可视化场景，试过几款主流建模软件，真的越用越崩溃：

• 软件超级笨重，功能太多太复杂，根本学不会
• 想简单建一栋楼，要调一堆看不懂的参数，耗时巨久
• 网上找的模型，导入后适配不了Three.js，还要二次修改
• 完全没法用大白话、自然语言直接生成想要的建筑

我只是想要一个简单、轻量化、输一句话就能出模型的小工具，仅此而已，市面上的工具都太“重”了。

2. 我的小目标

所以我就想着，靠AI自己搭一个专属小工具，满足自己的简单需求：

• 不用会建模、不用会写复杂代码，文字描述就能生成3D建筑
• 做成桌面软件，本地打开就能用，不用依赖网页
• 结构简单，后续想加道路、地形功能也能自己慢慢改
• 生成的模型能直接导出复用，不用二次折腾

二、零基础小白的项目规划思路

我一开始完全不知道从哪下手，没有直接瞎写代码，而是让AI帮我梳理了整套流程，把大项目拆成小任务，普通人也能看懂、落地。

1. 为什么选这些工具？

• Electron：最香的一点！不用学专门的桌面开发，前端技术就能做电脑软件，对新手极度友好
• React+TS：网上教程多，AI适配度高，能减少很多莫名其妙的报错
• Three.js：做网页3D最通用的工具，生态成熟，就算不懂原理，AI也能帮我们实现功能
• Vite：启动快、不卡顿，打包不容易报错，比老工具省心太多
• DeepSeek API：免费好用、响应快，最关键的是新手好接入，而且刚更新的VV版本，速度更快、性价比更高，完全够用

2. 我的四步落地流程

怕自己做乱，我把整个项目拆成了四个简单步骤，零基础复刻直接按这个顺序来，绝对不会乱：

1. 搭架子：先把项目基础框架、文件目录建好，打好地基
2. 接AI接口：打通AI对话能力，让AI能看懂我们的文字描述
3. 做3D渲染：实现核心功能，让文字描述能变成真实的3D模型
4. 优化完善：修bug、加小功能，让软件更好用

三、一步步复刻！小白零门槛搭建全过程

下面所有步骤，都是我自己摸索出来的，全程AI辅助，没有任何高深操作，普通人跟着一步步敲就能成。

步骤一：初始化项目，搭建基础框架

1. 核心命令（直接复制粘贴用）

不用懂原理，复制下面几行命令，依次执行就能装好项目、启动程序：

# 安装全局依赖
npm install

# 启动开发调试环境
npm run electron:dev

# 项目打包生成桌面端安装包
npm run electron:build

2. 统一文件目录（避免越写越乱）

我刚开始最怕文件乱七八糟，后面改都改不了。于是直接让AI帮我整理了一套规整的目录，大家复刻直接照搬，超级省心：

├── electron/              # 桌面程序核心配置
│   ├── main.ts           # 程序启动入口
│   └── preload.ts        # 页面和程序的通信桥梁
├── src/
│   ├── components/       # 软件页面上的按钮、弹窗、3D画布
│   ├── engines/          # 3D模型生成核心工具
│   ├── services/         # AI接口对接代码
│   ├── types/            # 基础规则配置
│   ├── utils/            # 通用小工具方法
│   ├── styles/           # 软件样式
├── docs/                 # 项目说明文档
└── package.json

简单说就是：不同功能放不同文件夹，后续想加新功能，不用改动之前的代码。

步骤二：对接AI功能（最关键、最简单的一步）

这个项目最核心的不是3D画面，而是让AI听懂我们的大白话，自动转换成建模能用的参数。

1. 配置AI密钥（零基础必看）

我不想把工具做成只能我自己用的版本，所以做了自定义密钥配置功能，所有人都能自己用：

1. 在软件右上角做一个API配置弹窗
2. 输入自己的DeepSeek密钥，点击测试连接
3. 保存后就能正常使用AI生成功能，本地缓存不用重复填

密钥获取超级简单：直接去 DeepSeek平台密钥页 注册账号，免费生成专属Key就行。平台最新的V4版本，推理速度更快、成本更低，对我们这种个人自用项目特别友好。

2. 调教AI话术（效果好坏全靠它）

很多人用AI做项目效果差，不是能力不够，是没说清楚需求。

我自己摸索出一个简单话术逻辑，专门适配建模场景：

• 让AI只解析建筑楼层、窗户、材质、道路这些有用的参数
• 强制让AI返回规整的JSON格式，不输出废话文字
• 我描述模糊的时候，让AI自动补全默认参数，避免生成失败

就这一步，实现了「我们随便说大白话，AI自动转成建模数据」的核心能力。

步骤三：搞定3D建模渲染（AI帮我攻克的难点）

说实话，Three.js的几何计算、光影、坐标这些东西，我完全看不懂，全程靠AI帮忙写代码。

1. 我的懒人开发思路

分享我最实用的办法：复杂代码让AI写，我只负责检查、微调、看效果

• 让AI单独写建筑生成代码，专门负责建楼层、窗户、屋顶
• 写一个统一工具，接收AI解析好的参数，自动生成模型
• AI生成的画面比较粗糙，我手动调一下光影、材质，让效果更好看

2. 基础交互功能

软件必备的操作功能，我全部让AI一键生成，不用自己研究：

• 左键拖拽旋转视角、右键平移、滚轮缩放画面
• 可以选中、删除单个模型，也能一键清空整个场景
• 一键重置视角，不怕画面乱掉

步骤四：简单优化，完善工具体验

核心功能做完后，我简单加了一些小优化，让工具更好用：

• 做了深色/浅色双主题，长时间看屏幕不刺眼
• 增加报错提示、加载提示，不会一脸懵不知道哪里错了
• 提前预留了道路、地形、水体功能位置，后续可以慢慢更新

四、零基础用AI做项目的真实经验（纯个人踩坑总结）

做完这个项目，我最大的感受就是：不会编程，真的可以靠AI做落地项目，分享几个我最实用的小白经验：

1. 看不懂的技术逻辑，全部丢给AI

Three.js图形计算、代码公式这些，不用逼自己看懂、学会。我们只需要告诉AI「我要实现什么效果」，让它写好可直接用的代码，我们负责拼接、测试、微调就行。

2. 先搭好框架，再写代码

我最开始差点翻车，想到啥写啥，文件乱成一团。后来先让AI帮我搭好整体架构和目录，再一点点填功能，全程没有重构、没有返工，新手一定要记住这一点。

3. 报错不用慌，直接复制给AI

我全程遇到的所有报错：界面乱了、模型出不来、接口连不上，全部都是复制报错内容发给AI，基本都能一键解决，不用自己啃文档瞎排查。

4. AI负责能用，我们负责好用

AI写的代码能实现功能，但效果一般比较粗糙。我的经验是：不用改底层代码，只微调样式、光影、交互细节，就能让项目质感提升很多，省时又省力。

5. 代码分层写，后续随便改

把AI接口、建模功能、页面样式分开写，现在用的DeepSeek模型，以后想换其他AI，只改一小部分代码就行，不用整个项目重写。

五、超简复刻流程

不想看长篇内容的，直接按这个最简步骤做，百分百能成：

1. 搭建Electron+React项目，整理好文件目录
2. 安装所需依赖，配置基础运行环境
3. 对接DeepSeek API，做好密钥配置功能
4. 搭建Three.js画布，实现基础视角操作
5. 设置AI解析话术，实现文字转建模参数
6. 接入建筑生成代码，完成核心建模功能
7. 微调界面和效果，修复小bug
8. 按需拓展道路、模型导出等新功能

六、后续可以继续玩的拓展功能

目前工具已经能用，后续我也会慢慢更新，零基础朋友也可以跟着迭代玩：

• 新增道路、桥梁、山水地形的自动生成
• 做可视化参数面板，拖动滑块就能改建筑样式
• 支持模型导出，随便用在自己的视频、Demo里
• 增加场景保存、预制建筑模板，不用重复生成