UI/UX Case: Avento — Aplikasi Freelancer Service Untuk Mahasiswa

Maulana Rifky Yudhira
9 min readFeb 27, 2023

--

👋 Pendahuluan

Beberapa waktu lalu, saya, Maulana Rifky Yudhira, bersama dengan kedua teman saya dari program studi Bisnis Digital Universitas Negeri Jakarta bernama Muhammad Farhan Ariq Pramanda dan Dennis Trama Karindra mengikuti kompetisi UI/UX yang diadakan oleh Himpunan Mahasiswa Informatika Institut Teknologi Bandung dalam rangkaian kegiatan bertajuk ARKAVIDIA 8.0. Walaupun kami belum berhasil melewati babak penyisihan, tetapi berbagai pengalaman dalam proses pengembangan konsep produk digital ini telah membantu kami dalam mempelajari lebih dalam mengenai seluk beluk proses riset, desain, hingga bekerjasama secara tim.

Kenal Lebih Dalam Mengenai Produk Kami

Avento merupakan sebuah konsep produk digital yang dikembangkan oleh kami dalam upaya mengikuti kompetisi ARKAVIDIA. Produk ini merupakan sebuah aplikasi mobile yang berfungsi untuk membantu mempertemukan freelancer yang membutuhkan pekerjaan dengan para pencari jasa freelancer. Direct competitor dari Avento sendiri seperti Fiverr dan Upwork yang memiliki konsep bisnis yang hampir serupa.

— — —

💭 Latar Belakang

Mengutip dari laporan Bank Dunia diawal tahun 2021, diketahui bahwa penetrasi Internet di Indonesia mencapai angka 73,7% dengan rata-rata penggunaan mencapai 19 miliar jam untuk aplikasi sosial dan komunikasi melalui perangkat smartphone Android saja. Perkembangan dunia digital yang sangat signifikan memberikan dampak terhadap cara berkehidupan masyarakat, salah satunya dalam proses bekerja dan berkarya. Fenomena freelancer atau pekerja lepas digital menjadi sebuah tren dimasyarakat usia muda saat ini karena kesempatan mendapatkan pekerjaan dengan gaji puluhan juta dari Rumah hanya melalui perangkat digital semata menjadi suatu nilai menarik bagi Masyarakat. Di Indonesia sendiri, freelancer telah mencapai angka 4,3 juta dengan kontribusi terhadap PDB negara hingga sebesar 11 miliar Dollar AS pada tahun 2021 menurut data yang dipublikasikan oleh Bank Dunia.

Permasalahan

Seperti yang telah kami jabarkan sebelumnya, perkembangan industri freelancer didunia yang berkembang sangat pesat, terutama di Indonesia memberikan beragam inovasi untuk menunjang perkembangan tren ini, salah satunya dengan kehadiran platform freelancer service seperti Fiverr atau Upwork.

Platform-platform ini memberikan kemudahan dari segi bisnis dimana freelancer mampu menjual jasanya tanpa perlu mempelajari proses bisnis dan marketing secara mendalam dan mempermudah pencari jasa untuk menemukan pencari jasa dengan harga yang sesuai dengan budgetnya dengan keamanan transaksi karena proses transaksi melalui penyedia layanan sebagi pihak ketiga. Namun, permasalahan seperti akses pembayaran dan penarikan uang yang terbatas, keamanan freelancer dari aksi scam yang cukup rentan, atau proses pembagian komisi yang dirasa terlalu besar seringkali menjadi permasalahan tersendiri yang membuat kehadiran platform-platform sejenis menjadi kurang menarik.

Oleh karenanya, kami berupaya untuk membuat suatu produk yang mampu menjawab permasalahan yang dihadapi oleh freelancer maupun penyedia jasa untuk menciptakan ekosistem bisnis freelancer yang lebih aman, nyaman, dan menyenangkan bagi semua pihak.

— — —

🧠 Proses Riset UX Hingga Desain UI

Proses desain yang kami jalankan berdasarkan atas UX Framework yang bernama “Five Elements of Framework”. Framework ini merupakan panduan bagi seorang desainer dalam mengubah suatu konsep menjadi sebuah produk yang tangible.

Five Elements of Framework Model (ramaster.medium.com)

Dalam proses ini, kami membagi proses kerja kami menjadi lima tahapan, yaitu:

  1. Strategy, proses ini bertujuan untuk menentukan tujuan bisnis yang ingin dicapai oleh produk yang akan kami kembangkan. Selain itu, proses riset mengenai end-user kami akan terjadi dalam proses ini. Dalam hal ini, end-user kami adalah para Mahasiswa yang tertarik bekerja sebagai freelancer dan pekerja yang membutuhkan jasa freelancer.
  2. Scope, proses ini bertujuan untuk menentukan fitur-fitur apa saja yang akan kami gunakan sebagai bagian dari solusi dalam memecahkan permasalahan yang kami temui dari segi users dan sebagai upaya dalam mendapatkan unique selling point produk kami dari segi bisnis.
  3. Structure, proses ini bertujuan untuk membuat struktur dari navigasi yang akan digunakan oleh users dalam melakukan interaksi dengan aplikasi yang kami bangun.
  4. Skeleton, proses ini bertujuan untuk membuat sketsa sederhana sebagai gambaran dasar bagaimana beragam fitur dan interaksi yang kami bangun akan tervisualisasikan dalam desain.
  5. Surface, proses terakhir ini bertujuan untuk mengubah sebuah tampilan sketsa/wireframe dari desain yang kami bangun menjadi konsep desain produk yang bersifat high-fidelity dan siap diuji coba.

Pemilihan UX Framework Five Elements of Framework” didasarkan dari scope proyek yang tergolong sederhana dengan jangka waktu yang sangat terbatas akibat ketatnya jadwal pendaftaran lomba kala itu. Akibatnya, kami mengalami keterbatasan dari segi proses riset maupun desain.

Dalam perkembangannya, proses pengembangan produk kami bagi kedalam tiga role, yaitu Muhammad Farhan Ariq P. sebagai UX Designer, Dennis Trama Karindra sebagai UX Architect, dan Maulana Rifky Yudhira sebagai UI Designer.

Proses Strategy — Riset Produk Dari Segi Users dan Bisnis

Riset produk yang kami jalankan dilakukan dengan melakukan observasi atas ketiga direct competitor dari konsep produk digital yang kami kembangkan, antara lain:

  1. Fiverr, perusahaan platform digital freelance service asal Israel ini merupakan salah satu pemain besar diindustri platform digital freelance service. Fiverr terkenal dengan fitur “mulai dari lima dollar” dan basis pengguna yang sangat besar hingga mencapai 3,42 juta aktif pengguna ditahun 2020.
  2. Upwork, perusahaan platform digital freelance service asal Amerika Serikat ini merupakan pemain besar dalam industri digital freelance service dengan sistem kontrak. Upwork banyak menjadi pilihan bagi para IT freelancer seperti programmer dan UIUX designer.
  3. Solos.work, Perusahaan platform digital freelance service asal Indonesia ini tengah menjadi perbincangan diindustri digital freelance service tanah air. Solos menyediakan servis dalam membantu masyarakat untuk menjalankan bisnis jasa daringnya secara mudah dan cepat.

Hasil riset yang kami lakukan kemudian kami coba diskusikan lebih dalam melalui software FigJam dengan melakukan deduksi terhadap pengalaman pengguna dari segi permasalahan dan kemudahan yang kami temui dalam aplikasi terkait.

Hasil riset dari deduksi pengalaman pengguna produk kompetitor (dokumentasi tim)

Dari hasil riset pengalaman pengguna produk-produk terkait, kami mencoba membuat diagram affinity untuk mengelompokan pengalaman-pengalaman yang kami miliki sehingga mempermudah kami menentukan permasalahan utama yang akan kami pecahkan.

affinity diagram dari proses riset kompetitor (dokumentasi tim)

Dari data yang kami peroleh, diketahui terdapat tiga masalah utama yang menjadi concern utama kami untuk dipecahkan. Antara lain:

  1. Masalah retensi pengguna dari aplikasi-aplikasi tersebut yang cenderung rendah, hal ini dikarenakan potongan harga yang dinilai memberatkan penjual jasa dan keleluasaan dan keamanan dalam bertransaksi yang terbatas bagi pembeli jasa.
  2. Masalah kurangnya rekomendasi penjual jasa yang cocok bagi pembeli jasa yang baru pertama kali menggunakan platform terkait, sehingga menyebabkan kebingungan serta ketidakyakinan dalam menggunakan platform terkait.
  3. Tindakan curang yang dilakukan oleh oknum pembeli yang melakukan pencurian hasil kerja untuk mendapatkan hasil jasa secara cuma-cuma. Modus operandinya sendiri banyak dijumpai oleh pekerja desain dan seni visual yang hasil kerjanya dijiplak tanpa diketahui pekerja dan kemudian proyeknya dibatalkan sepihak.

Selanjutnya, dari permasalahan-permasalahan tersebut kami coba susun menjadi suatu problem statement atau kalimat-kalimat yang berguna untuk menegaskan permasalahan-permasalahan yang ingin kami hasilkan solusinya. Kami membaginya atas tiga sudut pandang, yaitu sudut pandang pembeli, penjual, dan penyedia layanan. Problem statement itu, antara lain sebagai berikut:

Problem statement dari kiri ke kanan: Penjual jasa/freelancer, Pengembang/penyedia layanan, dan pencari jasa freelance (dokumentasi tim)

Selanjutnya, kami mencoba untuk menyelaraskan permasalahan tersebut dengan perilaku dari user ideal dari platform-platform tersebut dengan menggunakan pemodelan berupa UX Persona. UX Persona sendiri merupakan representasi fiksi dari user ideal kami tujuan mempermudah proses empati dengan user terkait dan mengindentifikasi apa saja yang sekiranya mereka butuhkan dan pengalaman yang mereka alami dengan lebih imersif.

Dalam membangun UX Persona, kami membuat dua macam persona, yaitu persona pembeli jasa dan persona penjual jasa. Persona pembeli jasa yang dinamai “William” merupakan seorang pebisnis pemula yang memiliki budget terbatas dalam merekrut pekerja dan penjual jasa yang dinamai “Sonya” merupakan seorang pekerja lepas yang bekerja dengan platform digital freelance service.

UX Persona dari freelancer dan pencari jasa (dokumentasi tim)

Selanjutnya, kami mencoba mendokumentasikan hasil riset kami dalam bentuk diagram UX Customer Journey. UX Customer Journey Mapping sendiri adalah proses yang digunakan oleh UX Designer untuk memahami bagaimana pelanggan berinteraksi dengan produk atau layanan. Hal ini memungkinkan desainer untuk mengidentifikasi kebutuhan, harapan, motivasi, dan painpoints pengguna.

UX Journey dari freelancer dan pencari jasa (dokumentasi tim)

Berdasarkan UX Customer Journey kami, diketahui bahwa titik terburuk aplikasi-aplikasi tersebut dalam user flow utama mereka yaitu interaksi menu login/register yang kurang nyaman dipakai dan media feedback yang dirasa kurang humanis. Hal ini tentu menjadi masukan berarti bagi kami, dimana kami menemukan permasalahan lain diluar permasalahan utama yang ingin kami selesaikan dalam aplikasi yang kami bangun.

Proses Scope —Menentukan Fitur Untuk Solusi dan USP

Selepas proses strategy selesai, kami mencoba melakukan iterasi kembali atas temuan yang kami jalankan diproses sebelumnya. Berdasarkan data-data tersebut, kami mencoba membangun beberapa fitur sebagai jawaban atas permasalahan sekaligus menjadi Unique Selling Point kami dari segi bisnis. Antara lain:

  1. Aventhouse, fitur ini merupakan solusi kami dalam mengatasi permasalahan dari retensi pengguna dengan memberikan beragam benefit kepada pembeli jasa yang akan semakin besar seiring dengan kenaikan level akun pengguna yang didasarkan atas metrik jumlah pembelian jasa yang sukses dilakukan hingga selesai.
  2. Adsvento, fitur ini merupakan solusi kami dalam mengatasi kesulitan pengguna pembeli jasa yang tergolong baru dengan platform sejenis dimana pembeli dapat memilih lapak jasa yang terdapat dalam seksi rekomendasi. Rekomendasi jasa sendiri merupakan lapak-lapak jasa dengan standardisasi tertentu yang melakukan periklanan digital didalam aplikasi Avento oleh penjual jasa terkait untuk meningkatkan engagement rate dari lapak-lapak mereka. Fitur ini selain membantu pengguna, juga membantu kami dalam meningkatkan pendapatan melalui periklanan dalam aplikasi.
  3. Watermark preview, fitur ini merupakan solusi kami dalam mengatasi kemungkinan pembeli yang melakukan kecurangan dengan membuat watermarking hasil kerja secara otomatis sehingga mengurangi tindakan kecurangan yang dilakukan oleh oknum pembeli jasa yang kurang bertanggungjawab. Untuk saat ini, fitur ini hanya dikhususkan untuk penjual dalam jasa desain grafis & seni karena tingginya rentan kemungkinan kecurangan dalam bidang terkait dibanding bidang-bidang lainnya.

Selanjutnya, kami mencoba melakukan mapping atas halaman-halaman apa saja yang akan dibuat sekaligus menentukan fitur-fitur apa saja baik fitur utama maupun pendukung yang akan kami hadirkan kedalam produk desain nantinya.

Proses mapping navigasi dan halaman produk Avento (Dokumentasi tim)

Setelahnya, kami mencoba menyusun konsep halaman-halaman tersebut menjadi suatu sitemap yang terorganisir untuk memodelkan navigasi aplikasi kami dan interaksi yang akan terjadi antara suatu komponen dengan komponen lainnya.

Sitemap dari produk Avento (dokumentasi tim)

Proses Skeleton — Sketsa Wireframe Dari Produk Avento

Kami melakukan proses terakhir dalam pengembangan UX dari aplikasi Avento, yaitu proses pembuatan wireframing dari aplikasi kami berdasarkan sitemap yang telah kami buat.

Wireframe dari produk Avento (dokumentasi tim)

Proses Surface— Desain Final Dari Produk Avento

Dalam membangun tampilan final dari Avento, kami mencoba membuat suatu mini style guide atau sistem desain yang kami pergunakan untuk membuat desain yang mampu terdiri atas 4C: Consistency, Continuity, Context, dan Compliment.

mini style guide atau sistem desain dari produk Avento (dokumentasi tim)

Setelah membangun mini style guide atau sistem desain yang akan kami pakai, kami melanjutkan kepada proses terakhir, yaitu proses desain high-fidelity yang mampu kamu lihat sebagai berikut:

Desain fitur utama produk Avento (dokumentasi tim)
Flow proses pembelian jasa freelancer dan pengecekan & pengiriman hasil kerja freelancer (dokumentasi tim)
preview desain dari produk Avento (dokumentasi tim)

Untuk tampilan prototype dari desain Avento, kamu bisa melihat video penjelasan kami melalui link Youtube berikut:

Atau mengakses secara mudah melalui link prototype Figma kami disini.

— — —

☕Penutup

Fiiuuhh… Proses pengembangan kami cukup panjang dan melelahkan. Namun, dibalik proses yang melelahkan tersebut, kami belajar banyak dalam menjalani proses pengembangan desain UI/UX secara tim, dari proses bertukar pikiran, melakukan riset, hingga mendesain tampilan final.

Walaupun kami belum mendapatkan hasil yang kami harapkan dari kompetisi UI/UX yang kami ikuti, kami mencoba untuk tidak patah arang dan mencoba melakukan evaluasi atas kinerja kami untuk perkembangan kami dimasa mendatang. Terima kasih kepada Panitia dan Panelis-panelis ARKAVIDIA 8.0 dan kawan-kawan tim, Muhammad Farhan Ariq dan Dennis Trama Karindra yang telah berkontribusi dalam pengembangan produk ini.

Jika kamu memiliki saran maupun kritik mengenai UX Case yang saya tulis disini, silahkan hubungi Saya melalui email mrifkyudhira@gmail.com atau drop dikolom komen dibawah 👇

Thanks, and See you! 😁🍻

Free

Distraction-free reading. No ads.

Organize your knowledge with lists and highlights.

Tell your story. Find your audience.

Membership

Read member-only stories

Support writers you read most

Earn money for your writing

Listen to audio narrations

Read offline with the Medium app

--

--

Maulana Rifky Yudhira
Maulana Rifky Yudhira

Written by Maulana Rifky Yudhira

Product Designer & UI Designer | Visual Storyteller | Builder & Designer

No responses yet

Write a response