Perancangan Desain UI/UX untuk Aplikasi Restoran Makanan Sehat Grains of Glory

Caroline Heliawanto, Ellis Melini

Abstract


Aktivitas padat menyebabkan adanya tuntutan kemudahan dan kepraktisan dalam berbagai hal. Hampir seluruh industri memanfaatkan teknologi untuk mempertahankan bisnisnya, sehingga terjadi peningkatan dalam pemesanan makanan secara online melalui aplikasi smartphone. Melihat hal ini, Grains of Glory berusaha memanfaatkan teknologi untuk mengajak dan memfasilitasi masyarakat dalam memulai gaya hidup yang lebih sehat. Untuk mencapai tujuan tersebut, Grains of Glory berencana merancang aplikasi pemesanan makanan dengan basis smartphone.

Perancangan proyek ini terdiri atas empat tahap, yaitu (1) memahami kebutuhan user, (2) pengumpulan dan analisis data, (3) penentuan konsep perancangan dengan menentukan keyword dan moodboard desain yang dilanjutkan dengan sketsa dan pembuatan berbagai assets dalam bentuk komponen serta design guidelines, (4) pembuatan prototype aplikasi menggunakan Figma.

Perancangan aplikasi ini telah berhasil memenuhi tujuannya melalui adanya pemilihan elemen interface dan flow dari aplikasi yang dirancang berdasarkan kaidah UI/UX untuk dapat memudahkan user. Selain itu, integrasi fitur-fitur yang relevan seperti rekomendasi makanan, informasi gizi yang jelas, serta perhitungan kalori memungkinkan user untuk membuat pilihan yang tepat dalam menjalani gaya hidup sehat.

Perancangan Desain UI/UX untuk Aplikasi Restoran Makanan Sehat Grains of Glory


Keywords


Grains of Glory, mobile application, usability, lifestyle app, UI/UX



DOI: http://dx.doi.org/10.37312/imatype.v2i2.7282

Full Text:

PDF

References


Ambrose, G., & Harris, P. (2011). Layout Gavin Ambrose Paul Harris | PDF (2nd ed.). AVA Publishing SA.

Andrew, R. (2011). A Simple Web Developer’s Color Guide. Smashing Magazine. https://www.smashingmagazine.com/2016/04/web-developer-guide-color/

Babich, N. (2016). Mobile UX Design: List View and Grid View. UX Planet. https://uxplanet.org/mobile-ux-design-list-view-and-grid-view-8f129b56fd5b

Babich, N. (2021). What Is a UI Kit? Examples & How to Use. Adobe. https://xd.adobe.com/ideas/process/ui-design/what-is-a-ui-kit/

Bierce, K. (2013). Notification Design Strategies. UX Booth. https://www.uxbooth.com/articles/notification-design-strategies/

Birkett, A. (2022). What is A/B Testing? The Complete Guide: From Beginner to Pro.

Deacon, P. (2020). UX & UI Design Strategy: A Step By Step Guide on UX and UI Design.

Laubheimer, P. (2016). Cards: UI-Component Definition. Nielsen Norman Group. https://www.nngroup.com/articles/cards-component/#:~:text=Summary%3A%20A%20%E2%80%9Ccard%E2%80%9D%20is,visually%20resembling%20a%20playing%20card.

Lutteroth, C., & Weber, G. (2006). User Interface Layout with Ordinal and Linear Constraints. Department of Computer Science The University of Auckland.

McElroy, K. (2016). Prototyping for Designers: Developing the Best Digital and Physical Products. O’Reilly Media, Inc. https://learning.oreilly.com/library/view/prototyping-for-designers/9781491954072/

Morzuch, M. (2022). How moodboards can help you create an excellent UI design? BOLDARE.

Payara, G. R., & Tanone, R. (2018). Penerapan Firebase Realtime Database Pada Prototype Aplikasi Pemesanan Makanan Berbasis Android. Jurnal Teknik Informatika Dan Sistem Informasi, 4, 397–406.

Six, Janet. M. (2010). Label Alignment in Long Forms | Paper Prototyping for Engineers. Label Alignment in Long Forms | Paper Prototyping for Engineers. https://www.uxmatters.com/mt/archives/2010/01/label-alignment-in-long-forms-paper-prototyping-for-engineers.php

Tips and tricks for making a UX flowchart. (2018). Justinmind. https://www.justinmind.com/blog/tips-and-tricks-for-making-a-ux-flowchart/#:~:text=A%20UX%20flowchart%20helps%20you,meet%20their%20needs%20more%20efficiently.

Usmani, F. (2022). What is a Creative Brief? Definition, Examples & Templates. https://pmstudycircle.com/creative-brief/

Zuliatunis, I. (2019). Gaya Hidup Serba Instan Generasi Milenial. Kompasiana. https://www.kompasiana.com/imazuliatunis/5d1a4047097f3619a061aa52/gaya-hidup-serba-instan-generasi-milenial


Refbacks

  • There are currently no refbacks.


IMATYPE: Journal of Graphic Design Studies

ISSN: 2828-4541
E-ISSN: 2828-3953

Journal Template: https://tinyurl.com/TemplateIMATYPE

For more information, please contact imatype@uph.edu