Pahalı montaj programlarına ihtiyaç duymadan, doğrudan kod yazarak profesyonel motion graphic videolar üretmek mümkün. Bu rehberde, Remotion adlı açık kaynaklı React kütüphanesini bilgisayarınıza kurup, yapay zeka desteğiyle kendi animasyonlu video sahnelerinizi nasıl oluşturacağınızı adım adım anlatıyoruz.
Tüm süreç kendi bilgisayarınızda (yerel/localhost) çalışır bulut aboneliği, render ücreti ya da stok video maliyeti yoktur.
Remotion Nedir?
Remotion, videoları timeline'da sürükleyip bırakarak değil, doğrudan React (JavaScript) kodu yazarak oluşturmanızı sağlayan açık kaynaklı bir kütüphanedir. Her sahne, her animasyon, her saniye kodla tanımlanır bu da hem hassas kontrol hem de yapay zeka modelleriyle (Gemini, Claude, ChatGPT gibi) kolayca sahne üretebilme imkanı sağlar.
Neden Remotion?
- Ücretsiz: Bireysel kullanıcılar ve 3 kişiye kadar şirketler için tamamen ücretsiz, ticari kullanımda dahil.
- Yerel çalışır: Render işlemi kendi bilgisayarınızın donanımında gerçekleşir, bulut sunucusuna ihtiyaç yoktur.
- Yapay zekayla uyumlu: Kod tabanlı olduğu için, bir AI modeline "şu sahneyi yaz" diyerek doğrudan kullanılabilir React bileşenleri üretebilirsiniz.
- Esnek: Veri görselleştirme, sayaç animasyonları, metin efektleri gibi karmaşık motion graphic işleri, geleneksel araçlardan çok daha hassas şekilde kodla kontrol edilebilir.
Gereksinimler
Başlamadan önce bilgisayarınızda Node.js kurulu olmalı. Node.js, JavaScript kodunu tarayıcı dışında çalıştırmanızı sağlayan bir çalışma zamanı ortamıdır ve Remotion'ın çalışması için gereklidir.
Adım 1: Node.js Kurulumu
- nodejs.org adresine gidin.
- "LTS" (uzun süreli destek) etiketli sürümü indirin bu, en stabil sürümdür.
- İndirilen kurulum dosyasını çalıştırıp varsayılan ayarlarla kurulumu tamamlayın.
- Kurulumun başarılı olduğunu doğrulamak için terminal/komut istemcisini açıp şu komutu çalıştırın:
node -v
Bir sürüm numarası (örneğin v20.x.x) görüyorsanız, kurulum başarılı demektir.
Adım 2: Remotion Projesi Oluşturma
Terminali açın, projenizi oluşturmak istediğiniz klasöre gidin ve şu komutu çalıştırın:
npx create-video@latest
Bu komut size birkaç seçenek sunacak:
- Şablon seçimi: Başlangıç için "Hello World" şablonunu seçin.
- Stil kütüphanesi: Tailwind CSS kullanmak isterseniz "y" (evet) seçeneğini işaretleyin bu, sahnelerinizi stillendirmeyi kolaylaştırır.
Kurulum birkaç dakika sürebilir, bağımlılıklar otomatik olarak indirilir.
Adım 3: Yerel Stüdyoyu Başlatma
Proje klasörüne girin ve geliştirme sunucusunu başlatın:
cd <proje-adiniz>
npm run dev
Eğer bir hata alırsanız, önce bağımlılıkların eksiksiz kurulduğundan emin olun:
npm install
Sunucu başladıktan sonra tarayıcınızda otomatik olarak localhost:3000 açılacak ve Remotion Studio arayüzünü göreceksiniz. Sol panelde mevcut "kompozisyonları" (video şablonlarını), sağda ise canlı önizlemeyi görebilirsiniz.
Adım 4: Yapay Zekaya Sahne Kodu Yazdırma
Artık istediğiniz sahneyi bir yapay zeka modeline tarif edip, kullanılabilir React kodu alabilirsiniz. Örnek bir prompt:
Bana Remotion kütüphanesi kullanarak dikey formatta (1080x1920),
sayaç ve neon ışık efekti barındıran bir React bileşeni yaz.
Daha karmaşık, çok sahneli videolar için, isterseniz sahnelerin zamanlamasını, renk paletini ve geçiş efektlerini de prompt içinde detaylandırabilirsiniz ne kadar spesifik olursanız, sonuç o kadar isteğinize yakın çıkar.
Adım 5: Bileşeni Projeye Ekleme
Yapay zekanın ürettiği .tsx dosyasını projenizin src/ klasörüne kaydedin. Ardından src/Root.tsx dosyasını açıp, yeni bileşeninizi bir <Composition /> olarak tanımlayın:
import { Composition } from 'remotion';
import { SahneAdiniz } from './SahneAdiniz';
<Composition
id="SahneAdiniz"
component={SahneAdiniz}
durationInFrames={300}
fps={30}
width={1080}
height={1920}
/>
Kaydettiğinizde, Remotion Studio otomatik olarak yenilenir ve yeni sahneniz sol panelde belirir.
Adım 6: Önizleme ve Render Alma
Stüdyoda oynat tuşuna basarak sahnenizi canlı izleyebilir, beğendiğiniz noktada durdurup düzenleyebilirsiniz. Sonuçtan memnun kaldığınızda:
- Stüdyo arayüzündeki Render butonuna tıklayarak, veya
- Terminalden şu komutla:
npx remotion render SahneAdiniz out.mp4
video dosyanızı MP4 olarak dışa aktarabilirsiniz.
Sık Karşılaşılan Sorunlar
- "npm run dev" hata veriyor:
npm installkomutunu tekrar çalıştırıp bağımlılıkların eksiksiz kurulduğundan emin olun. - Yapay zekanın verdiği kod çalışmıyor: Remotion'ın belirli sürümüne özgü API farklılıkları olabilir; hata mesajını AI modeline geri yapıştırıp düzeltmesini isteyin.
- Render çok yavaş: Video çözünürlüğünü veya süresini geçici olarak düşürerek test edin, son render'ı tam kalitede alın.
Lisans ve Ticari Kullanım
Remotion, bireysel kullanıcılar ve 3 kişiye kadar olan şirketler için ticari kullanım dahil tamamen ücretsizdir. 4 veya daha fazla kişilik ekipler için ayrı bir şirket lisansı gerekir. Güncel lisans koşullarını remotion.dev/docs/license/faq adresinden kontrol edebilirsiniz.
Sonuç
Remotion, video üretimini görsel arayüzlerden kod dünyasına taşıyarak hem maliyet hem de esneklik açısından ciddi bir avantaj sunuyor. Yapay zeka modelleriyle birlikte kullanıldığında, saatler süren manuel animasyon işleri dakikalar içinde tamamlanabiliyor. İlk sahnenizi kurduktan sonra, kütüphanenin diğer özelliklerini (ses senkronizasyonu, veri tabanlı animasyonlar, çoklu sahne geçişleri) keşfetmeye devam edebilirsiniz.
