[UX Case Study] — Aplikasi Booking Personal Photographer

Galuh Noor Akbar Pamungkas
8 min readAug 21, 2018

--

Brief : Bagaimana membuat orang-orang yang ingin memesan jasa fotografer dapat melakukan pemesanan fotografer dengan mudah dengan hanya menggunakan sebuah aplikasi?

1. Analisis Masalah

Hasil riset yang saya lakukan dengan mencari informasi pada forum-forum dan grup di internet serta melihat beberapa review aplikasi pemesanan fotografer, menyatakan bahwa ada beberapa masalah yang orang-orang alami :

  1. Memesan fotografer cukup sulit karena kebanyakan fotografer hanya menggunakan instagram sehingga proses pemesanan sepenuhnya dilakukan secara manual melalui media tersebut.
  2. Untuk mengetahui harga fotografer harus menghubungi fotografer terlebih dahulu karena para fotografer tidak mencantumkan harga dan paket yang mereka tawarkan di profile mereka.
  3. Tidak bisa mengetahui keahlian (spesialisasi) fotografer.
  4. Tidak bisa melihat portfolio fotografer yang ingin dipilih.
  5. Waktu pemilihan sesi foto tidak sesuai dan terkadang harga suka berubah.

2. User Persona

Dengan menuliskan user persona maka akan lebih mudah dalam merancang sistem yang sesuai dengan kebutuhan pengguna.

  • Persona Fotografer : dibuat berdasarkan data yang didapat setelah melakukan interview dengan fotografer
  • Persona Pencari Fotografer : Dibuat berdasarkan hasi interview dengan orang yang pernah menggunakan jasa fotografer.

3. Solusi masalah

solusi masalah didapatkan dari riset yang dilakukan langsung terhadap fotografer dan beberapa orang yang pernah menggunakan jasa fotografer dengan menggunakan metode semi-structured qualitative interview. Dari hasil interview yang dilakukan, dapat disimpulkan beberapa solusi dan kebutuhan pengguna:

  1. Membuat para calon pemesan mudah dalam mencari fotografer yang mereka butuhkan.
  2. Merancang aplikasi pemesanan fotografer sehingga dapat membuat proses pemesanan menjadi lebih cepat dan mudah.
  3. Membuat para calon pemesan mengetahui harga dan paket yang fotografer tawarkan.
  4. Membuat para calon pemesan dapat melihat portfolio fotografer sehingga dapat menjadikannya sebagai gambaran kualitas fotografer yang dipilih.

Flow pemesanan fotografer

Dari hasil riset yang dilakukan juga didapatkan flow pemesanan fotografer yang dilakukan secara manual, seperti berikut:

4. User Flow

Dengan mengacu pada flow yang telah ada akan lebih memudahkan dalam membuat user flow untuk aplikasi yang akan dirancang. Berikut ini adalah gambaran user flow pemesanan fotografer :

5. Wireframe

Setelah membuat user flow, hal yang dilakukan selanjutnya adalah membuat wireframe. Pada tahap ini kita membuat hal apa saja yang dapat dilihat oleh pengguna dalam aplikasi, informasi apa yang akan aplikasi berikan pada pengguna dan interaksi serta alur penggunaan seperti apa yang ingin diberikan kepada pengguna.

Berikut ini adalah wireframe aplikasi booking personal fotografer:

Wireframe Alur Pemesanan fotografer

Wireframe alur pemesanan fotografer dibuat berdasarkan user flow dan tampilan dibuat berdasarkan kebutuhan pengguna.

Wireframe alur pendaftaran dan login

Berikut ini adalah wireframe pendaftaran pengguna dan wireframe login pengguna.

6. Prototype

Setelah wireframe dibuat, yang dilakukan selanjutnya adalah membuat prototype. Dengan pembuatan prototype maka rancangan aplikasi nantinya akan terlihat menjadi lebih nyata dari segi tampilan dan juga dari segi interaksi. Selain itu, prototype juga dapat digunakan untuk melakukan pengujian terhadap pengguna nantinya.

Berikut ini adalah prototype dan penjelasan dari setiap halaman yang dibuat :

Prototype Home

Halaman ini adalah halaman pertama ketika user membuka aplikasi. Pada halaman ini pengguna akan melihat fotografer yang tersedia dan dapat mencari fotografer.

Berikut ini adalah penjelasan dari tiap elemen yang ada pada halaman home:

Nomor 1 : View mode list, User dapat merubah mode view menjadi list.

Nomor 2 : View mode grid, User dapat merubah mode view menjadi grid.

Nomor 3 : Fotografer card, card yang ada pada halaman home merupakan fotografer yang tersedia, ketika card ditekan maka akan muncul detail fotografer.

Nomor 4 : Filter, Pengguna dapat menggunakan filter untuk membuat fotografer yang muncul pada halaman home menjadi lebih spesifik.

Nomor 5 : Menu bar, Menu utama yang ada pada aplikasi yaitu menu Home (Halaman untuk pencarian fotografer yang tersedia), Shot (History pemesanan yang akan menunjukan history pesanan user), Message (Menu untuk melihat pesan antara user dan fotografer), dan Profile (Menu untuk mengatur profil user pada aplikasi).

Prototype Detail Fotografer

Ketika pengguna memilih fotografer yang tersedia pada halaman home, maka pengguna akan ditujukan pada halaman detail fotografer. Pada halaman ini pengguna dapat melihat fotografer lebih detail, mulai dari portfolio, harga, hingga paket yang ditawarkan.

Berikut ini adalah penjelasan dari tiap elemen yang ada pada halaman detail fotografer:

Nomor 1 : Back Button, ketika fotografer yang dipilih tidak sesuai yang diharapkan maka pengguna dapat kembali pada halaman awal.

Nomor 2: Thumbnail, thumbnail yang tampil pada halaman ini adalah versi maximize dari thumbnail yang ada pada halaman home sebelumnya.

Nomor 3: Portfolio, pada elemen nomor 2 ditampilkan 5 buah foto yang ditunjukan oleh fotografer yang dipilih. Dengan adanya portfolio fotografer ini diharapkan para calon pemesan akan mendapatkan gambaran seperti apa kualitas fotografer yang mereka pilih.

Nomor 4: Package List, elemen ini menunjukan paket-paket yang disediakan oleh fotografer dan juga menunjukan harga dari paket yang ada. Dengan adanya informasi ini diharapkan para calon pemesan dapat memilih fotografer sesuai dengan budget yang mereka miliki dan dengan adanya informasi harga, maka calon penyewa tidak perlu bertanya lagi kepada fotografer yang bersangkutan.

Nomor 5: Button BOOK, Untuk mentrigger user melakukan booking maka button book dibuat besar dan konsisten dibawah halaman. Dengan hal tersebut maka pengguna akan lebih mudah dan tertarik untuk melakukan booking.

Prototype Filter

Untuk membuat user lebih mudah dalam mencari fotografer yang lebih spesifik maka pengguna dapat menggunakan fitur filter.

Berikut ini adalah penjelasan dari tiap elemen yang ada pada halaman filter :

Nomor 1 : Photographer Type, dengan memilih tipe fotografer yang ingin difilter maka user dapat menemukan fotografer dengan tipe yang diinginkan.

Nomor 2 : Price Range, User juga dapat memfilter rentang harga fotografer yang sesuai dengan budget yang dimiliki.

Nomor 3 : Package, User dapat memfilter package apa yang dimiliki fotografer. Menurut hasil riset biasanya fotografer menerapkan paket harian dan perjam.

Prototype Select Date & Prototype Create Plan

Setelah user menjatuhkan pilihan pada salah satu fotografer, selanjutnya user akan memilih tanggal kapan akan melakukan sesi foto dan memilih paket yang disediakan fotografer.

Berikut ini adalah penjelasan dari tiap elemen yang ada pada halaman Select date :

Nomor 1 : Back button, membawa user kembali ke halaman detail fotografer.

Nomor 2 : Change Month, user dapat memilih bulan yang tersedia untuk menentukan waktu foto.

Nomor 3 : Select Date, user menentukan tanggal untuk melakukan sesi foto. ketika fotografer tersedia maka tanggal akan berwarna hitam sedangkan ketika fotografer tidak tersedia, maka tanggal akan berwarna abu-abu.

Nomor 4 : Button SELECT, Ketika user telah menentukan bulan dan tanggal untuk melakukan sesi foto selanjutnya pengguna dapat menekan button select untuk melanjutkan pemesanan.

Dan Berikut ini adalah penjelasan dari tiap elemen yang ada pada halaman Create Plan :

Nomor 1 : Back button, membawa user kembali ke halaman select date.

Nomor 2 : Create Plan, Terdapat 4 dropdown yang berfungsi untuk membantu user dalam memilih paket yang disediakan fotografer. Dropdown yang tersedia antara lain : Photoshoot type (Memilih jenis foto seperti traveling, wedding atau graduation), Select package (Memilih paket diantaranya adalah paket Hourly atau Daily), Set Time (Memilih jam melaksanakan sesi foto, tergantung pada availability fotografer), Session hour (jumlah sesi yang ingin dilakukan contoh untuk Hourly berapa jan dan untuk Daily berapa hari sesi foto). setelah semua dipilih maka akan muncul total harga yang harus dibayarkan.

Nomor 3 : Continue button, Setelah plan sudah dibuat selanjutnya tombol continue dapat ditekan untuk melanjutkan pemesanan.

Prototype Review Order

Setelah user meneyelesaikan seluruh proses maka user akan diminta melakukan review terhadap order yang dilakukan apakah sudah sesuai atau belum.

Berikut ini adalah penjelasan dari tiap elemen yang ada pada halaman Review Order :

Nomor 1 : Back button, membawa user kembali ke halaman create plan.

Nomor 2 : Cart, berisi informasi detail booking yang dilakukan oleh user.

Nomor 3 : Payment Details, berisi detail jumlah yang harus dibayarkan oleh user.

Nomor 4 : Continue button, Setelah order sudah direview selanjutnya tombol continue dapat ditekan untuk melanjutkan ke pembayaran.

Prototype Payment Method & Confirm Payment

Setelah seluruh proses pemesanan selesai selanjutnya pengguna akan dibawa pada halaman payment.

Berikut ini adalah penjelasan dari tiap elemen yang ada pada halaman Payment Method :

Nomor 1 : Back button, membawa user kembali ke halaman review order.

Nomor 2 : Select Payment Method, Memilih jenis metode pembayaran.

Nomor 3 : Continue button, Setelah sudah memilih jenis pembyaran selanjutnya tombol continue dapat ditekan untuk melanjutkan ke konfirmasi pembayaran.

Dan Berikut ini adalah penjelasan dari tiap elemen yang ada pada halaman Confirm Payment :

Nomor 4 : Back button, membawa user kembali ke halaman select payment method.

Nomor 5: Instruction, menunjukan instruksi pembayaran jika user merasa kebingungan.

Nomor 6 : Confirm Payment Button, Setelah semua proses selesai selanjutnya user mengkonfirmasi pembayaran.

Prototype Completed Booking

Setelah semua proses pemesanan hingga pembayaran selesai dan telah dikonfirmasi, maka user akan diberi tahu bahwa pesanan akan diproses, ketika user menekan button finish, pengguna akan dibawa pada halaman history order.

Prototype Register

Ketika pengguna belum mempunyai akun, maka pengguna dafat mendaftarkan akun pada halaman register seperti dibawah ini

Prototype Login

Ketika pengguna sudah memiliki akun, pengguna dapat langsung login kedalam aplikasi pada halaman berikut:

7. Usability Testing

Setelah membuat prototype, selanjutnya dilakukan testing. Saya melakukan testing terhadap 5 orang pengguna yang diberi skenario untuk melakukan pemesanan fotografer.

Skenario Melakukan Pemesanan Fotografer

Kamu akan traveling pada bulan september tanggal 10. Kamu ingin memesan fotografer traveling dengan paket hourly selama 2 jam sesi foto. Kamu ingin memulai sesi foto pada jam 8 pagi. Setelah kamu menemukan fotografer yang dicari, selanjutnya kamu akan melakukan pembayaran dengan metode bank transfer. silahkan gunakan aplikasi ini untuk memesan fotografer yang dapat mengabadikan momen traveling kamu.

Berikut ini adalah hasil dari testing terhadap 5 orang user

Kesimpulan

Dari masalah yang ada telah dibuat solusi berupa sebuah rancangan aplikasi booking personal photographer dengan mengacu pada kebutuhan user yang telah didapatkan dari riset yang dilakukan. Selain itu hasil testing menunjukan mayoritas user dapat menyelesaikan task dengan cepat. Hal tersebut berarti rancangan aplikasi yang dibuat cukup memudahkan pengguna dalam melakukan pemesanan fotografer.

Sekian case study yang saya lakukan. Semoga case study ini dapat dipahami dengan baik dan mohon maaf apabila penulisan kurang baik. Karena saya baru menulis case study untuk pertama kali :D

Apabila ada yang ingin ditanyakan ataupun ada masukan silahkan berikan komentar pada case study ini.

Terima kasih :)

Dribbble

LinkedIn

--

--

Galuh Noor Akbar Pamungkas
Galuh Noor Akbar Pamungkas

Written by Galuh Noor Akbar Pamungkas

Digital Product Designer. High curiosity, love to deep diving data, & really care to design impact. Currently actively looking for new role

Responses (3)