ESENTIAL CLEAN UI/UX- Web Design
- MIFTACHUL BACHRUDDIN
- Jul 25, 2022
- 4 min read
Updated: May 15, 2023
Essential Clean merupakan suatu usaha di bidang jasa pencucian dan reparasi sepatu yang berdiri sejak tahun 2020. Selama ini proses pengelolaan bisnis dilakukan secaradaring dengan platform media sosial dan secara luring untuk pasar Malang. Semenjak berlakunya lockdown sampai dengan PPKM, usaha ini sangat terpengaruh, sehingga proses pelayanan jasa yang ditawarkan harus dilakukan melalui daring.
Tentang Project
Waktu pengerjaan : Juli 2021
Role: UI/UX Designer
Tools : Figma, Photoshop
Deskripsi: Beberapa permasalahan yang dihadapi Essential Clean diantaranya karena sering terjadi human error dikarenakan chat pribadi dan bisnis yang tidak terpisah, waktu tunggu admin untuk merespon pesanan berkisar antara 30 menit - 2 jam pada keadaan sibuk serta terbatasnya jumlah admin dan yang mengelolah pesanan terdiri dari satu orang admin. Dengan permasalahan awal tersebut, saya memutuskan bahwa produk kami akan fokus pada: Pembuatan website dengan fitur komunikasi dan pemesanan jasa.
Design Process
Pada Project ini menggunakan pendekatan Human Centered Design (HCD). Berikut tahapan dalam perancangan UI/UX pada penelitian ini :
| |
2. Menentukan persyaratan pengguna | 4. Evaluasi Desain terhadap Persyaratan |
Proses wawancara dilakukan dengan 5 orang pengguna yang terdiri dari pegawai dan masyarakat umum, Wawancara dilakukan melalui media Google Meet. Penentuan kriteria pengguna didasarkan pada insight audiensi akun Instagram dan berdasarkan data pelanggan yang sering menggunakan jasa mereka.
Kelompok pengguna | Karakteristik |
Karyawan Essential Clean |
|
Pengguna umum (End user) |
|
Poin-poin penting dalam pertanyaan yang diajukan:
Perilaku
Permasalahan
Motivasi
Harapan
Kebutuhan
Saran
User Persona
Persona adalah suatu aktor fiksi dengan karakter berdasarkan aktor nyata yang menggambarkan target pengguna. Karakter dalam persona diperoleh darihasil wawancara.
Empathy Map
Empathy map adalah sebuah tool atau dokumen yang dapat membantumu menganalisa serta memahami prilaku pengguna dari produk. Empathy map terdiri dari empat bagian yaitu meliputisays, thinks, does, dan feels.
User Journey
Penggambaran user journey yaitu untuk mendekonstruksi pengalaman pengguna dengan suatu produk atau layanan sebagai urutan langkah. Pada penelitian ini menggunakan User journey dengan tipe retrospective maps yang berfokus pada proses yang dilalui pengguna pada saat ini.
Persyaratan pengguna merupakan harapan oleh pengguna yang harus ada dalam sistem. Berikut merupakan daftar permasalahan dan solusi atau fitur yang disarankan ada pada desain user interface yang diharapkan dapat mengatasi permasalahan yang ada, permasalahan tersebut didapatkn pada proses wawancara.
Permasalahan | Solusi yang disarankan | Deskripsi | Refrensi |
|---|---|---|---|
Pertanyaan umum yang sering ditanyakan konsumen. | FAQ (Frequently Asked Questions) | Untuk mengurangi pesan atau pertanyaan dengan pertanyaan umum. Penggunaan FAQ juga dapat mengoptimalkan kredibilitas website berorientasi informasi (Leavitt, 2006). |
|
Waktu tunggu admin untuk merespon pesana | Live Chat | Merubah sistem perpesanan dari WhatsApp ke chat dalam website untuk urusan bisnis. | ‘Contact Us’ Page Guidelines (Kaley, 2019) |
Proses pengiriman pesanan terkendala faktor cuaca. | Status Trackers | Status Trackers berfungsi untuk melacak atau membuat gambaran kemajuan dari proses kerja. Biasanya terdiri dari status terbaru dan pembaruan sebelumnya, ditampilkan dalam urutan kronologis. | Status Trackers and Progress Updates: 16 Design Guidelines (Rosala, 2019) |
Metode pembayaran yang diterima Essential Clean untuk sementara hanya BCA dan tunai. | Payment gateway. | Berfungsi sebagai sistem transaksi online yang mengotorisasi proses pembayaran, baik yang menggunakan kartu kredit, transfer bank, dan e-wallet. | E-Commerce: payment gateways (Department Of Broadband, Communications And The Digital Economy, 2012) |
Ragu dengan review layanan yang tidak sepenuhnya review asli. | Site reviews & rating | Sebagai feedback berupa penilaian suatu produk yang diberikan oleh pengguna dan untuk menumbuhkan kepercayaan pelanggan. 95% pengguna mengandalkan ulasan untuk mempelajari lebih lanjut tentang produk (Babich, 2021). | UX Guidelines for Ecommerce Product Pages. (Sherwin , 2019) |
Desain Solusi
Sitemap
Sitemap adalah kumpulan informasi tentang tautan yang terdapat dalam website yang untuk mempermudah pengunjung menemukan halaman yang diinginkan. Sitemap dibuat untuk memvisualisasikan halaman yang terdapat di dalam sebuah website. Berikut merupakan sitemap desain website Essential Clean.
Wireframe
Perancangan desain solusi dilakukan dengan membuat desain wireframe untuk kerangka yang menjadi representasi visual dari struktur website yang dibuat. Pembuatan wireframe didasarkan pada kebutuhan pengguna yang didapat melalui proses pada tahap sebelumnya.
Mockup (High fidelity prototype)
Pada tahap ini dilakukan penyempurnaan dari wireframe (low fidelity prototype). High fidelity prototype dilakukan implementasi dari aspek desain visual, termasuk gambar, warna, dan tipografi yang relevan dengan konten berdasarkan panduan desain yang telah dibuat. High fidelity prototype memberikan gambaran secara detail sebelum produk dibuat.
Prototype
Tahap terakhir dari solusi desain adalah pembuatan prototype. Prototipe adalah model fisik yang berfungsi dari suatu sistem atau subsistem, prototipe berfungsi sebagai versi awal dari sistem atau komponen dari mana persyaratan diekstraksi dan yang menjadi dasar versi selanjutnya, user journey dan mengidentifikasi masalah potensial pada tahap awal. Pada tahap ini pembuatan prototype menggunakan aplikasi figma untuk merancang desain interaktif & pengujian prototype.
Evaluasi Desain terhadap Persyaratan
Pada evaluasiini melibatkan delapan orang partisipan yang memungkinkan kita untuk menemukan permasalahan usability (Nielsen, Why You Only Need to Test with 5 Users, 2000). Evaluasi dilakukan berdasarkan task sekenario sebagai alur partisipan dalam mensimulasikan fungsi dari prototype website. Pada penelitian ini, terdapat beberapa kelompok pengguna untuk menjalankan pengujian sebanyak tiga kelompok. Berikut merupakan daftar partisipan beserta jumlah partisipan yang terlibat pada masing-masing kelompok pengguna.
Kelompok pengguna | Jumlah partisipan |
|---|---|
Karyawan Essential Clean | 2 |
Pelanggan | 3 |
Non Pelanggan | 3 |
Jumlah Total | 8 |
Hasil pengujian completion rate
Jumlah Tugas | 9 Task Scenario |
|---|---|
Jumlah Partisipan | 8 Partisipan |
Complation rate | 93.06 % |
Hasil pengujian time-based efficiency (TBE)
Jumlah Tugas | 9 Task Scenario |
|---|---|
Jumlah Partisipan | 8 Partisipan |
TBE Semua Task (goals/sec) | 0,117 goals/sec |
Kualifikasi Time Behaviour | Sangat Cepat |
Hasil pengujian sistem usability scale (SUS)
Skor rata-rata | 89.1 |
|---|---|
Adjective Ratings | Best Imaginable |
Grade Scale | B |
Aceptability range | Aceptable |
Kesimpulan
Setelah melakukan penelitian mengenai perancangan user Interface Website yang telah dilakukan pada Essential Clean, maka dapat diambil kesimpulan sebagai berikut:
Analisis persyaratan pengguna disusun dengan melakukan identifikasi stakeholder dan calon pengguna website yang merupakan karyawan dan owener Essential Clean serta pengguna layanan. Kemudian dilakukan wawancara dengan karyawan dan owener Essential Clean serta calon pengguna terkait permasalahan yang dialami saat dan kebutuhan apa yang harus dipenuhi saat menggunakan layanan. Hasil wawancara dijadikan dasar dalam penyusunan kebutuhan pengguna.
Solusi desain dibuat dengan menggunakan metode human-centered design, yaitu dimulai dengan melakukan analisis konteks penggunaan dan analisis kebutuhan pengguna. Berdasarkan hasil tahapan tersebut selanjutnya dilakukan pembuatan sitemap, user flow, desain guideline, wireframe, wireflow, high fidelity prototype dan pembuatan prototipe. 3. Evaluasi solusi desain dilakukan menggunakan teknik pengujian usability dengan melibatkan delapan orang partisipan yaitu dua orang yang merupakan karyawan dan owener Essential Clean, tiga orang pelanggan dan tiga orang non pelanggan. Pengujian Usability dengan mengukur tiga aspek yaitu efektivitas dengan menggunakan success rate, efisiensi dengan menggunakan time based efficiency (TBE) dan kepuasan dengan menggunakan sistem usability scale.
Pada aspek efektivitas mendapatkan success rate sebesar 93.06%, yang berarti hampir semua partisipan dapat menyelesaikan tugas. Pada aspek efisiensi mendapatkan nilai time based efficiency seluruh tugas sebesar 0,117 goals/sec, jika dikonfersi ke dalam indikator time behaviour maka dapat dikategorikan sangat cepat. Lalu pada aspek kepuasan diperoleh nilai rata-rata dari sistem usability scale seluruh tugas pada semua partisipan sebesar 89.1, di mana jika di konversi kedalam adjective ratings, acceptability scores, dan grading scales masuk dalam kategori Best Imaginable dan grade scale mendapatkan nilai B yang berarti hasil desain solusi dapat diterima.
Comments