Kerangka Laporan Perancangan Aplikasi UMKM
Panduan penyusunan laporan mata kuliah UI/UX: dari coretan tangan, wireframe hitam putih, hingga aplikasi berwarna yang siap dipakai UMKM, lengkap dengan rincian biaya nyata.
Sketsa mentah
Hitam putih
Pewarnaan
Setiap mahasiswa (atau kelompok) memilih satu dari tiga tema berikut, lalu membuat aplikasi untuk UMKM nyata. Laporan wajib memuat tiga tahap sketsa, bukti aplikasi berjalan, dan rincian biaya yang bisa diverifikasi.
E-commerceKatalog, keranjang, checkout, pembayaran, pelacakan pesanan.
POS / KasirTransaksi, stok, struk, laporan penjualan harian.
Smart OrderPesan via QR/meja, menu digital, status ke dapur, pembayaran.
Unduh Contoh Laporan (Word)Contoh laporan lengkap format .docx: sketsa tiga tahap, aplikasi siap pakai, dan rincian biaya.
Download
Susunan Laporan
Klik tiap bab untuk melihat isinya.
Bagian Awal
- Halaman judul (judul, logo kampus, nama/NIM, dosen, tahun)
- Lembar pengesahan dan kata pengantar
- Daftar isi, daftar gambar, daftar tabel
Bab I: Pendahuluan
- Latar belakang (kondisi UMKM dan alasan memilih tema)
- Rumusan masalah
- Tujuan
- Batasan masalah
- Manfaat
Bab II: Analisis Kebutuhan dan Riset Pengguna
- Profil UMKM mitra (nama, bidang usaha, kondisi saat ini)
- Pemilihan tema beserta alasannya
- Metode pengumpulan data (wawancara, observasi, kuesioner)
- Analisis pengguna: persona, empathy map, user journey
- Analisis kompetitor (minimal 2 sampai 3 aplikasi sejenis)
- Kebutuhan fungsional dan non-fungsional
- User flow dan information architecture (sitemap)
Bab III: Perancangan Antarmuka (UI/UX)
Bab inti tugas ini. Tiga tahap harus tampak jelas dan berurutan.
Sisipkan foto sketsa asli Anda di bagian ini. Di Blogger, klik ikon gambar, unggah foto, lalu beri keterangan di bawahnya seperti contoh berikut.
- Sketsa mentah. Foto atau scan gambar tangan sendiri, disertai catatan ide dan alasan tiap layar.
- Sketsa hitam putih (wireframe). Hasil penyempurnaan sketsa mentah, dengan penjelasan apa yang diperbaiki.
- Sketsa pewarnaan (UI hi-fi). Berisi design system (palet warna, tipografi, ikon, komponen), alasan pemilihan warna sesuai identitas UMKM, dan seluruh layar utama.
- Perbandingan tiga tahap dalam satu tabel atau gambar berdampingan.
- Prototype interaktif (tautan Figma atau sejenisnya).
Bab IV: Implementasi dan Pengujian (Aplikasi Siap Digunakan)
- Teknologi yang digunakan (platform, framework, database)
- Tangkapan layar aplikasi jadi, per fitur
- Panduan singkat penggunaan
- Pengujian usability (skenario tugas, jumlah responden, hasil SUS atau kuesioner)
- Evaluasi dan perbaikan berdasarkan hasil uji
Bab V: Rincian Biaya
- Biaya pengembangan satu kali: desain UI/UX, pengembangan, pengujian/QA, dokumentasi
- Infrastruktur dan publikasi: domain, hosting/server, akun Play Store/App Store, sertifikat SSL
- Operasional bulanan/tahunan: server, pemeliharaan, layanan pihak ketiga (payment gateway, notifikasi)
- Total biaya dan skema harga untuk UMKM (jual putus atau langganan)
- Analisis singkat balik modal (BEP) atau manfaat bagi UMKM
Contoh format tabel:
| No | Komponen | Keterangan | Volume | Harga Satuan | Total |
|---|---|---|---|---|---|
| 1 | Desain UI/UX | 15 layar | 1 paket | Rp ... | Rp ... |
| 2 | Hosting | per tahun | 12 bulan | Rp ... | Rp ... |
| 3 | Akun Play Store | sekali bayar | 1 | Rp ... | Rp ... |
Wajib: biaya harus nyata. Lampirkan sumber harga (screenshot harga hosting, tarif developer/freelance, biaya akun developer) agar bisa diverifikasi.
Bab VI: Penutup
- Kesimpulan
- Saran dan rencana pengembangan
Bagian Akhir
- Daftar pustaka
- Lampiran: transkrip wawancara, kuesioner, foto sketsa asli, bukti harga, dokumentasi bersama UMKM
Komponen Penilaian yang Disarankan
| Aspek | Yang dinilai |
|---|---|
| Tiga tahap sketsa | Lengkap, berurutan, ada penjelasan perbaikan tiap tahap |
| Konsistensi desain | Warna, tipografi, dan komponen seragam di semua layar |
| Aplikasi berjalan | Fitur inti benar-benar bisa dipakai UMKM |
| Analisis pengguna | Persona, journey, dan hasil uji usability |
| Rincian biaya | Wajar, rinci, dan disertai bukti harga |
Unduh Contoh Laporan LengkapGunakan sebagai acuan format. Ganti seluruh data, gambar, dan harga dengan milik Anda sendiri.
Download
Tip untuk mahasiswa: kerjakan laporan sambil merancang, bukan setelah aplikasi selesai. Foto setiap sketsa sejak awal agar tahap mentah tidak hilang.
Post a Comment