Cara Membuat GIF di PhotoShop dari Video

Diterbitkan: 2019-07-16

Jika Anda tiba di sini bertanya-tanya bagaimana cara membuat GIF dengan Photoshop, itu mungkin karena video yang Anda unggah ke situs web Anda memperlambat waktu pemuatan. Nah, Anda telah datang ke tempat yang tepat. Dalam panduan ini, kami akan menunjukkan cara membuat GIF di Photoshop dari cuplikan video. Ini akan terlihat bagus di situs Anda dan akan jauh lebih dioptimalkan untuk kecepatan daripada file video!

Dengan bantuan GIF, Anda dapat menyajikan semua jenis video di situs web, secara berulang. Ini bisa berupa klip dari materi promosi, rekaman layar untuk tutorial, atau apa pun yang Anda inginkan.

Untuk tutorial ini, Anda memerlukan beberapa cuplikan video dan Adobe Photoshop. Jika Anda tidak memiliki langganan Photoshop, Anda dapat melakukan uji coba gratis, akibatnya Anda mungkin menemukan bahwa memiliki Photoshop adalah bantuan besar untuk desain web! Jika video Anda sangat panjang, Anda mungkin ingin memotongnya terlebih dahulu di editor video seperti iMovie atau Adobe Premiere. Photoshop juga memiliki opsi trim saat Anda mengimpor tetapi editor video lebih baik jika rekaman aslinya sangat panjang.

Mari kita mulai.

Pratinjau Hasil Akhir

Ini adalah hasil akhir dari GIF yang kami buat untuk tutorial ini, cocok untuk latar bagian atau modul.

GIF dari pantai dengan nada warna biru

Untuk Memulai, Impor Video ke Photoshop

Untuk mengimpor klip video ke Photoshop, Anda harus berada di dalam editor Photoshop terlebih dahulu. Dari sana, klik File > Impor > Bingkai Video ke Lapisan. Pilih video yang ingin Anda gunakan dan klik buka.

Dalam dialog popup Anda memiliki dua pilihan; 1. Dari awal hingga akhir – untuk menggunakan video secara keseluruhan atau, 2. Hanya rentang yang dipilih – untuk menggunakan opsi pemangkasan dan hanya menggunakan sebagian video.

Di bawah itu, adalah pilihan untuk membatasi impor ke jumlah frame yang dipilih. Pilih angka kecil jika video lebih pendek dan angka lebih besar jika video lebih panjang. Ini mungkin memerlukan beberapa percobaan dan kesalahan sampai Anda memiliki aliran yang tepat. Misalnya, footage yang memiliki perubahan kecil atau lambat akan memiliki banyak frame yang terlihat hampir sama persis. Di sisi lain, jika rekamannya cepat dengan banyak perubahan visual, jika Anda mengambil terlalu banyak bingkai, itu mungkin terlihat tidak stabil.

Untuk tutorial ini, kita memilih 'From Beginning to End' dan 'Limit to every 3 frames.' Pastikan 'Buat Animasi Bingkai' diklik.

Tangkapan layar aksi photoshop tentang mengimpor video dengan bingkai sebagai lapisan untuk membuat GIF

Buat Penyesuaian pada Rekaman

Ini adalah waktu yang tepat untuk membuat segala jenis penyesuaian yang Anda inginkan pada rekaman video Anda, mulai dari pemotongan ukuran hingga penyesuaian tingkat warna. Misalnya, mungkin ada objek yang tidak sedap dipandang di sudut video atau tinggi penuh video terlalu besar untuk ditempatkan di desain situs web Anda. Atau, jika rekaman video terlalu jenuh, Anda dapat menggunakan panel penyesuaian untuk menyesuaikan saturasi pada semua lapisan sekaligus.

Untuk yang kreatif di luar sana, membuat penyesuaian pada lapisan yang berbeda akan menciptakan segala macam efek yang berbeda pada GIF Anda. Yang tidak dapat Anda lakukan adalah menghapus latar belakang atau menggunakan alat yang hanya berfungsi pada satu lapisan dalam satu waktu.

Kiat Pro: Pastikan bahwa penyesuaian apa pun yang Anda lakukan, Anda telah memilih semua lapisan.

Screenshot panel Layers di Photoshop - Cara membuat GIF dengan video di Photoshop

Cara Memotong Semua Lapisan Sekaligus

Pilih semua layer dengan mengklik Layer 1 lalu sambil menekan shift, klik pada layer paling atas. Pilih alat Rectangular Marquee dan pilih bagian dari video yang ingin Anda simpan (bukan yang ingin Anda keluarkan). Klik Image > Crop dan area di luar seleksi akan hilang. Dalam video kami, kami memilih seluruh area video dengan menyisakan sedikit di bagian atas yang tidak dipilih. Kami ingin membuat keseluruhan video kurang tinggi dan menghapus tepi putih cakrawala.

tangkapan layar aksi photoshop - pilih dan potong

tangkapan layar video yang dipotong di photoshop

Cara Menyesuaikan Warna di GIF

Dengan semua lapisan yang dipilih, klik pada tab penyesuaian di menu Panel. Anda dapat menggunakan salah satu alat penyesuaian dan menerapkannya ke lapisan di GIF Anda. Misalnya, Anda dapat mengubah warna menjadi hitam putih atau memberikan efek duotone. Kami menggunakan penyesuaian hitam dan putih dengan warna untuk membuat warna video kami sedikit lebih artistik. Ini sempurna untuk latar belakang yang tidak akan menghalangi konten lainnya. Anda dapat menggunakan rona warna apa pun yang Anda suka dan menyesuaikan tingkat warna yang berbeda sesuai keinginan Anda. Sekedar saran, jika Anda menambahkan penyesuaian warna, file akhir Anda akan lebih besar daripada jika tidak.

GIF ini diunduh pada 211MB tanpa filter warna dan pada 312MB dengan penyesuaian warna. Jika Anda benar-benar menginginkan penyesuaian warna, maka Anda harus mengurangi bingkai untuk membuat file akhir lebih kecil. Lebih lanjut tentang itu di bagian berikutnya.

Tangkapan layar hitam putih plus warna di video

Gunakan Garis Waktu untuk Mengedit Bingkai

Dengan jendela timeline, Anda dapat mengedit frame untuk mengurangi ukuran akhir file GIF. Misalnya, bingkai tambahan di akhir klip yang sepertinya hanya tertinggal atau membuat bagian statis. Semakin banyak bingkai yang bisa Anda ambil, semakin baik! Tapi hati-hati Anda mengambil terlalu banyak frame dan efek akhirnya menjadi gelisah, luangkan waktu Anda untuk memeriksa bagaimana loop terlihat setelah menghapus beberapa frame.

Untuk mengakses jendela timeline dan melihat bagaimana GIF bekerja dalam satu lingkaran, klik Window > Timeline. Panel horizontal panjang akan terbuka di bagian bawah layar Anda. Di sudut kiri bawah, ada beberapa kontrol. Pilih opsi loop sebagai 'Forever' dan tekan tombol putar untuk melihat tampilan GIF. Dalam kasus kami, GIF kami terlihat cukup bagus tetapi masih terlalu panjang. Pada lebih dari 200 frame dan dengan penyesuaian warna, file akhir adalah 312mB kekalahan. Anda dapat memeriksa ukuran file akhir Anda dengan mengikuti langkah-langkah di bagian 'Simpan Sebagai GIF' di bawah. Setelah Anda melihatnya, cukup tekan batal alih-alih menyimpan. Anda juga dapat memperkecil ukuran file dengan opsi Ekspor untuk Web.

screnshot action photoshop untuk membuka jendela timeline

Cara Menghapus Bingkai untuk Memperkecil Ukuran File GIF

Untuk membuat GIF kami jauh lebih kecil, kami mengambil 200 frame terakhir. Video lengkapnya memiliki bagian di mana kamera drone berputar dan bergerak ke kiri menuju taman di belakang pantai. Kami tidak membutuhkannya. Sekarang GIF kami memiliki berat 160MB. Masih cukup besar. Kami tidak mengambil bingkai lagi karena akan menjadi gelisah, jadi kami membiarkannya apa adanya untuk mengoptimalkan nanti dengan opsi 'Simpan untuk Web'.

Untuk menghapus bingkai, Anda dapat memilih salah satu dan menekan ikon tempat sampah yang berada di bawah fungsi putar dari jendela garis waktu. Demikian pula, Anda dapat memilih grup bingkai yang berurutan dengan mengklik satu dan kemudian bingkai sebelum atau sesudah dengan menekan shift+klik. Jika Anda tidak ingin memotong rekaman dari awal atau akhir GIF tetapi ingin membuatnya lebih pendek, hapus bingkai alternatif dengan menekan salah satu dan kemudian perintah+klik setiap bingkai lainnya.

tangkapan layar jendela timeline di photoshop

Kami menyukai bagaimana ketika Anda membuat GIF di Photoshop dengan video, Anda dapat memotong bagian dari rekaman baik saat impor maupun setelahnya! Sangat praktis.

Cara Mengubah Kecepatan GIF

Jendela timeline juga memberi Anda pilihan untuk memperlambat atau mempercepat GIF. Setiap frame di timeline memiliki kontrol kecepatan di bawahnya. Pengukuran default adalah 'tidak ada penundaan' atau '0' tetapi bisa saja video yang Anda gunakan sudah memiliki penyesuaian kecepatan. Ini adalah kasus dengan video kami. Jika Anda melihat tangkapan layar di atas tempat kami menghapus bingkai, Anda dapat melihat bahwa bingkai kami memiliki penundaan 0,04 detik. Saat kami mempratinjau GIF, sepertinya itu dipercepat. Kami tidak ingin itu.

Kami memilih semua frame di timeline dengan mengklik tiga garis di sudut kiri atas jendela timeline dan klik 'Select all Frames.' Pada salah satu frame, kita klik panah kecil ke bawah dan pilih 'no delay.' Ini akan membuat GIF kita mengalir secara alami. Untuk membuat GIF yang terlihat seperti bergerak lambat, pilih nilai apa pun di atas 1 detik.

tangkapan layar aksi photoshop - menggunakan garis waktu untuk mengontrol kecepatan GIF

Simpan Sebagai GIF dan Optimalkan

Setelah semuanya selesai, saatnya untuk menyimpan proyek sebagai GIF. Klik File > Ekspor > Simpan untuk Web (Legacy) dan pilih opsi GIF di dialog popup. Periksa ukuran file dan pertimbangkan outputnya. Ada beberapa hal yang dapat Anda lakukan untuk mengurangi ukuran file.

  • Kurangi jumlah warna.
  • Kurangi atau singkirkan gentar.
  • Kurangi tinggi dan lebarnya.

Untuk memeriksa bagaimana penyesuaian mengubah GIF Anda, klik tombol Pratinjau. Gunakan tab 2-Up dan 4-Up untuk melihat opsi yang berbeda. Anda mungkin harus kembali dan menghapus lebih banyak bingkai jika masih terlalu besar. Bertujuan untuk ukuran file di bawah 20 MB. Jika Anda membuat GIF untuk bagian lebar penuh, Anda harus benar-benar mengurangi bingkai agar bisa mendapatkannya dengan ukuran yang baik untuk web.

Tangkapan layar opsi simpan untuk web 4-up

Aturan praktis yang baik adalah menjaga file GIF Anda tidak lebih besar dari sekitar 20 MB. Lebih dari itu terlalu besar. Jika Anda dapat mengecilkannya di bawah 10MB tanpa kehilangan terlalu banyak kualitas, maka Anda telah menjadi pemenangnya.

Kami akhirnya menghapus lebih banyak bingkai dari GIF kami untuk menurunkannya menjadi 18 MB. Kemudian kami memasukkannya melalui GIFCompressor, dan menguranginya 55%. GIFCompressor adalah alat online gratis yang mengurangi ukuran GIF tanpa kehilangan kualitas. Anda dapat mengunggah GIF hingga ukuran 50MB.

Kesimpulan

Seperti yang Anda lihat, cukup mudah untuk membuat GIF di Photoshop dari cuplikan video. Satu-satunya peringatan adalah panjang video yang Anda mulai dan berapa banyak bingkai yang Anda hapus. Jika Anda tidak menghapus cukup, file akhir akan benar-benar besar, dan itu tidak akan membantu sama sekali. Mungkin perlu beberapa percobaan untuk akhirnya mendapatkan GIF yang terlihat seperti yang Anda inginkan. Jika Anda membuat GIF tangkapan layar untuk tutorial, seperti dalam panduan ini, Anda akan memahaminya dan akan lebih mudah setiap saat.

Gambar unggulan melalui emojoez / shutterstock.com