106.9K+İndir
Kullanım kılavuzuna geç
Motion Canvasyazan VideoZero

Motion Canvas Skill'i.

Generator’lar, reaktif sinyaller ve yeniden kullanılabilir düğümlerle Motion Canvas sahneleri yazın.

  • TypeScript
  • Canvas animasyonu
OpenDesign İndirKullanım Kılavuzunu Görüntüle
Kaynak incelemesi · motion-canvasSKILL.md
Görev Generator’lar, reaktif sinyaller ve yeniden kullanılabilir düğümlerle Motion Canvas sahneleri yazın. Çıktılar Projenin mevcut kurulumunu kullanan Motion Canvas sahne kodu. Başlamadan önce Mevcut Motion Canvas projesini, kurulu sürümünü ve eylem sıralı sahne brifini getirin. Hangi değerlerin ortak sinyal, hangi anların adlandırılmış zaman olayı olacağını belirleyin.
Editoryal özet · kaynak inceleme tarihi 2026-11-02 · oluşturulmuş bir örnek değildir

01 İşlevler

Generator’lar, reaktif sinyaller ve yeniden kullanılabilir düğümlerle Motion Canvas sahneleri yazın

Generator zamanlaması, reaktif sinyaller, düğüm referansları, şekiller ve açık sahne geçişleriyle Motion Canvas sahneleri oluşturun.

Kaynağa dayalı iş akışıÇalıştırma kıyaslaması değildir

Çalışma Yaklaşımı

motion-canvas, TypeScript ile Motion Canvas sahneleri yazmak için framework referansıdır. Generator tabanlı sıralamayı, reaktif sinyalleri, referansları ve sahne hiyerarşisini açıklar; ardından bunların şekil, metin, path ve medyayla birleşimini gösterir.

Kaynak; düğüm kaydetme/geri yükleme, adlandırılmış olayları bekleme, arka plan thread’leri çalıştırma ve özel geçişi bitirme gibi pratik durum ve zamanlama mekanikleri içerir. Ajan hangi sahneyi kuracağını biliyor ama bunu ifade edecek doğru framework kavramlarına ihtiyaç duyuyorsa yararlıdır.

Beklenen Çıktılar

  • Projenin mevcut kurulumunu kullanan Motion Canvas sahne kodu.
  • Yeniden kullanılabilir sinyaller, bileşenler ve zamanlama sekansları.
  • Yapılandırılmış önizleme ve render akışına hazır proje.
Örnek Brief'i Gör

Brifden İncelemeye

  1. 01
    Sahne nesnelerini tanımlayın

    Gerekli şekil ve metinleri oluşturun, referans atayın ve açık düğüm hiyerarşisine yerleştirin.

  2. 02
    Durumu zamanlamaya bağlayın

    Değişen değerler için sinyal, sıra için generator fonksiyonları kullanın. Birlikte çalışan eylemler için all(), animasyonun bitmesini bekleyen sıra için yield* kullanın. Adlandırılmış waitUntil() olayları sahneyi anlatımdaki belirli bir zaman noktasına hizalayabilir.

  3. 03
    Geçişleri ve çıktıyı kontrol edin

    slideTransition() başlamadan gelen sahnenin düğümlerini ekleyin; sonradan aniden belirmesinler. Özel useTransition(), geçiş animasyonu sonrasında çağrılması gereken bitiş fonksiyonu döndürür. Yapılandırılmış önizleme veya render’ı inceleyin, projeye özgü çıktı ayarlarını koruyun.

02 Kullanım Alanları

Ne zaman kullanılır

Mevcut Motion Canvas projesini, kurulu sürümünü ve eylem sıralı sahne brifini getirin. Hangi değerlerin ortak sinyal, hangi anların adlandırılmış zaman olayı olacağını belirleyin.

İyi Bir Uyum

  • Kod animasyonu kesin sıra gerektiriyorsaGenerator’lar ve adlandırılmış olaylar eylemler arasındaki ilişkiyi açık kılar.
  • Birkaç nesne değişen değer paylaşıyorsaHesaplanan sinyaller her düğümü elle güncellemek yerine geometriyi tek kaynaktan türetebilir.

Kontrol Edilecek Sınırlar

  • Framework mevcut olmalıdırSkill referanstır; çalışan Motion Canvas runtime’ı paketlemez.
  • Editör otomasyonundan ayrıdırZamanda gezinme, ekran görüntüsü ve HTTP render kontrolü tamamlayıcı motion-canvas-agent skill’ine aittir.
  • Referans örnekleri proje kontrolü gerektirirÖrnek uyarlamalarını mevcut framework sürümü ve çıktı yapılandırması belirlemelidir.

Bu Girdileri Getirin

  • Sahne brifiGörünür nesneleri, eylem sırasını ve açıklamayı veya hikâyeyi tanımlayın.
  • Proje kurulumuMevcut Motion Canvas kaynağını ve kurulu sürümü sağlayın.
  • Zamanlama ve çıktıSüreyi, olayları, kare boyutunu ve gereken render biçimini belirtin.

03 Önemli Kararlar

Önemli kararlar

  1. Reaktif sahne ilişkileri

    Hesaplanan sinyal bağımlı boyutları eşzamanlı tutabilir.

  2. Okunabilir sıralama

    Generator kodu beklemeleri, paralel eylemleri ve geçişleri kaynakta görünür kılar.

  3. Yeniden kullanılabilir bileşenler

    Özel düğümler ve kayıtlı durumlar tekrarlanan görselleri ve tersine çevrilebilir eylemleri destekler.

04 Örnek Görev Tanımı

Odaklı bir brief deneyin

Aşağıdaki örnek brif test edilmemiştir. Kullanmadan önce skill'in kurulumunu kontrol edin.

Kaynağı ve kurulumu inceleyin

Görünür nesneleri, eylem sırasını ve açıklamayı veya hikâyeyi tanımlayın.

Üst Kaynak Dosyası
https://github.com/VideoZero/skills/blob/670ff96af6149f0ac8850380a466f073471e600c/motion-canvas/SKILL.md

Aşağıdaki referans, özgün talimatları açar. Kullanmadan önce depo kurulumunu inceleyin; bu bir kurulum komutu değildir.

Tek bir çıktıyla başlayın

Skill'i çalıştırmadan önce bu brifteki kapsamı, kaynak materyali ve kısıtları uyarlayın.

Örnek Brif
Mevcut projemde üç paketin kuyruktan geçişini gösteren kısa sahne için motion-canvas kullan. Her pakete kararlı kimlik ver, kuyruk aralığını tek sinyalden türet. Etiketleri eylemden önce tanıt, paketleri sırayla hareket ettir ve sayımı görünür durumla eşzamanlı tut. Son açıklama beklemesi için adlandırılmış olay kullan. Kurulu framework sürümünü ve mevcut render ayarlarını koru. Sahne kodunu teslim et; özellikle geçiş bittikten sonra beliren nesneler açısından sahneye giriş ve çıkış geçişlerini incele.

Sonucu inceleyin

Gerçek çıktıyı bu gözlemlenebilir ölçütlere göre kontrol edin.

  • Sinyal ilişkilerini ve kararlı nesne referanslarını kontrol edin.
  • Sıralamayı, arka plan thread’lerini ve geçişin tamamlanmasını doğrulayın.
  • Yapılandırılmış önizlemeyi ve gerçek render çıktısını ayrı inceleyin.

OpenDesign, kodlama ajanları için yerel bir tasarım çalışma alanı sağlar. Bu listeleme, skill'in paketle birlikte geldiği veya harici araçlarının, kimlik bilgilerinin ve yazılım bağımlılıklarının dahil olduğu anlamına gelmez.

OpenDesign İndirHızlı Başlangıcı Oku

05 Kaynak ve Lisans

Kaynak ve lisans

Bu sayfa, aşağıda bağlantısı verilen sabitlenmiş kaynak revizyonunu açıklar. Upstream davranışı ve gereksinimleri değişebilir.

Kaynak Sahibi
VideoZero
Depo
VideoZero/skills
Skill Dosyası
SKILL.md
Lisans
Apache-2.0
İncelenen Sürüm
2026-11-02 · 670ff96af614
Editoryal Kaynak Özeti
Generator’lar, reaktif sinyaller ve yeniden kullanılabilir düğümlerle Motion Canvas sahneleri yazın.

Bağlantılı kaynağa dayanan, OpenDesign tarafından hazırlanmış özgün özet. Depo yıldızları tarihli bir popülerlik göstergesidir; skill kullanımını veya kalite puanını göstermez.

06 Başlamadan Önce Sorular

Başlamadan önce sorular

Generator fonksiyonları ne sağlar?

Zaman tabanlı sahne eylemlerini yield, bekleme ve birleşik animasyon işlemleriyle anlatır. Kaynak bunları temel sıralama mekanizması olarak kullanır.

Sinyaller ne için kullanılır?

Değişen değerleri tutar ve ortak yarıçaptan şekil boyutu gibi diğer değerleri reaktif olarak türetebilir.

Ekran görüntüsü otomasyonu var mı?

Framework referansı sahne yazımını kapsar. Tamamlayıcı motion-canvas-agent çalışan editör için HTTP kontrol ve ekran görüntüsü köprüsünü belgeler.

OpenDesign

Brief'inizi ve tasarım çalışmanızı bir arada tutun.

Brifinizi, kaynak materyalinizi ve tasarım çalışmanızı yerel bir çalışma alanında bir arada tutun. İş akışınıza eklemeden önce skill'in kendi kurulumunu kontrol edin.

OpenDesign İndirTasarım Skill'lerine Göz At
Üst Kaynak Dosyası
https://github.com/VideoZero/skills/blob/670ff96af6149f0ac8850380a466f073471e600c/motion-canvas/SKILL.md