JIP (Jurnal Informatika Polinema) ISSN: 2614-6371 E-ISSN: 2407-070X

PERANCANGAN DESIGN UI/UX MENGGUNAKAN METODE DESIGN

THINKING PADA APLIKASI RUBBISH-Q
Fifid Rahma Ifalus

Teknik Informatika, Sains dan Teknologi, Universitas Darussalam Gontor,

fifidifalus42025@mhs.unida.gontor.ac.id

Abstrak

Pada saat ini User Interface (UI) dan User Experience (UX) sudah dianggap sebagai bagian penting dalam proses
pengembangan produk digital. Bertujuan untuk memaksimalkan pengalaman pengguna saat berinteraksi dnegan
fungsi yang telah disediakan dalam sebuah aplikasi. Perancangan ini bertujuan untuk menghasilkan sebuah
tampilan antarmuka pada aplikasi Rubbish-Q menggunakan tools Figma. Perancangan ini menggunakan metode
design thinking dimana kebutuhan pengguna diutamakan untuk merancang aplikasi ini.

Kata kunci : design thinking, sampah, UI/UX, Figma

1. Pendahuluan pengguna sehingga dibutuhkan pengembangan yang

Indonesia merupakan negara yang memiliki
jumlah penduduk mencapai 276.639.440 jiwa per
Rabu, 8 Februari 2023 (World Population Review,
2023). Berdasarkan skor IKPS (Indeks Kinerja
Pengelolaan Sampah) pada tahun 2022, Indonesia
telah melakukan pengelolaan sampah sebesar 14,03
juta ton. Persentase angkanya menurun 44,76%
dibandingkan tahun sebelumnya yang sebanyak 25,4
juta ton.
Sampah bukan lagi suatu hal yang asing di
telinga manusia. Sampah merupakan salah satu
output atau konsekuensi adanya aktivitas manusia di
bumi. Sampah tidak akan pernah habis untuk
diproduksi dan tidak akan berhenti selama masih ada
manusia di muka bumi ini.
Dilihat dari banyaknya jumlah penduduk dan
timbunan sampah yang ada, solusi permasalahan
sampah di Indonesia ini masih belum terselesaikan
dengan baik. Masih banyak tumpukan sampah yang
tidak terkelola sehingga bisa menimbulkan bencana
alam.
Di era digital ini penggunaan teknologi
informasi khususnya di bidang jasa sangat pesat
penggunaannya. Banyaknya startup-startup yang
berkembang di Indonesia dapat mendorong untuk
berkembangnya aplikasi dalam bidang jasa di
Indonesia. Menurut Start Up Ranking, Indonesia
memiliki kurang lebih 2.400 startup pada tahun
2022. Dari banyaknya startup tersebut, masih belum
banyak startup yang mengembangkan aplikasi dalam
bidang lingkungan hidup.
Dalam pengembangan suatu teknologi, faktor
kemudahan menjadi faktor yang berperan penting
dalam kemudahannya. Kerap kali ditemukan faktor
kesulitan dalam sistem yang disediakan misalnya
kurang user friendly atau sulit dipahami bagi
lebih signifikan untuk kalangan yang luas.
Penggunaan perangkat bergerak atau mobile
di era sekarang menjadi suatu hal yang sudah
banyak ditemukan di masyarakat. Menurut data
Newzoo 2022, Indonesia mencapai 192,15 juta
pengguna smartphone dan menduduki peringkat ke-
4. Dikarenakan mobile memiliki banyak sekalii
kemudahan dalam penggunaannya dan praktis
dibawa kemana-mana sehingga ia memiliki
mobilitas yang tinggi.
2. Metode Penelitian
Dalam perancangan UI/UX aplikasi ini,
metode pengembangan yang digunakan adalah
metode design thinking. Pada metode design
thinking ini memiliki 5 tahapan yaitu :
a. Empathize, pada tahap ini dilakukan
wawancara tentang masalah yang
diselesaikan. Disini observer menaruh empati
untuk mengenal pengguna dan memahami
keinginan, kebutuhan, dan tujuan pengguna.
b. Define, setelah mendapatkan hasil wawancara
kepada target, observer menganalisa
pengamatan dan menentukan masalah inti
yang harus diselesaikan. Semua data yang
ada akan dibuat menggunakan empathy
mapping. Pada tahap observer dapat
mengumpulkan ide-ide untuk memenuhi
kebutuhan pengguna.
c. Ideate, pada tahap ini observer
mengimplementasikan ide-ide yang telah
dikumpulkan pada tahap define melalui
wireframe.
d. Prototype, tahap prototype diawali dengan
membuat high-fidelity design berdasarkan
wireframe yang dibuat pada tahap ideate.

Halaman|1
Volume X, Edisi X, November XXXX

Pada tahap ini observer akan memiliki

pandangan lebih jelas tentang bagaimana
pengguna akan berperilaku, berpikir, dan
rasakan terhadap sistem yang akan dibuat.
e. Testing, setelah melakukan finalisasi
prototype, tahap selanjutnya adalah testing
testing diperlukan kepada user untuk
memastikan fitur yang telah disajikan telah
memenuhi kebutuh pengguna atau belum.
User juga diminta untuk memberi feedback
untuk dapat mengembangkan lagi desain
yang sudah dibuat sebelumnya.

3. Hasil dan Pembahasan

a. Empathize
Gambar 2.2 Empathy Map
Pada tahap ini dilakukan analisa
kelebihan dan kekurangan dari produk c. Ideate
(Competitor Analysis) dan kelebihan
produk dibanding competitor (Unique Pada tahap ini observer
Selling Point). menghasilkan ide-ide kreatif setelah
mengetahui kebutuhan dan masalah user.
Tahap ini akan disajikan dalam bentuk site
map, userflow, dan wireframe.

Gambar 1.1 Competitor

Analysis

Gambar 1.2 Unique Selling Point

b. Define

Pada tahap ini kebutuhan dan

masalah user disajikan dalam bentuk user
persona dan empathy map.

Gambar 3.1 Site Map

Gambar 2.1 User Persona

Gambar 3.2 User Flow Sign Up

2|Halaman
JIP (Jurnal Informatika Polinema) ISSN: 2614-6371 E-ISSN: 2407-070X

Gambar 3.3 User Flow Trash

 Wireframe

Gambar 4.5 Organic Trash Gambar 4.6 Confirm the

Items

Gambar 4.1 Home Gambar 4.2 Sign Up

Gambar 4.7 Address Gambar 4.8 Pick the

Collector

Gambar 4.3 Home Gambar 4.4 Choose by the

Type

Halaman|3
Volume X, Edisi X, November XXXX

memiliki akun, cukup memasukkan email atau

Gambar 4.9 Confirmation Success username dan password yang sudah diregristasikan.
d. Prototype

Pada tahap ini wireframe yang

telah dibuat akan direalisasikan dalam
bentuk purwarupa atau biasa disebut
dengan prototype. Tools yang digunakan
adalah Figma.com.

Gambar 5.4 Home

Gambar 5.4 merupakan tampilan Home pada
aplikasi. Di tampilan ini, pengguna bisa memanggil
collector untuk mengambil sampah yang telah
ditentukan melalui ”Call the Collector”. Di tampilan
home juga terdaoat riwayat transaksi dan riwayat
jenis sampah yang pernah dipilih.
Gambar 5.1 Main Home

Gambar 5.1 merupakan tampilan utama setelah

mengklik aplikasi Rubbish-Q.

Gambar 5.5 Choose by Items

Gambar 5.5 merupakan tampilan untuk memilah

sampah berdasarkan jenisnya, yaitu sampah organik
Gambar 5.2 Sign Up Gambar 5.3 Log In dan sampah anorganik.

Gambar 5.2 dan 5.3 menunjukkan tampilan untuk

regristrasi akun terlebih dahulu sebelum masuk ke
tampilan Home pada aplikasi Rubbish-Q. Pengguna
harus mengisikan username, email, dan password
jika belum memiliki akun. Jika pengguna sudah

4|Halaman
JIP (Jurnal Informatika Polinema) ISSN: 2614-6371 E-ISSN: 2407-070X

Gambar 5.5 Organic Trash Gambar 5.5 Anorganic Gambar 5.7 Collector’s
Trash Location
Gambar 5.7 merupakan tampilan yang menunjukkan
Gambar 5.5 dan 5.6 merupakan tampilan sampah lokasi kolektor terdekat dari alamat yang telah
yang dibedakan berdasarkan jenisnya. Disini dimasukkan oleh user.
pengguna bisa memasukkan atau mendata jenis
sampah apa yang akan dijemput oleh kolektor
sehingga memudahkan untuk pemilahannya.

Gambar 5.8 Success Notification

Gambar 5.8 merupakan tampilan saat kolektor sudah

Gambar 5.6 Input Address berhasil mengambil sampah di alamat pengguna.

Gambar 5.6 merupakan tampilan untuk memasukkan

alamat penjemputan sampah. Jadi, pengguna
memasukkan alamat rumah yang akan dituju oleh
kolektor untuk mengambil sampah yang telah didata
oleh pengguna.

Halaman|5
Volume X, Edisi X, November XXXX
e. Testing
Pada tahap ini user akan menguji
bagaimana cara aplikasi tersebut berjalan.
Berikut hasil testing aplikasi melalui
Maze :
4. Kesimpulan dan Saran
4.1 Kesimpulan
Berdasarkan hasil perancangan
User Experience pada aplikasi mobile
Rubbishh-Q dengan metode Design
Thinking, dapat disimpulkan bahwa sangat
memudahkan dalam pembuatannya karena
dirancang sesuai dengan pengalaman dan
kebutuhan user secara langsung. Sehingga
kebutuhan fitur dan informasi yang
direalisasikan dapat disampaikan dengan
jelas dan tepat.. Pengujian usabilitas dengan
metode Usability Testing sangat membantu
dalam perancangan aplikasi dengan
dibuktikan hasil yang baik dan kualitas
yang didasari oleh indikator.
4.2 Saran
Aplikasi mobile ini masih perlu
dibenahi dalam hal website agar lebih
memudahkan lagi tanpa instal aplikasi
dalam mobile terlebih dahulu untuk
mengaksesnya.
DAFTAR PUSTAKA :
Adi, Y., Pratama, S., Kristen, U., & Wacana, S.
(2022). Pengembangan Ui / Ux Berbasis
Metode Design Thinking Fitur Send Your
Waste Perusahaan Waste4Change. 5, 99–110.
6|Halaman
Aulia Putri Prasetyo, Z., Virgantara Putra, O., &
Harmini, T. (2022). Implementasi Metode
Design Thinking pada Perancangan UI/UX
Situs Olah-Oleh TPS3R Kota Batu. Ikraith-
Informatika, 7(2), 1–10.
https://doi.org/10.37817/ikraith-
informatika.v7i2.2245
Averushyd Juliansyah, I., & Paputungan, I. V.
(2022). Perancangan User Experience Pada
Website Penjualan Kerajinan Tangan Dengan
Metodologi Design Thinking. Automata, 3(1),
4996–5004.
Faisal, M. N., Kharisma, A. P., & Huda, F. Al.
(2022). Perancangan Antarmuka Aplikasi
Perangkat Bergerak Pengelolaan Sampah
MyGarbage menggunakan Metode Human
Centered Design ( HCD ) ( Studi Kasus :
Warga Perumahan Juanda Harapan Permai ,
Sidoarjo ). 6(8), 3668–3677.
Haryuda, D., Asfi, M., & Fahrudin, R. (2021).
Perancangan UI/UX Menggunakan Metode
Design Thinking Berbasis Web Pada Laportea
Company. Jurnal Ilmiah Teknologi Infomasi
Terapan, 8(1), 111–117.
https://doi.org/10.33197/jitter.vol8.iss1.2021.7
30
Judul, H., Oleh, D., & Kurniawan, A. (2022). Pada
Mobile App Pedulipanti Dengan Metode
Design Thinking.
Karnawan, G. (2021). Implementasi User
Experience Menggunakan Metode Design
Thinking Pada Prototype Aplikasi Cleanstic.
Jurnal Teknoinfo, 15(1), 61.
https://doi.org/10.33365/jti.v15i1.540
Kurnia Ningrum, N., Utomo, I. W., Umami, Z., Dian
Nuswantoro Semarang Jl Imam Bonjol No, U.,
& Kidul Kota Semarang, P. (2022). Rancang
Bangun Design UI/ UX pada Aplikasi
PANTAU menggunakan Pendekatan Design
Thinking. Jurnal Ilmiah Elektronika Dan
Komputer, 15(2), 422–433.
http://journal.stekom.ac.id/index.php/elkomp
age422
Setiadi, A. R., & Setiaji, H. (2020). Perancangan
UI/UX menggunakan pendekatan HCD
(Human-Centered design) pada website
Thriftdoor. Automata, 1(2), 228–233.
Wahyudi, K. D., Putra, L. A., Saputra, M. R., Akbar,
N., Setyawan, S., & Pribadi, M. R. (2022).
Desain UI/UX Aplikasi HealMed
Menggunakan Metode Design Thinking. Mdp
Student Conference (Msc) 2022, 267–272.