# 3D बटन इंटरैक्शन कैसे बनाएँ - Spline 101 | अपना पहला इंटरैक्टिव सीन बनाएँ - Spline Academy (https://spline.design/hi/academy/tutorials/how-to-create-3d-button-interactions)

> इस ट्यूटोरियल में हम दिखाते हैं कि एक सरल 3D बटन कैसे बनाएँ, और माउस इवेंट से साइज़ बदलना, रंग बदलना और पोज़िशन टॉगल जैसे बुनियादी इंटरैक्टिव फ़ीचर कैसे जोड़ें।

1. [Academy](https://spline.design/hi/academy)
2. [कोर्स](https://spline.design/hi/academy/collections)
3. [Spline 101 | अपना पहला इंटरैक्टिव सीन बनाएँ](https://spline.design/hi/academy/collections/spline-101-build-your-first-interactive-scene)
4. 3D बटन इंटरैक्शन कैसे बनाएँ

# 3D बटन इंटरैक्शन कैसे बनाएँ

लेसन 5 / 16Spline 3Dशुरुआती10 मिनट

इस ट्यूटोरियल में हम दिखाते हैं कि एक सरल 3D बटन कैसे बनाएँ, और माउस इवेंट से साइज़ बदलना, रंग बदलना और पोज़िशन टॉगल जैसे बुनियादी इंटरैक्टिव फ़ीचर कैसे जोड़ें।

🏡 इसके बाद, हम दिखाएँगे कि ऐसा बटन कैसे बनाएँ जो घूमकर एक सीन दिखाए, और अपने बटन को URL खोलने के लिए कैसे लिंक करें।

यह ट्यूटोरियल इंटरैक्टिव 3D डिज़ाइन में दिलचस्पी रखने वाले शुरुआती लोगों के लिए बिल्कुल सही है!

अगर आप कुछ और सीखना चाहते हैं, तो कमेंट में बताएँ!

अपने 3D बटन का वर्ज़न हमारी कम्युनिटी में शेयर करें! 💖

🔮 Spline Community → <https://community.spline.design>

## आप क्या सीखेंगे

1. [0:00परिचय](https://www.youtube.com/watch?v=B8o5O7PyKjY&t=0s)
2. [0:153D बटन डिज़ाइन करना](https://www.youtube.com/watch?v=B8o5O7PyKjY&t=15s)
3. [1:29साइज़ बदलना - Mouse Hover इवेंट](https://www.youtube.com/watch?v=B8o5O7PyKjY&t=89s)
4. [2:57रंग बदलने का इफ़ेक्ट](https://www.youtube.com/watch?v=B8o5O7PyKjY&t=177s)
5. [4:04टॉगल - Mouse Down इवेंट](https://www.youtube.com/watch?v=B8o5O7PyKjY&t=244s)
6. [5:29इंटरैक्टिव 3D सीन दिखाने वाला बटन](https://www.youtube.com/watch?v=B8o5O7PyKjY&t=329s)
7. [8:41URL से लिंक करना - Open Link एक्शन](https://www.youtube.com/watch?v=B8o5O7PyKjY&t=521s)

## संबंधित रिसोर्स

- [House Buttonटेम्पलेट](https://app.spline.design/academy/tutorials/how-to-create-3d-button-interactions?redirect-duplicate-template-uuid=eaa257e7-bf12-4666-8fe0-26bc66f59075&is-2d-file=false)
- [Extruding 2D objects in 3Dडॉक्यूमेंट](https://docs.spline.design/designing-in-3-d/extruding-2d-objects-in-3-d)
- [How state-based animation worksडॉक्यूमेंट](https://docs.spline.design/interaction-states-events-and-actions/how-state-based-animation-works)
- [Key Down Eventडॉक्यूमेंट](https://docs.spline.design/interaction-states-events-and-actions/events/key-down-event)
- [Transition Actionडॉक्यूमेंट](https://docs.spline.design/interaction-states-events-and-actions/actions/transition-action)

## ओवरव्यू

- Spline 3D
- 10 मिनट
- शुरुआती

## आगे

[3D ऑब्जेक्ट में Look At एनिमेशन जोड़ें10 मिनटशुरुआती](https://spline.design/hi/academy/collections/spline-101-build-your-first-interactive-scene/add-look-at-animations-to-3d-objects)[जारी रखें](https://spline.design/hi/academy/collections/spline-101-build-your-first-interactive-scene/add-look-at-animations-to-3d-objects)

[Spline](https://spline.design/hi)

टीमों और उनके एजेंटों के लिए 3D और 2D एडिटर। वेब, iOS और Android पर पब्लिश करें।

#### Spline के बारे में AI से पूछें

#### प्रोडक्ट

- [3D डिज़ाइन](https://spline.design/hi/3d-design)
- [Hana](https://spline.design/hi/hana)
- [Omma](https://omma.build)
- [AI 3D जनरेशन](https://spline.design/hi/ai-generate)
- [Spline MCP](https://spline.design/hi/mcp)
- [Spline Arena](https://spline.design/hi/arena)
- [कीमतें](https://spline.design/hi/pricing)
- [एंटरप्राइज़](https://spline.design/hi/enterprise)

#### रनटाइम

- [Web](https://spline.design/hi/web)
- [iOS](https://spline.design/hi/ios)
- [Android](https://spline.design/hi/android)

#### ऐप्स

- [डाउनलोड](https://spline.design/hi/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Spline Mirror डाउनलोड करें](https://spline.design/download-mirror)

#### सीखें

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/hi/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [सॉल्यूशंस](https://spline.design/solutions)

#### कम्युनिटी

- [Spline कम्युनिटी](https://community.spline.design)
- [Blog](https://spline.design/hi/blog)
- [चेंजलॉग](https://spline.design/hi/changelog)
- [शिक्षा](https://spline.design/hi/education)
- [Contra](https://spline.design/contra)
- [एफ़िलिएट](https://spline.design/hi/affiliate)

#### कंपनी

- [ग्राहक](https://spline.design/hi/customers)
- [करियर](https://www.ycombinator.com/companies/spline/jobs)
- [सुरक्षा](https://spline.design/hi/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.