Tutorial GIF Animasi

Tip Kreatif: Membangun GIF animasi di Photoshop.

Jika Anda pernah bertanya-tanya bagaimana membuat animasi GIF di Photoshop, kami telah membuat tutorial sederhana dengan beberapa file contoh Anda dapat men-download dan mencoba.
Kami menggunakan banyak file GIF animasi di tips mingguan kami. Mereka menyenangkan untuk membangun, dan lebih baik bagi pelanggan email kita karena animasi Flash tidak didukung dalam pembaca email kebanyakan.


Sebuah Contoh Sederhana
Untuk cepat tangan-on tutorial tentang cara membuat animasi GIF di Adobe Photoshop, kami akan memandu Anda melalui menciptakan animasi berikut:
Ini animasi sederhana menggabungkan dua teknik animasi yang paling umum di Photoshop: Mengubah lapisan off dan on, dan menggunakan perintah Tween untuk menghidupkan gerakan suatu benda pada lapisan. 
Langkah 1: Mengatur lapisan Anda.

Langkah pertama dalam menciptakan setiap animasi di Photoshop adalah untuk membangun sebuah file Photoshop berlapis dengan semua elemen yang Anda berencana untuk menghidupkan. Dokumen contoh kami memiliki 7 lapisan yang berisi teks untuk mundur kami, dan lapisan untuk roket dan api.
Anda dapat men-download file Photoshop contoh kita di sini:: ExampleAnimation.psd

Langkah 2: Buat Frames Animasi dengan Visibilitas Layer.

Memilih Windows> Animation untuk menampilkan palet animasi Photoshop.
Pada frame pertama, matikan visibilitas untuk semua lapisan Anda tidak ingin terlihat pada awal animasi Anda. Kemudian tambahkan satu frame pada satu waktu, dan menghidupkan lapisan Anda ingin terlihat untuk setiap langkah dalam animasi.
Lapisan visibilitas Mengubah satu frame pada satu waktu adalah Photoshop klasik animasi yang meliputi teknik berbagai kebutuhan.
Dalam contoh kita, melanjutkan pola ini untuk mengungkapkan mundur dan nyala api di bagian bawah roket kami.Langkah 3: Membuat Animasi Frames menggunakan Tween.
Sekarang hitung mundur selesai, kita perlu menciptakan ilusi bahwa kapal roket kita lepas landas. Tambahkan satu frame lagi, dan kali ini pilih kelompok yang disebut "Rocket" dalam lapisan dan memindahkan roket Anda dari atas jendela gambar Anda.
Kemudian pilih "Tween ..." dari pop-out menu palette Animation.

Mengatur berapa banyak frame untuk menambah, dan Photoshop menyebar pergerakan lapisan Anda di frame ekstra tersebut.

Langkah 4: Mengatur Timing Anda.

Akhirnya, kembali melalui dan menyesuaikan delay untuk setiap frame animasi Anda. Waktu itu ditunjukkan dalam hitungan detik di bawah setiap frame.
Tip: Anda dapat menekan tombol Shift-untuk memilih berbagai frame (seperti 9 frame kami menambahkan untuk lepas landas roket) dan mengubah mereka bersama-sama.

Langkah 5: Ekspor GIF animasi.

Akhirnya, untuk mengekspor animasi GIF pilih:
Dalam Photoshop CS3: File> Save For Web & Devices ...
Dalam Photoshops Sebelumnya: File> Save For Web ...

Pastikan jenis gambar diatur ke GIF, merasa bebas untuk bereksperimen dengan beberapa pilihan lain, dan menyimpan file Anda.
Untuk menguji GIF animasi yang dihasilkan Anda, tarik file ke browser web Anda.
Sebagai acuan akhir, Anda dapat men-download file selesai kami Photoshop di sini: ExampleAnimation-Final.psd

Posted in: tutorial dan software