İmleci Takip Eden Göz Efekti


Bu ilginç animasyon tamamen trigonometri kurallarına göre hazırlanır. Önce animasyonu izleyin. Fareyi sahnede dolaştırdığınızda göz klipleri onu takip edecektir.

DOSYAYI İNDİR   

Trigonometri bilgileri ve dosyanın hazırlanması:

Flash`ta bir sahnedeki x ve y düzlemine ait sıfır değeri sol üst köşedir. Buradan sağa doğru x değeri aşağıya doğru y değeri pozitif olarak artar. Bu ek bilgiden sonra alttaki grafiye bir göz atalım:

Şimdi göz klibinin imleci takip edebilmesi için A açısının değerinin bilinmesi gereklidir. Biz burada a ve b kenar uzunluklarını bulabiliriz. Bu durumda A açının tanjant değerini bulma şansımız vardır.

Trigonometride bir dik üçgende bir açının tanjantını bulabilmek için karşı kenarı komşu kenara bölmek gerekir. Yani:

A tanjant= a / b `dir.

Buradaki b kenarı grafide de gördüğünüz gibi göz film klibinin x değerinden imlecin o anda bulunduğu x değerinin farkına eşittir. Flash`ta bu:

b=goz._x-_xmouse olarak ifade edilir.Aynı işlemi a kenarı içinde yapabiliriz.a=goz._y-_ymouse

A_acısı=Math.atan2(a,b);

A açısı bulundu ama değer radyan olarak alınır. Bunu derece cinsine çevirmek için yine matematik kurallarına göre 180 ile çarpıp pi değerine bölmek gereklidir. Flash`ta ifade şöyledir:

A_derece=A_acısı*(180/Math.pi);

Açı bulunduktan sonra işimiz kolaylaştı. Yapılacak son işlem göz klibine bu bulunan açı değeri kadar rotasyon uygulamaktır. Bunun için setProperty komutu kullanılır:

setProperty ("goz", _rotation, A_derece);

Animasyonu oluşturalım:

1- Flash`ta yeni bir sayfa açalım. İnsert--> New Symbol komutunu verelim ve davranış olarak film klibini seçelim. Oval aracı ile mavi renkli bir daire çizelim. Bunun üzerine yine oval aracı ile gözbebeğini temsil edecek beyaz renkli bir daire çizelim. Burada bu beyaz dairenin ortaya değilde yana doğru yerleştirilmesi uygun olur. Tam ortada olursa gözün dönme hareketi belirgin olmayacaktır.

2- Ana sahneye yüz görüntüsü için bir çizim yapalım. Üst kısma bir katman ekleyerek göz klibini sahneye alalım. Bu işlemi bir kez daha yapalım. Şimdi sahnede 2 göz klibi vardır. Bunlara goz1 ve goz2 örnek adını verelim.

3- En üste aksiyon komutları için bir katman ekleyelim. Bu katmana 2. keyframe yerleştirelim. Diğer katmanlarada 2. kareyi eklemeyi unutmayalım. Yani her katmanda 2 kare olmalıdır. Aksiyon katmanında 1.kareyi seçelim ve yukarda anlattığımız şekilde heriki gözü hareket ettirecek şu komutları ekleyelim:

//Goz1 hareketleri
a = goz1._y-_ymouse;
b = goz1._x-_xmouse;
A_acısı = Math.atan2(a, b);
A_derece = A_acısı*(180/Math.pi);
setProperty ("goz1", _rotation, A_derece);

// Goz2 hareketleri
a2 = goz2._y-_ymouse;
b2 = goz2._x-_xmouse;
A_acısı2 = Math.atan2(a2, b2);
A_derece2 = A_acısı2/(Math.pi/180);
setProperty ("goz2", _rotation, A_derece2);

4- Şimdi 2. kareyi seçelim ve bu işlemlerin farenin her oynamasında tekrarlamasını sağlamak için:

gotoAndPlay(2);

komutunu verelim. Animasyonun estetik kısmı tamamen zevkinize göre şekillendirilebilir.