Tugas 9 Kelas APSI E - 2023

Desain User Interface


User Interface Design Process

    UI atau disebut dengan User Interface merupakan tampilan antar muka dari sebuah aplikasi/website yang langsung berinteraksi dengan user/pengguna. User Interface Design Process merupakan tahapan yang dilakukan untuk merancang antarmuka pengguna yang lebih efektif dan atraktif dalam sebuah sistem informasi. Desain user interface lebih fokus pada aspek visual serta interaksi antar sistem dan user.


Ada beberapa tahapan dalam User Interface Design Process

  • Penelitian serta Analisis Pengguna (User Research and Analysis)
Pada tahap awal ini, pengumpulan informasi tentang user/pengguna yang akan menggunakan sistem, termasuk pada kebutuhan pengguna, referensi pengguna, serta karakteristik pengguna. Data yang dikumpulkan akan sangat membantu dalam perancangan antarmuka yang sesuai dengan kebutuhan para pengguna.
  • Perencanaan (Planning)
Pada tahap kedua ini, adanya perancangan dari total keseluruhan project User Interface dilakukan. Meliputi penentuan tujuan desain, adanya rancangan sketsa awal, serta pembagian tugas dalam tim desain
  • Pembuatan Prototype (Prototyping)
Pada tahap prototyping ini, tentunya melibatkan pembuatan prototype oleh tim desain antarmuka yang bertugas sebagai merepresentasikan visual dari desain yang diusulkan. Prototype ini akan digunakan untuk pengujain respon pengguna terhadap desain tersebut serta mendapatkan masukan dan saran yang tentunya untuk membuat desain lebih baik lagi
  • Desain Visual (Visual Design)
Pada tahap visual design ini, adanya elemen utama serta pendukung seperti warna tampilan, font dan tipografi yang digunakan, icon-icon pada tampilan serta grafis-grafis lainnya akan ditentukan untuk terciptanya antarmuka pengguna yang menarik secara estetika. Sebuah prinsip desain seperti sesuai apa tidaknya, adanya bacaan yang jelas, dan konsistensi desain juga perlu diperhatikan
  • Pengujian serta Evaluasi (Testing and Evaluation)
Pada tahap pengujuan dan evaluasi ini melibatkan pengguna rill atau user di lapangan langsung yang dapat mencobanya. Tahap ini dilakukan untuk mencari masalah yang perlu diperbaiki, banyaknya saran dan masukan sangat berarti untuk dijadikan dasar melakukan perbaikan dan penyempurnaan desainnya
  • Implementasi (Implementation)
Pada tahap ini, langsung implementasi desain ke dalam sistem yang sesungguhnya. Pada tim pengembang akan mencoba mengimplementasikan desain antarmuka yang telah dirancang sesuai dengan spesifikasi yang telah disepakati
  • Pemeliharaan dan Peningkatan (Maintenance and Enhancement)
Pada tahap setelah implementasi dilakukan, tentunya tidak langsung berhenti begitu saja. Harus adanya pemeliharaan desain dan peningkatan desain juga. Desain harus sesuai dengan keinginan pengguna yang lebih banyak lagi seiring berjalannya waktu.




Deskripsi Aplikasi

Nebeng Rio merupakan aplikasi pemesanan tiket nebeng (barengan) khusus mahasiswa asal Tuban untuk pulang ke kota asal, yaitu Tuban, Jawa Timur. Inisiasi ini muncul saat saya pulang sendirian menggunakan kendaraan mobil. Karena banyaknya mahasiswa asal Tuban yang kesusahan untuk mendapatkan bis/kendaraan umum, mengapa tidak bareng saya untuk pulang ke Tuban

Aplikasi Nebeng Rio ini dibuat untuk memberikan pengguna akses pulang bersama Rio dengan mudah dan aman karena Nebeng Rio ini dibuka saat pekan-pekan pulang mahasiswa. Pengguna dapat memesan tempat duduk sesuai dengan kapasitas kendaraan yang tersedia. 

Pada Aplikasi Nebeng Rio, pengguna akan menemukan informasi terkait identitas pengemudi, kendaraan yang digunakan, informasi rute yang akan dilewati, serta waktu sampai tujuan setiap pengguna. 

Selain itu, adanya fitur memberikan ulasan setiap pengguna sebelumnya yang telah bergabung dengan Nebeng Rio sehingga pengguna baru dapat membuat keputusan yang baik dalam memilih Nebeng Rio sebagai solusi pulang ke Tuban

Harapannya, Nebeng Rio dapat menjangkau pengguna lebih luas lagi yang berada diluar kota. Dan juga menjangkau pengemudi lain yang dari luar kota. Adanya pengemudi luar kota yang sendirian pulangnya, harapannya dapat bergabung ke Nebeng Rio untuk menjadi mitra Nebeng Rio




Use Scenario Development

Pada tahap ini melibatkan pemahaman tentang pengguna, tujuan pengguna serta tugas yang akan dicapai melalui antarmuka. Dalam tahap ini, perancang antarmuka mengumpulkan informasi kebutuhan pengguna nantinya, konteks penggunaan serta masalah yang ingin dipecahkan oleh antarmuka. Berikut ini beberapa Use Scenario Development dari aplikasi Nebeng Rio

  • Pengguna baru mendaftar pada aplikasi Nebeng Rio 
  1. Pengguna membuka aplikasi Nebeng Rio
  2. Pengguna menekan tombol "Daftar Disini" pada halaman utama
  3. Pengguna mengisi formulir pendaftaran akun
  4. Pengguna menekan tombol "Daftar Sekarng" untuk menyelesaikan proses pendaftaran

  • Pengguna yang telah memiliki akun ingin masuk ke aplikasi Nebeng Rio
  1. Pengguna membuka aplikasi Nebeng Rio
  2. Pengguna memasukkan username dan password sesuai dengan formulis pendaftaran yang telah diisi saat mendaftar
  3. Pengguna menekan tombol "Masuk" untuk akses akun pengguna

  • Pengguna ingin melihat jadwal kepulangan mitra pengemudi Nebeng Rio
  1. Pengguna login pada aplikasi Nebeng Rio
  2. Pengguna memilih kolom "Jadwal Kepulangan Mitra" untuk melihat jadwal kepulangan mitra ke kota asal
  3. Pengguna dapat melihat jadwal dan destinasi akhir kepulangan mitra ke kota asal pada aplikasi Nebeng Rio

  • Pengguna ingin melihat rute kepulangan mitra pengemudi Nebeng Rio
  1. Pengguna login pada aplikasi Nebeng Rio
  2. Pengguna memilih kolom "Jadwal Kepulangan Mitra"
  3. Pengguna memilih kolom "Rute Kepulangan" untuk melihat rute mana saja yang dilalui mitra saat perjalanan pulang
  4. Pengguna dapat melihat titik penjemputan oleh Mitra

  • Pengguna ingin melihat ulasan Nebeng Rio
  1. Pengguna login pada aplikasi Nebeng Rio
  2. Pengguna memilih kolom "Ulasan Pengguna" pada halaman pertama
  3. Pengguna dapat menekan tombol "Selengkapnya" untuk melihat lebih lengkap ulasannya

  • Pengguna ingin memesan tempat duduk Nebeng Rio
  1. Pengguna login pada aplikasi Nebeng Rio
  2. Pengguna dapat menekan tombol "Nebeng Yaaa" untuk melanjutkan ke pemesanan tiket nebeng
  3. Pengguna memilih "Destinasi Kepulangan" sesuai yang ada. Apabila destinasi belum ada, mitra Nebeng Rio belum bisa menjangkau destinasi yang diinginkan pengguna
  4. Pengguna dapat melihat Mitra Nebeng Rio yang tersedia sesuai dengan pilihan Destinasi Kepulangan
  5. Pengguna dapat melihat Rute yang dilewati Mitra Nebeng Rio sebelum memesan tiket 
  6. Pengguna dapat memesan tiket Nebeng Rio setelah melihat semua prosedur dan sesuai dengan pilihan yang pengguna pilih
  7. Pengguna dapat menekan tombol "Jadi Nebeng" untuk melanjutkan ke pengisian detail pemesanan tiket
  8. Pengguna dapat mengisi formulir pemesanan tiket aplikasi Nebeng Rio (Nama pemesan, Alamat Tujuan, Penjemputan oleh Mitra, Detail Harga)
  9. Pengguna dapat menekan tombol "Pesan" setelah memasukkan data diri diatas
  10. Pengguna dapat melihat bukti pemesanan setelah selesai menekan tombol "Pesan"
  11. Pengguna dapat melakukan pembayaran secara cash/scan QRIS setelah sampai tujuan akhir pengguna.




Interface Structure Design

Pada bagian interface structure design ini akan diperlihatkan bagan-bagan yang menjelaskan tentang bagaimana alur dari aplikasi Nebeng Rio. Berikut ini merupakan alur dari aplikasi Nebeng Rio mulai dari awal pengguna login sampai dengan pengguna mendapatkan tiket nebeng pulang





Interface Standard Design
Dalam pengerjaan




Interface Design Prototyping
Dalam pengerjaan















Komentar