Self-Serving POS system
Customer View
Worker's View
Design and develop a user-friendly Café POS System.
Tools
HTML
CSS
JavaScript
POS system is easy to understand
POS system will try to have the least amount of moving systems.
Have a minimal amount of buttons
References
Is it feasable?
Yes, because we can code the elements and do it in a minimalistic way.
We also have references of popular coffee POS systems that we can look up to.
Why should we design and develop?
So that it can be easy for the end-user to use our POS system.
All Modules
How can admin access the POS system?
Admin Button
User Button
Item 1
Item 3
Item 4
Cart information
Pay now
Item 2
Queuing Module
Reduce customer lines and waiting times at the cafe
Enhance operational efficiency and customer satisfaction.
Ordering Module
Payment Module
Eliminate the manual order transcription and miscommunication.
Integrate various payment methods into the system.
Analytics Module
Find out how many users are using the POS system.
Design and Develop a user-friendly Cafe POS system.
The Process for the POS System
Step 1: If the POS system is opened for the first time, it will ask if the user is either admin or customer.
Customer Option
Step 2: If customer option was chosen, the user will be shown the ordering page of the POS System.
Step 3: Person clicks the items to add it to the cart.
Step 3: After they are satisfied, the person can then click finish order.
Step 4: Next, the POS system displays the orders in the cart again.
The “Customer” can either confirm the order or cancel the order.
Step 5: Next, the POS System will ask if they want to pay using their top-up account or through cash.
Step 6 (Normal Way): If cash was chosen, the customer will be receiving a code, and they will need to pay the cashier within 1 hour.
Order Status Phases:
- Initiated
- Processing
- Completed
Cancelled
Step 4: The POS system will create a receipt for the person.
Since we can't use a printer to print the receipt, the customer will copy write down their code either through their phone (like note-taking apps) or through paper.
Person has:
- receipt
Step 5: If the person wants their meals, they would have to hold this receipt and pay it to the cashier
Database Transmit
Step 6: Cashier waits patiently for the customer.
Step 7: Cashier presents Receipt to Customer.
"Customer" will say their payment code to "Cashier", the "Cashier" will type it down the code.
Legend:
Blue is the progress of customer
Red is what the customer has during that process.
Purple are database processes.
Create a row in the database "Order_History".
Person has:
- nothing
Order Receipt Created: {Created Time}
List of Orders: {Links to another database}
Payment Amount: {Payment Amount}
Step 6 (Optional): If Top-Up Option was chosen, the “Customer” will need to authenticate using a code.
Customer types their email. Then they will email the OTP code to customer.
Every hour, the database will check if the order is paid. If not paid, they will set the payment status to cancelled.
Email Code to Customer
Customer enters code to system
System checks if typed code = code to database.
True
False
Code in database is erased.
Step 7: The POS System will email that same code to the typed email.
Person has:
- nothing
Order Status: Processing
Admin Option
Step 2: If Admin Option was chosen, the user will be asked for the Admin “Username” and “Password”.
Step 3: User Inputs Admin Username and Password.
True
False
It will say at the bottom of the text that either the admin "username or password is incorrect".
Step 4: User gets access to Admin Panel
Step 3 (Optional): User goes back because they don't want admin panel.
Payment Status: (Default) = Not Paid
In here they can see the:
Analytics
Orders
Available Items
User can Click on the "Sign up for an account".
Required Details:
Password
click to edit
Check if email is part of the User_Account Table
This is to ensure that the user won't type any email.
Result > 0
Send Code to Email
Result = 0
ERROR: "That email is not part of any account."
Step 8: If the email is received by the "customer", "customer" will type the code to authenticate that they own the account.
After the user submits the code to the system. It will then check if that code is equal to the OTP code.
SELECT email WHERE email = userinput_email
Add Code to Database
True
Balance deducted