UI/UX

Tablet Design

CHICKEN JOY - POINT OF SALE APP

CHICKEN JOY - POINT OF SALE APP

SCROLL DOWN TO START READING

Chicken Joy is a new cafe based in Yogyakarta. This project's aim is to create the UI design for a tablet-based cashier application (Point of Sale) that will be used by Chicken Joy for their outlet. This app will have some features that will be tailored by the Chicken Joy’s needs. In addition cashier system as the main feature, this app will have an automated bookkeeping feature that ensures seamless and accurate for every daily transaction. This app is built to enhance operational efficiency and establishment financial tracking.

Develop a cashier system that efficiently handles all transactions, allowing the team at Chicken Joy to add, edit, and delete products with ease.

Develop a cashier system that efficiently handles all transactions, allowing the team at Chicken Joy to add, edit, and delete products with ease.

Design a Point of Sale (POS) application with built-in transaction tracking for seamless and accurate bookkeeping.

Design a Point of Sale (POS) application with built-in transaction tracking for seamless and accurate bookkeeping.

An secure cashier application accessible only to registered accounts, with features for the owner to manage staff accounts, including adding, editing, and deleting access.

An secure cashier application accessible only to registered accounts, with features for the owner to manage staff accounts, including adding, editing, and deleting access.

01

INTRO AND GOALS

INTRO AND GOALS

01

01

02

USER AUDIENCE

USER AUDIENCE

The target audience for this project are :

Owner

An individual who will be allowed to access all the features and stuff on this application, from the cashier system, manage every product, manage accounts for the staff, and access the transaction report that will be categorized by Daily, Weekly, Monthly, and Yearly.

An individual who will be allowed to access all the features and stuff on this application, from the cashier system, manage every product, manage accounts for the staff, and access the transaction report that will be categorized by Daily, Weekly, Monthly, and Yearly.

Staff

An individual who will allowed accessing only to the cashier system. This individual only can log in to this app using an account that has been registered by the Owner.

An individual who will allowed accessing only to the cashier system. This individual only can log in to this app using an account that has been registered by the Owner.

02

02

For this project, I collaborated with the MajusCode Studio team as the only UI/UX Designer. My responsibilities included creating the UI design and all visual assets, such as icons, illustrations, color schemes, typography, and animations (Lottie) that represented Chicken Joy's brand. Additionally, I was tasked with designing the layout for the invoice to ensure a cohesive and polished user experience.

03

ROLE AND RESPONSIBILITY

ROLE AND RESPONSIBILITY

03

03

04

SCOPE AND CONSTRAINT

SCOPE AND CONSTRAINT

In this project, the client requested that the size of design or the breakpoint that will be used for this application is Tablet size with landscape orientation. The client has asked to ensure if this app will have 2 user role, which are :

Owner / Admin

  1. Can access the cashier system.

  2. Will have the ability to manage(add, edit, and delete) the products.

  3. Will be allowed to access the transaction history that will be categorized by Daily, Weekly, Monthly, and Yearly.

  4. Will have the ability to export transaction history into a bookkeeping-friendly Excel format (.csv) for streamlined record-keeping and sales analysis.

  5. Will have the ability to manage(add, edit, and delete) the account that will be used for Chicken Joy staffs.

  1. Can access the cashier system.

  2. Will have the ability to manage(add, edit, and delete) the products.

  3. Will be allowed to access the transaction history that will be categorized by Daily, Weekly, Monthly, and Yearly.

  4. Will have the ability to export transaction history into a bookkeeping-friendly Excel format (.csv) for streamlined record-keeping and sales analysis.

  5. Will have the ability to manage(add, edit, and delete) the account that will be used for Chicken Joy staffs.

Staff

For this role, this user only be allowed to access the cashier system on the Chicken Joy - Point of Sale app.

For this role, this user only be allowed to access the cashier system on the Chicken Joy - Point of Sale app.

This project has a tight deadline which is only 2 weeks until the application is ready to use on the Chicken Joy opening. I worked on this project only in 1 week to completing all the screens and assets.

04

04

Wireframe

For this project, because our team has a tight deadline which is two weeks, I decided to skip the wireframe process and create the High-Fidelity design directly.

For this project, because our team has a tight deadline which is two weeks, I decided to skip the wireframe process and create the High-Fidelity design directly.

Challenges

The main challenge I faced on this project was "Time". As I mentioned above, our team only has two weeks until the app is ready for use by the client. So, our team decided to divide the time we had into two sections. The first week was for me to work on the design while my team worked on the database design, and the second week was for me to develop the product.

The main challenge I faced on this project was "Time". As I mentioned above, our team only has two weeks until the app is ready for use by the client. So, our team decided to divide the time we had into two sections. The first week was for me to work on the design while my team worked on the database design, and the second week was for me to develop the product.

Mockup

On this study case, I will provide all mockups from all roles that be used on this app, which are :

  1. Owner / Admin Screens

  2. Staff Screens

On this study case, I will provide all mockups from all roles that be used on this app, which are :

  1. Owner / Admin Screens

  2. Staff Screens

05

THE

PROCESS

THE PROCESS

05

05

Owner / Admin Screens

Staff Screens

The Result

With the tight deadline that we faced on this project, I have tried to complete the design as soon as possible within one week. In order to ensure the project can be complete on time, every I finished design for each flow, I instantly hand-over the design to the developer team so they can start working earlier. After I completed all the screen, I preparing the Design Documentation for the visual assets such as typography, color, spacing, icons, illustration and the LottieFiles to help the developing process being more efficient. Hopefully, this project can be completed on time and the client was so happy with the result.

With the tight deadline that we faced on this project, I have tried to complete the design as soon as possible within one week. In order to ensure the project can be complete on time, every I finished design for each flow, I instantly hand-over the design to the developer team so they can start working earlier. After I completed all the screen, I preparing the Design Documentation for the visual assets such as typography, color, spacing, icons, illustration and the LottieFiles to help the developing process being more efficient. Hopefully, this project can be completed on time and the client was so happy with the result.

LET'S EXPLORE ANOTHER STUDY CASE

LET'S EXPLORE ANOTHER STUDY CASE

Papan Narapraja

Papan Narapraja

Javadestination

Javadestination

QueenPixel

Projects

Exploration

My Resume

QueenPixel