# Gumawa ng 2D Follow Interaction - Spline Academy (https://spline.design/fil/academy/tutorials/create-a-2d-follow-interaction)

> Kung first time mong subukan ang interactive 2D design, magandang simula ito! 😉 Sa tutorial na ito, gagabayan ka namin nang step by step kung paano…

1. [Academy](https://spline.design/fil/academy)
2. [Mga Tutorial](https://spline.design/fil/academy/tutorials)
3. Gumawa ng 2D Follow Interaction

# Gumawa ng 2D Follow Interaction

HanaBaguhan8 min

Kung first time mong subukan ang interactive 2D design, magandang simula ito! 😉 Sa tutorial na ito, gagabayan ka namin nang step by step kung paano madaling gumawa ng 2D interaction na sumusunod sa cursor mo (o sa touch input sa mga mobile device) gamit ang Hana, isang bagong real-time canvas para magdisenyo at mag-animate ng mga interactive na 2D experience.

Bubuuin namin ang masayang interaction na ito sa paglalapat ng Follow event para gumawa ng maayos at dumadaloy na chain reaction. Masaya at madaling paraan ito para magdagdag ng kaunting galaw at personalidad sa website o project mo.

Demo 👉 <https://app.spline.design/ui/98440491-bf75-4e54-ab6f-afa16fc04f7e>

Alamin kung paano ito gawin sa 3D gamit ang 3D Editor ng Spline: <https://youtu.be/TQe5Ae16rE8>

## Ang matututunan mo

1. [0:00Pagsisimula](https://www.youtube.com/watch?v=bKrapjgDBNo&t=0s)
2. [0:49Paggawa ng mga Ellipse at Paglalapat ng Follow Event](https://www.youtube.com/watch?v=bKrapjgDBNo&t=49s)
3. [2:41Pag-adjust ng mga Damping Value at Size](https://www.youtube.com/watch?v=bKrapjgDBNo&t=161s)
4. [6:10Pag-export at Pag-embed ng Design](https://www.youtube.com/watch?v=bKrapjgDBNo&t=370s)

## Mga kaugnay na resource

- [Follow CirclesTemplate](https://app.spline.design/academy/tutorials/create-a-2d-follow-interaction?redirect-duplicate-template-uuid=3b7c3f0a-306e-4a88-aa07-e705edb96030&is-2d-file=true)
- [Designing in HanaDokumento](https://docs.spline.design/hana-a-canvas-for-interactivity/designing-in-hana)
- [Hana EventsDokumento](https://docs.spline.design/hana-a-canvas-for-interactivity/interactivity-in-hana#hana-events)
- [Exporting as EmbedDokumento](https://docs.spline.design/hana-a-canvas-for-interactivity/exporting-in-hana#exporting-as-embed-link)

## Overview

- Hana
- 8 min
- Baguhan

## Bahagi ng

- [Hana | Lahat ng Kailangan Mong Malaman](https://spline.design/fil/academy/collections/hana-everything-you-need-to-know/create-a-2d-follow-interaction)

## Mga kaugnay na tutorial

[Lahat ng tutorial](https://spline.design/fil/academy/tutorials)

[Magsimula sa Interactive 2D sa HanaHanaBaguhan17 min](https://spline.design/fil/academy/tutorials/get-started-with-interactive-2d-in-hana)[Paano Mag-animate sa Kahabaan ng Path gamit ang Hana at SplineHanaBaguhan7 min](https://spline.design/fil/academy/tutorials/how-to-animate-along-a-path-with-hana-and-spline)[Gumawa ng mga Interactive na Design na Tumutugon sa Mouse Mo gamit ang HanaHanaBaguhan6 min](https://spline.design/fil/academy/tutorials/create-interactive-designs-that-react-to-your-mouse-with-hana)

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