Langsung ke konten
← Kembali ke Portofolio Mobile App

Vending Machine — Aplikasi Kontrol Vending Machine

Aplikasi Android pendamping controller vending machine: telusuri katalog produk, bayar sebuah slot, lalu biarkan aplikasi menjalankan mesin fisik lewat USB serial.

Aplikasi Mobile Android Desain UI/UX Kotlin IoT USB Serial

Klien

Vending Machine

Tahun

2024

Peran

Rekayasa Android & desain UI

Durasi

2024

Vending Machine — Aplikasi Kontrol Vending Machine
Tangkapan layar dari Vending Machine — Aplikasi Kontrol Vending Machine

Tantangan

Vending machine adalah mesin tanpa pengawasan. Apa pun yang terjadi di ponsel harus berakhir sebagai tindakan fisik - motor berputar, slot terbuka - dan harus tetap jalan ketika Wi-Fi toko mati. Tim butuh aplikasi pendamping yang bisa menampilkan katalog sungguhan, menerima pesanan, dan tetap menjalankan controller meski jaringan hilang, bukan sekadar layar yang hanya hidup selama tiga URL gambar masih aktif.

Pendekatan

Aplikasi ini dibagi menjadi tiga lapisan supaya detail hardware tidak bocor ke UI. Lapisan presentation memegang layar katalog dan layar pembayaran; lapisan domain memegang use case dan model, termasuk state machine status order yang eksplisit; lapisan data memegang implementasi repository, service Retrofit/Moshi, dan jembatan serial yang memiliki koneksi USB. Katalog disajikan dari daftar lokal dengan pengambilan remote dijaga satu baris saja di dekatnya, karena mesin yang berhenti berjualan saat jaringan berkedip adalah mesin yang kehilangan uang. Pembayaran dimodelkan sebagai order yang berjalan melalui CREATED, PAID, DISPENSING, dan COMPLETED, dan perintah dispense baru ditulis ke controller pada 9600 8N1 setelah order mencapai DISPENSING - pelanggan tidak pernah diberi tahu produk sedang meluncur sebelum pembayaran benar-benar selesai.

Fitur yang Dibangun

12 · 5 dengan screenshot

Tangkapan layar dari proyek berjalan.

Vending Machine — Aplikasi Kontrol Vending Machine — Katalog Produk Grid
01

Katalog Produk Grid

Aplikasi dibuka dengan katalog mesin: empat produk dalam grid dua kolom, tiap kartu menampilkan gambar produk, namanya, dan harga yang akan ditagih. Kolom pencarian dan ikon filter berada tepat di atas grid, di posisi yang wajar dijangkau jempol.

Tangkapan layar dari proyek berjalan
Vending Machine — Aplikasi Kontrol Vending Machine — Pencarian Katalog Langsung
02

Pencarian Katalog Langsung

Kolom pencarian memfilter katalog saat diketik, mencocokkan nama dan deskripsi produk. Di build awal kontrol ini mati; sekarang terhubung ke katalog yang tersimpan, dan mengosongkan kolom mengembalikan seluruh daftar.

Tangkapan layar dari proyek berjalan
Vending Machine — Aplikasi Kontrol Vending Machine — Detail Produk & Jumlah
03

Detail Produk & Jumlah

Mengetuk kartu membuka detail produk: gambar produk yang dibundel, harga satuan, pengatur jumlah, dan total berjalan. Pengatur jumlah dibatasi lima item, sehingga satu ketukan tak pernah mengirim mesin dengan pesanan yang tidak masuk akal.

Tangkapan layar dari proyek berjalan
Vending Machine — Aplikasi Kontrol Vending Machine — Status Pemrosesan Pembayaran
04

Status Pemrosesan Pembayaran

Selama pembayaran diproses, layar menyebutkan apa yang sedang terjadi - memproses pembayaran, lalu mengirim produk ke slot dispense. Tombol dinonaktifkan selama transaksi supaya pembayaran kedua tidak bisa dimulai oleh ketukan yang tidak sabar.

Tangkapan layar dari proyek berjalan
Vending Machine — Aplikasi Kontrol Vending Machine — Konfirmasi Pembayaran Berhasil
05

Konfirmasi Pembayaran Berhasil

Ketika order selesai, dialog konfirmasi melaporkan nomor pesanan, produk, jumlah, dan total yang dibayar, lalu pelanggan dikembalikan ke katalog dengan satu tombol.

Tangkapan layar dari proyek berjalan

Fitur lain yang dibangun

7

Katalog Offline-First

Daftar produk disajikan dari aplikasi itu sendiri dan gambarnya dibundel di dalam APK, sehingga katalog tampil tanpa jaringan sama sekali. Pengambilan remote tetap tersambung - hanya satu baris di repository - tapi tidak pernah berada di jalur kritis.

Jembatan Serial USB Controller

Aplikasi berbicara dengan controller vending machine lewat USB serial 9600 baud, 8 data bit, tanpa paritas. Koneksinya hidup di komponen ArduinoLink tersendiri, bukan di dalam Activity, sehingga layar pembayaran memakai port yang sama.

State Machine Order

Order bukan sekadar boolean. Ia berjalan melalui CREATED, PAID, DISPENSING, dan COMPLETED, dengan FAILED sebagai jalur keluar. Tiap langkah eksplisit di model, sehingga UI, log, dan perintah hardware selalu sepakat soal apa yang sedang terjadi.

Lapisan Clean Architecture

Presentation, domain, dan data dipisahkan, dan lapisan domain tidak mengenal Retrofit, Glide, maupun USB. Use case adalah satu-satunya pintu masuk, sehingga logika pembayaran tetap bisa diuji tanpa emulator.

Dependency Injection Koin

Modul mendeklarasikan repository, use case, dan kedua ViewModel. Modul Koin diuji dengan me-resolve seluruh definisi, sehingga binding yang hilang menggagalkan build, bukan sesi pelanggan.

Lapisan Data Retrofit + Moshi

Katalog remote memakai Retrofit dengan konverter Moshi dan adapter hasil generate, ditopang klien OkHttp dengan pencatatan request untuk debugging. API yang sama seperti pada proyek awal, dihidupkan kembali di versi pustaka terkini.

Toolchain Android Modern

Dibangun ulang dengan Android Gradle Plugin 8.7.3, Kotlin 2.1.0, Gradle 8.9, dan JDK 17, memakai compileSdk 35, insets edge-to-edge ditangani benar, serta jcenter dan kotlin-android-extensions yang sudah usang dibuang.

Teknologi

Kotlin Clean Architecture MVVM Koin Retrofit OkHttp Moshi Coroutines Glide usb-serial-for-android Data Binding

Hasil

Mesinnya sekarang bisa dioperasikan dari ujung ke ujung lewat ponsel: katalog tampil tanpa jaringan sama sekali, order berjalan melalui state machine yang terlihat, dan controller menerima perintah slot begitu pembayaran selesai. Proyek yang tidak bisa dikompilasi sejak diarsipkan kini dibangun di atas toolchain terkini dengan unit test untuk katalog, pencarian produk, dan pembuatan order - dan gambar produk ikut terkirim di dalam APK, sehingga kartunya tidak pernah kosong lagi.

Tentang Proyek Ini

Vending machine menjual ketika tak ada orang di dekatnya. Lemari, motor, dan penerima koin bekerja sendiri, tetapi mesinnya tetap butuh wajah untuk pelanggan: sesuatu yang bisa menampilkan stok, menerima pesanan, dan menyuruh controller releasing produk yang tepat ke slot yang tepat.

Wajah itu adalah aplikasi ini. Aplikasi dibuka dengan katalog produk mesin, ikut terfilter saat mengetik, dan setiap kartu adalah produk lengkap dengan harga. Mengetikuk produk membuka layar detail, jumlah bisa diubah, dan total dihitung ulang. Pembayaran menjalankan order melalui state machine sungguhan - CREATED, PAID, DISPENSING, COMPLETED - dan begitu order mencapai DISPENSING, aplikasi menulis perintah dispense ke controller lewat USB serial 9600 baud. Pelanggan mendapat konfirmasi, mesin menjalankan motor, dan slot terbuka.

Di bawahnya, aplikasi ini adalah proyek Clean Architecture kecil. Lapisan presentation memegang katalog dan layar pembayaran, lapisan domain memegang use case (ambil produk, buat order) beserta model (item, order, status order), dan lapisan data memegang implementasi repository, service Retrofit, serta jembatan serial ke hardware. Koin menyatakannya, Moshi mengurai payload, dan Glide memuat gambar produk.

Katalognya sengaja offline-first. Build awal mengambil daftar produk dari API placeholder dan tiga dari empat URL gambarnya menunjuk ke host pihak ketiga yang sudah tidak melayani apa pun, sehingga pelanggan yang berdiri di depan mesin melihat kartu yang setengah kosong. Sekarang katalognya berada di dalam aplikasi, gambarnya dibundel di dalam APK, dan mesin tetap bisa berjualan ketika Wi-Fi toko mati.

Repository ini tidak bisa dikompilasi selama bertahun-tahun sejak terakhirnya disentuh: class model yang terduplikasi, objek parameter yang rusak, drawable yang hilang, aturan penamaan font yang sudah tidak diterima Android, dan build yang masih tertuju ke jcenter serta Android Gradle Plugin 4. Semuanya dibangun ulang di atas AGP 8.7.3, Kotlin 2.1.0, dan Gradle 8.9, dibersihkan, dan dilengkapi unit test untuk katalog serta pembuatan order.

Antarmukanya berbahasa Indonesia, memakai target sentuh besar, dan menaruh setiap aksi dalam satu jempol - aplikasi ini dibuat untuk dipakai cepat, di depan mesin, oleh orang yang hanya ingin beli minum.