Bikin header blog pakai aplikasi editing di hp!

Assalamu’alaikum. Hallo teman-teman…

Di postingan kali ini saya mau nulis tentang proses saya ganti header di blog Ummu’s pages. Sebelum masuk ke proses saya bikin, saya mau cerita sedikit dulu.

Gonta-ganti header blog

Entah ini sudah yang keberapa kali saya mengganti header blog saya. Dulu mah asal ngaplot gambar aja. Tidak acuh dengan apakah gambar tersebut kontras dengan warna keseluruhan blog, tidak peduli dengan ramainya gambar yang digunakan sebagai header.

Ini salah dua dari beberapa gambar yang pernah saya gunakan sebagai header dengan warna keseluruhan blog yang konsisten orens dan coklat -sejak kapan saya lupa juga. Mungkin 2016. Tapi pernah juga saya coba warna latarbelakangnya nya orens yang kayak lampu redup dan bikin mata sakit kalo diliat.

Kalau iingta-ingat lagi geli juga. Gak kebayang bagaimana gerutuan orang-orang yang kebetulan mampir ke slaah satu postingan di blog saya ini, namun langsung keluar karna tampilan yang ganggu mata.

Nah awal 2020 ini, saya jadi kepikiran untuk membuat header yang setidaknya agak enak dipandang meski tetap saja masih kurang karena saya gangerti juga kenapa resolusinya jadi pecah gotu dan ukuran yang berbeda di tampilan desktop dan mobile. Di bawah ini perbedaan ukuran header Ummu’s pages yang terlihat pada tampilan web dan tampilan versi mobile.

Beda banget emang kan yah? Saya mikir dan bikin itu berjam-jam (hampir seharian, bahkan) sebelum akhirnya memutusakn untuk sudah, pakai saja dulu. Saya akan belajar lagi untuk bikin yang lebih baik lagi. Ehehee.

Proses bikin header

Saya bukan ahli dalam bidang editing pakai adobe, dll.

Pernah pakai tapi hanya untuk pemakaian editing dasar.

Saya pernah menggunakan adobe untuk edit foto, bikin quotes, dll. Dan saya pernah menggunakan CorelDraw untuk menggambar. Susah emang tapi senang banget pas liat hasilnya. Sayangnya laptop saya yang sekarang tidak mendukung penggunaan dua aplikasi yang baru saja membuat saya jatuh cinta itu. Saya tidak menyerah dan tetap mengedit maupun menggambar dengan dukungan hp kentang saya. Dan pembuatan header ini, telah melalui beberapa kali unggah simpan berbagai aplikais sederhana gratisan di playstore.

Menggambar karakter orang di IbisPaintX

Gambar lagi tertegun itu hasil saya jiplak foto saya yang sudah lama saya bikin untuk post quotes di instagram. Dan saat kepikiran bikin header untuk blog ini yang deskripsi blognya adalah Where I put my thoughts, saya langsung kepikiran gambar yang menurut saya agak nyambung. Kan tertegun terkesan seperti sedang mikir gitu kan ya. Alhamdulillah, draftnya masih tersioman di beranda akun IbisPaitX saya.

Layer-layer pada IbisPaintX

Nah proses bikin karakter ini gampang-gampang susah. Banyak tutorialnya di YouTube. Intinya, saya masukin foto di layer 1, terus di laer 2 dan seterusnya mulai deh saya menggambar dengan menjiplak foto di layer satu, warna-warnaya tinggal disesuaikan.

Menulis judul blog dan deskripsi dengan Phonto

Setelah gambar karakter selesai, yang saya lakukan selanjutnya adalah membubuhkan judul blog dan deskripsinya di smaping karakter pada gambar dari IbisPaintX

Kenapa saya memilih Phonto? Meskipun sebenarnya di IbisPaintsX sendiri ada tools untuk membubuhkan text?

Well, kembali ke kenyamanan saya. Menurut saya pembubuhan tect melalui IbisPaintX kurang mendukung apa yang saya inginkan. Mungkin sebenarnya bisa tapi saya belumn menemukannya. Saya menemukannya di Phonto yang menyediakan lebih banyak pilihan font, fitur tilt yang mempermudah kita memiringkan tulisan dan yang paling saya suka, fitur stylenya yang terdiri dari Text Color, Shadow, Stroke, Background, Spacing, dan Curving yang mana kesemua fitur itu masing-masing mempunyai fitur plus lainnya seperti, Alpha, Radius, Width, Angle, dll. 

Fitur-fitur edit text di Phonto

Setelah tulisan jadi, saya kembali lagi mengedit pada IbisPaintX untuk menambahkan pola bunga.

Mengubah ukuran gambar di PicsArt

Setelah gambar yang saya inginkan sudah jadi dan dirasa cukup. Mulailah kesusahan dihadapi. Gambar pertama yang saya unggah terlalu besar pada tampilan header sehingga ketika dibuka, setengah layar laptop saya hanya dipenuhi tampilan header yang bahkan tidka menunjukkan tulisan dan karakter saya. Hanya pojok warna orens dan bunga-bunga kecil yang terlihat. Saya paham ada yang salah dengan ukurannya. Tapi saya tidak tau dengan pasti ukuran yang bisa tampil dengan pas. Makan saya melakukan berbagai percobaan dengan berbagai ukuran gambar yang disediakan di PicsArt.

Mulai dari ukuran persegi, 3:2, 16:9, pos untuk facebook, sampul facebook, pos twitter, sampul/judul twitter, dan berbagai ukuran yang saya katang-karang lebar dan tingginya. Capek asli heeheh. 

Pilihan  ukuran gambar pada PicsArt

Terakhir saya kepikiran. Kenapa saya tidak lihat ukuran keseluruhan blog saya di fiur sesuaikan tema blog saja ya lalu bikin ukuran gambar mengikuti itu? Tapi ternyata itu tetap saja bukan jawaban karena gambar masih tidak tampil dengan baik. Meski begitu saya sempat merasa pintar sekali dengan pemikiran itu, hahaha.

Lalu saya akhirnya sampai pada sebuah moment saat saya tiba-tiba sadar bahwa gambar yang ditampilkan pada tampilan web hanya memakan setengah bagian kiri (dilihat dari kita sebagai yang melihat gambar) sampai tengah gambar yang saya unggah. Maka saya rombah lagi gambarnya dengan memperkecil karakter serta tulisan dan meletakkannya pada batasan pada bagian kiri sampai garis tengah. Dari batasan garus tengah ke kanan, saya biarkan kosong, hanya ada bunga-bungan agar tidak terlihat sepi. Maka jadilah header dengan banyak kekurangan pada gb. 1 diatas itu. Itu pun sudah bikin saya senang. :D

Info tambahan:

Ukuran ambar yang diunggah: I920*442px

Ukuran file: 164KB

Ukuran keseluruhan blog: 1070px

Sekian postingan kali ini. Semoga bermanfaat!

Salam! Ummu J