Kimi API for Vision-to-Code Generation

Oynanabilir bir Snake arcade oyunu için eksiksiz, tek dosyalık bir HTML sayfası oluştur; tüm CSS ve JavaScript satır içinde olsun ve harici bağımlılık, CDN, görsel ya da font kullanılmasın. Oyun tahtasını modern, koyu zemin üzerinde neon renk şemasıyla bir canvas üzerinde çiz; akıcı hareket ve yılanın arkasında yumuşak parlayan bir iz efekti olsun. Ok tuşları ve WASD kontrollerinin yanı sıra dokunmatik cihazlarda kaydırma hareketlerini destekle; canlı skoru ve kalıcı yüksek skoru göster; skor arttıkça oyunu kademeli olarak hızlandır. Yem yenildiğinde küçük bir parçacık patlaması tetikle, yeniden başlatma düğmesi olan animasyonlu bir oyun bitti katmanı göster ve düzeni responsive tutarak tahtanın hem masaüstünde hem mobilde ortalanmış ve okunaklı kalmasını sağla.

Tek, tamamen kendi kendine yeten bir HTML dosyası oluştur (tüm CSS ve JavaScript satır içinde, kesinlikle harici bağımlılık, CDN, görsel veya web fontu yok). Bu dosya etkileşimli bir "yaşayan dijital teraryum" oluştursun: ekranın merkezinde duran, içinde gerçek zamanlı büyüyen, kendi kendini sürdüren minyatür bir yağmur ormanı bulunan kapalı bir cam kavanoz. Herhangi bir modern tarayıcıda açıldığında derleme adımı olmadan hemen 60fps çalışmalıdır. Ana sahne ve düzen: Kompozisyonu simetrik biçimde ortala; cam kavanozu, derin ve vignette uygulanmış koyu bir arka plan üzerinde baş sahne olarak ele al (yumuşak yosun ışıklı merkezden neredeyse siyah kenarlara solan radial gradient), böylece tüm odak kavanoza yönelsin. Her şeyi, gerçek glassmorphism DOM/CSS arayüz katmanının altında tam pencere HTML5 Canvas üzerinde çiz: kavanoz duvarı gerçek cam nitelikleri göstermeli — kavisli kırılma vurguları, parlak speküler rim-light şeridi, hafif buzlu blur ve minik lens etkileri olan dağınık yoğuşma damlacıkları — bunlar katmanlı radial/linear gradient’ler, backdrop-filter blur, yarı saydam beyaz çizgiler ve yumuşak box-shadow’larla elde edilmeli. Kavanozun içinde altta koyu, nemli humus ve yavaşça süzülen hafif hacimsel bir sis bulunsun. Üst üste durması ve birlikte var olması gereken üç teknik katman (zayıf ve güçlü modelleri ayıran yer burasıdır — zayıf model statik bir resim üretir, güçlü model tüm kavanozu canlı kılar): 1. Recursive L-system growth: sarmaşıklar, eğrelti yaprakları ve yosunlar bir L-system / recursive branching algoritmasıyla üretilir ve zaman içinde açılarak büyümeleri animasyonlanır — gövdeler uzar, dallar alt dallara ayrılır, yaprakçıklar kıvrımlarını açar, yapraklar easing ile ölçeklenerek belirir. Büyüme organik ve dal başına hafif rastlantısal olmalıdır (açı jitter’ı, kalınlık incelmesi, uzunluk azalması), böylece yeniden yüklendiğinde hiçbir iki bitki aynı görünmez. 2. Particle system: kehribar renkli ateş böceği benzeri ışık zerrecikleri (düzinelerce) yumuşak additive glow ve hafif parallax ile sisin içinde sürüklenip salınır; ayrıca yükselen yoğuşma/polen tanecikleri bulunur. Parçacıklar yeni büyüyen bitkilere incelikle tepki verir. 3. Day–night lighting cycle: sürekli bir ortam ışığı döngüsü, üstten gelen ana ışığı soğuk beyaz şafak → sıcak altın gün batımı → derin indigo gece ve tekrar geri olacak şekilde dolaştırır; tüm sahneyi, cam vurgularını, sisi ve bitki tonlarını buna göre yeniden renklendirir. Bitkiler fototropizm sergiler — gövdeler, ışık yönü hareket ettikçe uçlarını mevcut ışık yönüne doğru eğer ve yöneltir. Birincil etkileşim: Kavanoz duvarının/içinin herhangi bir yerine tıklamak, tıklanan x konumunda humusa tek bir tohum düşürür ve bu tohum sırasıyla tam, görünür bir yaşam döngüsü oynatır — tohum düşer ve yerleşir, filizlenir, filiz L-system ile recursive biçimde dallanır, sonra olgunlukta küçük parlayan bir çiçek açar — her aşama easing’li ve net okunur olmalı; inişte yumuşak bir dalga/toz pufu efekti bulunmalı. Birden fazla tıklama, birlikte var olan ve büyümeyi sürdüren birden fazla bitki oluşturur; teraryum zamanla daha yoğun bir çalılığa dönüşür. Glassmorphic pill düğmeler içinde birkaç ince satır içi kontrol ekle (ör. "Teraryumu sıfırla" ve kullanıcının günün saatini ileri geri gezdirebildiği bir "Gündüz/Gece: otomatik ⇄ sürükle" anahtarı, ayrıca isteğe bağlı duraklatma). İlk etkileşimden sonra kaybolan hafif bir ipucu satırı ekle ("tohum dikmek için cama dokun"). Palet ve atmosfer: orman mürekkebi yeşili ve yosunumsu sarı-yeşil yapraklar; ışık zerrecikleri ve çiçekler için kehribar/bal parıltısı; kavanozda serin camgöbeği-cam tonları; gündüz-gece geçişi boyunca sıcak altın ve soğuk indigo yıkamaları. Genel his sessiz, nefes alan, meditatif olmalı — yavaş ve nazik hareket, sert geçişler yok. Teknik gereksinimler: Animasyonun kare hızından bağımsız olması için delta-time ile requestAnimationFrame kullan; canvas’ı pencere yeniden boyutlandırmasına duyarlı hale getir, doğru devicePixelRatio ölçeklemesi yap ve kavanozu ortada tut; akıcı kalması için parçacık/dal sayılarını makul biçimde sınırla; büyümenin doğal görünmesi için tüm rastlantısallığı bitki bazında seeded tut. Geometri, parıltı, cam, sis, aydınlatma, parçacıklar ve recursive bitkiler dahil her şey kodla çizilmeli veya hesaplanmalı; harici asset kesinlikle kullanılmamalı. Yalnızca tek bir .html dosyası olarak kaydedilip açılmaya hazır eksiksiz HTML belgesini teslim et.