# Koji Studio는 어떻게 Spline으로 3D 제품 쇼케이스를 완성했나 - Spline customers (https://spline.design/ko/customers/koji-studio) > Koji Studio는 Spline을 사용해 정적인 제품 비주얼을 스크롤 기반 3D 제품 쇼케이스로 바꿔, 클라이언트의 혁신과 장인 정신을 돋보이게 하는 더 매력적이고 기억에 남는 경험을 선사했습니다. [고객 사례](https://spline.design/ko/customers) 2025년 8월 21일 · 고객 사례 · KOJI # Koji Studio는 어떻게 Spline으로 3D 제품 쇼케이스를 완성했나 Koji Studio는 Spline을 사용해 정적인 제품 비주얼을 스크롤 기반 3D 제품 쇼케이스로 바꿔, 클라이언트의 혁신과 장인 정신을 돋보이게 하는 더 매력적이고 기억에 남는 경험을 선사했습니다. 의료 기술 기업 Ori가 새로운 3D 치과 스캐너 제품의 웹사이트를 출시하려 했을 때, 과제는 분명했습니다. 실물 기기의 정밀함과 혁신을 온라인에서도 똑같이 혁신적으로 느껴지게 전달하려면 어떻게 해야 할까? 회사는 새로운 Ori Intraoral Scanner 기기를 시장에 선보이려 했습니다. 치과의사가 환자 치아의 매우 정확한 디지털 모델을 실시간으로 얻을 수 있도록 돕는 3D 치과 스캐닝 기기입니다. 정적인 이미지와 동영상을 넘어 고객에게 이 제품의 기술적 진보를 보여 주고 싶었던 그들은 제품 출시를 위한 크리에이티브 팀으로 KOJI Agency를 찾았습니다. KOJI 팀은 Webflow 안의 Spline 통합을 활용해, 스캐너가 치과의사의 손에서처럼 웹에서도 손에 잡힐 듯 느껴지는 인터랙티브 3D 디지털 경험을 만들기로 했습니다. Ori Scan의 스크롤 기반 인터랙티브 3D 웹사이트 ## 새로운 도구를 받아들이는 풀스택 디자인 팀 Ori Scan의 웹사이트를 만든 KOJI Agency 팀에는 Pavel, Slava, Nikita, Liza가 있었고, 모두 수많은 클라이언트 프로젝트를 거친 노련한 디자이너입니다. 브랜딩, 아이덴티티, 디지털 경험 분야에서 20년이 넘는 경력을 쌓으며 모듈식 광고 시스템부터 몰입감 있는 내러티브 사이트까지 모든 것을 만들어 왔습니다. 그들의 강점은 제품적 사고, 비주얼 디자인, 인터랙션, 코드를 아우르는 "풀스택 디자이너"라는 데 있습니다. > 우리는 늘 조사하고, 늘 새로운 도구를 찾으려 합니다. 그렇게 Spline을 만나게 됐어요. **Slava Sheykin**, KOJI 풀스택 디자이너 ## Spline으로 인터랙션의 문을 열다 Ori Scan의 경영진은 그저 그런 의료 제품 웹사이트를 원하지 않았습니다. 치과의사와 의료 전문가라는 고객층에게 돋보일 경험을 원했습니다. KOJI 팀은 스캐너의 혁신을 강조하는 데 인터랙티브 3D가 최선의 매체라고 보았고, Spline을 선택한 것도 마찬가지로 의도적이었습니다. 웹사이트 방문자는 페이지를 따라 내려가며 스캐너를 돌려 보고 살펴봅니다 팀은 빠르게 반복하고, 성능을 최적화하고, 여러 기기에서 스캐너의 제품 디자인을 인터랙티브하게 보여 줄 수 있는 유연성이 필요하다는 것을 알았습니다. > 디자인 커뮤니티 어디에서나 Spline이 보였습니다. 이 프로젝트는 마침내 Spline을 써 볼 완벽한 기회였고, Webflow와의 매끄러운 통합 덕분에 결정은 더 쉬웠습니다. **Pavel Dergachev**, KOJI 창립자 겸 크리에이티브 디렉터 ## 디자인 과정: CAD와 폴리곤 최적화에서 완성도 높은 웹 경험까지 과정은 Ori Scan의 기술 CAD 파일에서 시작했고, 에이전시는 이를 다듬고 최적화한 뒤 Spline으로 가져왔습니다. 워크플로는 반복적이었습니다. 폴리곤 수, 머티리얼, 조명을 조율하며 시각적으로 매력적인 결과와 웹에서의 부드러운 성능 사이의 균형을 맞췄습니다. Spline은 과정의 기술적 측면과 창의적 측면을 하나로 모았습니다. 성능 도구는 모델 최적화에 대한 명확한 인사이트를 주어 여러 기기에서 매끄럽게 통합되도록 했습니다. 이벤트 시스템으로 인터랙티브 모션을 쉽게 설정할 수 있었고, 다재다능한 머티리얼과 조명 도구는 제품의 룩을 다듬어 웹에서 완성도 높고 사실적으로 느껴지게 했습니다. 3D 모델과 최종 모바일 구현 특히 돋보이는 디테일은? 바로 치아 3D 모델입니다. 스캐너가 작동하는 모습을 보여 주기 위해 팀은 Spline에서 자연스러워 보이는 치아를 모델링했고, 이것이 데모를 진짜처럼 느껴지게 하는 핵심 요소가 되었습니다. 이런 세심함 덕분에 데모는 기술 쇼케이스 이상의 것이 되었습니다. 사실감과 인터랙션을 결합해 진정성 있고, 매력적이고, 치과의사가 실제로 스캐너를 쓰는 방식과 직접 연결되는 제품 스토리를 만들었습니다. > 재미있었지만 동시에 아주 중요한 작업이었어요. 스캐너의 목적이 치아를 스캔하는 것이니까, 3D 모델이 자연스러워 보이고 자연스럽게 느껴져야 했습니다. **Liza Grin**, KOJI 디지털 프로듀서 위에서부터: 최종 구현, 원본 3D 모델, 초기 초안 ## Webflow와의 통합 KOJI 팀은 Spline으로 Ori Scan 제품에 생명을 불어넣고, Spline의 네이티브 Webflow 통합으로 3D 에셋을 웹사이트에 매끄럽게 구현했습니다. 덕분에 스크롤 기반 애니메이션과 인터랙티브 3D를 결합해, 방문자가 페이지를 따라 내려가며 스캐너를 돌려 보고 살펴볼 수 있게 되었습니다. > 아주 간단하고 빠릅니다. 러닝 커브가 낮아서 주니어 디자이너도 바로 Webflow에 3D를 통합할 수 있어요. Spline의 네이티브 Webflow 통합 ## 인터랙션이 중요한 이유 Ori Scan에게 인터랙티브 3D 제품 쇼케이스는 단지 미적인 문제가 아니었습니다. 명확성과 임팩트의 문제였습니다. 고객이 제품을 스크롤하며 보고, 돌려 보고, 맥락 속에서 기능을 살펴볼 수 있게 해 정적인 사진이나 동영상으로는 결코 이룰 수 없는 경험을 만들었습니다. > 인터랙션은 모든 것을 바꿉니다. 제품을 실제처럼 느끼게 하죠. 무엇보다 클라이언트가 혁신적으로 느껴지는 방식으로 자신의 이야기를 전할 수 있게 도와줍니다. ## Spline 시작하기 KOJI 팀은 계속해서 Spline으로 실험하고 있습니다. 그들에게 이 프로젝트는 3D와 인터랙티브 디자인이 "있으면 좋은 것"이 아니라 제품 스토리를 전하는 데 꼭 필요한 것이 된 새로운 장의 시작이었습니다. 인터랙션이 디지털 제품 디자인을 실제처럼 느껴지는 경험으로 바꿀 수 있음을 보여 주는, 시각적으로 놀라운 사례입니다. [영업팀 문의](https://spline.design/ko/enterprise) ## 다른 고객 사례 [2026년 4월 13일 · 고객 사례Lynksen은 어떻게 Spline으로 복잡한 B2B 플랫폼 웹사이트에 생명을 불어넣었나](https://spline.design/ko/customers/lynksen)[2026년 3월 2일 · 고객 사례Onyx Coffee Lab은 어떻게 이커머스를 위한 인터랙티브 3D를 만드나](https://spline.design/ko/customers/onyx-coffee-lab)[2026년 2월 24일 · 고객 사례Hermetica는 어떻게 3D 디자인으로 핀테크 브랜드를 끌어올렸나](https://spline.design/ko/customers/hermetica) [Spline](https://spline.design/ko) 팀과 AI 에이전트를 위한 3D·2D 에디터. 웹, iOS, Android에 바로 배포하세요. #### AI에게 Spline에 대해 묻기 #### 제품 - [3D 디자인](https://spline.design/ko/3d-design) - [Hana](https://spline.design/ko/hana) - [Omma](https://omma.build) - [AI 3D 생성](https://spline.design/ko/ai-generate) - [Spline MCP](https://spline.design/ko/mcp) - [Spline Arena](https://spline.design/ko/arena) - [요금제](https://spline.design/ko/pricing) - [엔터프라이즈](https://spline.design/ko/enterprise) #### 런타임 - [Web](https://spline.design/ko/web) - [iOS](https://spline.design/ko/ios) - [Android](https://spline.design/ko/android) #### 앱 - [다운로드](https://spline.design/ko/download) - [Spline Mirror](https://spline.design/spline-mirror) - [Spline Mirror 다운로드](https://spline.design/download-mirror) #### 학습 - [Docs](https://docs.spline.design/) - [Academy](https://spline.design/ko/academy) - [Spline API](https://www.npmjs.com/package/@splinetool/runtime) - [솔루션](https://spline.design/solutions) #### 커뮤니티 - [Spline 커뮤니티](https://community.spline.design) - [Blog](https://spline.design/ko/blog) - [변경 로그](https://spline.design/ko/changelog) - [교육](https://spline.design/ko/education) - [Contra](https://spline.design/contra) - [제휴 프로그램](https://spline.design/ko/affiliate) #### 회사 - [고객 사례](https://spline.design/ko/customers) - [채용](https://www.ycombinator.com/companies/spline/jobs) - [보안](https://spline.design/ko/security) #### 법적 고지 - [이용약관](https://spline.design/terms) - [개인정보처리방침](https://spline.design/privacy) #### 문의 - [help@spline.design](mailto:help@spline.design) - [jobs@spline.design](mailto:jobs@spline.design) © 2026 - Spline, Inc.