# Membuat Karakter Lebah Interaktif untuk Web - Spline Academy (https://spline.design/id/academy/tutorials/create-an-interactive-bee-character-for-the-web)

> Selamat datang kembali! 🙌 Dalam video tutorial ini, kami akan menunjukkan cara membuat pengalaman interaktif dengan karakter lebah yang menggemaskan. Coba…

1. [Academy](https://spline.design/id/academy)
2. [Tutorial](https://spline.design/id/academy/tutorials)
3. Membuat Karakter Lebah Interaktif untuk Web

# Membuat Karakter Lebah Interaktif untuk Web

Spline 3DMenengah14 mnt

Selamat datang kembali! 🙌 Dalam video tutorial ini, kami akan menunjukkan cara membuat pengalaman interaktif dengan karakter lebah yang menggemaskan. Coba Spline: <https://spline.design/>

Anda akan belajar membuat animasi berulang untuk sayap dan mata lebah, serta menerapkan efek transisi interaktif yang membuat elemen bergerak atau muncul di layar saat tombol diklik, dengan event Mouse Down.

Unduh lebah 3D ini dan ikuti tutorialnya.

🐝 Remix: <https://app.spline.design/file/68152128-3ac0-4fdd-a941-1cdcbe075c43>

Pelajari lebih lanjut tentang event interaktif di Spline Docs! 📘 <https://docs.spline.design/>

Selamat belajar!

## Yang akan Anda pelajari

1. [0:00Intro](https://www.youtube.com/watch?v=hRy-Iqle6EU&t=0s)
2. [0:38Membuat animasi sayap yang berulang](https://www.youtube.com/watch?v=hRy-Iqle6EU&t=38s)
3. [2:44Menambahkan mata yang berkedip](https://www.youtube.com/watch?v=hRy-Iqle6EU&t=164s)
4. [4:13Membuat efek transisi dengan tombol (event Mouse Down)](https://www.youtube.com/watch?v=hRy-Iqle6EU&t=253s)
5. [11:53Menyiapkan kamera dan mengekspor untuk situs web](https://www.youtube.com/watch?v=hRy-Iqle6EU&t=713s)

## Sumber terkait

- [Bee - UI interactionTemplate](https://app.spline.design/academy/tutorials/create-an-interactive-bee-character-for-the-web?redirect-duplicate-template-uuid=21a2a3bb-b549-405f-88b0-b0269a8f2390&is-2d-file=false)
- [How state-based animation worksDokumen](https://docs.spline.design/interaction-states-events-and-actions/how-state-based-animation-works)
- [Scroll EventDokumen](https://docs.spline.design/interaction-states-events-and-actions/events/scroll-event)
- [Transition ActionDokumen](https://docs.spline.design/interaction-states-events-and-actions/actions/transition-action)

## Ikhtisar

- Spline 3D
- 14 mnt
- Menengah

## Bagian dari

- [Animasi & Interaksi di Spline](https://spline.design/id/academy/collections/animation-interactions-in-spline/create-an-interactive-bee-character-for-the-web)

## Tutorial terkait

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

[Cara Membuat Bola 3D Reaktif dengan Gerakan dan InteraksiSpline 3DMenengah7 mnt](https://spline.design/id/academy/tutorials/how-to-build-a-reactive-3d-orb-with-motion-and-interaction)[Cara Membuat Interaksi Carousel 3DSpline 3DLanjutan16 mnt](https://spline.design/id/academy/tutorials/how-to-create-a-3d-carousel-interaction)[Menghidupkan Robot 3D InteraktifSpline 3DPemula13 mnt](https://spline.design/id/academy/tutorials/bring-an-interactive-3d-robot-to-life)

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