콘텐츠로 이동

1차시: 첫 번째 3D 세계 만들기 - 환경 설정부터 구(sphere) 띄우기까지

⏰ 50분 · VPython 환경 설정 · 3D 좌표계 · 기본 객체 생성 · 난이도 ●○○○○

학습목표: VPython 개발 환경을 설정하고, 3D 좌표계를 이해하며, sphere와 box 객체를 코드로 생성할 수 있다.

오늘의 질문: "파이썬 코드 단 3줄로 눈앞에 떠 있는 3D 공을 만들 수 있다면, 믿으시겠습니까? 🏀"


🎯 핵심 주제 카드

🧠 3D 좌표계 이해

화면 속 3D 공간의 x, y, z 축이 무엇인지 파악하고, 원하는 위치에 객체를 배치하는 방법을 배웁니다.

💻 VPython 객체 생성

sphere(), box() 등 기본 3D 객체를 코드로 직접 만들고, 색상·크기·위치를 바꿔보며 3D 세계를 구성합니다.


⏱️ 수업 흐름

🚪 도입 — VPython이 뭐예요? (5분)

VPython의 정체와 오늘 만들 결과물을 미리 살펴봅니다. "코드 3줄로 3D 공 만들기"라는 목표를 확인하고 동기를 부여합니다.

🔧 환경 설정 — 내 컴퓨터에서 VPython 실행하기 (10분)

Web VPython 또는 로컬 VPython 3.2 설치 중 하나를 선택하여 환경을 설정합니다. 자주 발생하는 오류를 함께 해결합니다.

🌐 핵심 개념 1 — 3D 좌표계 이해하기 (10분)

VPython의 x, y, z 좌표축 개념을 일상 비유로 배우고, vector()를 활용하여 위치를 지정하는 방법을 익힙니다.

🔨 핵심 개념 2 — 첫 3D 객체 만들기 (20분)

sphere()부터 시작하여 점진적으로 코드를 발전시킵니다. box()도 추가하고, 에러를 직접 만나보며 디버깅 감각을 익힙니다.

📝 마무리 — 성찰 & 평가 (5분)

오늘 배운 내용을 점검하고, 다음 차시에 배울 내용을 미리 엿봅니다.


🚪 도입 — VPython이 뭐예요?

여러분, 혹시 게임 속 3D 캐릭터가 어떻게 화면에 나타나는지 궁금했던 적 있나요? 🎮

그 뒤에는 항상 3D 그래픽 엔진이라는 것이 있습니다. 하지만 유니티(Unity)나 언리얼(Unreal) 같은 도구는 너무 복잡하죠.

VPython은 파이썬으로 3D 객체를 만들 수 있는 가장 쉬운 도구입니다. 원래 물리학 시뮬레이션을 위해 만들어졌지만, 우리는 이것을 활용해서:

  • 🏀 3D 공이 바닥에 튕기는 애니메이션
  • 🌍 지구와 달의 공전 시뮬레이션
  • 🎯 화살표와 힘 벡터의 시각화

같은 것들을 파이썬 코드 몇 줄로 만들 수 있습니다.

오늘의 목표는 소박하지만 강력합니다:

"코드 3줄로 화면에 3D 공 하나 띄워보기"

이것이 되면, 다음 차시부터는 이 공을 움직이고, 색을 바꾸고, 충돌시키는 것까지 나아갈 수 있습니다. 시작해 볼까요? 🚀


🔧 환경 설정 — 내 컴퓨터에서 VPython 실행하기

두 가지 선택지

VPython을 실행하는 방법은 크게 두 가지입니다. 아래 표를 보고 자신에게 맞는 방법을 선택하세요.

구분 🌐 Web VPython (권장) 💻 로컬 설치 (VPython 3.2)
주소 webvpython.org 터미널에서 pip 설치
장점 설치 없이 즉시 사용 가능 인터넷 없이도 사용 가능
단점 인터넷 필요 설치 과정에서 오류 가능
추천 대상 처음 시작하는 학습자 이미 파이썬 환경이 갖춰진 학습자

방법 A: Web VPython (가장 빠른 시작 🏃‍♂️)

1단계: 웹 브라우저에서 webvpython.org에 접속합니다.

2단계: 화면 상단의 에디터 창에 아래 코드를 입력합니다.

⚠️ Web VPython에서는 from vpython import * 대신 첫 줄에 Web VPython 3.2라고 작성합니다!

Web VPython 3.2
# Web VPython에서는 이 한 줄이 import 역할을 합니다
sphere()

3단계: Run this program 버튼을 클릭합니다.

화면에 하얀 공이 하나 나타나면 성공입니다! 🎉

방법 B: 로컬 설치 (VPython 3.2)

이미 파이썬이 설치되어 있다면, 터미널(명령 프롬프트)에서 아래 명령어를 실행합니다.

pip install vpython

설치가 완료되면, .py 파일을 만들어 아래 코드를 작성하세요.

from vpython import *
# 로컬 환경에서는 반드시 이 import 문이 필요합니다
sphere()

실행하면 웹 브라우저가 자동으로 열리면서 3D 화면이 나타납니다.

💡 이후 모든 예제 코드는 로컬 환경(from vpython import *) 기준으로 작성합니다. Web VPython 사용자는 첫 줄을 Web VPython 3.2로 바꾸고, from vpython import * 줄은 삭제하면 됩니다.

🛠️ 트러블슈팅 FAQ

설치 과정에서 문제가 생겼나요? 당황하지 마세요. 아래는 자주 만나는 오류와 해결법입니다.

증상 원인 해결 방법
ModuleNotFoundError: No module named 'vpython' vpython 패키지가 설치되지 않음 pip install vpython 실행
pip을 찾을 수 없다는 메시지 pip 경로가 설정되지 않음 python -m pip install vpython 시도
설치 중 빨간 에러 가득 C++ 빌드 도구 부족 (Windows) pip install --upgrade pip 후 재시도, 또는 Web VPython 사용
브라우저가 열리는데 화면이 검은색 브라우저 WebGL 미지원 Chrome 또는 Edge로 변경
Web VPython에서 import 에러 from vpython import *를 Web VPython에서 사용 첫 줄을 Web VPython 3.2로 변경

🤝 선배 개발자 팁: 환경 설정은 프로그래밍에서 가장 짜증나는 단계입니다. 여기서 막힌다고 실력이 부족한 게 아닙니다. 프로 개발자도 새 도구 설치할 때마다 고생합니다. 포기하지 마세요!


🌐 핵심 개념 1 — 3D 좌표계 이해하기

🏠 일상 비유로 시작하기

여러분이 친구에게 "교실 안에서 내 자리가 어디인지" 설명한다고 생각해 보세요.

  • "출입문에서 오른쪽으로 3걸음" → 이것이 x축 (좌우)
  • "바닥에서 위로 1.5미터" → 이것이 y축 (상하)
  • "칠판에서 뒤쪽으로 4걸음" → 이것이 z축 (앞뒤·깊이)

3D 공간에서 어떤 위치를 표현하려면, 이 세 가지 방향의 숫자가 모두 필요합니다. 이것을 3D 좌표계라고 합니다.

📐 VPython의 좌표계 정의

VPython에서 사용하는 좌표계는 오른손 좌표계(Right-Hand Coordinate System)입니다.

방향 양(+)의 방향 음(-)의 방향
x축 좌우 오른쪽 → ← 왼쪽
y축 상하 위쪽 ↑ ↓ 아래쪽
z축 앞뒤 화면 밖(나를 향해) ● 화면 안쪽 ○

💡 오른손 법칙: 오른손 엄지가 x축(→), 검지가 y축(↑), 중지가 z축(화면 밖)을 가리킵니다. 나중에 벡터 외적을 배울 때 다시 만나게 됩니다!

아래 다이어그램은 VPython의 3D 좌표계 구조를 보여줍니다.

flowchart LR O["원점<br/>(0, 0, 0)"] -->|"x+ (오른쪽)"| X["x축"] O -->|"y+ (위쪽)"| Y["y축"] O -->|"z+ (화면 밖)"| Z["z축"]

🎯 좌표를 코드로 표현하기: vector()

VPython에서 위치를 지정할 때는 vector(x, y, z) 또는 줄여서 vec(x, y, z)를 사용합니다.

from vpython import *

# 원점: 화면 정중앙
원점 = vector(0, 0, 0)

# 오른쪽으로 3칸 이동한 위치
오른쪽 = vector(3, 0, 0)

# 위로 2칸, 오른쪽으로 1칸 이동한 위치
대각선 = vector(1, 2, 0)

print(원점)
print(오른쪽)
print(대각선)
<0, 0, 0>
<3, 0, 0>
<1, 2, 0>

위 코드에서 주목할 점:

  • 2번째 줄 vector(0, 0, 0)이 바로 원점(origin), 즉 3D 공간의 정중앙입니다.
  • 5번째 줄 vector(3, 0, 0)에서 첫 번째 숫자 3만 바뀌었죠? x축 방향으로만 이동한 것입니다.
  • VPython은 한글 변수명도 지원합니다! (하지만 실무에서는 영문을 추천합니다)

🔑 핵심 정리: vector(x, y, z)는 3D 공간의 "주소"입니다. 마치 "서울시 강남구 역삼동"처럼, 세 개의 숫자로 공간 속 정확한 위치를 표현합니다.


🔨 핵심 개념 2 — 첫 3D 객체 만들기

드디어 3D 객체를 만들 시간입니다! 완성 코드를 바로 보여드리지 않겠습니다. 함께 한 줄씩 발전시켜 봅시다. 💪

📌 v1: 가장 기본적인 공 — 코드 2줄

실행 환경: Python 3.x + VPython 3.2 (또는 Web VPython 3.2)

from vpython import *  # <- 여기가 [모듈 import] — 3D 도구 상자를 여는 것
sphere()               # <- 여기가 [객체 생성] — 기본 구(sphere)를 하나 만듦

실행 결과: 화면 정중앙에 하얀색 공이 하나 나타납니다.

여기서 잠깐! 이 2줄의 코드를 파이썬 문법 관점에서 분석해 봅시다.

  • 1번째 줄 from vpython import *은 여러분이 이미 배운 모듈 import입니다. vpython이라는 모듈에서 모든 것(*)을 가져옵니다.
  • 2번째 줄 sphere()함수 호출입니다. sphere라는 함수를 괄호 ()와 함께 호출하면, VPython이 3D 공을 만들어 줍니다.

💡 *로 전부 가져오는 것은 일반적인 파이썬 프로젝트에서는 권장되지 않지만, VPython처럼 시각화 전용 라이브러리에서는 편의를 위해 흔히 사용합니다. 이유는 sphere, box, color, vector 등 수십 개의 이름을 매번 vpython.sphere()로 쓰면 코드가 길어지기 때문입니다.

아래는 파이썬 코드가 3D 화면으로 변환되는 과정입니다.

flowchart LR A["from vpython import *<br/>모듈 가져오기"] --> B["sphere&#40;&#41;<br/>객체 생성 명령"] B --> C["VPython 엔진<br/>3D 렌더링"] C --> D["🖥️ 웹 브라우저<br/>3D 화면 출력"]

📌 v2: 위치와 크기 지정하기

기본 공이 너무 심심하죠? 이번에는 위치(pos)반지름(radius)을 지정해 봅시다.

v1에서 바뀐 점: sphere() 안에 posradius 매개변수 추가

from vpython import *

# 공의 위치를 오른쪽으로 2칸, 반지름을 0.5로 지정
sphere(pos=vector(2, 0, 0), radius=0.5)  # <- 여기가 [매개변수를 통한 속성 지정]

실행 결과: 화면 중앙에서 오른쪽으로 이동한 작은 공이 나타납니다.

코드를 분석해 봅시다:

  • pos=vector(2, 0, 0)pos는 position(위치)의 약자입니다. 아까 배운 vector()로 좌표를 지정합니다.
  • radius=0.5radius는 반지름입니다. 기본값은 1이므로, 0.5로 지정하면 절반 크기가 됩니다.

여기서 posradius는 파이썬의 키워드 인자(keyword argument)입니다. 함수를 배울 때 def 함수이름(매개변수=기본값) 형태를 보셨죠? VPython의 sphere() 함수도 같은 원리입니다.

📌 v3: 색상 입히기

v2에서 바뀐 점: color 매개변수 추가

from vpython import *

# 빨간색 공을 오른쪽 위에 배치
sphere(
    pos=vector(2, 1, 0),      # x=2(오른쪽), y=1(위쪽)
    radius=0.5,                # 반지름 0.5
    color=color.red            # <- 여기가 [색상 지정] — VPython 내장 색상 사용
)

실행 결과: 화면 오른쪽 위에 빨간색 공이 나타납니다.

color.red가 약간 신기하죠? VPython에서 자주 쓰는 내장 색상을 정리해 봅시다.

코드 색상 RGB 값
color.red 🔴 빨강 (1, 0, 0)
color.green 🟢 초록 (0, 1, 0)
color.blue 🔵 파랑 (0, 0, 1)
color.yellow 🟡 노랑 (1, 1, 0)
color.white ⚪ 흰색 (1, 1, 1)
color.orange 🟠 주황 (1, 0.6, 0)
color.cyan 🩵 시안 (0, 1, 1)
color.magenta 🩷 마젠타 (1, 0, 1)
vector(R, G, B) 커스텀 0~1 사이 값

💡 일반적인 RGB는 0~255 범위를 쓰지만, VPython은 0~1 범위를 사용합니다. 예를 들어, 연한 하늘색은 vector(0.5, 0.8, 1.0)처럼 표현합니다.

📌 v4 (최종): 여러 객체 함께 놓기 — sphere + box

드디어 최종 버전입니다! 이번에는 공과 상자를 함께 만들어 봅시다.

v3에서 바뀐 점: box() 객체 추가, 변수에 객체 저장

from vpython import *

# 장면(scene) 제목 설정 — 브라우저 탭 아래에 표시됩니다
scene.title = "나의 첫 번째 3D 세계 🌍"
scene.background = color.black  # 배경을 검은색으로 변경

# 빨간 공 만들기 — 변수에 저장하면 나중에 이 공을 조작할 수 있습니다
my_ball = sphere(
    pos=vector(-2, 1, 0),   # 왼쪽 위에 배치
    radius=0.7,
    color=color.red
)

# 초록 상자 만들기
my_box = box(
    pos=vector(2, -1, 0),   # 오른쪽 아래에 배치
    size=vector(1, 1, 1),   # <- 여기가 [box의 크기 지정] — (가로, 세로, 깊이)
    color=color.green
)

# 파란 공 하나 더!
small_ball = sphere(
    pos=vector(0, 0, 0),    # 정중앙
    radius=0.3,
    color=color.cyan
)

실행 결과: 검은 배경 위에 빨간 공(왼쪽 위), 초록 상자(오른쪽 아래), 시안 공(정중앙) 총 3개의 객체가 나타납니다.

여기서 꼭 알아둘 점들:

  • 4번째 줄 scene.title은 3D 장면(scene) 자체의 속성을 바꾸는 것입니다. scene은 VPython이 자동으로 만들어주는 캔버스(화면) 객체입니다.
  • 8번째 줄 my_ball = sphere(...)처럼 변수에 저장하면, 나중에 my_ball.pos = vector(0, 0, 0)처럼 공의 위치를 바꿀 수 있습니다. 2차시에서 애니메이션을 만들 때 이 변수가 핵심이 됩니다!
  • 17번째 줄 size=vector(1, 1, 1)은 box 전용 속성입니다. vector(가로, 세로, 깊이) 순서로 크기를 지정합니다. sphere의 radius와는 다른 방식이죠.

sphere와 box의 차이를 정리하면 다음과 같습니다.