Wedding Website Aznil & Hani

Kamis, 1 Februari 2018 alhamdulillah adik saya sudah sah menjadi seorang istri. Seperti halnya pernikahan saya, persiapan acara dilakukan langsung oleh keluarga besar kami. Dan tentunya dengan semangat gotong royong saya turut membantu beberapa hal yang bisa saya lakukan.

Adik saya awalnya ga gitu ngebet pengen punya wedding website, ditambah waktu persiapan yang sudah semakin mepet. Tapi karena saya udah bertekad bikinin wedding website buat adik-adik saya, maka saya kekeuh pengen bikin. Apalagi dulu saya udah bikinin buat adik ipar saya, masa iya buat adik sendiri ga dibikinin, hehe.

Baca juga: Wedding Website Reyhan & Rahayu

Development + Deployment

Dibanding wedding website lain yang pernah saya buat, wedding website adik saya ini adalah yang paling kilat dibikin (sekitar 4 harian, di sela-sela ngurus anak, proyek freelance, dan packing buat mudik) dan paling mepet di-publish, haha. Dulu rata-rata saya udah menyelesaikan web-nya sekitar 1 bulan sebelum hari H. Sementara web adik saya baru di-publish seminggu sebelum hari H, itu pun undangan cetaknya udah disebar duluan dari 2 hari sebelumnya.

Padahal di undangan cetak itu dimasukkan URL web-nya. Saya ga tau deh apa ada yang buka URL itu sebelum undangannya beres, haha. Domainnya, aznilhani.com, sih udah dibeli dari awal Januari dan langsung saya set up sebagai custom domain di akun Tumblr yang saya gunakan untuk naruh web-nya. Ya, web-nya tetap saya taruh di Tumblr karena selama ini selalu begitu, malas eksplor yang baru lagi, hehe. Tapi sampai web-nya beres saya develop, domain-nya masih kosong kalau dibuka.

Sebenarnya saya udah berencana untuk beresin web-nya dari bulan Desember. Apa daya kondisi ga memungkinkan karena saya masih banyak fokus utak-atik dan mengisi content web pribadi saya, reisha.net. Trus bulan Januari alhamdulillah ada kerjaan freelance dari teman, jadi saya ngerjain itu dulu donk ya. Trus foto-foto dan content web juga belum disediakan oleh adik saya. Trus tau-tau udah mau mudik aja, dan undangan cetak udah siap disebar, baru deh dikebut bikin web-nya, hihi.

Tema warna udah ditentukan sejak lama, yakni putih gold, sejalan dengan tema warna undangan cetak. Template lagi-lagi saya pilih yang one page biar ga ribet.

Untuk content, adik saya ngasihnya bertahap pula, ga langsung semua sekaligus. Dan yang pertama dikasih ke saya, di luar dugaan saya, adalah quote dari Aznil dan jumlahnya ada 12. Wakwaw, kirain cuma dikit. Tapi OK juga sih karena jadinya saya ga perlu pusing mikirin isi section separator dan sub heading, tinggal masukin quote aja. Namun demikian makan waktu juga sih mikir quote mana bagusan ditaruh di mana.

Content

Yuk mari kita lihat apa aja yang ada di dalam wedding website Aznil & Hani ini.

1. Preloader

Kali ini saya memilih tampilan yang ada preloader-nya. Jadi saat browser masih me-load web-nya, akan muncul layar hitam dengan tulisan nama AZNIL + HANI.

2. Section Home

Setelah web di-load, bagian yang pertama ditampilkan adalah section ini. Sederhana aja, isinya foto full dan quote singkat.

3. Section Tentang Kami

Begitu scroll ke bawah, akan muncul section tentang kami dan menu. Tadinya isinya cuma profil kedua mempelai (yang mana yang nulis adalah saya, eaaa), lalu kemudian Aznil request ditambahkan video mereka.

4. Section Separator 1

Di bawah profil ada pembatas dengan section berikutnya. Format separator di web ini sama semua, yakni quote dengan background foto prewedding.

5. Section Loveline

Berikutnya timeline yang berisi kisah Aznil & Hani dari perkenalan awal hingga memutuskan menikah. Bagian ini paling akhir dikasih sama adik saya dan ternyata lebih singkat dari ekspektasi. Tapi untungnya nemu layout timeline yang oke untuk kisah yang pendek ini, hoho.

6. Section Testimoni

Di bawah timeline langsung diisi dengan testimoni tentang pasangan. Tadinya saya berharap tulisan masing-masing dari Aznil & Hani sama panjang, ternyata tidak. Saya udah minta adik saya nambahin karena punya dia yang lebih pendek, tapi dia bilang udah ga tau mau nambah apalagi. Kalau ditampilin 2 kolom seperti biasa jadi ga oke ya, kalau dibikin satu kolom aja juga ga bagus. Trus kepikiran deh bikin kayak bubble percakapan, dan untungnya ada foto mereka yang cocok dan ga perlu diedit dengan ribet untuk jadi seperti siluet.

7. Section Separator 2

Berikutnya pembatas antar section lagi.

8. Section Undangan

Akhirnya sampai juga ke undangan pernikahannya, hihi. Kalimat dalam undangan ini sama dengan undangan cetak, yang mana juga sama persis dengan undangan pernikahan saya dulu, hehe.

Baca juga: Undangan Versi Cetak (1): Design

9. Section Separator 3

Kembali ke pembatas antar section, hehe.

10. Section Lokasi

Info acara disediakan dalam bentuk denah lokasi. Ada beberapa teman yang komentar, mending ditambahkan Google Maps. Nah biasanya saya memang selalu menampilkan lokasi acara dalam 2 bentuk: Google Maps dan denah. Cuma masalahnya lokasi acara resepsi kedua belum ada di database Google Maps, jalannya pun belum ada. Daripada ga berimbang karena yang satu ada Google Maps-nya sementara yang satu lagi tidak ada, mending ditiadakan aja dua-duanya, hehe.

Baca juga: Wedding Website Sre & Fadlil

11. Section Separator 4

Sebelum masuk ke galeri, saya tambahkan pembatas lagi.

12. Section Galeri

Seperti biasa, isinya foto prewedding. Kalau biasanya saya buat galeri foto berupa slider atau carousel biasa, kali ini tampilannya agak beda. Pertama dibuka, tampilannya seperti foto cetak yang bertebaran bertumpukan. Kalau mouse hover, akan kelihatan button “Lihat Galeri”. Selanjutnya kalau button ini diklik, foto-foto akan menyebar lalu satu foto ditampilkan di tengah dan ada slider-nya. Suka deh. Minusnya ga ada tombol next dan prev-nya, karena buru-buru dan ga sempat utak-atik lagi, hehe.

13. Section Buku Tamu

Di bawah galeri ada buku tamu yang selalu saya bikin pakai Facebook Comment Plugin. Udah lama ga pake plugin ini, saya sempat bingung juga pas bikin App ID-nya, karena tampilannya udah beda lagi, hehe.

14. Section Footer

Di bawah buku tamu, saya masukkan quote terakhir yang tersisa, lalu di bawahnya footer berisi credit ke nama saya dan link ke reisha.net. (eh apa mending pasang link ke portfolio aja ya?) 😀

–

Kata Aznil, super sekali web-nya, hoho. Alhamdulillah kalau suka. Semoga yang lain juga suka. Berikutnya bikin wedding website siapa lagi yaa? 😀

Salam,