LaporWarga

Membangun pengalaman pelaporan masyarakat yang lebih cepat, transparan, dan terintegrasi.

Elektro Expo 2026 Lomba Desain UI/UX — SMA/SMK

Sons of Figma

Leon Indiantono · Arya Dwiputra · Noval Akbar
Pembimbing — Maziya Distya, S.Pd. · SMK Negeri 1 Kandeman

laporwarga.id

Beranda LaporWarga — hero dan pelacakan laporan

LPW-2026-0607-33421

Lubang Jalan Membahayakan Selesai

Tim

Kenalan dengan tim kami

Siapa mengerjakan apa dalam proyek ini.

Leon Indiantono

Ketua Tim

Arya Dwiputra

Anggota

Noval Akbar

Anggota

Masalah

Ketika masalah di sekitar kita belum punya jalur laporan yang jelas

Jalan rusak Sampah menumpuk Fasilitas rusak Saluran air tersumbat Penerangan jalan Lingkungan Layanan publik

Sekarang

Warga menemukan masalah

Datang ke kantor desa atau hubungi petugas

Sulit terdokumentasi, prosesnya ribet

Tidak tahu perkembangan laporannya

Bersama LaporWarga

Warga melapor online, di mana saja

Laporan terverifikasi petugas

Ditindaklanjuti pihak yang berwenang

Selesai — statusnya bisa dipantau

User Persona

Warga sebagai pelapor masalah

Admin Persona

Admin sebagai pengelola laporan

Keunggulan & Gimik Desain

Keunggulan UX dan Elemen Visual Unik

UI Simpel & Panduan Jelas

Antarmuka sederhana tanpa membingungkan warga awam, dilengkapi petunjuk tata cara penggunaan web.

Fitur Utama & Transparansi

Fitur unggulan ditampilkan di bagian atas serta pelacak progres status terbuka untuk membangun kepercayaan.

Peta Penanda Lokasi

Peta interaktif terintegrasi untuk menandai titik presisi lokasi kejadian masalah di lingkungan sekitar.

Upload Bukti Foto

Pengunggahan foto bukti masalah secara langsung agar laporan akurat, jelas, dan valid untuk diproses.

Dampak & Manfaat

Dampak Nyata bagi Masyarakat & Lingkungan

Bagi Warga

Kemudahan melapor masalah di mana saja
Partisipasi aktif lewat dokumentasi foto & titik lokasi
Pelacak status laporan membangun transparansi
Akses mudah via browser tanpa perlu install aplikasi

Bagi Pihak Berwenang

Laporan terorganisir & terdokumentasi rapi
Data lokasi presisi dan bukti foto jelas
Proses penanganan lebih cepat dan terkoordinasi
Peningkatan kualitas pelayanan publik

Bagi Lingkungan

Penanganan cepat berbagai masalah lingkungan seperti jalan rusak, sampah, saluran air, dan lainnya
Komunikasi warga dan aparat semakin efektif

Wireframe Lo-Fi

Kami mulai dari struktur, bukan warna

Wireframe adalah kerangka visual sederhana yang menampilkan tata letak, struktur, dan navigasi halaman tanpa detail warna atau visual. Tujuannya untuk memvalidasi alur utama pengguna sebelum dikembangkan menjadi UI Design.

Home

Ajukan Laporan

Laporan

Profile

Admin

Information Architecture (IA)

LaporWarga

Alur Pengguna

Dari menemukan masalah hingga selesai ditangani

Menemukan masalah

Membuka LaporWarga

Buat laporan

Pilih kategori

Detail + foto

Selesai

Diproses

Verifikasi

Kirim laporan

Tetapkan lokasi

Setiap tahap memberi umpan balik Terkirim Terverifikasi Diproses Selesai

Prototipe Hi-Fi

Dari wireframe menjadi pengalaman nyata

UI Design atau prototipe high-fidelity adalah representasi visual akhir sebuah tampilan yang sudah menerapkan warna, tipografi, ikon, ilustrasi, dan komponen interaktif secara realistis sehingga menampilkan hasil akhir antarmuka LaporWarga dari Beranda, formulir Buat Laporan, detail laporan dengan timeline status, Profil, hingga Dashboard Admin.

Prototype User Prototype Admin

Home