# Web için etkileşimli bir arı karakteri oluştur - Spline Academy (https://spline.design/tr/academy/tutorials/create-an-interactive-bee-character-for-the-web)

> Tekrar hoş geldin! 🙌 Bu video eğitimde sevimli bir arı karakteriyle etkileşimli bir deneyim oluşturmayı göstereceğiz. Spline’a göz at: https://spline.design/

1. [Academy](https://spline.design/tr/academy)
2. [Eğitimler](https://spline.design/tr/academy/tutorials)
3. Web için etkileşimli bir arı karakteri oluştur

# Web için etkileşimli bir arı karakteri oluştur

Spline 3DOrta14 dk

Tekrar hoş geldin! 🙌 Bu video eğitimde sevimli bir arı karakteriyle etkileşimli bir deneyim oluşturmayı göstereceğiz. Spline’a göz at: <https://spline.design/>

Arının kanatları ve gözleri için döngülü bir animasyon oluşturmayı ve Mouse Down olayıyla düğmelere tıklandığında öğelerin ekranda hareket etmesini ya da belirmesini sağlayan etkileşimli bir geçiş efekti uygulamayı öğreneceksin.

Bu 3D arıyı indir ve eğitimi takip et.

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

Etkileşimli olaylar hakkında daha fazlasını Spline dokümantasyonunda öğren! 📘 <https://docs.spline.design/>

İyi öğrenmeler!

## Neler öğreneceksin

1. [0:00Giriş](https://www.youtube.com/watch?v=hRy-Iqle6EU&t=0s)
2. [0:38Döngülü kanat animasyonu oluşturmak](https://www.youtube.com/watch?v=hRy-Iqle6EU&t=38s)
3. [2:44Göz kırpma eklemek](https://www.youtube.com/watch?v=hRy-Iqle6EU&t=164s)
4. [4:13Düğmelerle geçiş efektleri oluşturmak (Mouse Down olayı)](https://www.youtube.com/watch?v=hRy-Iqle6EU&t=253s)
5. [11:53Kamerayı kurmak ve web sitesi için dışa aktarmak](https://www.youtube.com/watch?v=hRy-Iqle6EU&t=713s)

## İlgili kaynaklar

- [Bee - UI interactionŞablon](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 worksDoküman](https://docs.spline.design/interaction-states-events-and-actions/how-state-based-animation-works)
- [Scroll EventDoküman](https://docs.spline.design/interaction-states-events-and-actions/events/scroll-event)
- [Transition ActionDoküman](https://docs.spline.design/interaction-states-events-and-actions/actions/transition-action)

## Genel bakış

- Spline 3D
- 14 dk
- Orta

## Ait olduğu kurs:

- [Spline’da animasyon ve etkileşimler](https://spline.design/tr/academy/collections/animation-interactions-in-spline/create-an-interactive-bee-character-for-the-web)

## İlgili eğitimler

[Tüm eğitimler](https://spline.design/tr/academy/tutorials)

[Hareket ve etkileşimle tepki veren bir 3D küre nasıl oluşturulurSpline 3DOrta7 dk](https://spline.design/tr/academy/tutorials/how-to-build-a-reactive-3d-orb-with-motion-and-interaction)[3D carousel etkileşimi nasıl oluşturulurSpline 3Dİleri16 dk](https://spline.design/tr/academy/tutorials/how-to-create-a-3d-carousel-interaction)[Etkileşimli bir 3D robota hayat verSpline 3DBaşlangıç13 dk](https://spline.design/tr/academy/tutorials/bring-an-interactive-3d-robot-to-life)

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

Ekipler ve ajanları için 3D ve 2D editör. Web’de, iOS’ta ve Android’de yayınla.

#### Spline’ı yapay zekaya sor

#### Ürünler

- [3D Tasarım](https://spline.design/tr/3d-design)
- [Hana](https://spline.design/tr/hana)
- [Omma](https://omma.build)
- [Yapay Zekayla 3D Üretim](https://spline.design/tr/ai-generate)
- [Spline MCP](https://spline.design/tr/mcp)
- [Spline Arena](https://spline.design/tr/arena)
- [Fiyatlandırma](https://spline.design/tr/pricing)
- [Kurumsal](https://spline.design/tr/enterprise)

#### Runtime’lar

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

#### Uygulamalar

- [İndir](https://spline.design/tr/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Spline Mirror’ı indir](https://spline.design/download-mirror)

#### Öğren

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/tr/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [Çözümler](https://spline.design/solutions)

#### Topluluk

- [Spline Topluluğu](https://community.spline.design)
- [Blog](https://spline.design/tr/blog)
- [Sürüm Notları](https://spline.design/tr/changelog)
- [Eğitim](https://spline.design/tr/education)
- [Contra](https://spline.design/contra)
- [Ortaklık](https://spline.design/tr/affiliate)

#### Şirket

- [Müşteriler](https://spline.design/tr/customers)
- [Kariyer](https://www.ycombinator.com/companies/spline/jobs)
- [Güvenlik](https://spline.design/tr/security)

#### Yasal

- [Şartlar ve Koşullar](https://spline.design/terms)
- [Gizlilik](https://spline.design/privacy)

#### İletişim

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

© 2026 - Spline, Inc.