Studi Kasus UX| BukaBuku

Rendah nya angka literasi di Indonesia sudah sangat memperhatinkan. Minimnya pasokan buku-buku berkualitas dalam bidang akademik membuat para akademisi kesusahan dalam melakukan riset. Benar bahwasannya buku-buku bagus dapat didapatkan pada situs-situs penyedia buku Internasional, namun harganya akan sangat mahal meski sepadan dengan isinya.

Tapi pada beberapa kasus, para akademisi tidak memerlukan keseluruhan buku untuk riset nya, melainkan hanya beberapa bagian untuk keperluan citasi ataupun landasan teori dari riset yang sedang dibangunnya. Hal ini mengakibatkan ke-tidak-efektifan dalam pembelian buku jika dibanding kan dengan harga yang harus dibayar sedang mereka hanya memerlukan satu bab dari buku tersebut.

Kesimpulannya, bagaimana kita bisa menyediakan buku-buku berkualitas ke pasar Indonesia dengan harga yang terjangkau dan membuat pembelian buku untuk keperluan riset akademisi bisa lebih efektif atau tidak mubazir?

Idea Validation

Untuk mencari solusi dari permasalahan diatas saya melakukan diskusi pada temen-teman terdekat yang memiliki hobi membaca buku, riset dengan topik yang berat, dan yang pernah membeli buku melalui situs penyedia buku Internasional untuk bacaanya.

Berdasarkan cerita mereka, permasalahan yang disebutkan diatas benar adanya. Ditambah, sebenarnya terdapat banyak penulis-penulis yang berkecimpung di bidang akademisi di Indonesia namun sering terhalang oleh susahnya mendapatkan kesempatan untuk bukunya di-publikasikan. Hingga beberapa dari mereka sering membagikan buku-buku elektronik secara gratis pada publik. Akhirnya kami sepakat untuk merembukkan sebuah solusi yang dapat membantu menyelesaikan masalah ini.

Setelah melakukan perancangan, diinsiasilah apliasi berbasisi web bernama BukaBuku dengan 4 pengalaman yang ingin diciptakan pada aplikasi ialah sebagai berikut:

1. Jual/beli buku per bagian
2. Eksposisi penulis/akademisi lokal
3. Eksplorasi buku baru dan rekomendasi
4. Baca buku online

Design Process

Interview

Setelah memahami betul apa yang masalah yang ingin diselesaikan dan mengerti bagaimana solusi yang ini dibangun tentunya begitu banyak keputusan yang harus diambil berdasarkan pertimbangan-pertimbangan para stakeholder. Seperti fungsionalitas apa yang diutamakan atau diprioritaskan, bagaimana mencapainya, kesan atau pengalaman apa yang ingin diciptakan, dan lain-lain. Beberapa pertanyaan yang muncul dipikiran saya antara lain:

1. Seberapa kecil bagian buku akan dipecah untuk dijual perbagian? Apakah per-bab? Sub-bab? Bahkan paragraf atau kalimat?
2. Apakah buku yang sudah dibeli dapat diunduh?
3. Lebih utama proses pencarian buku karna asumsi pengguna sudah mengetahui buku apa yang ingin dicari? Atau eksplorasi buku? Karna hal ini akan mempengaruhi bentuk dari halaman utama pengguna
4. Kesan apa yang ingin ditimbulkan? Mewah? Friendly? Atau Professional?

Berdasarkan hasil wawancara, hasil yang saya dapatkan adalah antara lain:

1. Pemecahan bagian buku maksimal hanya sampai per paragraf. Dengan pertimbangan keperluan citasi namun tidak terlalu dalam hingga per kalimat karna akan menyusahkan pada bagian indexing dan ketergantungan antar topik per paragraf.
2. Buku yang dibeli tidak bisa diunduh. Dengan pertimbangan untuk meningkatkan retensi dari pengguna ke aplikasi.
3. Alur penggunaan yang diutamakan ialah eksplorasi. Dengan mempertimbangkan tujuan untuk meningkatkan eksposisi dari buku buku lokal.
4. Kesan yang ingin diciptakan ialah Insightful, Sophisticated, Clean, dan Powerful. Nilai-nilai tersebut akan mempengaruhi beberapa keputusan dalam desain.

Sketching

Saat ingin melakukan proses desain saya sering kesulitan menentukan harus memulai darimana dan bagaimana bentuknya. Maka dari itu, sebelum langsung melompat ke desain secara digital saya membuat gambaran dan berbagai macam coretan cepat yang merepresentasikan solusi yang ingin dibuat. Keluaran dari tahap ini adalah saya dapat mendapatkan gambaran lebih pasti dan pola dari tampilan yang akan dibangun secara umum. Sekaligus mencoba memahami alur penggunaan aplikasi lebih dalam.

Setelah melakukan sketsa beberapa kali, saya meminta saran dan konfirmasi dari para stakeholder mengenai desain yang sesuai dengan sedikit menjelaskan pertimbangan dari keputusan desain yang diambil. Hingga akhirnya kami dapat menentukan pola dan desain mana yang sesuai dan akan dieksekusi.

Wireframing

Pada tahap ini, saya melakukan blocking terhadap desain yang sudah dipilih pada tahap sebelumnya dengan tujuan menambahkan detail detail kecil dan hirarki pada konten. Semua komponen berbentuk kotak kotak dan sudah melambangkan bentuk konten ini apa dan komponen apa saja yang akan menyusunnya. Pada tahap ini juga saya menerapkan grid system agar kedepannya mudah apabila diperlukan desain responsif ke perangkat tertentu.

Landing Page Wireframe

Hi-Fi Design

Tiba lah saya pada tahap High Fidelity Design dimana pada tahap ini (menurut definisi pribadi) merupakan tahap menambahkan konteks pada desain. Disini saya mulai menuangkan warna dan bentuk yang mewakili kesan yang ingin ditimbulkan. Juga menambahkan copy dan konten yang membuat desain lebih mudah dipahami dan merepresentasikan konten yang kira akan tampil pada penggunaan di masa depan.

Landing Page

Book Detail Page

Book Viewer Page

Design Validation

Designer’s Review

Tiap designer tentu memiliki idealisme dan sudutpandang nya yang berbeda-beda maka dari itu saya memutuskan untuk meminta masukan secara langsung kepada rekan-rekan desainer saya dari berbagai pengalaman dan level, baik yang baru memulai hingga yang berpengalaman.

Proses yang saya pilih ialah dengan sedikit menjelaskan latar belakang dari masalah yang ingin dipecahkan, menjelaskan solusi yang ingin dibangun, lalu meminta feedback dari hasil desain yang sudah dibuat.

Masukan yang saya dapatkan adalah antara lain:

1. Kurang tergambarnya konsep jual beli buku pada halaman awal
2. Kurang nya kontras warna pada teks menu samping pada halaman baca
3. Mempertimbangkan untuk penambahan pola tampilan carousel pada halaman utama

Public’s Review

Sedikit berbeda saat saya meminta pendapat pada sesama designer. Untuk kali ini saya mencoba melihat seberapa intuitif dan familiar desain yang saya buat kepada calon pengguna secara umum. Saya tidak menjelaskan latar belakang dari permasalahan yang ingin dipecahkan atau solusi yang ditawarkan, namun saya meminta untuk para calon pengguna untuk menebak aplikasi apakah ini dengan hanya melihat 3 screen yang sudah saya buat sebelumnya.

Kesimpulan yang saya dapat dari para calon pengguna ialah:

1. Mereka tidak langsung memahami aplikasi ini merupakan situs jual beli buku saat melihat halaman landing page dan book detail. Mereka sedikit kebingungan, apakah ini artikel, musik, atau yg lain. Mereka baru memahaminya saat melihat halaman book viewer lalu kembali ke halaman book detail baru untuk bertanya “Jadi ini buku nya dijual per bagian?”.
2. Untuk menambah exposure dan makna jual beli buku mereka menyarankan untuk mengganti pola foto thumbnail menjadi cover dari buku itu dan mengurangi penjelasan dari buku tersebut.

Revision

Setelah melakukan perbaikan berdasarkan saran dan masukan hasil dari desain aplikasi BukaBuku adalah:

Landing Page Revised

Book Detail Page Revised

Book Viewer Page Revised

Dengan begitu, diharapkan BukaBuku dapat menyelesaikan masalah literasi Indonesia, dan memudahkan bagi para akademisi atau peniliti untuk melanjutkan studinya ke tingkat yang lebih tinggi.

Catatan:

Untuk hasil dari project ini bisa anda lihat di Figma pada tautan berikut.