Impor SVG Apple Motion: Periksa Artwork Sebelum Menganimasikan

Apple Motion mendukung impor SVG. Panduan fitur Motion 6.3 Apple mencantumkan dukungan SVG, sehingga saran lama yang mengarahkan setiap SVG melalui format lain bukan titik awal yang andal untuk versi itu. Mulailah dengan file statis, impor sebagai media, dan periksa hasilnya sebelum membangun animasi.

Ada tiga pertanyaan berbeda untuk dijawab: apakah artwork muncul, apakah transparansinya terlihat benar, dan dapatkah Anda mengendalikan bagian yang perlu bergerak secara mandiri? Grafis yang muncul di canvas hanya menjawab yang pertama. Itu tidak membuktikan bahwa setiap path SVG telah menjadi shape Motion native.

Alur kerja ini menggunakan lambang cincin dan cakram sederhana agar pemeriksaan tersebut terlihat. Ini adalah prosedur terdokumentasi untuk dicoba dalam versi terinstal Anda, bukan laporan pengujian impor Motion native.

Sesuaikan alur kerja dengan versi Motion dan tugas Anda

Periksa versi terinstal sebelum mengikuti posting forum lama atau mengimpor kumpulan besar. Panduan SVG Apple saat ini menjelaskan penggunaan yang didukung dan keterbatasan khusus. Jika instalasi berbeda dari versi yang didokumentasikan, periksa panduan yang sesuai sebelum mendiagnosis artwork itu sendiri.

Tentukan apa yang perlu terjadi setelah impor:

Baris terakhir sangat penting. Dokumentasi SVG Motion menyatakan bahwa SVG beranimasi hanya menampilkan frame pertamanya. Mengimpor file beranimasi tidak sama dengan mengimpor animasinya.

Jika Anda memilih di antara aplikasi animasi, panduan penelusuran logo After Effects dan alur kerja penelusuran Adobe Animate menjelaskan objek tujuan masing-masing. Perintah dan jenis objeknya tidak dapat dipertukarkan dengan impor media Motion.

Mulai dengan sumber yang dapat Anda periksa

Simpan contoh orisinal ini sebagai orbit-mark.svg:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 120">
  <circle cx="68" cy="66" r="34" fill="none" stroke="#157D78" stroke-width="14"/>
  <circle cx="126" cy="24" r="12" fill="#EF8067"/>
</svg>

Cincin hijau kebiruan memiliki pusat kosong. Cakram koral lebih kecil berada di atas dan kanannya, terpisah oleh celah. File tidak memiliki persegi panjang latar belakang, teks, referensi gambar eksternal, skrip, atau animasi. Pilihan itu menjadikannya dasar berguna untuk memeriksa lambang yang lebih rumit nanti.

Buka terlebih dahulu dalam editor sumber. Periksa bukaan cincin, celah, dan batas canvas. Simpan master yang dapat diedit, karena memperbaiki artwork dan memperbaiki pengaturan impor adalah tugas berbeda.

Untuk file Anda sendiri, sederhanakan salinan penyerahan hanya ketika fitur khusus menimbulkan masalah. Desain dengan tulisan membutuhkan strategi font eksplisit; gunakan daftar pemeriksaan perubahan font SVG sebelum ekspor. Pertahankan teks yang dapat diedit dalam master meskipun salinan penyerahan membutuhkan tulisan outline. Jangan menelusuri vektor yang sudah dapat digunakan hanya karena aplikasi tujuan berbeda.

Impor ke komposisi, lalu periksa media

Pilih grup tempat Anda ingin lambang muncul. Dalam alur kerja impor Motion saat ini, pilih File > Import > Media, atau tekan Command-I, pilih SVG, dan impor. Anda juga dapat menyeret file dari Finder ke canvas atau grup dalam daftar Layers.

Setelah impor, cari grafis dalam canvas dan lapisannya dalam grup yang dimaksudkan. Hindari menilai file hanya berdasarkan apakah namanya muncul dalam daftar Media. Apple juga mendokumentasikan impor ke daftar itu tanpa menambahkan media ke komposisi; dalam kasus itu, media belum akan muncul dalam canvas atau daftar Layers.

Letakkan lambang di atas latar belakang kontras untuk pemeriksaan. Lihat pusat terbuka dan ruang di antara kedua bagian. Latar belakang penampil gelap dapat membuat konten hilang dan konten transparan terlihat serupa sehingga sulit dibedakan.

Untuk memeriksa substitusi latar belakang Motion, klik Media dalam Project pane dan pilih objek SVG. Buka Media Inspector. Halaman SVG Apple mendokumentasikan Use Background Color dan kontrol warna terkait. Biarkan substitusi tersebut mati ketika tujuan Anda mempertahankan area transparan sumber; aktifkan hanya ketika warna pengganti memang disengaja.

Persegi panjang opak yang sudah digambar di dalam SVG merupakan masalah terpisah. Mematikan opsi latar belakang media tidak menghapus path yang termasuk dalam artwork. Panduan latar belakang SVG transparan membahas diagnosis tingkat sumber itu.

Uji kontrol bagian sebelum menambahkan keyframe

Pilih lambang yang diimpor dan buat perubahan posisi kecil yang dapat dibalik. Jika cincin dan cakram bergerak bersama, itu perilaku berguna untuk satu grafis. Pulihkan posisi, lalu tanyakan apakah animasi yang direncanakan membutuhkan lebih banyak kendali.

Untuk cakram yang bergerak secara mandiri, coba pilih dan pindahkan hanya bagian itu. Terima penyerahan hanya ketika cincin tetap di tempat dan objek yang dimaksudkan dapat diakses secara mandiri. Nama grup SVG, celah terlihat, atau thumbnail lapisan tidak cukup sebagai bukti dengan sendirinya.

Jika objek yang tersedia tidak menyediakan kontrol yang Anda perlukan, pilih konstruksi yang menyediakannya. Untuk contoh sederhana ini, menggambar cincin dan cakram sebagai shape native terpisah merupakan opsi yang masuk akal. Panduan bentuk sederhana Apple menjelaskan Circle tool dan kontrol warna serta outline-nya. Bangun cincin dengan outline dan isian kosong, serta cakram dengan isian solid, lalu periksa seleksi setiap objek secara terpisah.

Untuk artwork lebih rumit, opsi lain adalah menyiapkan file sumber terpisah untuk bagian yang membutuhkan gerakan mandiri. Pertahankan canvas bersama dan catat perataan yang dimaksudkan dalam editor sumber. Verifikasi penempatannya setelah impor; kumpulan file tidak otomatis merupakan tata letak siap animasi.

Ini adalah keputusan tentang objek yang diperlukan, bukan janji bahwa impor SVG memecah artwork menjadi shape native. Jika Anda membutuhkan deformasi tingkat titik, pastikan konstruksi yang dipilih menyediakan kontrol geometri yang diperlukan sebelum melanjutkan animasi.

Diagnosiskan konten yang tidak didukung dengan salinan lebih sederhana

Keterbatasan SVG Apple mengidentifikasi beberapa alasan file dapat berbeda dari editor sumber. Gunakan gejala untuk memilih pemeriksaan berikutnya.

Jangan menginterpretasikan keterbatasan referensi eksternal sebagai bukti bahwa setiap fitur SVG mandiri yang mungkin ada berfungsi. File dasar lebih kecil membantu mengisolasi ketergantungan, tetapi artwork akhir tetap membutuhkan pemeriksaannya sendiri.

Setelah tampilan statis benar, tinjau lambang pada ukuran terkecil dan terbesar yang digunakan dalam komposisi. Perhatikan bukaan dalam cincin dan celah di samping cakram. Kemudian periksa bagian pendek hasil ekspor pada resolusi penyerahan yang dimaksudkan. Geometri sumber vektor tidak menghapus kebutuhan memeriksa compositing, efek, dan frame video akhir.

Siapkan lambang yang hanya berupa raster untuk Motion

Jika lambang yang dapat diedit hilang dan hanya PNG atau JPG sederhana tersisa, alur kerja gambar-ke-vektor PerfectVector dapat membantu menyiapkan kandidat SVG statis. Crop ke lambang, periksa pratinjau untuk bukaan cincin terisi, cakram tergabung, atau bentuk latar belakang yang tidak diinginkan, dan bandingkan kandidat dengan sumber. Unduh artwork yang diterima, lalu ulangi pemeriksaan impor dan objek mandiri.

Vektorisasi tidak memulihkan keyframe, waktu, lapisan Motion native, atau rig animasi. Gunakan master vektor yang sudah ada jika tersedia. Pertahankan foto dan gambar sarat efek sebagai raster ketika itu lebih baik menjaga tampilannya; gambar cincin dan cakram sederhana langsung di Motion ketika kendali objek native merupakan kebutuhan sebenarnya.

Sebelum menyerahkan proyek kepada orang lain, catat nama file sumber, versi Motion, pilihan latar belakang, dan elemen mana yang harus tetap terpisah. Sertakan master yang dapat diedit dan referensi yang menunjukkan susunan yang dimaksudkan. Alur kerja artwork di blog membahas keputusan persiapan sebelum penyerahan tersebut.

FAQ

Dapatkah Apple Motion mengimpor file SVG secara langsung? Ya. Dokumentasi Motion 6.3 Apple mencantumkan dukungan SVG. Gunakan alur kerja impor untuk versi terinstal Anda, lalu periksa artwork dan kontrol yang diperlukannya.

Apakah mengimpor SVG mempertahankan animasinya? Tidak. Motion hanya menampilkan frame pertama SVG beranimasi. Jika frame itu transparan, artwork impor mungkin tampak kosong.

Mengapa SVG saya memiliki latar belakang berwarna dalam Motion? Periksa Use Background Color dalam Media Inspector dan periksa sumber untuk bentuk latar belakang opak. Pengaturan latar belakang media dan persegi panjang yang digambar ke SVG merupakan penyebab terpisah.

Apakah setiap path SVG menjadi shape Motion yang dapat diedit? Jangan menganggapnya dari impor yang berhasil. Uji apakah bagian dan kontrol geometri yang diperlukan tersedia. Siapkan objek terpisah atau gunakan konstruksi native yang sesuai ketika animasi membutuhkan kendali mandiri.

Sources

1. Apple — Yang baru dalam Motion — Dukungan SVG Motion 6.3 yang didokumentasikan.
2. Apple — Bekerja dengan file SVG dalam Motion — Kontrol transparansi dan batas fitur SVG.
3. Apple — Impor media ke Motion — Impor media, penempatan grup, dan impor hanya ke daftar Media.
4. Apple — Gambar bentuk sederhana dalam Motion — Alternatif native untuk geometri sederhana yang dikendalikan terpisah.

Periksa tampilan dan struktur objek satu lambang sebelum menyiapkan seluruh sequence. Jika hanya artwork raster tersisa, siapkan kandidat SVG statis, periksa bagian terpisah, dan validasi file yang diterima dalam Motion sebelum menganimasikan.