Claude Opus 5.5 için HTML/Canvas kullanarak, yay fizikleri ve ritim senkronize geçişlerle döngüsel, sofistike bir UI hareket tasarımı videosu oluşturmak üzere detaylı istem.
Komut
<inputs>
Bana şu 3 şeyi sor: Birbirine dönüşen 8-12 UI bileşeni (örneğin, buton, yükleyici, müzik çalar, ses kaydırıcısı, anahtar, sekme, grafik, komut paleti, bildirim), renk şeması (katı siyah-beyaz veya tek vurgu rengi) ve yaklaşık 120 BPM'lik telifsiz bir parça (örneğin, Mixkit'ten).
</inputs>
<direction>
Dribbble'da yer alacak kadar cilalı ekran hareketleri yarat. Yalnızca tek bir şekil kullan; asla sahne kesme. Tüm durumları, kısa bulanıklıklar ile içeriği değiştirerek boyut, köşe yarıçapı ve rengi değişen aynı şekille temsil et. İmleç, gerçek tıklama ve sürüklemelerle tüm değişiklikleri yönlendirir. Arka plan sıcak açık gri, bileşenler siyah ve beyazdır. Metin Japonca (Noto Sans JP) ve İngilizce/simgeler (Geist) olarak yazılır. Tüm hareketler, minimum aşırı salınımla doğal yay fiziğini kullanır. Kamera her durum için ekranı dolduracak şekilde yakınlaşır. Mükemmel döngü kur (son kare ilk kareyle eşleşmeli). Yasak olanlar: zıplamalı hareket, parçacık patlamaları, parlama efektleri, bileşenlerde gradyanlar, tutarsız simge ağırlıkları, sessiz boşluklar, şablon benzeri estetik.
</direction>
<structure>
120 BPM, 7 ölçü (~14 saniye), her vuruşta bir şey olur.
Buton -> Yükleyici -> Onay İşareti -> Dynamic Island tarzı -> Müzik Çalar oynat/duraklat dönüşümü -> Kaydırıcı sürükleme -> Ses kaydırıcısı gerilmesi -> Anahtar senkronizasyonu -> Sıvı sekme seçimi -> Sekme kendi kendini çizen grafiğe açılır -> Komut Paletine daralır -> Yaz/Ara -> Enter -> Bildirim -> Butona geri dön.
</structure>
<build>
1. Tek HTML dosyası, 1440x1440 kare. Tüm görselleri seek(t) içinde hesapla. CSS geçişleri/zamanlayıcıları yok. Kareler arasında durumsuz ol.
2. Yayları kapalı form adım tepkileri olarak modelle. Değişen hedefler için hesaplamaları üst üste bindir.
3. Sekme seçimi: Sol/sağ kenarlar için ayrı yaylar, öndeki kenar daha hızlı uzar.
4. Sürükleme: Tutulduğu sürece doğrudan manipülasyon, bırakıldığında yay ile geri dönüş.
5. Ses analizi için numpy kullanarak vuruş ızgarasını belirle. Sesleri ölçülen tepe noktalarına senkronize et.
6. Playwright ile render et. 60fps'te hareket bulanıklığı için ffmpeg tmix ile karıştırmak üzere her kare için 4 alt kare dışa aktar.
7. Tam render öncesi zamanlama/okunabilirlik sorunlarını düzeltmek için her vuruş başına bir önizleme karesi göster.
</build>
<gotchas>
Kamera yakınlaştırılmış öğelerde asla will-change kullanma (metin bulanıklığına neden olur). Giren/çıkan metinlere örtüşmeyi önlemek için benzersiz zamanlamalar ver. Pürüzsüz döngü için son karenin ilk kareyle tam olarak eşleştiğinden emin ol (imleç konumu/hızı dahil).
</gotchas>
<start>
Önce girdileri iste, ardından kod yazmadan önce bana vuruş bazında durum listesini göster.
</start>
Bu prompt nasıl kullanılır
1
Yukarıdaki tam prompt'u kopyalayın.
2
Claude Opus 5.5'i destekleyen bir platform açın (örneğin YouMind) ve prompt'u yapıştırın.
3
Konuyu, stili veya ayrıntıları fikrinize göre değiştirin ve üretin.
Bu, YouMind'ın prompt kütüphanesinden ücretsiz bir AI prompt'udur. Kopyalayıp uyarlayabileceğiniz binlerce videolar prompt'u daha keşfedin.
Yapay zekanın on binlerce komutu taramasına izin ver. Modele, tarih aralığına ve anahtar kelimeye göre filtrele; görüntülenme, kaydetme, paylaşım gibi etkileşim metriklerine göre sırala.
Her fotoğrafı ayrıntılı bir AI görsel prompt'una dönüştürün. Ücretsiz görselden prompt'a dönüştürücü kompozisyonu, stili ve ışığı analiz eder; istediğiniz görünümü saniyeler içinde yeniden yaratırsınız.
