# Mag-animate ng mga Organic na 3D Blob gamit ang mga State - Animation at mga Interaction sa Spline - Spline Academy (https://spline.design/fil/academy/tutorials/animate-organic-3d-blobs-with-states)

> ☀️ Update: Bumuti ang UI ng Spline, at ipinakilala na namin ang konsepto ng mga Action na nagbibigay ng mas maraming oras para sa mga interaction. Sa loob…

1. [Academy](https://spline.design/fil/academy)
2. [Mga Kurso](https://spline.design/fil/academy/collections)
3. [Animation at mga Interaction sa Spline](https://spline.design/fil/academy/collections/animation-interactions-in-spline)
4. Mag-animate ng mga Organic na 3D Blob gamit ang mga State

# Mag-animate ng mga Organic na 3D Blob gamit ang mga State

Aralin 13 ng 14Spline 3DBaguhan5 min

☀️ Update: Bumuti ang UI ng Spline, at ipinakilala na namin ang konsepto ng mga Action na nagbibigay ng mas maraming oras para sa mga interaction. Sa loob ng event panel, Transition (na isang action) na ngayon ang tawag sa dating seksyong "Objects". Gawing mula Current (Base State) papuntang State ang transition action mo.

Hi! Sa tutorial na ito, matututunan mo kung paano gumawa at magdagdag ng galaw/animation sa isang 3D blob gamit ang mga material ng Spline at ang mga state transition.

Demo: <https://my.spline.design/animateblobtutorial-3cd0ff763c85d6c7932987288496472e/> Remix: <https://app.spline.design/file/8784fb55-d7a0-4a39-b00c-b88ab4524c2e>

## Ang matututunan mo

1. [0:00Introduksyon](https://www.youtube.com/watch?v=KclCVV4bnow&t=0s)
2. [0:27Paggawa ng sphere](https://www.youtube.com/watch?v=KclCVV4bnow&t=27s)
3. [1:28Paggawa ng mga material](https://www.youtube.com/watch?v=KclCVV4bnow&t=88s)
4. [3:34Pag-animate ng deformation](https://www.youtube.com/watch?v=KclCVV4bnow&t=214s)
5. [4:13Pagtuklas sa mga alternatibo](https://www.youtube.com/watch?v=KclCVV4bnow&t=253s)

## Mga kaugnay na resource

- [Blob Soft AnimationTemplate](https://app.spline.design/academy/tutorials/animate-organic-3d-blobs-with-states?redirect-duplicate-template-uuid=8d2738da-646b-4647-8a1e-696489259738&is-2d-file=false)
- [Materials & ShadingDokumento](https://docs.spline.design/#%F0%9F%8C%88-materials-&-shading)
- [Displace LayerDokumento](https://docs.spline.design/materials-shading/displace-layer)
- [Transition ActionDokumento](https://docs.spline.design/interaction-states-events-and-actions/actions/transition-action)
- [Events & InteractivityDokumento](https://docs.spline.design/interaction-states-events-and-actions/events-interactivity)

## Overview

- Spline 3D
- 5 min
- Baguhan

## Susunod

[Paikutin at I-animate ang mga 3D Object6 minBaguhan](https://spline.design/fil/academy/collections/animation-interactions-in-spline/rotate-animate-3d-objects)[Magpatuloy](https://spline.design/fil/academy/collections/animation-interactions-in-spline/rotate-animate-3d-objects)

[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.