Melalui pembelajaran pada tiga pelajaran sebelumnya, kita telah menguasai cara pembuatan animasi, walaupun animasi yang dihasilkan masih sangat kasar. Masih ingatkah Anda saat mempelajari dasar-dasarnya, Anda dihadapkan pada satu blok warna dalam waktu yang lama? Hal ini tidak mempengaruhi tingkat kinerja semua orang saat ini. Demikian pula, kami akan segera mulai membuat animasi yang lebih detail. Namun sebelum semua ini terjadi, setiap orang harus mempelajari beberapa pemikiran desain yang diperlukan. Yang disebut pemikiran desain mengacu pada perencanaan dan pertimbangan sebelum membuat animasi. Perencanaan ini mencakup banyak aspek.
Pertama, mari kita bicara tentang pengorganisasian lapisan. Animasi akhir yang telah selesai tidak berisi informasi lapisan. Lapisan yang disebutkan di sini hanya mengacu pada lapisan yang sedang diproduksi. Untuk animasi yang dihasilkan dengan menggunakan perubahan posisi lapisan, masalah yang jelas adalah bahwa lapisan-lapisan tersebut harus disusun secara wajar , karena satuan gerakan terkecil adalah lapisan, jadi jika Anda perlu membuat banyak objek dengan lintasan gerak yang berbeda, maka harus didistribusikan secara berbeda. lapisan. Anda juga perlu mempertimbangkan jarak pergerakan terlebih dahulu. Ukuran dan penempatan gambar harus memberikan ruang yang cukup untuk bergerak.
Yang kedua adalah mempertimbangkan apakah lapisan tersebut akan berpotongan dengan lapisan lain, dan bagaimana menangani perpotongan tersebut, siapa yang akan menutupi siapa, yaitu susunan hierarki lapisan tersebut. Gambar berikut mencantumkan tiga cara untuk berpotongan adalah Ketika kedua lapisan berada pada 100%, warna hijau menutupi warna merah. Dua lainnya menunjukkan efek cakupan yang berbeda dari lapisan yang berbeda pada opacity 50%. Jika warna hijau menutupi warna merah, maka persimpangan tersebut akan menjadi lebih hijau, dan sebaliknya. Ini semua dalam blending mode normal. Jika Anda memilih blending mode lain seperti overlay, Anda harus lebih memperhatikan layernya.
Semua yang disebutkan di atas adalah masalah teknis, sekarang mari kita bicara tentang masalah plot. Secara umum, jika suatu benda selalu bergerak dalam gambar, maka tidak perlu memperhitungkannya. Tetapi jika benda tersebut semula tidak ada dalam gambar tetapi kemudian masuk dalam gambar, atau semula ada dalam gambar dan kemudian keluar dari gambar, maka perlu dijelaskan kemunculan dan hilangnya benda tersebut pemirsa untuk memiliki perubahan psikologi yang lebih alami. Teknik yang umum adalah membuat objek muncul secara bertahap (disebut juga fade-in) atau menghilang secara bertahap (disebut juga fade-out). Seperti yang ditunjukkan pada gambar di bawah, ini menunjukkan perbandingan efek fading in dan fading out pada pergerakan teks yang sama.
Anda dapat menggerakkan mouse ke dalam area pemutaran untuk melihat efek animasi sebenarnya, dan menggerakkan mouse keluar dari area pemutaran untuk menghentikan pemutaran. Melalui perbandingan, saya yakin semua orang akan merasakan bahwa efek penambahan pemrosesan fade-in dan fade-out lebih baik.
Selain itu, pengaturan loop juga merupakan masalah plot. Kami sebenarnya telah menyebutkan hal ini sebelumnya, yaitu, dalam beberapa situasi, animasi loop tak terbatas dapat digunakan, sedangkan dalam situasi lain tidak cocok. Contohnya, jika animasi teks judul kolom memudar terus menerus, maka akan membuat keseluruhan halaman web terlihat berantakan dan membuat pemirsa merasa tidak nyaman. Pendekatan yang paling cocok saat ini adalah dengan memutarnya sekali, sehingga efeknya dapat ditampilkan tanpa mempengaruhi halaman web secara keseluruhan. Siklus yang disetel menjadi 2 hingga 3 kali secara umum dapat diterima, dan jika lebih dari itu tidak baik.
Namun, animasi yang hanya diputar satu kali sebaiknya ditempatkan di bagian atas halaman web sehingga dapat dilihat segera setelah Anda memasuki halaman web. Jika ditempatkan di bagian bawah halaman web, animasi mungkin telah selesai diputar pada saat pemirsa mencapai titik tersebut. Dalam hal ini, membuat animasi tidak ada gunanya, dan akan lebih baik menggunakan gambar statis.
Perlu diperhatikan bahwa gambar animasi GIF akan diputar ulang setiap kali dipanggil. Jika beberapa orang sudah memiliki pengetahuan tentang produksi halaman web, mereka dapat menggunakan properti ini untuk mengatur tindakan yang sesuai dalam perangkat lunak produksi halaman web. Misalnya, beginilah cara Anda menggerakkan mouse ke sini untuk melihat animasi contohnya. Animasi selalu dimulai dari awal setelah setiap gerakan. Dengan cara ini, meskipun animasi hanya diputar satu kali, animasi tersebut dapat diputar berkali-kali di halaman web. Jangan khawatir jika Anda tidak memiliki pengetahuan tentang produksi halaman web, ini tidak akan mempengaruhi pembelajaran animasi kita selanjutnya. .
Masalah penting yang perlu dipertimbangkan sehubungan dengan efek fade yang tampak bagus adalah bahwa browser dapat diatur untuk menonaktifkan animasi. Saat ini, animasi hanya akan menampilkan frame pertama dari animasi. Kemudian animasi yang mirip dengan "diam-diam datang dan pergi" di atas akan kosong di halaman web, karena frame pertama awalnya kosong. Hal ini dapat dengan mudah menimbulkan kesalahpahaman di kalangan pemirsa.
Mungkin Anda akan berpikir bahwa tidak ada seorang pun yang dengan sengaja mematikan tampilan animasi, namun karena faktor ini tidak dapat dikesampingkan, maka kita perlu mempertimbangkan situasi pengunjung dari tingkat yang seluas-luasnya. Pada tata letak halaman web secara keseluruhan, hindari penggunaan animasi pudar pada teks atau bagian indikator penting. Setelah menempatkan animasi ke halaman web, yang terbaik adalah mematikan pemutaran animasi secara manual untuk memeriksa apakah ada masalah. Selain mematikan pemutaran animasi, jika pengunjung menekan tombol ESC saat halaman ditampilkan, pemutaran animasi juga akan terhenti, dan layar akan tetap ada pada saat gangguan.
Jika Anda ingin menjaga pengunjung yang dilarang memutar animasi dan yang diperbolehkan memutar animasi pada saat yang bersamaan, serta menjaga keseimbangan di antara keduanya, maka Anda harus mengikuti prinsip dalam produksi animasi, yaitu, bagian utama tidak boleh bergerak dan bagian yang dimodifikasi harus dianimasikan. Seperti terlihat pada gambar di bawah ini, teksnya sendiri tidak dianimasikan, hanya bagian tepi teks saja yang dianimasikan. Dengan cara ini, meskipun animasi diam diputar atau diinterupsi selama pemutaran, hal ini tidak akan memengaruhi pemahaman pemirsa terhadap konten.
Namun, selama konten dapat direfleksikan secara akurat setiap saat dan hilangnya teks atau perubahan bentuk yang berlebihan dapat dihindari, teks utama juga dapat dipindahkan.
Konten yang dijelaskan dalam pelajaran ini tidak terkait dengan teknologi produksi animasi. Namun, ketika Anda ingin menerapkan animasi ke halaman web, Anda harus mempertimbangkan metode produksi dan performa animasi dari perspektif yang luas. Mempelajari konten ini saja sudah agak membosankan. Tinggalkan kesan pada semua orang dan terapkan dalam produksi mendatang.
Tugas ini membuat animasi “Quietly Come and Go”. Selain itu, dua animasi turunan berikut juga diproduksi.
Di bagian selanjutnya, kami memperkenalkan cara mengekspresikan fade-in dan fade-out dalam animasi.