Perancangan UI/UX dan Frontend Transportation Management System untuk Optimasi Distribusi Food Service di PT XYZ

Abstract

Proses distribusi food service di PT XYZ melibatkan berbagai pengguna dan aktivitas yang memerlukan integrasi informasi dalam satu sistem. Penelitian ini bertujuan menganalisis kebutuhan pengguna, merancang User Interface (UI) dan User Experience (UX), mengembangkan frontend Transportation Management System (TMS), serta mengevaluasi kesesuaiannya. Perancangan dilakukan melalui identifikasi kebutuhan pengguna, penyusunan arsitektur informasi dan alur pengguna, pembuatan prototipe dan design system, serta implementasi frontend berbasis React. Sistem mendukung perencanaan distribusi, monitoring pengiriman, pengelolaan electronic Proof of Delivery (e-POD), pencatatan biaya, dan visualisasi informasi. Hasil User Acceptance Testing (UAT) menunjukkan tingkat penerimaan pengguna sebesar 91,25%, sedangkan pengujian waktu efisiensi menunjukkan peningkatan efisiensi waktu sebesar 96,07% dibandingkan proses sebelumnya. Hasil tersebut menunjukkan bahwa frontend TMS dapat diterima dengan sangat baik dan mendukung aktivitas distribusi yang lebih efisien dan terintegrasi.

The food service distribution process at PT XYZ Depot involves multiple users and activities that require integrated information within a single system. This study aimed to analyze user requirements, design the User Interface (UI) and User Experience (UX), develop the frontend of a Transportation Management System (TMS), and evaluate its suitability. The design process included user requirement identification, information architecture and user flow development, prototyping and design system development, followed by React-based frontend implementation. The system supports distribution planning, delivery monitoring, electronic Proof of Delivery (e-POD) management, cost recording, and information visualization. User Acceptance Testing (UAT) showed a user acceptance score of 91,25%, while efficiency testing demonstrated a 96,07% improvement in processing time compared with the previous processes. These results indicate that the TMS frontend was highly accepted and supported more efficient and integrated distribution activities.