UI/UX Case Study : Redesign Aplikasi Konseling Dengan Psikolog Profesional

Rafli Aulia
4 min readNov 4, 2021

--

Preview : https://bit.ly/plong_prototype

Projek kali ini adalah melakukan redesign UI yang sudah ada dari aplikasi PLONG sebelumnya. PLONG sendiri merupakan sebuah aplikasi yang bisa digunakan untuk meditasi dan konseling dengan psikolog profesional. Aplikasi ini belum rilis secara umum di Play Store maupun App Store, baru sebatas konsep dan juga masih dalam tahap pengembangan.

Permasalahan

Saat saya menerima kesempatan kali ini, desain UI nya telah ada sebelumnya namun saat saya cek desain yang diberikan kepada saya terdapat beberapa permasalahan dalam desain UI aplikasi kali ini. Berikut beberapa permasalahan yang saya lihat :

  1. Tampilan UI tidak menggunakan guidelines yang umum
  2. Hanya berfokus ke tampilan tanpa memperhatikan usability
  3. Kurang memperhatikan tentang user flow
  4. Terlalu banyak menggunakan warna
  5. Kurang menerapkan hierarki visual

Tujuan

Selain untuk menyelesaikan beberapa masalah yang sudah saya sebutkan sebelumnya, tujuan lain yang saya jadikan value dalam melakukan redesign pada projek kali ini adalah dengan membuat sebuah tampilan UI yang bisa untuk di kembangkan oleh developer serta dapat digunakan oleh user saat aplikasi ini rilis di Play Store dan App Store.

Lingkup Kerja

Saat saya menerima desain awal dari aplikasi PLONG ini sudah tersusun beberapa fitur yang nanti nya akan ada dalam aplikasi. Saat saya berdiskusi dengan founder, beliau ingin menambah beberapa fitur ke dalam aplikasi nya. Setelah berdiskusi berikut merupakan beberapa fitur yang menjadi lingkup kerja saya :

  1. Fitur Konseling
  2. Fitur Meditasi
  3. Fitur Relaksasi
  4. Fitur Cerita Lelap
  5. Fitur Mood Tracker
  6. Fitur Jurnal Bersyukur
  7. Fitur Artikel Kesehatan Mental

Proses Desain

  1. Menggunakan Material Design sebagai guidelines

Permasalahan pertama yang saya sebutkan adalah tentang tampilan UI yang tidak menggunakan guidelines umum dimana solusi yang saya lakukan adalah dengan menggunakan Material Design untuk menjadi guidelines saya dalam me-redesign projek kali ini. Alasan saya menggunakan Material Design karena cukup popular digunakan dan juga menjadi guidelines untuk merancang sebuah UI di Android.

https://material.io/resources

2. Meminimalisir elemen tidak penting

Untuk permasalahan tentang kurangnya tingkat usability dari UI kali ini, saya mulai dengan mengelompokan elemen — elemen yang sekiranya kurang dimengerti oleh user dan juga menghilangkan elemen — elemen yang tidak penting.

3. Riset aplikasi sejenis

Projek kali ini mengambil referensi dari 4 aplikasi yaitu Halodoc, Alodokter, Headspace, dan Daylio. Hal ini yang saya jadikan solusi untuk permasalahan tentang kurangnya perhatian tentang user flow.

Aplikasi Halodoc, Alodokter saya pilih sebagai inspirasi untuk fitur Konseling karena 2 aplikasi tersebut cukup populer digunakan untuk berkonsultasi dengan tenaga medis. Untuk aplikasi Headspace saya jadikan inspirasi untuk fitur meditasi, fitur relaksasi, fitur cerita lelap. Sedangkan untuk aplikasi Daylio saya jadikan inspirasi untuk fitur mood tracker nya.

4. Penggunaan teori warna

Hal dasar yang menjadi pembeda saat membuat sebuah UI yaitu salah satunya adalah dengan memahami dan menerapkan teori warna kedalam desain kita. Solusi tersebut yang saya berikan terhadap permasalahan tentang terlalu banyak menggunakan warna agar desain UI nya menjadi lebih clean dan konsisten.

www.interaction-design.org/literature/topics/color-theory

5. Membuat skala prioritas

Karena founder ingin menambah beberapa fitur dan juga perlu adanya sebuah hierarki visual dalam sebuah UI maka saya akan mengelompokan beberapa fitur ada seperti contoh fitur meditasi, fitur relaksasi, dan fitur cerita lelap saya kelompokan menjadi satu halaman.

6. Pembuatan wireframes

Setelah solusi — solusi desain telah terdefinisikan langkah selanjutnya yang saya lakukan adalah dengan membuat wireframes guna mendapatkan gamabaran visual yang lebih jelas tentang tampilan setiap konten untuk beberapa fitur yang akan tersedia.

7. Perbandingan desain

Setelah selesai membuat wireframes langkah selanjutnya yang saya lakukan adalah membuat High — Fidelity / Final Look dari redesign UI kali ini. Berikut merupakan perbandingan sebelum dan sesudah saya melakukan redesign UI aplikasi PLONG.

Feedback Founder

Saat desain High — Fidelity / Final Look sudah selesai saya buat, kemudian saya tunjukan hasilnya ke founder. Hasilnya founder cukup puas akan hasil kerja saya tentang user flow dari UI kali ini, founder juga memberi feedback soal fitur mood tracker yang dirasa masih kurang kreatif dan terlalu monoton dan saya merasakan betul akan hal itu. Hal tersebut terjadi karena keterbatasan waktu dan sumber daya yang ada tetapi jika diberikan kesempatan kembali saya akan berusaha semaksimal mungkin untuk mendesain sebuah User Interface yang tidak monoton.

Preview Desain

Prototype Plong dapat dilihat menggunakan link berikut ini :

https://bit.ly/plong_prototype

--

--

Rafli Aulia

I'm Rafli Aulia, a passionate Product Designer with over 2 years of experience in crafting intuitive and engaging digital experiences.