Serangkaian tutorial membuat animasi pesawat di Photoshop CS3 (1): Gambaran Umum.
Prinsip pembentukan animasi adalah mata manusia mempunyai ciri-ciri persistensi penglihatan. Yang disebut dengan persistensi penglihatan artinya setelah melihat suatu benda, meskipun benda tersebut menghilang dengan cepat, tetap akan meninggalkan bayangan yang terus menerus di mata. jangka waktu tertentu. Hal ini berlaku bila objeknya relatif terang. Hal yang paling umum adalah menggunakan flash saat mengambil gambar di malam hari. Meski flash sudah lama padam, lingkaran cahaya akan tetap terlihat di mata subjek dan bertahan selama jangka waktu tertentu.
Penerapan paling awal dari fitur ini mungkin pernah kita lakukan saat kita masih di sekolah dasar, yaitu dengan menggambar pergerakan banyak karakter di footer buku teks, lalu dengan cepat membolak-baliknya untuk mendapatkan gambar yang berkesinambungan di mata adalah animasi. Perlu diperhatikan bahwa animasi di sini tidak mengacu pada animasi kartun. Walaupun prinsip produksi animasi kartun sama, namun animasi di sini secara umum mengacu pada semua gambar yang berkesinambungan.
Singkatnya, yang disebut animasi adalah menggunakan beberapa gambar diam untuk diputar secara terus menerus dan menggunakan ketekunan penglihatan untuk membentuk gambar yang berkelanjutan. Misalnya, film tradisional menggunakan serangkaian film panjang untuk merekam satu frame secara terus menerus, dan memproyeksikannya ke layar dengan cahaya secara berurutan pada kecepatan tertentu. Ada persyaratan kecepatan di sini. Bayangkan jika kita membuka buku teks secara perlahan, kita hanya akan melihat beberapa gambar diam, bukan gambar kontinu. Hal yang sama berlaku untuk memutar film. Jika kecepatannya terlalu lambat, apa yang dilihat penonton setara dengan tayangan slide yang berputar. Agar penonton dapat menikmati gambar secara terus menerus, film diputar dengan kecepatan 24 frame per detik, yaitu 24 gambar diam terus menerus diproyeksikan ke layar dalam satu detik. Satuan kecepatan pemutaran animasi adalah fps, dengan f adalah kata bahasa Inggris Frame (gambar, bingkai), p adalah Per (per), dan s adalah Second (detik). Dalam bahasa Cina, artinya berapa banyak frame per detik, atau berapa banyak frame per detik. Film memiliki kecepatan 24fps, sering disebut sebagai 24 frame.
Perangkat lain yang dapat menghasilkan gambar dalam kehidupan nyata juga memiliki konsep frame rate, seperti sinyal TV. Format PAL yang digunakan di China dan Eropa adalah 25 frame, dan format NTSC yang digunakan di Jepang dan Amerika adalah 29,97 frame. Jika animasi diputar di monitor komputer, 15 frame dapat menghasilkan efek gambar kontinu. Dengan cara ini, saat Anda membuat video di masa mendatang, Anda harus memikirkan perangkat apa yang akan digunakan untuk mempublikasikannya dan menetapkan kecepatan bingkai yang berbeda.
Akurasi pengenalan mata manusia sebenarnya jauh lebih tinggi dibandingkan frame rate di atas, karena sistem visual yang terdiri dari mata manusia dan otak sudah sangat berkembang. Hanya saja tingkat sensitivitasnya berbeda-beda tergantung lingkungannya, misalnya di lingkungan gelap, waktu persistensi visual sumber cahaya yang lebih terang lebih lama, sehingga film hanya membutuhkan 24 frame. Ngomong-ngomong, hanya sedikit hewan yang mempunyai mata yang melebihi manusia dalam beberapa aspek, tapi semuanya sangat kekurangan dalam aspek lain. Misalnya, elang, sang "Raja Detail", buta warna, sedangkan burung hantu, "Raja Penglihatan Malam", memiliki mata terpaku dan harus menoleh untuk mengamati sekelilingnya.
Dalam tutorial desain Photoshop yang kami tonton di Tianji Design Online, Photoshop banyak digunakan untuk membuat gambar statis seperti poster dan manuskrip cetak. Sekarang kita akan membuat animasi yang terdiri dari beberapa frame di Photoshop. Perluas satu layar ke beberapa layar. Dan ciptakan semacam kesinambungan gambar di antara beberapa adegan ini untuk memberi bentuk pada animasi.
Saat ini, banyak animasi yang diproduksi menggunakan Flash dilengkapi dengan dubbing dan interaktivitas, membuat keseluruhan animasi menjadi lebih hidup. Animasi yang dihasilkan oleh Photoshop hanya bisa disebut animasi sederhana, terutama karena hanya memiliki gambar dan tidak dapat menambahkan suara, serta penonton hanya dapat menontonnya secara tetap. Namun kesederhanaan tidak berarti kekasaran. Meskipun yang pertama menyediakan lebih banyak metode produksi dan ekspresi, yang terakhir masih memiliki keunggulan uniknya sendiri, misalnya animasi gaya lapisan dapat dengan mudah membuat beberapa hal indah yang sulit dicapai dengan perangkat lunak animasi lainnya. Selain itu, sama seperti menggambar di atas kertas adalah tindakan yang sangat sederhana, setiap orang menggambar dengan cara yang berbeda-beda. Oleh karena itu, animasi yang unggul tidak serta merta membutuhkan teknologi yang rumit, yang penting adalah kreativitas yang unggul.
Apa pun perangkat lunaknya, prinsip produksinya sama, seperti mode warna RGB yang telah kami pelajari dengan cermat, mode ini dapat diterapkan di mana saja. Jadi tugas kita saat ini adalah menggunakan pengetahuan dasar Photoshop yang telah kita pelajari, memperluasnya ke produksi animasi, dan mempelajari keterampilan umum dan metode produksi animasi. Pengetahuan ini masih bisa diterapkan pada aspek lain nantinya. Dan kami juga akan memperkenalkan cara mengubah animasi Photoshop menjadi video dan menambahkan suara ke dalamnya.
Selain perbedaan produksi, juga terdapat perbedaan penggunaan. Animasi sering kali ditempatkan di area tertentu pada halaman web untuk menekankan konten tertentu, seperti animasi iklan. Jenis animasi ini biasanya memiliki ukuran tetap yang sesuai menurut lokasi penempatan yang berbeda, seperti 468x60, 140x60, 90x180, dll. Animasi juga dapat diterapkan pada MMS ponsel (layanan pesan teks multimedia yang dapat mengirim gambar, suara, dan video). Masing-masing kegunaan ini memiliki karakteristiknya masing-masing, dan ada faktor lain yang perlu dipertimbangkan selain ukuran. Seperti batasan jumlah byte, waktu tunggu frame, dll. Kami akan menjelaskannya langkah demi langkah di tutorial.
Catatan: Sebelum memulai rangkaian tutorial ini, kami mengharuskan pembaca untuk mempelajari dasar-dasar Photoshop, memahami dan menguasai konsep dan operasi seperti lapisan penyesuaian, gaya lapisan, dll., seperti "Cara membuat lapisan penyesuaian kurva" dan sebagainya hanya pengenalan singkat tentang pengoperasian yang akan diberikan, dan prinsip-prinsipnya tidak akan dijelaskan secara rinci. Oleh karena itu, disarankan agar pembaca baru mempelajari dasar-dasarnya terlebih dahulu.
Selain itu, hanya versi Photoshop CS3 Extended (diperpanjang) yang memiliki fungsi produksi animasi, yang tidak tersedia di versi biasa. Versi CS2 hadir dengan fungsi pembuatan tindakan, dan pengoperasiannya mirip dengan CS3 Extended. CS dan versi sebelumnya memerlukan perangkat lunak ImageReady yang disertakan untuk produksi animasi. Disarankan agar Anda menggunakan versi CS3 Extended yang sama dengan tutorial.
Karena disebut animasi, artinya membuat gambar di layar bergerak. Mari kita menggambar dan membuat animasi yang "sederhana dan kasar" sekarang.
Buat gambar kosong baru berukuran 150×150, buat layer baru dan gambar persegi panjang, kira-kira seperti yang ditunjukkan di kiri bawah, dan palet layer seperti yang ditunjukkan di sebelah kanan. Dapat dilihat dari sini bahwa ini adalah lapisan kisi biasa. Anda harus menggunakan lapisan vektor sebanyak mungkin dalam pengoperasian sebenarnya. Kami juga akan memperhatikan hal ini dalam tutorial berikut.
Buka palet animasi melalui [Window_Animation], seperti yang ditunjukkan pada gambar kiri di bawah. Saat ini, ada juga beberapa pilihan lain di palet layer, seperti yang ditunjukkan oleh panah merah di gambar kanan bawah. Jika Anda menutup palet Animasi, palet tersebut akan dikembalikan ke keadaan semula. Jangan khawatir tentang hal itu untuk saat ini. Selain itu, palet animasi sering digabungkan dengan palet rekaman pengukuran. Palet ini tidak ada hubungannya dengan konten kami saat ini dan dapat dimatikan.
Setelah membuka palet animasi, kita dapat mulai membuat animasi. Klik tombol "Salin Bingkai yang Dipilih" pada panah merah di palet animasi. , Anda akan melihat bingkai baru ditambahkan. Seperti yang ditunjukkan di bawah ini. Menurut kebiasaan kita sebelumnya, ikon ini harus mewakili yang baru, seperti layer baru, dll. Meskipun penjelasan literal di sini adalah salinan, sebenarnya ini adalah yang baru, tetapi bingkai yang baru ditambahkan sebenarnya sama dengan bingkai sebelumnya. . Konten yang sama. Sejalan dengan itu, setiap orang harus bisa berimajinasi Fungsi tombol tersebut adalah untuk menghapus frame.
Pastikan bingkai ke-2 yang disalin saat ini dipilih di palet animasi, lalu gunakan alat pindah untuk memindahkan kotak di lapisan dengan jarak tertentu, kira-kira seperti yang ditunjukkan pada gambar kiri di bawah. Saat ini palet animasinya seperti terlihat pada gambar tengah di bawah. Terlihat meskipun posisi balok pada frame 2 mengalami perubahan, namun posisi balok pada frame 1 tetap tidak berubah. Ini adalah fitur yang sangat penting.
Ulangi operasi ini dengan menyalin bingkai terlebih dahulu dan kemudian memindahkan blok beberapa kali, dan akhirnya Anda akan mendapatkan sesuatu seperti gambar di kanan bawah (mirip dengan ini). Sekarang kita memiliki 7 frame, dan balok-balok tersebut berada pada posisi berbeda di setiap frame. Perhatikan kalimat "Posisi kotak di setiap bingkai berbeda", lalu lihat palet lapisan Jelas bahwa hanya ada satu lapisan (lapisan latar belakang tidak dihitung untuk saat ini), yang mengarah ke sebuah fitur: untuk satu lapisan Katakanlah, posisinya (atau koordinatnya) dapat ditentukan secara individual dalam bingkai yang berbeda. Berdasarkan fitur ini, kita dapat menganimasikan pergerakan objek hanya dengan menggunakan satu layer.
Sekarang Anda dapat menekan tombol putar di palet animasi , Anda dapat melihat efek pergerakan kotak di jendela gambar, tetapi pergerakannya sangat cepat. Hal ini karena waktu tunda frame tidak diatur. Perhatikan bahwa sekarang ada "0 detik" di bawah setiap frame dalam palet animasi. Ini adalah waktu tunda frame (atau waktu tunggu). Waktu tunda bingkai menunjukkan berapa lama bingkai ditampilkan selama animasi. Misalnya, jika penundaan frame tertentu diatur ke 2 detik, maka saat frame ini diputar, frame tersebut akan bertahan selama 2 detik sebelum melanjutkan memutar frame berikutnya. Penundaan defaultnya adalah 0 detik, dan penundaan dapat diatur secara independen untuk setiap frame.
Metode untuk mengatur penundaan frame adalah dengan mengklik waktu di bawah frame dan memilih waktu yang sesuai dalam daftar pop-up. Seperti yang ditunjukkan pada gambar kiri di bawah, atur frame 7 menjadi 0,5 detik. "Tanpa penundaan" dalam daftar adalah 0 detik. Jika tidak ada waktu yang ingin Anda atur, Anda dapat memilih "Lainnya" dan memasukkan nilainya sendiri (dalam hitungan detik). Anda juga dapat mengubah penundaan secara seragam setelah memilih beberapa frame. Cara memilih beberapa frame sama dengan memilih beberapa layer. Pertama klik pada frame 1 di palet animasi untuk memilihnya, lalu tahan tombol SHIFT dan klik pada frame 6 . Cukup pilih frame 1 hingga 6. Kemudian atur zona waktu frame mana pun, seperti yang ditunjukkan pada gambar kanan bawah, atur ke 0,1 detik. Ini adalah waktu tunda yang lebih umum digunakan.
Mainkan animasinya lagi dan Anda akan melihat bahwa balok bergerak lebih lambat dan bertahan lebih lama di akhir gerakan. Tentu saja, hal ini disebabkan oleh penundaan yang lama. Penundaan yang lama ini sebenarnya memegang peranan penting, dan fitur ini dapat digunakan untuk menonjolkan tema tertentu dalam produksi sebenarnya. Kami juga akan meluangkan waktu untuk memperkenalkan beberapa teknik ekspresi di tutorial berikutnya.
Selain waktu tunda, fitur animasi lainnya adalah Anda dapat mengatur jumlah putaran pemutaran. Perhatikan bahwa ada "selamanya" di bawah frame pertama palet animasi, yang merupakan jumlah loop. Setelah mengklik, Anda dapat memilih "sekali" atau "selamanya", atau mengatur sendiri jumlah siklusnya. Kemudian putar kembali animasinya untuk melihat efek pengaturan nomor loop.
Meskipun dalam banyak kasus animasi berulang terus menerus (yaitu, selamanya), pengulangan tunggal atau beberapa kali (2 hingga 3 kali) juga digunakan di beberapa tempat, terutama saat menggunakan animasi untuk membuat komponen web. Misalnya menganimasikan nama suatu kolom dari awal hingga muncul secara bertahap, sehingga ketika nama tersebut ditampilkan secara lengkap, seharusnya tetap, dan tidak dapat hilang lagi lalu memudar lagi. Pada saat ini, perlu menggunakan pengaturan siklus "sekali".
Tekan 〖CTRL+S〗[File>Save] untuk menyimpan pengaturan animasi, dan format file adalah psd. Format file ini merupakan hak milik Photoshop dan dapat merekam semua informasi yang relevan. Disarankan agar setiap orang menyimpan karya mereka dalam format ini untuk memfasilitasi modifikasi di masa mendatang. Jika Anda memerlukan file animasi independen yang dapat digunakan pada halaman web, Anda perlu menggunakan [CTRL+ALT+SHIFT+S] [File>Save for Web and Devices], dan jendela besar akan muncul seperti yang ditunjukkan di kiri bawah . Jendela besar ini memiliki banyak hal untuk ditutupi. Namun kini Anda hanya perlu mengacu pada pengaturan di area panah merah.
Pada saat yang sama, tombol putar dan opsi putaran akan muncul di area panah hijau di kanan bawah jendela. Mengubah jumlah putaran di sini juga akan mengubah pengaturan di file sumber. Perhatikan bahwa jika tidak ada GIF yang dipilih dalam area panah merah, tombol putar tidak tersedia. Pasalnya, hanya format GIF yang mendukung animasi. Jika Anda menyimpannya secara paksa ke format lain seperti JPG atau PNG, gambar yang dihasilkan hanya akan memiliki frame pertama.
Selama proses penyimpanan, mungkin akan muncul pesan peringatan seperti gambar di kanan bawah. Anda juga bisa membuatnya tidak terlihat lagi. Namun, setiap orang harus memperhatikan penggunaan bahasa Inggris atau angka setengah lebar saat memberi nama file, dan jangan menggunakan karakter lebar penuh atau karakter Cina. Ini agar lebih kompatibel secara luas dengan browser berbagai bahasa.
Pada bab ini, yang perlu dikuasai setiap orang adalah dua atribut animasi, yaitu waktu tunda frame dan jumlah loop. Selain itu, Anda perlu menguasai cara membuat animasi perpindahan objek sederhana seperti "menyalin bingkai dan memindahkan lapisan". Dan gunakan cara ini untuk membuat animasi dengan perpindahan dua objek sekaligus. Efeknya mirip dengan gambar di bawah ini.
Pada bagian selanjutnya kami memperkenalkan bagian kedua: karakteristik propagasi frame pertama.