# 3D 교육자료 — AI 작업 안내 파일

119 소방 AI 스튜디오(https://119-ai-studio.kr)의 '3D 교육자료' 페이지를 AI가 읽도록 글로 옮긴 파일입니다. AI 코딩 도구(Claude Code·Codex)와 Blender 로 소방 3D 교육자료를 만드는 작업 계획과 요청을 쓸 때 씁니다.
화면에서 보기: https://119-ai-studio.kr/fire-3d.html
이 파일: https://119-ai-studio.kr/assets/ai/fire-3d.txt

기준일: 2026-10-25

## 만드는 흐름

AI 코딩 도구에 말로 요청하면 도구가 Blender에서 모형을 만들고 웹 화면 코드도 씁니다. 사람은 만들어진 화면을 보고 고칠 곳을 다시 요청합니다.

1. 요청 — AI 코딩 도구(Claude Code·Codex)에 만들 화면과 근거 자료를 말로 요청합니다.
2. 모형 — AI 코딩 도구가 MCP for Blender를 거쳐 Blender에서 기기 모형을 만듭니다.
3. 3D 화면 — 모형을 웹 화면에 불러와 돌려 보고 누를 수 있는 3D 장면을 만듭니다.
4. 교육자료 — 안내 글을 붙여 브라우저에서 바로 여는 교육자료로 완성합니다.

MCP는 AI 앱을 다른 프로그램과 연결하는 공개 표준입니다. MCP for Blender를 설치하면 AI 코딩 도구가 Blender를 직접 조작합니다. 아래 예제도 Blender와 MCP for Blender를 설치한 뒤 만들었습니다.

## 준비할 도구

- AI 코딩 도구: 말로 요청하면 코드를 쓰고 고치는 AI 도구(Claude Code·Codex 등). 하는 일: Blender 모형 작업, 3D 화면 코드, 안내 글을 만들고 고침
  - Blender를 다루게 하려면 MCP for Blender를 AI 코딩 도구에 연결합니다. 연결 방법은 도구마다 조금씩 다릅니다.
  - 대화가 길어질수록 사용량이 늘어납니다. 아래 '토큰을 아끼는 요령'을 함께 봅니다.
- Blender: 누구나 내려받아 쓰는 공개 3D 제작 프로그램(GPL). 하는 일: 기기 모형을 만듦
  - 여러 번 고칠 모형은 Python 스크립트로 만들게 합니다. 스크립트만 고쳐 다시 실행하면 같은 모형을 얻습니다.
  - 모형을 자세하게 만들수록 파일이 커지고 웹에서 느려질 수 있습니다.
- MCP for Blender: AI 코딩 도구가 Blender를 직접 조작하게 연결하는 공개 도구(MIT). Blender 재단이 만든 것은 아닙니다. 하는 일: AI 코딩 도구의 요청대로 Blender 안에서 모형을 만들고 결과 화면을 확인함
  - 설치는 AI 코딩 도구에 연결하고, Blender 애드온을 설치한 뒤 Blender 설정(Add-ons)에서 켜는 순서입니다. Blender를 열면 연결이 시작됩니다.
  - 업무용 PC에 설치할 때는 기관의 보안 절차를 먼저 확인합니다. Blender 재단이 아닌 외부에서 만든 프로그램입니다.
  - AI가 Blender 안에서 Python 코드를 그대로 실행합니다. 쓰기 전에 작업 파일을 저장합니다.
  - 복잡한 작업은 작은 단계로 나눠 요청합니다.
  - 기본으로 익명 사용 기록(도구 이름·성공 여부·운영체제 등)을 보냅니다. 프롬프트·코드·화면은 사용자가 동의해야 보냅니다.
- three.js: 웹 브라우저에서 3D를 그리는 자바스크립트 라이브러리. 하는 일: 장면·카메라·조명을 그리고 모형 파일을 불러옴
  - three.js 설명서는 모형 형식으로 glTF(.glb)를 권장합니다. 파일이 가볍고 빨리 열립니다.
- React Three Fiber: three.js를 React 화면 부품처럼 쓰게 해 주는 도구. 하는 일: 3D 장면과 학습 패널을 한 앱에서 함께 바꿈
  - 이 예제는 패널(버튼·글)과 3D를 한 화면에서 함께 바꾸려고 썼습니다.
- glTF · GLB: 3D 장면과 모형을 주고받는 공개 파일 형식. 하는 일: Blender에서 만든 모형을 웹 화면으로 옮김
  - .glb는 모양·색·그림을 파일 하나에 담아 옮기기 쉽습니다.
  - 모형 파일이 앱 크기의 대부분을 차지합니다.

## 만드는 순서 — 수신기 한 대를 3D로 만든다면

완성된 예제를 작게 줄인 판을 만든다면 이런 순서로 진행합니다. 단계마다 붙인 요청 예시는 흐름을 보여 주는 견본입니다.

1. 준비 — Blender와 MCP for Blender를 설치하고, AI 코딩 도구(Claude Code·Codex)에 연결합니다. 웹 화면을 만들려면 Node.js도 설치합니다.
2. 빈 장면 — 바닥·조명·카메라만 있는 장면부터 엽니다.
   요청 예시: React Three Fiber로 바닥·조명·돌려 보는 카메라만 있는 웹 앱을 만들어 주세요. 외부 CDN은 쓰지 않습니다.
3. 모형 — Blender에서 기기 모형을 만듭니다. 여러 번 고칠 모형은 Python 스크립트로 만들게 합니다.
   요청 예시: Blender에서 벽에 붙은 P형 수신기를 만들어 웹 화면에 넣어 주세요. 로고·인증 마크는 넣지 않습니다.
4. 동작 — 누르면 반응하게 하고, 판정은 3D 코드와 나눠 시험합니다.
   요청 예시: 감지기를 누르면 화재표시등과 지구표시등 2번이 켜지게 해 주세요. 판정은 따로 함수로 두고 시험을 붙입니다.
5. 안내 — 처음 쓰는 사람을 위해 지금 할 일을 하나씩 보여 줍니다.
   요청 예시: 오른쪽 패널에 지금 할 일 한 가지를 합니다체로 보여 주고, 할 일이 바뀌면 카메라가 그 기기로 옮겨 가게 해 주세요.
6. 확인 — 화면의 수치와 문장을 원문과 맞춥니다. 고칠 곳은 대상과 증상을 적어 다시 요청합니다.

## 요령

- 한 번에 한 단계: 장면 → 모형 → 동작 → 안내 순서로 나눠 요청하고, 단계마다 화면을 열어 확인합니다. 방향이 틀린 채로 오래 진행하면 되돌리는 데 토큰을 더 씁니다.
- 구체적으로 요청: '수신기를 고쳐 줘' 대신 '감지기를 누르면 수신기 앞면 화재표시등이 빨갛게 켜지게'처럼 대상·위치·결과를 적습니다. 도구가 읽는 파일이 줄어듭니다.
- 확인할 것을 함께: 기대하는 결과나 시험, 화면 그림을 요청에 붙이면 도구가 스스로 확인하고 고칩니다.
- 다른 일로 넘어가면 /clear: 요청할 때마다 그때까지의 대화 전체를 함께 보내므로, 대화가 길수록 토큰을 많이 씁니다. 다른 일로 넘어갈 때는 /clear로 새로 시작하고 정한 내용을 한두 줄로 다시 알려 줍니다. 사용량은 /usage로 봅니다.
- 틀리면 바로 멈춤: 엉뚱한 방향으로 가기 시작하면 Esc로 바로 멈추고 다시 요청합니다.
- 반복하는 말은 CLAUDE.md에: 합니다체, 상대경로, 외부 자원 없음처럼 매번 하는 말은 프로젝트의 CLAUDE.md에 적어 둡니다. 꼭 필요한 것만 200줄 안으로 적습니다.
- 모형은 스크립트로: 모형을 Blender 스크립트로 만들게 하면, 고칠 때 큰 모형 파일 대신 짧은 스크립트만 고칩니다.
- 바뀌는 부분은 코드로: 표시등·버튼·화면 글자처럼 상황에 따라 바뀌는 부분은 모형 파일에 넣지 않고 코드로 그립니다. 모형을 다시 만들 일이 줄어듭니다.

## 주의할 점

- 수치와 기준은 원문에서: 설치 기준·수치는 설비별 화재안전기술기준(NFTC) 판본을 찾아 원문을 요청에 붙여 줍니다. AI가 기억으로 쓴 수치는 원문과 다를 수 있습니다.
- 자세할수록 무거워짐: 모형과 장면을 자세하게 만들수록 요청과 수정이 늘어 토큰 비용이 커지고, 모형 파일도 커져 웹에서 열리고 움직이는 속도가 느려질 수 있습니다. 학습에 필요한 부분만 자세히 만듭니다.
- 특정 제품을 닮게 하지 않기: 여러 제품에 공통인 모양만 쓰고 로고·인증 마크·특정 제품의 배치는 넣지 않습니다.
- 외부 프로그램 설치: MCP for Blender 같은 외부 프로그램을 업무용 PC에 설치할 때는 기관의 보안 절차를 먼저 확인합니다. 이 도구는 AI가 Blender 안에서 코드를 실행하고, 기본으로 익명 사용 기록을 보냅니다.
- 같은 요청이라도 결과는 모델 성능·추론 능력·개선 횟수에 따라 달라집니다. 결과 화면을 보고 고칠 곳을 다시 요청합니다.

## 완성된 예제 — 자동화재탐지설비 3D

- 실행: https://119-ai-studio.kr/assets/fire-3d/index.html
- 3D 교육자료 제작 방법을 시험하는 테스트 판입니다. 내용에 오차가 있을 수 있으니 참고용으로만 사용하세요.
- 구성: 건물에 설치된 기기를 차례로 보며 역할과 설치 기준을 익힙니다.
- 신호 흐름: 불이 난 순간부터 경종이 울릴 때까지 신호가 가는 길을 따라갑니다.
- 경보 조치: P형 1급과 R형 수신기 가운데 하나를 골라 경보 상황에서 조치합니다.
- 수신기 점검: 동작시험·도통시험·예비전원시험을 하고 숨은 결함을 찾습니다.