KANA Piksel Tavşan Okçu

Prompt

Kopyalamak için giriş yapın

Saf JavaScript ve Canvas 2D kullanarak animasyonlu bir piksel sanatı tavşan okçusu çizen, tek başına çalışan tek bir HTML dosyası oluştur. Ekli KANA tavşanını görsel referans olarak kullan: beyaz kürk; iç kısımlarında camgöbeği/mavi ışıklı detaylar bulunan büyük, dik kulaklar; bir normal mavi göz ve bir kırmızı sibernetik mekanik göz; üzerinde “KANA” yazan sarı kapüşonlu üst; koyu mavi eldiven ve pantolon; sarı/mavi bilimkurgu tarzı mekanik bacak zırhı; sevimli chibi oranları; fütüristik yay ve ok; sırtta küçük bir sadak. Harici varlık, kütüphane, resim, yazı tipi veya ağ isteği kullanma. Her şey kodla prosedürel olarak çizilmeli. GÖRÜNTÜLEME - Önce her şeyi 160x120 sabit mantıksal çözünürlüklü ekran dışı bir canvas üzerine çiz. - Tarayıcı penceresine sığan en büyük tam sayı ölçeğiyle tam ekran görüntüleme canvas'ına büyüt ve ortala. - imageSmoothingEnabled = false ve CSS image-rendering: pixelated ayarla. - Tüm koordinatları tam sayılara hizala. Gradyan, bulanıklık, kenar yumuşatma, shadowBlur veya alt piksel çizimi kullanma. - Yaklaşık 28 renkten oluşan sabit palet kullan: arka plan için koyu lacivertler, kürk için beyaz/gri, kapüşonlu üst için sarılar, giysiler için maviler, sibernetik göz için kırmızılar, kulak ışıkları için camgöbeği ve yay/ok efektleri için sarı/turuncu. KARAKTER Tavşanı piksel dikdörtgenleri, çokgene benzeyen piksel dizileri, piksellerle yaklaşık çizilmiş daireler ve basit blok şekilleriyle prosedürel olarak oluştur. Yaklaşık boyut: 28–34 piksel genişlik, 40–48 piksel yükseklik. Siluet açıkça tanınabilir kalmalı: büyük tavşan kulakları, yuvarlak ve tüylü baş, küçük gövde, kırmızı sibernetik göz, sarı kapüşonlu üst, mekanik bacaklar, yay, ok ve sadak. Kulakları, başı, kolları, bacakları, kapüşonlu üstü, yayı, oku ve gövdeyi ayrı ayrı canlandır. Ana döngü 60 fps çizse de görsel hareket özenli bir 8–12 fps sprite animasyonu gibi hissettirsin diye pozları ayrık adımlara nicemle. EYLEMLER Şu sekiz eylemi içeren döngüsel bir animasyon gösterimi oluştur: 1. IDLE — Bekleme - Tavşan hazır durur; gövde hafifçe salınır, kulaklar belli belirsiz hareket eder, kapüşonlu üst ve sadak sallanır. - Sibernetik göz yumuşakça ışıldayıp söner; yay yanda rahatça tutulur. 2. RUN — Koşma - Güçlü, dönüşümlü bacak hareketiyle hızlı ileri koşu; kollar hareketi dengeler. - Yay bir elde tutulur, sadak zıplar, kulaklar hafifçe geriye uzanır ve ayakların altında küçük toz pikselleri belirir. 3. AIM — Nişan Alma - Ayaklar yere sağlam basar; yay kaldırılır, sadaktan ok alınır, kirişe takılır ve kiriş geriye çekilir. - Bir göz hedefe odaklanır, sibernetik göz daha parlak olur ve gövde atış yönüne hafifçe eğilir. 4. SHOOT — Atış - Kiriş bırakılır; ok ekranı hızla geçer, yay hafifçe geri teper ve kol hareketi tamamlar. - Okun arkasında parlak sarı enerji izi, 1–2 piksellik hafif ekran sarsıntısı, sibernetik gözde kırmızı parıltı ve yaydan kısa namlu alevi benzeri bir ışık patlaması görülür. 5. JUMP — Zıplama - Tavşan çömelir, yukarı zıplar ve bacaklarını gövdesinin altına toplar. - Kulaklar gecikmeli tepki verir; yay gövdeye yakın tutulur ve sıçrayışta küçük bir toz bulutu oluşur. - Pikselleri bozmayan tam sayılı dönüşümlerle hafif ezilme ve esneme uygula. 6. DODGE / ROLL — Kaçınma / Yuvarlanma - Hızla eğilip yana yuvarlanır; yay gövdeye yakın, kulaklar geriye yatıktır. - Küçük toz parçacıkları ve hareket pikselleri; alçak, savaşa hazır bir pozla biter. 7. HURT / HIT — Hasar / Darbe - Tavşan hafifçe geriye savrulur; baş aniden geriye gider, kulaklar belirgin tepki verir ve sibernetik göz titrek yanar. - Küçük piksel yıldızları veya darbe kıvılcımları belirir; yay aşağı iner ya da neredeyse düşer. Karakter kısa bir gecikmeden sonra toparlanır. 8. VICTORY — Zafer - Tavşan yayı başının üstüne kaldırır; mutlu bir ifade, oyuncu biçimde yana yatmış bir kulak ve parlak sibernetik göz görülür. - Küçük sarı kutlama parçacıkları ve kısa bir zafer zıplayışı. Son poz sevimli ve kahramanca hissettirmeli. DURUM MAKİNESİ Şu döngüyü kullan: IDLE → RUN → AIM → SHOOT → JUMP → DODGE → HURT → VICTORY → IDLE. Her eylem görsel olarak anlaşılacak kadar uzun sürmeli. Poz geçişlerinde easing işlevleri kullan; durumlar arasına kısa geçiş animasyonları ekleyerek döngünün aniden poz değiştirmek yerine kesintisiz akmasını sağla. YAY VE OK - Fütüristik kavisli yay, beyaz/koyu lacivert gövde, sarı ışıklı mekanik eklemler ve ince parlak kiriş. - Parlak sarı ok ucu; SHOOT sırasında ok izi kısa süre kalmalı. Sadakta birkaç görünür ok bulunmalı. PARÇACIKLAR Döngü içinde bellek ayırmayan, havuz kullanan bir parçacık sistemi uygula. Animasyon döngüsünden önce tüm parçacıkları önceden ayır. Türler: ayak tozu, ok izi, yay enerji kıvılcımları, sibernetik göz kıvılcımları, darbe yıldızları ve zafer parçacıkları. Her parçacık yaşlandıkça palet rengini değiştirir. Ana döngüde yeni nesne oluşturma. SAHNE Minimal bir piksel sanatı ortamı oluştur: karanlık gece göğü, birkaç 1 piksellik yıldız, büyük ay, basit taş veya fütüristik platform ve çok hafif uzak siluetler. Tavşanın silueti her zaman okunabilir kalsın diye arka plan sade olmalı. AIM ve SHOOT sırasında sibernetik gözden gelen hafif camgöbeği/kırmızı, yaydan gelen sarı kenar ışığı ekle. TEKNİK GEREKSİNİMLER Tek HTML dosyası; yalnızca saf JavaScript ve Canvas 2D; kütüphane, SVG, harici resim, varlık veya ağ isteği yok. Sabit 60 Hz zaman adımı; çizim için requestAnimationFrame; ana animasyon döngüsünde sıfır nesne tahsisi; kararlı 60 fps; duyarlı tam ekran ölçekleme; tam sayı ölçeğinde keskin pikseller. KALİTE HEDEFİ Sonuç, 16 bitlik bir aksiyon oyunu başkahramanının özenle hazırlanmış sprite animasyonu gibi görünmeli. Basit geometrik şekiller görünümünden kaçın. Tavşan ifadeli, sevimli, hızlı ve savaşabilir hissettirmeli. Sekiz eylemin siluetleri belirgin biçimde farklı olmalı. Karakter tasarımı tüm animasyon durumlarında tutarlı kalmalı. Sonuç gerçek bir piksel sanatı aksiyon oyununa uygun hissettirmeli.