Studi Kasus UI/UX : Layout Redesign Halaman Pendaftaran Layanan Rawat Jalan Rumah Sakit.
Halo medium, kali ini saya akan kembali menulis studi kasus kecil kecilan saya untuk membagi insight dibalik decision saya me-redesign salah satu Layout Pendaftaran Layanan Rawat Jalan Rumah Sakit di Indonesia.
Latar Belakang…
Beberapa minggu yang lalu saya mencoba apply pekerjaan di sebuah software house yang terletak di jawa timur. Setelah proses wawancara selesai, head product manager software house tersebut memberi saya task untuk meredesain tampilan sebuah dashboard pendaftaran pasien suatu rumah sakit.
Saya langsung menyiapkan kertas untuk sketching, figma untuk tools desain ini dan beberapa experience yang saya dapat pada beberapa pekerjaan dan project UI/UX Design sebelumnya…
Dalam proses redesain kali ini, saya menggunakan analisa UX dengan teknik heuristic usability.
Analisa UX
Tahapan saya sebelum meredesain layout ini adalah mengumpulkan letak pain points dari desain ini sebelum melakukan sketching, disini setelah saya melakukan heuristic usability scanning, saya menemukan beberapa pain points pada interface lama 👇
Sketching & Ideation
Setelah menemukan pain points, saya memulai tahap sketching untuk membuat wireframe kasar sekaligus melakukan ideasi pada calon tampilan baru dashboard ini.. disini saya hanya menggunakan bolpen dan kertas note kecil saya 😅
Tahap Wireframing…
Lanjuut ke tahap wireframing, sebelum itu mari kenalan dulu dengan apa itu wireframe :
Wireframe adalah gambar rangka suatu situs web / aplikasi untuk menjadi panduan visual yang mewakili kerangka kerangka sebuah situs web / aplikasi.
Menurut saya, tahap wireframe pada suatu proses desain UI/UX sangatlah krusial karena ini adalah sebuah kerangka awal / gambaran bagaimana suatu halaman website atau halaman suatu aplikasi akan terlihat, dalam proses ini saya biasanya melibatkan stakeholder, project manager, developer atau bagian team lainya dalam project, yang penting dia adalah seorang decision maker pada suatu project agar menghindari perubahan secara major pada tahap desain selanjutnya.
Tahap High Fidelity
Setelah tahap wireframe telah terkonfirmasi, saya melanjutkan ke tahap high fidelity… Yuk kenalan sama apa sih itu high fidelity 🥰
High Fidelity adalah suatu design yang tingkat presisinya tinggi. Sudah memiliki warna, ukuran , jarak dan bentuk elemennya juga sudah dibuat dengan tingkat presisi dan akurasi yang detail ( Sumber : Artikel Dwinawan )
Bedah Design
Mari kita bedah desain yang sudah dibuat ini berdasarkan ux heursitic usability dan wireframe..
1. Halaman Utama Dashboard
Halaman utama ini adalah hal pertama yang dilihat oleh seorang perawat nantinya yang akan memasukan data pasienya, oleh karena itu saya membuat dashboard ini lebih simple dan rapi dengan memasukan elemen elemen form pendaftaran pada sebuah pop up saat perawat klik tombol “Tambah Pasien”.
Elemen elemen penting yang saya munculkan pada halaman ini adalah :
- Statistik Pasien Masuk, Pasien Booking dan Dokter yang Tersedia
- Tabel Daftar Antrian
2. Bagian Pendaftaran Pasien
Pada desain yang baru, saya memasukan form pendaftaran pasien pada sebuah pop up agar tampilan awal terlihat lebih rapi dan perawat dapat lebih fokus untuk melakukan pendataan pasien yang baru.
Penutup…
Demikian studi kasus yang saya buat ini, semoga bisa bermanfaat pada para pembaca dengan melihat sekilas alur / flow desain UI/UX yang biasanya saya pakai dalam setiap project atau pekerjaan desain saya.
Disclaimer :
Studi kasus yang saya buat ini adalah berawal dari sebuah soal test yang diberikan oleh suatu perusahaan, untuk penggunaan lebih lanjut tentang tampilan ini, diperlukan riset yang lebih lanjut, survey ke target user yang lebih dalam lagi.
Hai 👋 yuk kenalan lebih dekat di sosmed saya :
Portfolio desain di Instagram : https://www.instagram.com/balaqaba
🥳 Currently, im open for any Design / Front End Development project, please DM at one of my social media or email me at : iqbalaqaba96@gmail.com
