3D 기술 스택을 잘 몰라서 Astra로 오디세이 인터랙티브 스크롤 프로젝트를 만들어봄

난 Three.js나 3D 모델링 같은 거 진짜 젬병임. 그래서 Astra 성능 테스트해 볼 기회가 생겼을 때, 3D 데모 같은 거 만드는 대신 스토리 위주의 결과물을 만들어 보기로 했음.

영감은 오디세이아랑 크리스토퍼 놀란 영화에서 받았고, 호메로스의 원작 요소도 좀 섞었음. 결과물은 스크롤을 내리면 이야기가 진행되는 인터랙티브 월드 스크롤 방식임.

여정은 오디세우스가 트로이 전쟁을 위해 이타카를 떠나는 것부터 시작해서, 키클롭스의 섬, 키르케의 섬, 그리고 죽은 전우들을 만나는 저승까지 이어지는 긴 항해를 따라감. 거기서 세이렌이랑 바다 괴물들을 만나고, 칼립소의 섬에 도착했다가 결국 불멸 대신 집을 선택함. 마지막엔 이타카로 돌아와서 집을 되찾고 가족들과 재회하는 걸로 끝남.

이건 Netas Studio에서 Astra를 써서 만들었고, 이미지는 Image2, 영상은 Seedance 2.0으로 뽑았음.

데모 관련해서 한마디 하자면, 녹화본이 중간중간 좀 끊겨 보일 수 있음. 특히 초반부가 좀 그럼. 이게 스크롤할 때마다 장면이 바뀌는 거랑 주요 순간을 이어주는 영상 시퀀스가 합쳐진 거라 그런데, 직접 페이지 스크롤 해보면 훨씬 부드러움.

배경 음악도 Astra로 뽑았는데, 스토리 분위기랑 너무 잘 어울려서 진짜 감탄했음.

월드 스크롤 뒤에는 오디세우스 여정의 주요 거점을 표시한 아틀라스도 추가했음. 지도 아트워크는 전부 Image2로 만든 거임.

Astra 써보면서 3D 데모에서는 잘 안 드러날 수도 있는 세 가지 장점이 눈에 띄었음.

스토리 이해도

대충 줄거리만 던져줬는데도 스토리 흐름이랑 샷 구성을 금방 잡아내더라. 좀 비싸긴 한데, 이거 롤플레잉이나 TRPG 캠페인 할 때 진짜 괜찮을 것 같음.

병렬 에이전트

여러 장소에 들어갈 이미지랑 영상이 필요해서 동시에 작업할 게 많았거든. GPT-4 쓸 때보다 훨씬 작업 속도가 빠른 느낌이었음. 뭐 이건 벤치마크 같은 건 아니고 그냥 내 개인적인 체감임. 계속 써보면서 더 테스트해 볼 생각임.

프론트엔드 디자인

처음에 적용된 폰트랑 스타일이 영 마음에 안 들었음. 그래서 그냥 대충 "고대 그리스 느낌 나게 해줘, 파피루스 질감이랑 그에 맞는 타이포그래피로"라고 피드백을 줬거든. 그랬더니 색감이랑 폰트를 싹 바꿔줬는데, 결과물이 내가 생각했던 거랑 훨씬 비슷하게 나왔음.

전체 프로젝트는 여기서 볼 수 있음