Kota Pintar - Mobile App UI/UX Design

Overview

Kota Pintar adalah konsep aplikasi mobile yang dirancang untuk membantu masyarakat mengakses berbagai layanan publik secara lebih sederhana dalam satu platform digital.

Dalam proyek ini, saya berfokus pada perancangan UI/UX, mulai dari penyusunan struktur informasi, user flow, hingga desain antarmuka mobile yang konsisten dan mudah dipahami.

Role: UI/UX Designer Scope: User Flow, Information Architecture, Wireframe, UI Design, Interaction Design Deliverable: Mobile App UI/UX Design

Tantangan

Aplikasi layanan publik memiliki banyak kategori dan jenis layanan yang berbeda. Tanpa struktur informasi yang jelas, pengguna dapat kesulitan menemukan layanan yang mereka butuhkan.

Tantangan utama dalam perancangan ini adalah:

• Menyusun berbagai layanan publik ke dalam struktur navigasi yang mudah dipahami.
• Membuat proses pencarian dan discovery layanan menjadi lebih sederhana.
• Menampilkan informasi yang cukup tanpa membuat interface terasa terlalu padat.
• Menjaga konsistensi visual pada berbagai halaman dan kategori layanan.
• Merancang pengalaman yang tetap familiar bagi pengguna mobile.

Pendekatan Desain

Saya memulai proses dengan menyusun struktur informasi dan alur pengguna untuk memahami bagaimana pengguna berpindah dari satu layanan ke layanan lainnya.

1. Information Architecture

Layanan dikelompokkan berdasarkan kategori agar pengguna dapat menemukan kebutuhan mereka dengan lebih cepat.

Kategori utama mencakup:

• Laporan dan Kedaruatan
• Kesehatan
• Sosial dan Ekonomi
• Transportasi
• Pendidikan
• Olahraga
• Lingkungan
• Informasi Publik
• Kartu dan Usaha
• Keamanan
• Kemitraan

2. User Flow

Saya merancang alur interaksi untuk beberapa kebutuhan utama pengguna, seperti:

• Menemukan layanan
• Mencari layanan tertentu
• Melihat kategori layanan
• Membuat laporan
• Melihat aktivitas laporan
• Melihat notifikasi
• Mengelola profil dan akun

3. UI Design

Interface dirancang dengan pendekatan minimal dan functional-first agar informasi layanan publik tetap menjadi fokus utama.

Beberapa prinsip yang digunakan:

• Clear visual hierarchy
• Consistent spacing
• Simple navigation
• Accessible information structure
• Consistent iconography
• Reusable UI components
• Mobile-first interaction

Hasil Perancangan

Hasil akhir berupa rangkaian desain UI mobile yang mencakup beberapa area utama aplikasi:

• Home / Service Discovery
• Service Categories
• Service Search
• Emergency Services
• Public Reporting
• Activity & Report Tracking
• Notifications
• User Profile
• Account Settings
• Informational Content

Desain menggunakan sistem visual yang konsisten untuk menjaga hubungan antar halaman dan membantu pengguna memahami pola interaksi aplikasi.

Dampak Desain

Karena proyek ini berfokus pada UI/UX Design, dampak yang dapat dievaluasi terutama berada pada aspek pengalaman dan kualitas interface, bukan metrik bisnis.

Hasil perancangan memberikan:

• Struktur layanan yang lebih terorganisir.
• Navigasi yang lebih mudah dipahami.
• Visual hierarchy yang lebih jelas.
• Pola komponen yang konsisten antar halaman.
• Alur interaksi yang lebih terstruktur.
• Presentasi informasi layanan yang lebih sederhana untuk konteks mobile.

Catatan: Tidak terdapat data kuantitatif seperti conversion rate, retention, atau peningkatan pengguna yang dapat diklaim dari proyek ini. Oleh karena itu, dampak proyek dijelaskan berdasarkan hasil dan ruang lingkup desain yang dikerjakan.

Kontribusi Saya

Saya bertanggung jawab pada bagian UI/UX Design, termasuk:

• Information Architecture
• User Flow
• Wireframing
• Mobile UI Design
• Interaction Design
• Visual Hierarchy
• Component & UI Consistency
• Design Presentation

Pengembangan aplikasi dan implementasi teknis berada di luar scope kontribusi saya dalam proyek ini.