# Gawing Interactive na Web Experience ang Iyong mga Spline Design - Spline 101 | Gawin ang Una Mong Interactive Scene - Spline Academy (https://spline.design/fil/academy/tutorials/turn-your-spline-designs-into-interactive-web-experiences)

> Alamin kung paano bigyang-buhay sa web ang mga Spline 3D design mo! Sa mini masterclass na ito, gagabayan ka namin sa lahat ng kailangan mong malaman…

1. [Academy](https://spline.design/fil/academy)
2. [Mga Kurso](https://spline.design/fil/academy/collections)
3. [Spline 101 | Gawin ang Una Mong Interactive Scene](https://spline.design/fil/academy/collections/spline-101-build-your-first-interactive-scene)
4. Gawing Interactive na Web Experience ang Iyong mga Spline Design

# Gawing Interactive na Web Experience ang Iyong mga Spline Design

Aralin 16 ng 16Spline 3DBaguhan10 min

Alamin kung paano bigyang-buhay sa web ang mga Spline 3D design mo! Sa mini masterclass na ito, gagabayan ka namin sa lahat ng kailangan mong malaman tungkol sa pag-integrate ng mga Spline scene sa mga website at web project mo.

🎯 Ang Matututunan Mo:

- Paano i-export at i-share ang mga Spline scene gamit ang mga Public URL
- Pag-embed gamit ang Spline Viewer para sa mabilis na integration
- Mga opsyon sa code export para sa Vanilla JS, Three.js, React, Next.js at React Three Fiber
- Self-hosted na deployment para sa buong kontrol
- Pag-integrate ng Spline sa mga web builder gaya ng Framer, Webflow, Wix at Shopify

Para ang tutorial na ito sa sinumang gustong magdagdag ng mga interactive na 3D element sa kanilang mga site o project, kaya simulan na natin!

## Mga kaugnay na resource

- [Likes ButtonTemplate](https://app.spline.design/academy/tutorials/turn-your-spline-designs-into-interactive-web-experiences?redirect-duplicate-template-uuid=0ffd92cf-735d-47e7-8cea-ad0bebdcd0d0&is-2d-file=false)
- [Exporting Your SceneDokumento](https://docs.spline.design/#%F0%9F%8E%9E%EF%B8%8F-exporting-your-scene)
- [Exporting as Public URLsDokumento](https://docs.spline.design/exporting-your-scene/web/exporting-as-public-ur-ls)
- [Exporting as Spline ViewerDokumento](https://docs.spline.design/exporting-your-scene/web/exporting-as-spline-viewer)
- [Exporting as CodeDokumento](https://docs.spline.design/exporting-your-scene/web/exporting-as-code)

## Overview

- Spline 3D
- 10 min
- Baguhan

## Huling aralin

Dito nagtatapos ang Spline 101 | Gawin ang Una Mong Interactive Scene.

[Bumalik sa kurso](https://spline.design/fil/academy/collections/spline-101-build-your-first-interactive-scene)

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

Ang 3D at 2D editor para sa mga team at kanilang mga agent. I-publish sa web, iOS at Android.

#### Magtanong sa AI tungkol sa Spline

#### Mga Produkto

- [3D Design](https://spline.design/fil/3d-design)
- [Hana](https://spline.design/fil/hana)
- [Omma](https://omma.build)
- [AI 3D Generation](https://spline.design/fil/ai-generate)
- [Spline MCP](https://spline.design/fil/mcp)
- [Spline Arena](https://spline.design/fil/arena)
- [Presyo](https://spline.design/fil/pricing)
- [Enterprise](https://spline.design/fil/enterprise)

#### Runtimes

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

#### Apps

- [I-download](https://spline.design/fil/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [I-download ang Spline Mirror](https://spline.design/download-mirror)

#### Matuto

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/fil/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [Mga Solusyon](https://spline.design/solutions)

#### Community

- [Spline Community](https://community.spline.design)
- [Blog](https://spline.design/fil/blog)
- [Changelog](https://spline.design/fil/changelog)
- [Edukasyon](https://spline.design/fil/education)
- [Contra](https://spline.design/contra)
- [Affiliate](https://spline.design/fil/affiliate)

#### Kumpanya

- [Mga Customer](https://spline.design/fil/customers)
- [Careers](https://www.ycombinator.com/companies/spline/jobs)
- [Security](https://spline.design/fil/security)

#### Legal

- [Mga Tuntunin at Kundisyon](https://spline.design/terms)
- [Privacy](https://spline.design/privacy)

#### Contact

- [help@spline.design](mailto:help@spline.design)
- [jobs@spline.design](mailto:jobs@spline.design)

© 2026 - Spline, Inc.