Animasi menjadi mudah: Warna

Mengenai konsep warna, kami sudah memikirkan untuk membuat semuanya menjadi sangat sederhana dan minimal dengan latar belakang biru dan teks kuning. Biru dan kuning adalah warna komplementer, membuatnya mudah dibaca, dan saling kontras.

Kami sebenarnya bisa membuat area warna baru yang berwarna biru dan kemudian mewarnai teks menjadi kuning. Namun, kami akan menghadapi masalah di mana saat tengah-tengah animasi, kami ingin meletakkan sapuan berwarna yang membalikkan warna di seluruh gambar.

Meskipun kami dapat mencoba untuk membuat sebuah lapisan penyesuaian menggunakan Layar > Baru > Lapisan Penyesuaian atau Ctrl+Alt+Y dan kemudian menerapkan efek Membalikkan Saluran. Namun, kami melihat bahwa warna kami sebenarnya tidak benar-benar komplementer. Untuk warna biru, warna yang komplementer adalah oranye dan itu tidak cocok di sini, kami tidak mendapatkan warna yang pas.




Namun, saya ingin melakukan ini dengan cara tertentu dan pasti ada cara untuk melakukannya.

Langkah 1

Kita akan membuatnya seperti ini: Kita mengambil area warna biru laut dan menekan Ctrl+Shift+Y atau pergi ke Layar > Pengaturan Area Warna dan mengubah warna menjadi hitam.

Maka, akan terjadi perubahan yang bagus dan After Effects bahkan akan mengubah nama area warna.

Kami akan menuliskan teks "Animasi Mudah" dengan warna putih.

Kami memiliki warna hitam dan putih tanpa transparansi dan kami dapat dengan mudah membaliknya.





Namun, saat ini hanya hitam dan putih, tetapi saya ingin menggunakan biru dan kuning.

Langkah 2

Jadi, kita akan membuat lapisan penyesuaian kedua dengan Ctrl+Alt+Y dan menerapkan efek Penyalaan Warna.

Efeknya sangat sederhana, efek ini hanya melakukan pemetaan warna. Ini mengambil hitam dan putih dan memberikan nilai warna yang berbeda.

Kami akan memilih warna hitam di sini dan menyesuaikan warna biru kami. Saya sudah mencatat kode warna "008FF", itulah warna biru yang indah ini.

Dan kami akan menyesuaikan warna putih dengan warna kuning, nilai warnanya adalah "FFF000", kuning yang sangat cerah.

Langkah 3

Sekarang, kami telah menerapkan perubahan setelah lapisan pembalikan. Saya juga akan memberi nama sebelumnya sebagai "Perubahan Warna" dan "Mewarna".

Mari kita kunci lapisan teratas, karena kita tidak akan pernah menyentuhnya lagi.

Saat saya mengaktifkan dan menonaktifkan "Perubahan Warna", kita mendapatkan pembalikan warna yang indah, tanpa beralih menjadi oranye atau ungu.





Tetapi bagaimana kita merancang transisinya? Kita bisa memindahkan lapisan "Perubahan Warna" dari kiri ke kanan atau dari atas ke bawah melintasi gambar, untuk membuat transisi. Namun, itu tidak terlalu menarik.

Saya ingin melakukan sesuatu yang lebih, yaitu membaginya menjadi garis-garis, dan garis-garis ini akan menyapu gambar untuk memecah sedikit tepiannya. Bagaimana cara terbaik untuk melakukannya?

Langkah 4

Ada efek untuk itu seperti contohnya di Effect > Efek Transisi; di situ kita punya Pembersih Garis, yang bergerak ke arah tertentu, tetapi garis dibuat terlebih dahulu sebelum yang berikutnya dimulai.

Bagi saya, itu tidak cukup tidak teratur.

Langkah 5

Oleh karena itu, yang terbaik adalah menggunakan Masker. Saya akan melakukan double-click pada simbol Masker dan membuat masker yang sesuai dengan ukuran saya. Ini adalah fungsi yang sangat praktis dan akan kami gunakan lagi nanti.

Langkah 6

Kami ingin membagi masker ini menjadi 20 bagian sehingga kami memiliki 20 kolom terpisah. Hal ini tidak bisa dilakukan dengan alat bawaan After Effects.

Tapi dalam situasi seperti ini, saya hanya menulis sebuah Script untuk melakukan hal ini. Untuk hal-hal yang kami gunakan di sini, saya telah menyertakan Script di tutorial masing-masing.

Kami memiliki Layer Chainer, Mask Slicer, dan Sequence Strokes. Mask Slicer adalah yang kami butuhkan di sini, seperti yang bisa Anda bayangkan.

Simbol ini sebelum nama file adalah bagian dari Extendscript Toolkit, yang dapat saya mulai disini. Jika saya memulai ini, maka Extendscript Toolkit juga akan dimulai.

Toolkit ini harus diinstal secara terpisah karena tidak diinstal secara default. Anda harus melakukan ini terlebih dahulu, itu bisa dilakukan dengan mudah melalui CreativeCloud.

Dalam Script ini di atas, kami memiliki beberapa Pengaturan. Untuk semua Script tersebut, saya tidak membangun antarmuka pengguna karena mereka untuk penggunaan pribadi saya. Artinya, semua pengaturan di sini harus diubah langsung di file teks.

Dalam kasus ini, kita bisa mengubah dua nilai: "noOfSplices", yaitu berapa banyak Slices individu yang ingin kita miliki secara keseluruhan.

Dan "seperateLayers", yang bisa berisi true atau false. Jika true, setiap Slice akan ditambahkan sebagai lapisan baru.

Untuk sementara, mari mencoba dengan 4 Slices, ...

... pergi ke After Effects dan pilih mask yang ingin kita potong. Ini sangat penting.

Kemudian pilih After Effects CC di atas target aplikasi. Kamu lihat, di sana juga ada program lain, toolkit ini digunakan untuk menulis dan menguji script.

Pada kasus ini, kita pilih After Effects, kemudian saya tekan tombol Play ...

... dan kembali ke After Effects. Di sana kita memiliki layer-layer baru, masing-masing terdiri dari satu layer.

Dan jika saya sekarang menghasilkan gradien 4 warna di sini, ...

... maka kamu akan melihat bahwa semuanya membentuk sebuah gambar lagi. Sebenarnya ini adalah satu layer dengan sebuah koordinat, hanya mask yang dipotong. Artinya, kita memiliki slice-slice individu dari layer ini, yang bisa sangat berguna karena kita dapat memindah dan memutar mereka secara individual.





Tapi kita tidak membutuhkannya di sini. Saya ingin sesuatu yang berbeda.

Langkah 7

Saya ingin memiliki semua mask pada satu layer, bukan hanya 4, tapi 20.

Dan kami atur separateLayers menjadi false. Saya simpan, kembali ke Play, ...

... dan sekarang kami memiliki 20 mask pada satu layer.

Saya menandainya dari 1-20 dan tekan Strg+C atau cmd+C. Kemudian saya hapus mask asli dan tambahkan semua mask di sini sebagai gantinya.

Sekarang semuanya ada di sini dan saya ingin menganimasikannya di langkah selanjutnya.

Langkah 8

Sayangnya, mask tidak memiliki properties transformasi seperti rotasi dan skalasi, hanya jalur mask. Tapi itu bukan masalah.

Kami tandai semua mask dan buka mereka. Kemudian kita tekan path mask, atur sebuah keyframe dan pergi sedikit kemudian dalam komposisi, di mana kita kemudian memindahkan semua mask ke bawah dari gambar.

Langkah 9

Mari kita lihat. Musik berjalan di latar belakang, pas. Dan sekarang kita memiliki dua keyframe linear, yang tidak begitu menarik.

Saya ingin sedikit lebih menarik dan tidak ingin menggunakan keyframe linear, karena kita sudah mendengarnya pada aturan Disney: Kecepatan konstan tidak terjadi dalam kehidupan nyata, jadi kita juga tidak membutuhkannya dalam animasi.

Langkah 10

Untuk itu kita klik pada editor diagram. Di sana saya mendapatkan kurva yang nantinya akan kita pelajari secara detail pada bouncing ball.

Untuk membatasi pada jalur mask, saya tandai semua mask dan tekan U, karena dengan demikian saya mendapatkan semua properties yang di animasikan.

Sekarang kita melihat kurva kecepatan, speed graph. Tidak sebagus saat bekerja dengan kurva nilai, itu nanti akan kita lihat. Tapi ini baik digunakan ketika ingin menganimasikan banyak properties secara bersamaan.

Saya ingin terlebih dahulu memberikan Easy Ease, entah dengan F9 atau dengan tombol ini.

Dengan begitu grafik telah berubah drastis. Di sisi kiri akan menjadi kecepatan konstan, kita mulai dengan kecepatan tertentu dan berhenti secara tiba-tiba.

Dengan Easy Ease kita mulai dari kecepatan nol perlahan naik dan kemudian turun lagi. Ini seperti bentuk parabola.

Saya ingin membuatnya sedikit lebih ekstrim. Untuk itu saya ambil tangen dan tarik sedikit saja, sehingga kita benar-benar memiliki puncak di tengah.

Begini, mari kita lihat hasilnya ...





Saya biarkan itu berjalan dan saya lihat: Itu bergerak langsung di atas. Di tengah terjadi pergerakan yang jauh lebih cepat daripada di awal dan di akhir. Saya suka itu.

Langkah 11

Kita juga bisa melakukan ini dengan posisi - kenapa kami membuat slice?

Kita sekarang menggesernya dengan cara yang tidak teratur dalam waktu dan menyusun keyframe sepertinya acak, sehingga kami juga mendapatkan sedikit variasi dalam bentuk reveal. Garis-garis tersebut tidak boleh semua bergerak bersamaan.

Pada akhirnya terlihat sedikit seperti skyline. Garis tunggal itu, yang biasanya akan memisahkan gambar kita, kita ingin memecahkannya. Terkadang hanya di satu sisi atau hanya di depan atau hanya di belakang. Saya mencoba untuk menghindari agar mereka berakhir di ketinggian yang sama.

Seems good.

Dan kalian lihat, saat kalian mengaktifkan pratinjau - terlihat keren. Fantastis.

Langkah 12

Dan sekarang kita bisa mengambil lapisan ini, memutar, skalakan, pindahkan, dan tentu saja bisa digunakan lagi, karena ini hanya efek inversi sederhana.

Kami menduplikasinya, menggesernya secara temporal dan beralih dari kuning ke biru, dan dari biru ke kuning.





Pada kasus ini sebelumnya ditampilkan dan kemudian hilang. Itu harus kita balik, karena saya ingin bahwa pada awalnya tidak ada lapisan dan bahwa lapisan tersebut digeser ke depan.

Jadi saya menghapus lagi lapisan yang diduplikasi dan mengaktifkan lapisan "Change Colors". Kemudian kami menandai semua Keyframes dengan menggambar sebuah kotak di atasnya.

Dengan klik kanan, saya pergi ke Asisten Keyframe dan kemudian menemukan di bagian bawah Urutan Keyframe dibalik.

Saya baru saja melakukan itu dan sekarang warna kuning bergerak dari bawah ke biru.

Dan sekarang seharusnya berhasil, jika saya menggandakan lapisan lagi dan kemudian sedikit menggesernya ke belakang.

Kita sekarang berpindah dari satu warna ke warna lain dan kembali lagi. Sempurna.





Sudah berfungsi. Tantangan berikutnya dalam bagian berikut dari seri tutorial ini adalah teks.