사이트 주소 하나 줬더니
3D 우주가 됐다

주소만 바꿔서 그대로 쓰시면 됩니다

먼저 둘러보세요

아래 화면이 실제로 만들어진 3D 우주입니다. 저절로 행성 사이를 날아다니고, 행성에 도착하면 그 행성에 붙은 글·앱 카드가 뜹니다. 카드의 버튼을 누르면 실제 글로 갑니다.

글 안에서는 페이지가 잘 내려가도록 확대와 손가락 끌기를 꺼 두었습니다. 마우스로 끌어서 돌려 보고 확대하려면 전체 화면으로 여세요. 오른쪽 위 EN 버튼을 누르면 영어로 바뀝니다.

🔇 소리 켜기를 누르면 행성 사이를 날아갈 때 로켓 소리가, 행성에 도착하면 짧은 종소리가 납니다. 소리는 음원 파일 없이 브라우저에서 바로 만들어집니다.

영상으로 보기

만드는 과정을 33초 쇼츠로 정리했습니다.

실제로 쓴 프롬프트

이 프롬프트를 클로드에 그대로 넣었습니다. [사이트 주소] 부분만 내 주소로 바꾸세요.

내 웹사이트 [사이트 주소]를 먼저 둘러보고, 사이트에 있는 실제 글과 앱으로 3D 우주 공간을 만들어줘.
1. HTML 파일 하나로, Three.js로 태양·행성·블랙홀을 그려줘
2. 행성마다 내 사이트 글이나 앱을 하나씩 붙이고, 도착하면 제목·한 줄 설명·링크 카드가 뜨게 해줘
3. 카메라가 행성 사이를 자동으로 날아다니고, 마우스로 끌어서 둘러볼 수도 있게 해줘
4. 세로 화면(쇼츠)에서도 행성이 잘리지 않게 해줘

• 더 실감 나게 — 다 만들어지면 한 번 더 이렇게 말하세요: "행성에 NASA 행성 사진을 입혀줘"
• 우주 사이트가 아니라면 — '태양계' 대신 '박물관 전시실'이나 '작은 도시'로 바꿔서 요청하세요. 글이 전시품이나 건물이 됩니다.

어떻게 만들어졌나

클로드가 사이트를 먼저 둘러보고, 글 724편과 무료 앱 32개 중에서 9곳을 골라 태양부터 블랙홀까지 순서대로 놓았습니다. 태양에는 태양 주기 글과 앱, 지구에는 낮달 글, 목성에는 스윙바이 시뮬레이터가 붙는 식입니다.

결과물은 HTML 파일 하나입니다. 3D는 Three.js라는 무료 라이브러리로 그려서, 따로 설치할 것 없이 브라우저에서 바로 열립니다. 처음엔 행성을 코드로만 그렸고, 두 번째 요청으로 NASA 행성 사진을 입혔습니다.

행성 사진은 어디서 왔나

지구의 낮·밤 사진과 구름은 NASA의 Blue Marble·Black Marble, 달은 달 탐사선 LRO 지도, 금성·화성·목성·토성·해왕성은 NASA 3D Resources 자료입니다. NASA는 출처를 밝히고 NASA가 보증한 것처럼 보이지 않게 쓰면 허락 없이 써도 된다고 안내합니다. 이 3D는 NASA와 관계가 없습니다.

2026년 9월 26일 기준