Start from the request a person actually receives
A customer’s print request becomes a material choice, finishing specification, dimensions and quantity. Grouping those inputs gives the calculation a recognizable order.
GROUP PROJECT / BUSINESS WORKFLOW
VinaDesign CRM
From dimensions
to a clearer quote.
A CRM concept for a printing business, bringing price calculation, orders and reporting into a shared workspace. The recovered DMS4 front-end makes its pricing workflow tangible.
- CONTRIBUTION
- Concept, research, user journey, sketches & selected front-end pages
- FORMAT
- Desktop CRM prototype
- CRAFT
- UX/UI · HTML · CSS · JavaScript
01 / CONTEXT & INTENT
How can a sales team turn a printing request into a quote with less friction?
The DMS4 group document describes a workflow with manual price calculation, scattered order information and repeated invoice work. The proposal connects these tasks in one system. Its recovered front-end includes a local price calculator: a useful place to show how material choices, dimensions and quantities become a visible breakdown.
02 / DESIGN REASONING
The thinking behind the interface.
Show the calculation as well as the total
The interface separates area, printing cost, remaining material, per-piece cost and the final amount. This makes the quote inspectable while the salesperson changes the inputs.
Keep the quote connected to an order
A cart collects selected items and notes before a customer summary. The wider design also maps reporting and order management, documented in the group’s flow and screen sketches.
The experience, step by step.
A walkthrough of the documented experience.
- 01
Choose
Find a material and finish.
- 02
Calculate
Enter dimensions and quantity.
- 03
Inspect
Review the price breakdown.
- 04
Collect
Add items to the sample cart.
03 / VISUAL EVIDENCE
A closer look at the work.
Original screens and process material. Select an image to inspect it at full size.
My role within the group
Original DMS4 document, p. 2: the task-allocation slide distinguishes each teammate’s design and front-end responsibilities.
Mapping the wider workflow
Original DMS4 group document, p. 9: navigation and the relationship between the proposed operational tasks.
The original calculator, restored
A capture of the local front-end. Sample prices are preserved to demonstrate interaction; they are not a current quotation.
The wider interface proposal
Original portfolio presentation: pricing, order records, delivery information and reports.
04 / EXPLORE
From explanation to experience.
Try the original price calculator: choose a material, enter positive dimensions and quantity, then add it to the cart. The preview uses sample prices and keeps the cart in memory. Reporting, real orders, account services and printing are outside this version.
EXPLORE THE ACTUAL PROJECT
What this work carries forward.
The group’s task-allocation slide credits me with concept, research, user journey and sketches, plus front-end work for reports, order creation and customer/order search. The calculator is presented as part of the group’s wider system. The recovered material now lets me show both the intended system and an actual front-end interaction, while keeping the distinction between a prototype calculation and a connected business service clear. The next design question is how well the breakdown matches the way staff explain prices and revise orders in daily work.