# Hana ile fareye tepki veren etkileşimli tasarımlar oluştur - Hana | Bilmen gereken her şey - Spline Academy (https://spline.design/tr/academy/tutorials/create-interactive-designs-that-react-to-your-mouse-with-hana)

> Bu videoda sana bir giriş yapacak ve Hana ile tasarımlarını imlecine tepki veren etkileşimli deneyimlere nasıl dönüştürebileceğine dair çeşitli örnekler…

1. [Academy](https://spline.design/tr/academy)
2. [Kurslar](https://spline.design/tr/academy/collections)
3. [Hana | Bilmen gereken her şey](https://spline.design/tr/academy/collections/hana-everything-you-need-to-know)
4. Hana ile fareye tepki veren etkileşimli tasarımlar oluştur

# Hana ile fareye tepki veren etkileşimli tasarımlar oluştur

Ders 5 / 15HanaBaşlangıç6 dk

Bu videoda sana bir giriş yapacak ve Hana ile tasarımlarını imlecine tepki veren etkileşimli deneyimlere nasıl dönüştürebileceğine dair çeşitli örnekler göstereceğiz. Mouse Down, Mouse Up, Mouse Press, Mouse Hover, Look At ve Follow gibi olayları ve bunları animasyon ve efektleri tetiklemek için nasıl kullanacağını keşfedeceğiz.

## Neler öğreneceksin

1. [0:00Giriş](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=0s)
2. [0:15Tıklamak – Mouse Down olayı](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=15s)
3. [2:32Bırakmak – Mouse Up olayı](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=152s)
4. [2:46Basılı tutmak – Mouse Press olayı](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=166s)
5. [2:56Hover büyüsü – Mouse Hover olayı](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=176s)
6. [3:26Tasarımını imlece döndür – Look At olayı](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=206s)
7. [4:51Tasarımın imleci takip etsin – Follow olayı](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=291s)
8. [5:57Bir sonraki eğitime ön bakış](https://www.youtube.com/watch?v=TgZdS8RK0bM&t=357s)

## İlgili kaynaklar

- [Interactive Flat IconsŞablon](https://app.spline.design/academy/tutorials/create-interactive-designs-that-react-to-your-mouse-with-hana?redirect-duplicate-template-uuid=2a05e307-90dd-4666-bc8b-f2b7f3c2cce8&is-2d-file=true)
- [Designing in HanaDoküman](https://docs.spline.design/hana-a-canvas-for-interactivity/designing-in-hana)
- [Interactivity in HanaDoküman](https://docs.spline.design/hana-a-canvas-for-interactivity/interactivity-in-hana)

## Genel bakış

- Hana
- 6 dk
- Başlangıç

## Sıradaki

[2D bir Follow etkileşimi oluştur8 dkBaşlangıç](https://spline.design/tr/academy/collections/hana-everything-you-need-to-know/create-a-2d-follow-interaction)[Devam et](https://spline.design/tr/academy/collections/hana-everything-you-need-to-know/create-a-2d-follow-interaction)

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