GIF Animasi Gfycat Sebagai Ilustrasi Artikel Blog

Tulisan ini terilhami oleh sebuah pertanyaan di kolom komentar artikel Membuat Tombol Back to Top di Blogger. Si pembaca menanyakan bagaimana cara merekam GIF yang dijadikan ilustrasi dalam artikel tersebut.
Nah, artikel ini bukan hanya akan menjawab bagaimana, namun juga sedikit bercerita mengapa saya memasang GIF sebagai ilustrasi di artikel tersebut. Follow me...

Alkisah, ketika menulis artikel Membuat Tombol Back to Top di Blogger terpintas dalam benak ini untuk memberinya ilustrasi yang sedikit berbeda. Jika biasanya artikel cukup berilustrasikan gambar, kali ini saya menginginkan video. Maklum, topik artikel dirasa kurang terjelaskan jika hanya diberi ilustrasi gambar diam. Rencananya, video yang dibuat akan diunggah ke YouTube untuk kemudian embedded dalam artikel. Sounds simple, karena blog saya dibuat di Blogger otomatis memiliki akses yang relatif mudah ke YouTube.

Membuat videonya sendiri relatif tidak sulit. Dengan hanya mengandalkan SimpleScreenRecorder video pun selesai dibuat. Durasinya pendek saja, yang penting cukup memberikan penjelasan bagi pembaca artikel. Selain berdurasi pendek, ukuran berkas videonya pun kecil karena hanya berisi stream video, tanpa suara. Mulai dari sini telah terasa bahwasanya video, yang nyatanya hanya berdurasi sekian detik dengan ukuran tidak sampai 1MB, tidak cocok untuk ilustrasi artikel kali ini.
Tidak mengapa, saya tetap unggah video mini ini ke YouTube. Meski ukurannya kecil, ternyata prosesnya lumayan lama. Mungkin karena format berkasnya tidak optimized for YouTube, jadi ia mesti reencoded.

Hmmm... Benar saja. Seperti yang telah disangka, hasil embed videonya terlihat tidak bagus. Matra videonya berubah menjadi lebih kecil (rescaled) hingga terlihat buram, plus mesti mengklik video tiap kali ingin melihatnya. Mungkin ada pengaturan agar video tampak dalam resolusi aslinya, namun kala itu saya tidak banyak mencari tahu. Terlanjur tidak suka.

Setelah sekian lama merenung mencari ilham bagaimana memasang ilustrasi bergerak selain video di blog, akhirnya teringat akan GIF. GIF cocok untuk gambar bergerak berdurasi singkat, dan ia juga akan memainkan gambar tersebut berulang-ulang (looping).

GIF adalah singkatan dari Graphics Interchange Format . Penjelasan lebih lanjut mengenai GIF bisa dibaca di wikipedia, namun secara ringkas GIF ini bisa dikata sebuah teknologi kuno yang fiturnya telah ketinggalan zaman. Teknologi boleh saja tertinggal, namun karena sudah menjadi semacam de facto bagi gambar animasi di dunia web maka GIF ini masih tetap banyak dipakai hingga kini. Teknologi anyar seperti APNG boleh saja lebih canggih, namun karena lambatnya dukungan dari peramban (web browser) maka penggunaan APNG tidak kunjung bisa menggantikan GIF.

Nah, karena saya menggunakan sistem operasi GNU/Linux dan membuat blog di Blogger, kini timbul lagi pertanyaan; "Bagaimana membuat GIF animasi di Linux dan apakah Blogger mendukung GIF animasi?"
Wah, ternyata mencari cara mudah membuat GIF animasi dari sebuah video di GNU/Linux ini lumayan langka. Yang paling umum ditemui adalah dengan menguraikan (extracting) video menjadi frame gambar, dan kemudian bingkai-bingkai gambar tersebut disusun ulang menjadi sebuah GIF animasi. Saya telah mencoba cara ini, baik menggunakan GIMP ataupun ffmpeg + imagemagick. Not recommended. Selain merepotkan, juga sulit menemukan titik temu antara mutu dan ukuran berkas GIF.

Kembali memutar otak. Bagaimana jika menggunakan layanan GIF converter saja, yang banyak bertebaran di internet?
Dari sinilah saya teringat akan Gfycat. Dengan menggunakan layanan luar semacam Gfycat, saya tidak perlu lagi memikirkan apakah Blogger mendukung GIF animasi. Walau sepertinya sih mendukung.

Dalam wikipedia, Gfycat diterangkan sebagai layanan penyimpan (hosting) video singkat. Mungkin menimbulkan pertanyaan di benak Anda, GIF kan gambar, lalu mengapa di situ disebut penyimpan video singkat?
Confused not.... Seperti telah disinggung di awal artikel ini, meski teknologi GIF sudahlah uzur namun tetap banyak yang memakainya. Telah ada upaya untuk memberikan alternatif bagi GIF, misal dengan APNG, namun berujung sia-sia. Karena memberi alternatif format baru tidak diterima khalayak, sekarang trennya beralih membuat gambar animasi dalam bentuk video MPEG 4 namun tetap dengan nama berakhiran (extension) GIF. Itulah yang kini dilakukan oleh misalnya Gfycat dan Telegram. Agak membingungkan memang. Namun cara ini menjawab keterbatasan GIF, misalnya soal kedalaman warna dan playback control. Informasi lebih rinci mengenai perbedaan GIF dengan Gfycat dapat dibaca di sini.

Wah, tidak terasa basa-basinya sudah lumayan panjang. Baiklah kita kini menuju bagian tutorial bagaimana menggunakan Gfycat sebagai sarana penyimpanan berkas GIF yang akan digunakan dalam artikel blog. Sok, mangga...

• Siapkan berkas video yang akan dijadikan GIF. Video cukup hanya berisi stream video tanpa disertai suara.
• Silakan meluncur ke gfycat.com untuk mengunggah video. Kita bisa menggunggah secara anon, alias tanpa mendaftar terlebih dahulu. Namun jika akan sering menggunggah ke Gfycat, disarankan untuk mendaftar akun saja. Agar kita bisa menata berkas-berkas yang kita unggah.
• Klik menu Upload di sebelah kanan atas.

• Klik tombol Choose files to upload kemudian pilih berkas video yang hendak diunggah.

  

• Tunggu beberapa saat sampai pengolahan berkas usai.

  

• Pengolahan berkas pun selesai. Saatnya untuk mendapatkan embedable code. Klik tombol See more details di bagian kiri bawah.

  

• Klik menu Embed. Di sini ada beberapa pilihan, namun saya sendiri memakai Responsive iFrame. Klik tombol Copy untuk menyalin embedded code-nya.

  
• That's it. Kita tinggal menambahkan kode yang telah kita salin ke dalam artikel.
• Profit!

Demikian untuk artikel kali ini. Jika ada pertanyaan atau apa pun perihal artikel ini, jangan ragu untuk menuangkannya ke dalam kolom komentar. I love your comments. Seringkali komentar Anda menjadi ilham tulisan dalam blog ini. So, keep it coming...