Digitalize existing paper works into digital web form
ST Engineering Aerospace has capability to do maintenance and reparation of various type of aircrafts.
Unfortunately, they're still using paper works to do the check before conducting the maintenance. Here is the challenge, how might we digitalize 15+ required forms and 8+ approval line from manual flow (paper) into digital web with a lot of data that need to be handled also.
*Data that shown on these mockups are dummies.
Summary of Project
Project Duration
5 months (Jul - Aug 2025)
Rapid prototyping for first 2 months
Team Member
Andrian Cedric (UI/UX Designer)
Saraska Putri I Lango (UI/UX Designer)
Tools
Figma (Design and Make), v0.dev, ChatGPT
Solving the Right Problem
We start with understanding the user's pain points
We have conducted numerous meeting with main users from ST Engineering Aerospace to gain clarity of their pain points of current system's UI/UX design.
There are 2 main pain points of current workflow:
Paper-based form and human error risks
Too much paper-based form leads to difficulties in organize and track the forms. There’s disadvantage in storing and tracing old forms, sometimes can be missing through the process
No data linkage/synchronization.
Engineers feel painful to find and search the linkage of one data to another; they need to go back and forth to Workshop. If one engineer buy one thing, the other engineer may don't know the purchase because no linkage of the data in current flow
Solving the Problem Right
We continue with solutions
After defining and mapping the user needs, I moved into solution validation through Wireframes and Prototyping—built low-to-high fidelity wireframes to validate layouts and flows.
We also conduct usability testing to iterate our design with the users. We tried to use AI-tools such as Figma Make and v0.dev which can developed live website as prototype based on created mockups and prompt. These findings will be the basis of later development.
The design simulates the workflow of Engineer to create a capability study form (10+ forms) and the approval role to approve the form (there are 5+ approval role that need to be handled).
Weekly Meeting and Site Visit
To ensure our understanding aligns with user's and business' needs, we're conducting weekly meeting with ST Engineering teams and visited the site at the beginning of the project to gather more information and understanding of daily work and their pain points.
Design system used in this project
We created a custom-made design system, heavily based on React as the main framework of e-CSR Development. These ensure every components and assets are consistent and standardize to be developed later.
