Membuat Banner Iklan Dengan Photoshop Bagian 2

Blog ini tidak saya urus lagi sejak Mei 2014, untuk melihat tulisan baru saya, silahkan buka JakaZulham.com.

Setelah sebelumnya kita membuat banner dengan ukuran 125px x 125px, sekarang kita akan menambahkan animasi pada banner kita, sehingga gambar desain banner tersebut tidak tampak kaku sebagai sebuah iklan digital. Sebelum berlanjut ke tutorial kali ini, pastikan anda telah membuat desain gambar banner seperti pada postingan sebelumnya Membuat Banner Dengan Photoshop karena postingan berikut ini adalah lanjutan dari postingan sebelumnya. Atau, download resource desain bannernya pada tombol download berikut
Buka file gambar anda terdahulu, pastikan gambar tersebut masih dalam format .PSD karena jika anda telah menyimpannya ke dalam format lain seperti .jpg .png .gif maka gambar tersebut tidak bisa diedit lagi.

Langkah 1
Duplicate layer teks “tutorial photoshop”, lalu kemenu Filter > Blur > Motion Blur > OK
Langkah 2
Hilangkah tanda icon mata sehingga layer tersebut tidak nampak. Lalu, menggantikan layer “tutorial photoshop” tambahkan lagi beberapa kata, misalnya “Tutorial CorelDraw”, “inspirasi desain”, dan lain-lain. dan buat lagi seperti langkah 1 diatas! lihat gambar
Langkah 3
Buka window Animation pada Adobe Photoshop CS3 anda (Window > Animation). perhatian, pada Photoshop versi sebelumnya belum ada window animation, untuk membuatnya anda harus berpindah dulu ke program Image Ready. Berikut gambar pada Adobe Photoshop CS3
Pilih Convert to frame animation untuk merubah window animation di kanan bawah.
Langkah 4
klik “Duplicate Selected Frames” untuk membuat layer baru pada window animation
pada bagian 2, hilangkan tanda atau icon mata pada layer “tutorial photoshop” dan di gantikan dengan layer tutorial photoshop yang sudah dimotionkan.
Selanjutnya, klik lagi “Duplicate Selected Frames” dan hilangkan tanda mata pada layer tutorial photoshop yang telah dimotion blur diganti dengan menampakkan layer “Tutorial CorelDRAW”
Demikian selanjutnya secara berurutan, setidaknya seperti gambar dibawah ini
Langkah 5
Ubah Looping option dengan Forever, ini berarti bahwa animasi tersebut terus berjalan tanpa henti. Ubah juga Delay time setiap nomor, contohnya seperti gambar berikut
Klik Plays Animation untuk melihat hasilnya.

Langkah 6
Sekarang saatnya menyimpan desain banner iklan tersebut. Perlu diingat bahwa jika kita salah cara menyimpan filenya, maka file tersebut tidak berbentuk animasi seperti yang kita harapkan. Berikut cara menyimpan file agar berbentuk menjadi animasi. Klik file > Save for Web & Devices…
Langkah 7
Pastikan anda memilih GIF dan atau buat properties seperti gambar dibawah, lalu klik Save
Atur tempat penyimpananya, pastikan saat anda save gambar bertype .gif dan pada File Name isi nama filenya.
Klik Save maka jadilah :D

Sedikit info, Preview gambar desain anda dengan browser seperti Mozilla firefox, opera, Internet Eksplorer, dan lainnya. Karena beberapa viewer seperti picasa tidak bisa mereview animasi .gif tersebut!

Demikianlah tutorial Desain banner dengan photoshop, Komentar, kritik, saran, saya tunggu di bawah ini. Jika belum mengerti cara berkomentar, lihat tutorialnya… (tutorial cara berkomentar pastinya)

Tweet