Membuat Banner Iklan GIF Simpel Dengan Photoshop
Friday, May 6, 2016
Banner iklan bukan hal yang asing bagi para pembaca blog, salah satu alasan utama Blogger atau Publisher dalam membuat Blog adalah mendapatkan penghasilan dari iklan bekerjasama dengan pihak ketiga (sponsor) atau juga dengan Google Adsense. Jenis iklan yang umumnya ada di Blog ini adalah jenis iklan dalam bentuk banner, bisa berupa gambar JPG, PNG atau gambar bergerak atau yang dikenal dengan GIF.
Sampai hari ini Saya membuat Blog hanya untuk keperluan bekerjasama dengan pihak ketiga dalam pemasangan banner produk dan review artikel (Paid Review), sempat menggunakan Google Adsense pada blog namun tidak bertahan lama. Untuk bekerjasama dalam hal pemasangan banner iklan biasanya dari customer (pengiklan) tidak menyediakan gambar, atau jika sudah ada menurut Saya kurang begitu menarik karena itu mau tidak mau Saya harus membuat ulang. Tampilan gambar banner iklan dengan gambar menarik tentunya akan lebih banyak kesempatan bagi pembaca Blog untuk mengklik atau melihat iklan tersebut.
Pada tutorial ini Saya akan sedikit menjelaskan bagaimana cara membuat banner iklan dengan aplikasi Photoshop. Sebagai gambaran jenis banner iklan seperti gambar di bawah ini sebagai contohnya. Gambar dibawah ini adalah jenis gambar dengan format GIF. Untuk membuat banner iklan ini tidak harus diperlukan keahlian dalam Photoshop, hanya cukup mengetahui basic photoshop saja.
Pada contoh gambar di atas, jenis gambar yang berubah hanya pada warna bodi mobil Toyota Sienta saja, artinya Sobat perlu memiliki 3 gambar warna eksterior mobil Toyota Sienta yaitu Orange, Putih dan Quartz Brown. Jika Sobat kebetulan juga ingin membuat banner iklan mobil Toyota silakan download gambar aslinya di Blog Toyota Indonesia.
Setelah gambar utama (mobil) di dapat, silakan cari backgroud gambar sesuai dengan keinginan Sobat, pada contoh di atas Saya menggunakan warna Orange dengan background kota (city). Untuk logo Toyota Let's Go Beyond, nama mobil Toyota All New Sienta biasanya juga banyak tersedia, silakan Sobat Googling, cari gambar dengan format PNG.
Silakan Sobat buka Photoshop kemudian masukkan gambar yang sudah dipersiapkan sebelumnya (gambar download), masukkan satu persatu sesuai dengan urutan. Untuk gambar mobil ini biasanya dari gambar aslinya memiliki ukuran yang sama, jadi dalam layer photoshop silakan Soba tumpuk gambar dan pastikan ukuran sama persis sehingga pada saat di buat animasi hanya warna saja yang akan berubah.
Background warna pada tulisan Toyota All New Sienta-Unlock Your Play Ground, logo Toyota dan pada tulisan Selengkapnya Saya menggunakan menu Shape. Kelebihan dengan menggunakan Shape adalah warna dapat diatur sesuai dengan keinginan.
Untuk membuat warna pada Toyota All New Sienta berubah ubah caranya adalah buat layer 3 buah, masing-masing layer untuk satu warna. Karena ukuran gambar sudah sama persis maka tidak perlu lagi mengatur besar ukurannya. Namun jika ukuran gambar / posisi ukuran tidak sama persis caranya adalah masukkan gambar 1 terlebih dahulu, sebagai patokan, gambar kedua (layer2) sesuaikan dengan ukuran gambar pada layer 1 (gambar 1) dan seterusnya.
Proses selanjutnya adalah tekan menu Window pada di bagian atas menu Photoshop cari menu Animasi. Akan muncul menu Animation Frame yang berfungsi untuk mengatur gambar. Karena gambar yang akan berubah warna hanya 3 maka buat frame sebanyak 3 buah. Pada masing-masing frame akan ada tulisan 0 Sec, fungsinya adalah untuk mengatur jeda tampilan gambar pada saat animasi dibuat.
Isi frame satu pada layer satu dengan warna Toyota Sienta Orange, pada layer warna Toyota Sienta lainnya silakan klik pada gambar mata atau tampilkan hiden. Proses kedua sama yaitu pada frame 2 hiden warna Toyota Sienta Orange, dan tampilkan warna Toyota Sienta Putih, untuk warna lainnya silakan tampilan hidden. Untuk frame 3 langkahnya tetap sama.
Jika semua proses sudah selesai silakan Sobat ganti 0 Sec dengan keinginan Sobat, bisa 2 atau 3 detik. Silakan lik menu segitiga pada bagian bawah Frame atau menu putar. lihat hasilnya, jika semua proses sudah sesuai lakukan penyimpanan gambar, caranya adalah klik pada menu File kemudian pilih Save For Web & Devices....
Proses membuat gambar animasi GIF sudah selesai, proses berikutnya adalah tinggal memasukkan gambar ke dalam Blog. Silakan Sobat coba jika ada pertanyaan silakan sampaikan di kolom komentar. Akhir kata selamat mencoba.
Sampai hari ini Saya membuat Blog hanya untuk keperluan bekerjasama dengan pihak ketiga dalam pemasangan banner produk dan review artikel (Paid Review), sempat menggunakan Google Adsense pada blog namun tidak bertahan lama. Untuk bekerjasama dalam hal pemasangan banner iklan biasanya dari customer (pengiklan) tidak menyediakan gambar, atau jika sudah ada menurut Saya kurang begitu menarik karena itu mau tidak mau Saya harus membuat ulang. Tampilan gambar banner iklan dengan gambar menarik tentunya akan lebih banyak kesempatan bagi pembaca Blog untuk mengklik atau melihat iklan tersebut.
Pada tutorial ini Saya akan sedikit menjelaskan bagaimana cara membuat banner iklan dengan aplikasi Photoshop. Sebagai gambaran jenis banner iklan seperti gambar di bawah ini sebagai contohnya. Gambar dibawah ini adalah jenis gambar dengan format GIF. Untuk membuat banner iklan ini tidak harus diperlukan keahlian dalam Photoshop, hanya cukup mengetahui basic photoshop saja.
Pada contoh gambar di atas, jenis gambar yang berubah hanya pada warna bodi mobil Toyota Sienta saja, artinya Sobat perlu memiliki 3 gambar warna eksterior mobil Toyota Sienta yaitu Orange, Putih dan Quartz Brown. Jika Sobat kebetulan juga ingin membuat banner iklan mobil Toyota silakan download gambar aslinya di Blog Toyota Indonesia.
Setelah gambar utama (mobil) di dapat, silakan cari backgroud gambar sesuai dengan keinginan Sobat, pada contoh di atas Saya menggunakan warna Orange dengan background kota (city). Untuk logo Toyota Let's Go Beyond, nama mobil Toyota All New Sienta biasanya juga banyak tersedia, silakan Sobat Googling, cari gambar dengan format PNG.
Silakan Sobat buka Photoshop kemudian masukkan gambar yang sudah dipersiapkan sebelumnya (gambar download), masukkan satu persatu sesuai dengan urutan. Untuk gambar mobil ini biasanya dari gambar aslinya memiliki ukuran yang sama, jadi dalam layer photoshop silakan Soba tumpuk gambar dan pastikan ukuran sama persis sehingga pada saat di buat animasi hanya warna saja yang akan berubah.
Background warna pada tulisan Toyota All New Sienta-Unlock Your Play Ground, logo Toyota dan pada tulisan Selengkapnya Saya menggunakan menu Shape. Kelebihan dengan menggunakan Shape adalah warna dapat diatur sesuai dengan keinginan.
Untuk membuat warna pada Toyota All New Sienta berubah ubah caranya adalah buat layer 3 buah, masing-masing layer untuk satu warna. Karena ukuran gambar sudah sama persis maka tidak perlu lagi mengatur besar ukurannya. Namun jika ukuran gambar / posisi ukuran tidak sama persis caranya adalah masukkan gambar 1 terlebih dahulu, sebagai patokan, gambar kedua (layer2) sesuaikan dengan ukuran gambar pada layer 1 (gambar 1) dan seterusnya.
Proses selanjutnya adalah tekan menu Window pada di bagian atas menu Photoshop cari menu Animasi. Akan muncul menu Animation Frame yang berfungsi untuk mengatur gambar. Karena gambar yang akan berubah warna hanya 3 maka buat frame sebanyak 3 buah. Pada masing-masing frame akan ada tulisan 0 Sec, fungsinya adalah untuk mengatur jeda tampilan gambar pada saat animasi dibuat.
Isi frame satu pada layer satu dengan warna Toyota Sienta Orange, pada layer warna Toyota Sienta lainnya silakan klik pada gambar mata atau tampilkan hiden. Proses kedua sama yaitu pada frame 2 hiden warna Toyota Sienta Orange, dan tampilkan warna Toyota Sienta Putih, untuk warna lainnya silakan tampilan hidden. Untuk frame 3 langkahnya tetap sama.
Jika semua proses sudah selesai silakan Sobat ganti 0 Sec dengan keinginan Sobat, bisa 2 atau 3 detik. Silakan lik menu segitiga pada bagian bawah Frame atau menu putar. lihat hasilnya, jika semua proses sudah sesuai lakukan penyimpanan gambar, caranya adalah klik pada menu File kemudian pilih Save For Web & Devices....
Proses membuat gambar animasi GIF sudah selesai, proses berikutnya adalah tinggal memasukkan gambar ke dalam Blog. Silakan Sobat coba jika ada pertanyaan silakan sampaikan di kolom komentar. Akhir kata selamat mencoba.
