PAYQR x sutokon
Creating a POS Payment Experience That Works for Both Staff and Customers
Creating a POS Payment Experience That Works for Both Staff and Customers
PayQR Sutokon UI Mockups Overview
PayQR Sutokon UI Mockups Overview
ROLE
UX/UI Designer
CLIENT
Arunas Akatsuki Denki
Period
April 2026 - Present
PLATFORM
POS Tablet / Payment System
RESPONSIBILITIES
UX Design · UI Design · User Flow · Prototyping · Client Collaboration
ABOUT
PayQR Sutokon is a tablet-based POS experience designed to extend the existing AES-CUT payment ecosystem (Arunas payment machine that can only have 4 menu list options) . It allows stores to manage significantly larger and more complex orders before handing payment to AES-CUT for cash or credit card processing.
BACKGROUND
Arunas already had AES-CUT for payment processing, but its existing interface could manage only four menu selections. This created a limitation for menu-heavy businesses such as Japanese izakaya, where staff may need to process many food items, drinks, quantities, prices, and tax treatments.
Arunas already had AES-CUT for payment processing, but its existing interface could manage only four menu selections. This created a limitation for menu-heavy businesses such as Japanese izakaya, where staff may need to process many food items, drinks, quantities, prices, and tax treatments.
The First Problem
Current AES CUT Payment Machine
The Payment Worked. The Ordering Model Didn’t Scale.
01
Only 4 Menu Options
AES-CUT could process payments, but only four menu selections.
02
Limited Store Compatibility
Suited to stores with a small number of menu items, such as hair cut salons.
The Second Problem
This became a limitation for izakaya and other menu-heavy stores that need to handle many food, drink, and add-on options.
01
Menu-Heavy Stores
Izakaya need many food items, drinks, quantities, prices during one transaction.
02
More Menu = More Complexity
More products mean more quantities, prices, tax, totals to verify.
To address this limitation
The client wanted to add a new machine that could handle more than four menu items, with additional store and sales management features.
Main Objective
So, we aimed to build an easy-to-use POS system interface for both staff and customers
Scan Items → Review Order → Print QR → Pay at AES-CUT
Secondary Objective
Staff can manage sales, history, receipts, POS settings, and machine status in one place.
It also gives staff quick access to sales, store settings, receipts, and other POS settings from one place.
Users
Who Uses Sutokon?
CUSTOMER
• In same cases they can scan products
• Understand payment
• Confirm amount
• Complete payment confidently
STAFF
• Scan products
• Manage quantities
• Verify totals
• Process orders quickly
AUTHORIZED STAFF / MANAGER
• Manage settings
• Access transaction history
• Issue operational codes
• Maintain the system
Because the tablet exists physically inside the store, the UX couldn't assume a single type of user.
This influenced navigation, security, information hierarchy, and passcode protection.
USER FLOW
Sutokon Flow From Order to Payment
01 / SIX
CUSTOMER ORDERS
Customer communicates the order to staff at the table or counter.
02 / SIX
SCAN PRODUCTS
Staff scan product codes quickly to add food and drinks to the tablet cart.
03 / SIX
REVIEW & ADJUST
Staff review products, quantities, prices, taxes, and totals dynamically.
04 / SIX
GENERATE CODE
Sutokon generates and prints a unique QR settlement code for check.
05 / SIX
PAY WITH AES-CUT
Customer completes payment securely using cash or credit card at terminal.
06 / SIX
TRANSACTION SAVED
Settlement information remains permanently accessible for store operation.
Solutions
First step
Scan Orders and Print QR code
01
SCAN →
02
REVIEW →
03
ADJUST →
04
CONFIRM →
05
PRINT →
06
PAY
Before Money Moves, Give the User One More Chance to Check.
Selecting 「精算用コードを印刷」 moves the transaction from an editable order into payment. Because this is a meaningful transition, I introduced a final confirmation state showing purchase information, quantities, individual amounts, and the final total.
EDITABLE ORDER →
FINAL REVIEW →
SETTLEMENT QR →
PAYMENT
Second step
Scan QR Code and Pay
Once the QR code is received from SUTOKON, customers can pay for their order directly using the AES-CUT machine.
Third step
Data Saved to Sutokon
After a customer pays, staff still need to manage what happened next. Transaction Management keeps every transaction accessible, so staff can track payment status, review discounts, and refunds information.
We also show a not a happy path here
REFUNDS
Dedicated refund-code workflow.
DISCOUNTS
Configure discount amounts, minimum purchase values, activation dates, and expiration periods.
PETTY CASH
Control withdrawal operations using staff codes, limits, denomination settings, and device information.
Fourth step
Reprint receipts, print order details, and issue ryōshūsho (領収書).
Transaction Management also available to reprint order receipts and issue or reprint 領収書 (receipts) when needed.
Security
If Customers and Staff Share the Environment,
Access Matters.
After a customer pays, staff still need to manage what happened next. Transaction Management keeps every transaction accessible, so staff can track payment status, review discounts, reprint order receipts, refunds and issue or reprint 領収書 (receipts) when needed.
Other Functipns
Supporting the Store Beyond Payment
Sutokon was designed as more than an order-entry interface. The system also supports the operational tasks required to run and maintain the payment environment.
STORE & STAFF
•
Store environment configurations
•
Unique staff identification codes
•
Strict supervisor passcode protection
•
Printed receipt header/footer custom text
SYSTEM & BUSINESS
•
On-device printer maintenance
•
Over-the-air software updates
•
Hardware peripheral diagnostic checks
•
Operation event logs
•
Offline storage syncing
•
Local daily sales aggregation
Quick answers here. Deeper analysis there.
→
TRANSACTION (Sutokon)
↓
QUICK PERFORMANCE CHECK · Sales Total · Average · Comparison
↓
DEEPER ANALYSIS (Mobapro)
Outcome
From a Limited Payment Interface to a Scalable Store Experience
PayQR Sutokon expanded the existing AES-CUT ecosystem beyond its limited menu interface, creating a tablet experience capable of supporting menu-heavy businesses and more complex store operations. By separating ordering, payment, transaction management, and administration, the system can accommodate significantly larger menus without placing all of that complexity into the checkout experience.
ORDER
SETTLEMENT
PAYMENT
HISTORY
MANAGEMENT
MORE FLEXIBLE
Seamlessly supports menu-heavy environments with customizable catalogs, stepping far past previous hardcoded terminal menu bounds.
MORE CONNECTED
Bridges the operational gap between tablet POS ordering entry, downstream terminal checkouts, and back-office executive business reporting.
EASIER TO OPERATE
Preserves cognitive load for counter staff during busy checkout cycles. Complex configurations remain accessible but securely separated.
Next plan
What I would improve next
01
TEST WITH STORE STAFF
Run task-based usability testing with staff across simple and complex orders.
02
MEASURE CHECKOUT PERFORMANCE
Instrument transaction completion time and correction rates.
03
VALIDATE THE SUTOKON → MOBAPRO JOURNEY
Measure whether managers understand when to continue into deeper analytics.
04
DESIGN FOR HIGH-PRESSURE CONDITIONS
Validate touch targets, readability, system feedback, and recovery during busy store operations.
Outcome
From Four Menu Options to a Scalable Store Workflow
BEFORE — AES-CUT
4
menu options → Payment
AFTER — SUTOKON + AES-CUT
Large order handling →
Quantity & tax management →
Settlement →
Cash/card payment →
Transaction history →
Operational controls →
Sales management
Sales management
The result wasn't simply an interface with more menu capacity. Sutokon created an operational layer around AES-CUT that allows complex restaurant orders to be prepared before handing payment to the payment machine. By separating responsibilities between ordering and payment, the ecosystem can support greater operational complexity while keeping the core counter flow straightforward.
Reflection
Designing for Operations, Not Just Screens
This project reinforced that designing a POS product is not only about making individual screens easy to use. The experience has to work as part of a larger operational ecosystem — across staff roles, customers, payment hardware, transaction history, security, maintenance, and business management. My biggest focus became deciding where complexity should live and where it should disappear.
"Design around the task users need to complete at that moment — keeping everyday payment simple while supporting the complexity required behind it."
UX/UI CASE STUDY — END OF PORTFOLIO OVERVIEW
Let’s Create Impact Together
Have something in mind? Feel free to reach out.
Let’s connect, exchange ideas, and create something impactful together.
Project
© Bhaswara Maralaut 2026. All rights reserved.
Created by Bhaswara Maralaut
Let’s Create Impact Together
Have something in mind? Feel free to reach out.
Let’s connect, exchange ideas, and create something impactful together.
Project
© Bhaswara Maralaut 2026. All rights reserved.
Created by Bhaswara Maralaut
Sorry! The mobile view is still in progress. Please view the full details on desktop.
Sorry! The mobile view is still in progress. Please view the full details on desktop.