Role: UX/UI Designer
Scope: E-Commerce App and Inventory Platform
This project is an e-commerce platform designed for small retail businesses, primarily local grocery stores, to streamline their ordering and inventory operations.
The platform enables customers to browse and place orders via LINE Official Account, while supporting internal operations through a connected CMS and POS system.
This project focuses on creating a seamless end-to-end experience — from customer ordering on LINE OA to order management, payment processing, and fulfillment across multiple systems.
The platform consists of three interconnected parts:
These systems work together to support a complete order lifecycle from customer interaction to backend processing.
This project demonstrates the ability to design scalable systems that connect customer experience with operational workflows.
A scalable design system was developed to ensure consistency across LINE OA, CMS, and POS interfaces. The system standardizes visual elements and interaction patterns, enabling faster development and a cohesive user experience across multiple platforms.
solid
status
Primary/gradient
line
Primary/brand
BG
Primary/hover
Text
Heading H1
font-family: Kanit
font-style: Bold
font-size: 36
line-height: 140 %
The quick brown fox jumps over the lazy dog
Heading H2
font-family: Kanit
font-style: SemiBold
font-size: 32
line-height: 140 %
The quick brown fox jumps over the lazy dog
font-family: Kanit
font-style: Medium
font-size: 32
line-height: 140 %
The quick brown fox jumps over the lazy dog
Heading H3
font-family: Kanit
font-style: SemiBold
font-size: 28
line-height: 140 %
The quick brown fox jumps over the lazy dog
font-family: Kanit
font-style: Medium
font-size: 32
line-height: 140 %
The quick brown fox jumps over the lazy dog
Heading H4
font-family: Kanit
font-style: Medium
font-size: 24
line-height: 140 %
The quick brown fox jumps over the lazy dog
font-family: Kanit
font-style: Regular
font-size: 24
line-height: 140 %
The quick brown fox jumps over the lazy dog
Heading H5
font-family: Kanit
font-style: Medium
font-size: 20
line-height: 140 %
The quick brown fox jumps over the lazy dog
font-family: Kanit
font-style: Regular
font-size: 20
line-height: 140 %
The quick brown fox jumps over the lazy dog
Paragraph Large
font-family: Kanit
font-style: Medium
font-size: 18
line-height: auto
The quick brown fox jumps over the lazy dog
font-family: Kanit
font-style: Regular
font-size: 18
line-height: auto
The quick brown fox jumps over the lazy dog
Paragraph Medium
font-family: Kanit
font-style: Medium
font-size: 16
line-height: auto
The quick brown fox jumps over the lazy dog
font-family: Kanit
font-style: Regular
font-size: 16
line-height: auto
The quick brown fox jumps over the lazy dog
Paragraph Small
font-family: Kanit
font-style: Medium
font-size: 14
line-height: auto
The quick brown fox jumps over the lazy dog
font-family: Kanit
font-style: Regular
font-size: 14
line-height: auto
The quick brown fox jumps over the lazy dog
Label
font-family: Kanit
font-style: Medium
font-size: 12
line-height: auto
The quick brown fox jumps over the lazy dog
font-family: Kanit
font-style: Regular
font-size: 12
line-height: auto
The quick brown fox jumps over the lazy dog
