브라우저에서 돌아다닐 수 있는 작은 테라리움 컬렉션을 바이브코딩으로 만들어봤음 (약 한 달 걸림)
I vibecoded a tiny living collection of terrariums you can walk around in your browser (took about a month)
핵심 요약
브라우저에서 탐험 가능한 가우시안 스플랫 기반의 테라리움 프로젝트를 바이브코딩으로 구현함.
- 가우시안 스플랫 — 오픈 데이터를 활용해 도시와 자연 환경을 브라우저에서 구현함.
- 바이브코딩 도구 — Decision Kit 프레임워크를 사용해 100개 이상의 개발 의사결정을 효율적으로 처리함.
- 다채로운 환경 — 계절 변화, 날씨, 이동하는 새와 자동차 등 생동감 넘치는 요소들을 포함함.
- 웹 테라리움 — 사용자가 직접 돌아다니며 즐길 수 있는 힐링용 인터랙티브 환경을 제공함.
이건 원래 도시를 Gaussian Splat 버전으로 만들 수 있을까 하는 호기심에서 시작한 프로젝트였음. 그러다 좀 삘 받아서 마을 여러 개랑 엄청나게 다양한 스타일을 만들어버렸네. 오픈 데이터를 잔뜩 때려 박았는데, 도로랑 건물은 OpenStreetMap, 지형은 USGS 고도 데이터, 건물이나 나무 높이는 주 정부 레이저 측량 데이터, 그리고 가로수나 버스 정류장, 벤치 같은 건 도시 오픈 데이터를 썼음.
전체적인 설계는 내가 만든 Decision Kit 프레임워크를 엄청나게 써먹었음. 대충 설명하자면, 중요한 결정(물 표현은 어떻게 할지, 메뉴 기능은 뭘 넣을지, 교통 흐름은 어떻게 할지 등)을 내릴 때마다 선택지 4개랑 추천안, 그리고 반대 의견까지 정리된 페이지를 만들게 했거든. 난 그냥 거기서 고르기만 했음. 워낙 큰 프로젝트라 이런 결정을 100번 넘게 내린 듯.
살아있는 것처럼 보이게 하려고 별의별 걸 다 넣었음. 계절도 바뀌고, 날씨도 변하고, 철새도 날아다니고, 별도 뜨고, 차도 다니고, 뽈뽈거리는 귀여운 사람들도 돌아다님.
아무튼, 다들 좋아해 줬으면 좋겠다. 그냥 맘 편하게 즐기면서 숨겨진 이스터 에그 찾는 재미로 만든 거니까. 배경화면처럼 그냥 틀어놓고 싶으면 홈페이지에 있는 "watch them all" 링크 눌러보셈. 그리고 어떤 스타일이 제일 마음에 드는지도 알려줘. 난 개인적으로 Poster, Pixel, Dreamlike 스타일을 제일 좋아하는데, Clay 스타일에서 찰흙 인형 같은 애들 돌아다니는 거 보는 것도 꽤 재밌음.
