Study Case - Website Staycation

#Background

Staycation adalah aplikasi untuk membantu masyarakat dalam menemukan rumah, hotel, dan apartment yang bisa dijadikan sebagai tempat berlibur. Tempat yang disediakan biasanya memiliki lokasi yang dekat dengan wisata sehingga mereka bukan hanya tinggal tapi juga bisa sekaligus berlibur bersama keluarga.

#main-purpose

membuat website yang memiliki banyak item pilhan (rumah, apartment, hotel) juga dengan design minimalist, menjanjikan dan juga meudah diakses.

#research

Melakukan riset terlebih dahulu terhadap kompetitor yang lain untuk mendapatkan kelebihan dan kekurangan mereka sehingga dapat kita jadikan bahan improvisasi.

Customer Persona

Ander Herrera, Product Designer

#Bio

Ander Herrera adalah seorang product designer di salah satu perusahaan teknologi. ia memilki 2 orang anak yang masih kecil yang selalu hadir untuknya setiap hari.

Ander sangat suka mengajak keluarganya liburan sekaligus bekerja. jadi dia membutuhkan tempat yang cocok untuk untuk bekerja, berlibur, dan mempunyai tempat tinggal.

#Goals

  1. Mengajak keluarga berlibur
  2. Bekerja sambil liburan
  3. Tempat yang nyaman dan tersedia signal yang kencang

#Frustrasions

  1. Tempat liburan bagus tapi tempat tinggal tidak mendukung
  2. Review hotel nya kurang meyakinkan
  3. Dekat dengan tempat wisata tapi susah signal

#Influences

  1. New Place
  2. Nature
  3. Technology
  4. Experience
  5. Promo

#Influences

  1. Family
  2. Trip
  3. Work
  4. Explore

Information Architecture

information architecture bertujuan untuk mengetahui apa-apa saja yang akan di tampilkan di dalam website staycation kita. seperti halaman home/landing page, nah nanti mau di isi apa di halaman tersebut seperti nama-nama product, review product, dan lain-lain. Information Architecture penciptaan struktur penyusunan untuk website,aplikasi yang memungkinkan kita untuk memahami sebagai pengguna/user dan mana informasi yang kita inginkan dan kita butuhkan.

Main Flow

Tujuan dibuat nya main flow agar mengetahui apa-apa saja yang dilakukan user ketika menggunakan website, dari user membuka website, memilih kamar, memilih jadwal penginapan, sampai melakukan transaksi pembayaran. hal ini akan sangat memudahkan tim developer ketika akan mendevelop sebuah website sehingga tim developer tahu apa apa saja yang akan dilakukan user ketika menggunakan website tersebut.

Websites for Information

Wireframe

Setelah melakukan information architecture dan main flow, selanjutkan memasuki langkah wireframe atau gambaran kasar dari sebuah halaman website atau aplikasi. pembuatan wireframe ini sangat penting sehingga seorang desainer dan klien fokus pada konten terlebih dahulu. disini saya membuat 5 halaman:

  1. Halaman Home Page
  2. Halaman Detail Page
  3. Halaman Booking Information
  4. Halaman Pembayaran
  5. Halaman Succes Pembayaran

Defining Colors

Sebelum menuju ke mockup, saya melakukan riset warna apa yang harus saya gunakan berdasarkan branding dan apa yang dilakukan perusahaan.

Mockup

Setelah mendesain wireframe atau gambaran kasar dari website tersebut, saya melanjutnya ke tahap mockup. mengisi gambar, membuat beberapa elemen untuk menekankan makna situs, menambahkan warna, dan menyempurnakan tata letak.