image-logo
Catatan tentang desain baru untuk blog ane, dan kebetulan ini yang keempat kalinya.
post
/post/4th-redesign-blog/
4th Redesign Blog!

4th Redesign Blog!

Blog ini -dalam riwayat hidupnya (cie elah riwayat hidup), sudah 3 kali berganti tema. Dan sekarang, ini yang keempat.

Pergantian Pertama

Awal-awal blog dibuat, blog ini masih menggunakan blogspot. Pertama kali berganti tema, itu kalau tidak salah tahun 2016. Waktu itu sehabis belajar menggunakan HTML-CSS-JS di codecademy, ane langsung menerapkan ilmu tersebut di blog ane : memodifikasi tema bawaan blogspot menjadi sesuai selera ane.

Latar utamanya bertema gelap. Kenapa gelap? Karena ane suka warna hitam. Warna primernya ane buat biru. Kenapa biru? Karena ane suka warna biru. Ok ga penting.

Karena ane suka sesuatu yang kesannya cool, ane bikin desain home dan about-nya kesannya cool gitu.

Nah, jadinya begini :

Tema Pertama Z-nya cool, kan?

Pergantian Kedua

Kemudian oktober 2017, Ane ganti tema lagi. Kali ini ane ambil kerangkanya dari tema Soho blogspot, jadi tidak bikin dari awal. Ane modifikasi temanya agar cocok dengan tema ane sebelumnya (tema gelap dan warna utama biru). Kali ini, ane tambah warna sekunder coklat muda/krem.

Tema Kedua

Kebetulan untuk tema yang ini, ane catat dokumentasi lengkapnya disini.

Pergantian Ketiga

Tahun 2018, ane sebenarnya udah ada rencana untuk mengganti tema lagi. Bedanya, ganti tema saat itu sekalian ane mau rombak ulang blog ane : pindah ke wordpress dan membuat tema dengan framework Vue.js. Hanya saja karena satu dan lain hal, tahun 2018 ane belum kesampaian untuk melaksanakan project tersebut.

Pergantian tema ini baru ane lakukan saat 2019, tepatnya bulan maret. Ane yang sudah belajar development front-end lebih lanjut, ane mulai proses perpindahan dan perombakan blog ane.

Untuk tampilan webnya -seperti rencana awal ane, dibuat dengan vue.js. Kemudian untuk blognya, ane pindah ke wordpress. Jadi ane migrasikan seluruh postingan ane dari blogspot ke wordpress. Ane tidak mau bikin dari ulang lagi.

Untuk tema, untuk redesign yang ini sebenarnya ane sudah membuat mockupnya, tapi akhirnya ane tidak mengikuti itu. Ane malah akhirnya hanya membuat wireframe kerangka blog dalam bentuk sketsa di buku catatan. Setelah itu, ane buat layout dasarnya dulu berdasarkan sketsa tersebut. Tema dan warna yang digunakan, atau styling-nya, ane kira-kira saja.

Untuk redesign kali ini, ane lebih fokus ke membangun struktur blognya dibandingkan fokus ke tampilannya. Karena kali ini ane bikin dari 0, jadi ane pastikan semuanya bisa berjalan dulu. Tampilannya belakangan.

Setelah 2-3 minggu, Rombakan selesai.

Tema Ketiga - Home Tema Ketiga - Post

Kontras dengan yang sebelumnya, ane kali ini memakai tema terang. Warna latarnya putih, dengan warna primer tetap biru. Rencananya ane mau membuat ala-ala minimalis temanya. Tapi kalau boleh jujur, mungkin itu terlalu minimalis alias kosong kesannya. Maklum, ane tidak terlalu memikirkan desain kan.

Tema ane kali ini hanya menampilkan header, footer, dan post list. Ada juga quote pribadi ane di footer dan copyright (biar ala-ala gitu). Di atas footer, ada kotak subscription untuk menampilkan link ke Twitter dan Email ane. Headernya juga sederhana : logo di tengah aja. Halaman post pun sederhana : hanya judul, post, dan komen.

Sederhana banget sih, wajar kalau temanya kesannya kosong minimalis.

Pergantian Keempat (saat ini)

Setelah beberapa bulan mengoptimalisasi kerangka blog (karena sebelumnya masih banyak masalah, seperti kecepatan loading yang lambat dan tidak memiliki feed -yang membuat ane harus selalu membuat tweet manual setiap ada postingan baru), Ane mulai mendesain ulang tema blog. Biar tidak kosong-kosong banget gitu :v.

Yang pertama ane lakukan adalah, membuat sketsa wireframe. Untuk tema blog kali ini, ane ingin kesannya seperti diary, jadi ada catatan tiap tahun. Untuk pengkategoriannya, ane buat per bulan, bukan per hari lagi. Kenapa per bulan? biar rapih. Lagipula, ane jarang menulis blog (4 tahun hanya 150 postingan? bayangkan saja).

Kemudian ane juga menambahkan "tentang" di blog. Bingung sih mau tulis apa disana, biar bagus aja. Awalnya mau membuat satu halaman khusus untuk itu, tapi ujungnya ane hanya membuat 1 paragraf singkat untuk "tentang" ini, dan itu ditaruh di footer.

Bicara soal footer, kotak subscribe ane hilangkan. Gantinya ane satukan di footer berupa ikon link. Isinya hanya 3 : twitter, email, dan feed (yakin deh ini yang paling jarang diklik sama warga +62). Quote juga ane hilangkan. rencananya mau dijadikan satu gambar header saja.

Header juga tidak banyak perubahan. Paling rencana mau ditambah hero image di bawah header biar tidak kosong-kosong banget.

Kemudian setelah membuat sketsa wireframe dan menunda 1 bulan karena rencana mau membuat mockup dulu, tapi bawaanya males, akhirnya dimulailah redesign blognya langsung. Hanya bermodalkan wireframe.

Hari pertama, sukses me-redesign footer dengan lancar.

Hari kedua, redesign header jadi.

Hari ketiga dan keempat, redesign halaman post list. ini yang paling lama, karena strukturnya sedikit berubah. Selain itu, Ane merasa masih kosong walaupun sudah ditambah warna-warna dan styling macem-macem. Akhirnya ane coba bikin background di illustrator, baru deh enak dilihat.

Hari keempat dan terakhir, redesign halaman post. tidak terlalu susah karena sederhana dan tidak rombak banyak.

Dan setelah seminggu, akhirnya jadi!

Tema Keempat - Home dan Header Tema Keempat - Footer dan About Tema Keempat - Post

Overall, ane suka liat hasilnya. Entah kenapa kesannya adem gitu, padahal backgroundnya bangun ruang kek matematika :v.

Selanjutnya Apa

Tadi ane bilang mau bikin hero image, nah itu mau dikelarin dulu. sebenarnya desainnya sudah jadi, tapi belum cocok dengan desain blog yang sekarang, jadi mau dimodifikasi lagi. Selain itu, ane juga ingin memperbaiki animasi dan loading page juga. Jadi itu saja sih untuk redesign.

Untuk feature, ada rencana ane mau beralih ke ghost cms. Alasannya agar mudah kalau ingin posting lewat HP, tidak harus lewat komputer. Tapi ini nanti saja.

Yang terpenting, karena tema blog sudah selesai dan rombaknya juga sudah baik, ane mau mulai memperbanyak menulis blog lagi. Rasanya miris banget 4 tahun hanya posting 150-an post. Ane juga mau belajar fotografi dan desain lagi, memberi makan kreatifitas yang ada di kepala. Untuk itu, mungkin ane akan sering-sering memakai twitter untuk posting hasil kreatif tersebut.

Oh, ane juga mau merapihkan dan menambah portofolio desain, sekalian membuat halaman web khusus profesional -yang kali ini mungkin akan memakai tema gelap.

Oh my, ternyata banyak ya. Kudu ane atur ini mah.

Penulis: Riza Kariza