# Cara Menganimasikan di Sepanjang Lintasan dengan Hana dan Spline - Hana | Semua yang Perlu Anda Ketahui - Spline Academy (https://spline.design/id/academy/tutorials/how-to-animate-along-a-path-with-hana-and-spline)

> Dalam tutorial ini, kami akan menunjukkan cara memakai salah satu pembaruan terbaru kami di Hana, dan bagaimana Anda bisa dengan mudah menganimasikan bentuk…

1. [Academy](https://spline.design/id/academy)
2. [Kursus](https://spline.design/id/academy/collections)
3. [Hana | Semua yang Perlu Anda Ketahui](https://spline.design/id/academy/collections/hana-everything-you-need-to-know)
4. Cara Menganimasikan di Sepanjang Lintasan dengan Hana dan Spline

# Cara Menganimasikan di Sepanjang Lintasan dengan Hana dan Spline

Pelajaran 11 dari 15HanaPemula7 mnt

Dalam tutorial ini, kami akan menunjukkan cara memakai salah satu pembaruan terbaru kami di Hana, dan bagaimana Anda bisa dengan mudah menganimasikan bentuk atau desain di sepanjang lintasan kustom.

Kami akan memandu Anda melalui berbagai cara mendesain lintasan di Hana, cara menyelaraskan bentuk ke lintasan itu, membuat animasi, menyesuaikan position offset, dan memilih antara orientasi world dan tangential.

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

## Yang akan Anda pelajari

1. [0:00Intro](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=0s)
2. [0:16Cara membuat lintasan dengan Vector Tool](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=16s)
3. [1:00Cara memakai Align to Path](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=60s)
4. [2:07Membuat animasi](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=127s)
5. [3:23Cara membuat lintasan dengan Shape](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=203s)
6. [4:03Menyesuaikan Position Offset](https://www.youtube.com/watch?v=u-fEUpXoyCU&t=243s)
7. [4:53Orientasi World vs. 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 terkait

- [Shapes Follow PathTemplate](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)

## Ikhtisar

- Hana
- 7 mnt
- Pemula

## Berikutnya

[Mendesain dan Menganimasikan dengan Vector Mask7 mntPemula](https://spline.design/id/academy/collections/hana-everything-you-need-to-know/design-and-animate-with-vector-masks)[Lanjutkan](https://spline.design/id/academy/collections/hana-everything-you-need-to-know/design-and-animate-with-vector-masks)

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

Editor 3D dan 2D untuk tim dan agen mereka. Rilis ke web, iOS, dan Android.

#### Tanya AI tentang Spline

#### Produk

- [Desain 3D](https://spline.design/id/3d-design)
- [Hana](https://spline.design/id/hana)
- [Omma](https://omma.build)
- [Pembuatan 3D dengan AI](https://spline.design/id/ai-generate)
- [Spline MCP](https://spline.design/id/mcp)
- [Spline Arena](https://spline.design/id/arena)
- [Harga](https://spline.design/id/pricing)
- [Enterprise](https://spline.design/id/enterprise)

#### Runtime

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

#### Aplikasi

- [Unduh](https://spline.design/id/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Unduh Spline Mirror](https://spline.design/download-mirror)

#### Belajar

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

#### Komunitas

- [Komunitas Spline](https://community.spline.design)
- [Blog](https://spline.design/id/blog)
- [Changelog](https://spline.design/id/changelog)
- [Pendidikan](https://spline.design/id/education)
- [Contra](https://spline.design/contra)
- [Afiliasi](https://spline.design/id/affiliate)

#### Perusahaan

- [Pelanggan](https://spline.design/id/customers)
- [Karier](https://www.ycombinator.com/companies/spline/jobs)
- [Keamanan](https://spline.design/id/security)

#### Legal

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

#### Kontak

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

© 2026 - Spline, Inc.