Claude ile ürün tanıtım videosu: tek prompt değil, 6 adım

Üç şeye ihtiyacın var: referans bulacağın bir yer (whatships.com, X'te paylaşılmış ürün tanıtım videolarının arşivi), kodu videoya çeviren bir motor (HyperFrames ya da Remotion) ve videoya koyacağın gerçek arayüz (kendi uygulaman ya da 21st.dev). Hepsinin linki aşağıda.

Aşağıda fazladan olan şey şu: HyperFrames'in gerçekte neye ihtiyaç duyduğu (Node 22 ve FFmpeg, yoksa render çalışmıyor), Claude Code'a kurmanın iki yolu, Remotion'ın hangi durumda ücretli olduğu ve videoyu sahne sahne yöneten Türkçe prompt.

1. Sıfırdan başlama, referansla başla. Referans vermezsen Claude kendi varsayılan görünümüne döner. Bir stili tarif etmek yerine "şu videodaki gibi" demek her seferinde daha iyi sonuç veriyor.

2. Doğru aracı kur. HyperFrames ve Remotion ikisi de her sahneyi kod olarak yazdırıp doğrudan MP4'e çeviriyor. Bunun faydası şu: bir şeyi değiştirmek istediğinde baştan üretmiyorsun, tek satırı düzeltip yeniden render alıyorsun.

3. Claude'a gerçek arayüz ver. Kendi uygulamanın ya da sitenin kodunu ve ekran görüntülerini kullan. Henüz yoksa 21st.dev gibi bir bileşen kütüphanesinden al. Aksi halde Claude sahte duran butonlar ve boş kutular uyduruyor, video da o an ucuz görünüyor.

4. Promptu yapıştır. Aşağıdaki promptu referanslarınla ve videonun akışıyla birlikte ver.

5. Önce storyboard. Claude her sahne için tek bir kare çıkarıyor, sen render başlamadan notlarını veriyorsun. Yanlış giden bir sahneyi burada düzeltmek, 30 saniyelik videoyu yeniden render etmekten çok daha ucuz.

6. Tekrar et. En önemli adım bu. İlk render mükemmel olmayacak. Her sürüme geri bildirim ver; yazmak zor geliyorsa sesli not kullan.

HyperFrames, HeyGen'in açık kaynak (Apache-2.0) aracı. HTML, CSS ve GSAP ile yazılmış sahneleri MP4'e çeviriyor. Claude Code'a iki yolla ekleyebilirsin; ikisi de aynı skill'leri getiriyor.

claude plugin marketplace add heygen-com/hyperframes
claude plugin install hyperframes@hyperframes

npx skills add heygen-com/hyperframes

Eklenti yolunda Claude Code içinde /hyperframes:hyperframes ile başlatıyorsun. Projeyi kendin açıp elle önizlemek istersen CLI da var:

npx hyperframes init video-projem
cd video-projem
npx hyperframes preview   # tarayıcıda canlı önizleme
npx hyperframes render    # MP4 çıkar

Remotion aynı işi React bileşenleriyle yapıyor. Uygulaman zaten React ise bileşenlerini doğrudan videoya taşıyabildiğin için daha rahat olabilir.

npx skills add remotion-dev/skills
npx create-video@latest

Promptla birlikte şu dosyaları ekle: beğendiğin üç referans video, uygulamanın ekran görüntüleri, bileşen kodun, marka dosyan ve her sahneyi bir satırda anlatan akış dosyan. Prompt bu dosya adlarına göre yazıldı; dosyalarının adı farklıysa ya onları yeniden adlandır ya da prompttaki adları değiştir.

BRIEF
Ürünüm için HyperFrames ile 30 saniyelik bir tanıtım videosu yap, 1080x1920, 60fps.
Fikir: ilk 3 saniyede problem, 8. saniyeye kadar ürünün onu çözmesi, sonra üç özellik, sonra kapanış kartı.

REFERANSLAR
Ekteki üç referans videonun temposunu, tipografisini ve geçişlerini yakala. Her 1,5 ila 2 saniyede bir kes. Ritme oturan sert kesmeler, fade yok.
ref-2'nin arayüzde tek bir detaya zoom yapışını ve ref-3'ün başlığı kelime kelime yazışını aynen uygula.

SADECE GERÇEK ARAYÜZ
components.tsx içindeki gerçek bileşenlerimi ve gerçek ekran görüntülerimi kullan. Asla arayüz uydurma. Sana vermediğim bir ekrana ihtiyacın olursa benden iste.

MARKA
brand.md içindeki renkleri, fontları ve logoyu kullan. Tek bir vurgu rengi. Büyük yazı, kısa satırlar, ekranda asla altı kelimeden fazla olmasın.

AKIŞ
flow.md'yi sahne sahne takip et. Önce storyboard'u yaz, her sahne için tek bir kare, ve herhangi bir şey render etmeden önce notlarımı bekle.

RENDER ALIRKEN
Önce lint, sonra render. Ardından kendi render'ını kare kare izle; üst üste binen, kırpılan ya da iki saniyeden uzun hareketsiz kalan her şeyi düzelt.

Remotion kullanıyorsan ilk satırdaki "HyperFrames ile" kısmını "Remotion ile" yap. 1080x1920 dikey format, yani Reels ve TikTok için; X ya da YouTube için yatay istiyorsan 1920x1080 yaz.