# Hana ile fareye tepki veren etkileşimli tasarımlar oluştur - 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. [Eğitimler](https://spline.design/tr/academy/tutorials)
3. Hana ile fareye tepki veren etkileşimli tasarımlar oluştur

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

HanaBaş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ıç

## Ait olduğu kurs:

- [Hana | Bilmen gereken her şey](https://spline.design/tr/academy/collections/hana-everything-you-need-to-know/create-interactive-designs-that-react-to-your-mouse-with-hana)

## İlgili eğitimler

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

[Progressive blur ve yumuşak gradyanlarla etkileşimli efektler tasarlaHanaBaşlangıç9 dk](https://spline.design/tr/academy/tutorials/design-interactive-effects-with-progressive-blur-and-smoothing-gradients)[3D nesnelere fare tabanlı etkileşimler ekleSpline 3DBaşlangıç14 dk](https://spline.design/tr/academy/tutorials/add-mouse-based-interactions-to-3d-objects)[Spline’da değişkenler ve gerçek zamanlı API’lerle 3D veri görselleştirmeleri nasıl oluşturulurSpline 3Dİleri15 dk](https://spline.design/tr/academy/tutorials/how-to-create-3d-data-visualizations-in-spline-using-variables-and-real-time-apis)

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