# 3D 오브젝트에 마우스 기반 인터랙션 추가하기 - Spline 101 | 첫 인터랙티브 씬 만들기 - Spline Academy (https://spline.design/ko/academy/tutorials/add-mouse-based-interactions-to-3d-objects) > 3D 요소가 커서에 반응하게 만들어 인터랙션을 쉽게 만드는 방법을 배워 보세요! 1. [아카데미](https://spline.design/ko/academy) 2. [코스](https://spline.design/ko/academy/collections) 3. [Spline 101 | 첫 인터랙티브 씬 만들기](https://spline.design/ko/academy/collections/spline-101-build-your-first-interactive-scene) 4. 3D 오브젝트에 마우스 기반 인터랙션 추가하기 # 3D 오브젝트에 마우스 기반 인터랙션 추가하기 레슨 4/16Spline 3D초급14분 3D 요소가 커서에 반응하게 만들어 인터랙션을 쉽게 만드는 방법을 배워 보세요! 입문자를 위한 가이드로, 관련 개념을 쉽게 따라올 수 있도록 소개합니다. Mouse Up, Down, Press, Hover 같은 마우스 이벤트가 3D 디자인을 얼마나 돋보이게 하는지 보여 드립니다. 또한 마우스 이벤트를 색상, 크기, 애니메이션 변경과 카메라 이동 같은 액션에 연결해 인터랙티브 경험을 만드는 방법도 소개합니다! 마우스 이벤트를 더 알아보려면 다른 튜토리얼도 확인해 보세요! \--- 더 많은 멋진 크리에이터와 프로젝트(#MadeInSpline)를 만나 보세요: ## 배울 내용 1. [0:00인트로](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=0s) 2. [0:29마우스 이벤트 이해하기](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=29s) 3. [1:42간단한 Mouse Down 인터랙션 만들기](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=102s) 4. [5:02클릭하면 색상 바꾸기](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=302s) 5. [6:03인터랙티브 버튼과 색상 변경](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=363s) 6. [8:47카메라 위치가 바뀌는 클릭 인터랙션](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=527s) 7. [10:54효과음 추가하기](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=654s) 8. [12:01Create Object 액션 살펴보기](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=721s) 9. [12:20클릭하면 웹사이트가 열리도록 URL 추가하기](https://www.youtube.com/watch?v=rdZrrXFLxuw&t=740s) ## 관련 자료 - [Mouse Hover Event템플릿](https://app.spline.design/academy/tutorials/add-mouse-based-interactions-to-3d-objects?redirect-duplicate-template-uuid=267cdcd9-2272-426a-9b67-4028d2c1d024&is-2d-file=false) - [How state-based animation works문서](https://docs.spline.design/interaction-states-events-and-actions/how-state-based-animation-works) - [Events & Interactivity문서](https://docs.spline.design/interaction-states-events-and-actions/events-interactivity) - [Events문서](https://docs.spline.design/#events) - [Actions문서](https://docs.spline.design/#actions) ## 개요 - Spline 3D - 14분 - 초급 ## 다음 레슨 [3D 버튼 인터랙션 만드는 방법10분초급](https://spline.design/ko/academy/collections/spline-101-build-your-first-interactive-scene/how-to-create-3d-button-interactions)[계속하기](https://spline.design/ko/academy/collections/spline-101-build-your-first-interactive-scene/how-to-create-3d-button-interactions) [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.