# Cara Menganimasikan Sepanjang Laluan dengan Hana dan Spline - Spline Academy (https://spline.design/ms/academy/tutorials/how-to-animate-along-a-path-with-hana-and-spline)

> Dalam tutorial ini, kami akan menunjukkan cara menggunakan salah satu kemas kini terbaharu kami dalam Hana, dan cara anda boleh menganimasikan bentuk atau…

1. [Academy](https://spline.design/ms/academy)
2. [Tutorial](https://spline.design/ms/academy/tutorials)
3. Cara Menganimasikan Sepanjang Laluan dengan Hana dan Spline

# Cara Menganimasikan Sepanjang Laluan dengan Hana dan Spline

HanaPemula7 min

Dalam tutorial ini, kami akan menunjukkan cara menggunakan salah satu kemas kini terbaharu kami dalam Hana, dan cara anda boleh menganimasikan bentuk atau reka bentuk dengan mudah di sepanjang trajektori tersuai.

Kami akan membimbing anda melalui pelbagai cara mereka bentuk laluan dalam Hana, cara menjajarkan bentuk pada laluan itu, mencipta animasi, melaraskan ofset kedudukan, dan memilih antara orientasi world dan tangential.

Demo 👉 <https://app.spline.design/ui/6a36d303-a217-4466-95f5-85a1561c5725>

## Apa yang akan anda pelajari

1. [0:00Pengenalan](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=0s)
2. [0:16Cara mencipta laluan menggunakan Vector Tool](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=16s)
3. [1:00Cara menggunakan Align to Path](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=60s)
4. [2:07Mencipta Animasi](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=127s)
5. [3:23Cara mencipta laluan menggunakan Shape](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=203s)
6. [4:03Melaraskan Ofset Kedudukan](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=243s)
7. [4:53Orientasi World lwn. Tangential](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=293s)
8. [6:13Align to Path dalam 3D](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=373s)

## Sumber berkaitan

- [Shapes Follow PathTemplat](https://app.spline.design/academy/tutorials/how-to-animate-along-a-path-with-hana-and-spline?redirect-duplicate-template-uuid=86ecf61d-28ed-4c69-9f76-029bd8130eed&is-2d-file=true)
- [Algin to Path ModiferDokumen](https://docs.spline.design/hana-a-canvas-for-interactivity/designing-in-hana#%F0%9F%8E%A2-modifiers)

## Gambaran keseluruhan

- Hana
- 7 min
- Pemula

## Sebahagian daripada

- [Hana | Semua yang Perlu Anda Ketahui](https://spline.design/ms/academy/collections/hana-everything-you-need-to-know/how-to-animate-along-a-path-with-hana-and-spline)

## Tutorial berkaitan

[Semua tutorial](https://spline.design/ms/academy/tutorials)

[Cipta Interaksi Follow 2DHanaPemula8 min](https://spline.design/ms/academy/tutorials/create-a-2d-follow-interaction)[Bermula dengan 2D Interaktif dalam HanaHanaPemula17 min](https://spline.design/ms/academy/tutorials/get-started-with-interactive-2d-in-hana)[Cipta Reka Bentuk Interaktif yang Bertindak Balas terhadap Tetikus Anda dengan HanaHanaPemula6 min](https://spline.design/ms/academy/tutorials/create-interactive-designs-that-react-to-your-mouse-with-hana)

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

Editor 3D dan 2D untuk pasukan dan ejen mereka. Terbitkan ke web, iOS dan Android.

#### Tanya AI tentang Spline

#### Produk

- [Reka Bentuk 3D](https://spline.design/ms/3d-design)
- [Hana](https://spline.design/ms/hana)
- [Omma](https://omma.build)
- [Penjanaan 3D AI](https://spline.design/ms/ai-generate)
- [Spline MCP](https://spline.design/ms/mcp)
- [Spline Arena](https://spline.design/ms/arena)
- [Harga](https://spline.design/ms/pricing)
- [Perusahaan](https://spline.design/ms/enterprise)

#### Runtime

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

#### Aplikasi

- [Muat Turun](https://spline.design/ms/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Muat turun Spline Mirror](https://spline.design/download-mirror)

#### Belajar

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

#### Komuniti

- [Komuniti Spline](https://community.spline.design)
- [Blog](https://spline.design/ms/blog)
- [Log Perubahan](https://spline.design/ms/changelog)
- [Pendidikan](https://spline.design/ms/education)
- [Contra](https://spline.design/contra)
- [Afiliat](https://spline.design/ms/affiliate)

#### Syarikat

- [Pelanggan](https://spline.design/ms/customers)
- [Kerjaya](https://www.ycombinator.com/companies/spline/jobs)
- [Keselamatan](https://spline.design/ms/security)

#### Undang-undang

- [Terma & Syarat](https://spline.design/terms)
- [Privasi](https://spline.design/privacy)

#### Hubungi

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

© 2026 - Spline, Inc.