Central Design Time
Central Design Time is a cloud product, which builds end to end models and provide a holistic view on production processes. It interacts with ERP and MES systems to do routing definition, machine orchestration and message flow design.
Role
-
Conducted on-site interviews in local factories
-
Defined solution directions and maintained design consistency across iterations
Toolkit
-
Figma
-
Axure RP
-
Adobe CC
-
Miro
-
Google Forms
Discover
Background
The routing is the top level of process modeling, which defines the sequence of operations required to manufacture a product. It’s like a recipe or blueprint that tells the system how to make something, where to do it, and in what order.
To apply routings from ERP to the shop floor level interactions involves two roles:
-
Routing Planner
-
Technical Engineer
Before CDT, the routing planner managed routings within the ERP system. Typically, a routing did not include detailed operational sequences—these were usually hard-coded directly into the PLCs at the shop-floor level. Whenever interactions between machine units were required or when the production environment changed, a technical planner had to manually update the PLC code each time.
Research Plan
We seek to analyze user interactions with the current workflow to inform the design of an end-to-end system that streamlines production routing management.
Methods:
-
Stakeholder interview
-
Affinity mapping
-
User persona
-
User journey mapping
Business Research
To better understand the goals of our stakeholders and the expectations for improving the current production-process solution, We conducted:
-
Secondary research — reviewing company news, internal documentation, and industry articles
-
Business interviews — speaking with the product owner and marketing team to clarify strategic objectives
From this research, we identified three key stakeholder goals:
-
Business Goals
1
Establish an end-to-end, unified production process management system.
2
Enable planners and engineers to configure processes without requiring excessive PLC programming skills.
3
Deliver a cohesive user experience that strengthens brand trust and loyalty.
User Research
We conducted interviews with 21 participants — including 7 routing planners, 10 technical planners, and 4 first-time users. All interviews were held on-site at the local factory.
We used affinity mapping to organize interview insights and uncover common patterns and pain points. Based on these insights, we created user personas to represent key user groups and their needs. We then mapped the end-to-end user journey to visualize workflows, handoffs, and opportunities for improvement.
-
Affinity Mapping
-
User Persona
-
User Journey Mapping
.jpg)
Define
After organizing and synthesizing the research findings from previous steps, we summarized five key pain points and developed solution directions aligned with both user needs and business goals.
User Pain Points
1
Disconnected ERP–machine workflows force manual engineer intervention and fragmented communication, leading to misalignment and wasted team effort.
2
Repeated hard-coded machine changes require runtime updates, creating redundant work and increasing error risk.
3
Lack of unified data makes it difficult to monitor real-time production, trace issues, or drill across production levels.
4
Text-based routings without visual or interactive support make decision-making harder and lead to repetitive, time-consuming work.
5
Technical planners are overloaded with both routing design and deployment, while non-technical users lack the ability to make independent changes.
Solution Directions
Project Goals
With the end of the research phase, we defined a clear project goal: to fundamentally reduce system complexity and transform cross-team collaboration by delivering a visual flow editor, centralized process management, and an integrated monitoring dashboard within a unified experience.
1
Visual Flow Editor – Replace text-based routings with a drag-and-drop graphical interface.
2
Centralized Management of Production Processes – Link routing, validation, and shop floor configurations.
3
Integrated Monitoring Dashboard – Provide unified, real-time production visibility.
Design
After synthesizing research insights and defining key pain points, business objectives, and MVP goals, I moved into the design phase. The goal was to translate user needs and business objectives into a clear, intuitive system architecture and workflow.
UX Design
-
Sitemap
To ensure a clear information architecture, I first created a sitemap to define the overall structure of the CDT application. The sitemap helps visualize how different sections—such as projects, flows, and machines—are organized and connected, establishing a foundation for intuitive navigation and scalable design.
.jpg)
-
As-Is Workflow vs To-Be Workflow
After defining the information structure, I led a critical workflow transformation phase—developing a side-by-side comparison of the current and future states to clearly articulate how the new design fundamentally improves collaboration, visibility, and operational efficiency.
Current Workflow
Future Workflow
Current Flow Observations:
-
Fragmented systems & manual handoffs
-
Low production visibility
-
Manual, inefficient processes
-
Engineering-dependent operations
Future Flow Improvements:
-
Centralized, unified workflow
-
Visual, real-time visibility
-
Reusable & testable routings
-
Role-based, low-code configuration
-
User Flows + System Decision Points
After defining the information structure, I designed role-based user flows to illustrate how different users complete key tasks within the system. I carefully considered key decision points to identify potential friction and ensure each step feels intuitive, efficient, and aligned with both user needs and business requirements.
Case 1: The routing planner creates a new project and assigns to a operation planner
System Decision Point: Create Project
-
If name is blank -> inline message “add name” + disable create
-
If name is existed -> inline message “name is existed pls change” + disable create
-
If name is in wrong format -> inline message shows the right format + disable create
-
If description exceeds the word limit -> inline message shows current words/word limit + disable input continually
System Decision Point: Select Routings
-
If data source is missing -> show link to switch to administration page + disable next
-
If routings are missing -> show link to ERP page where planner can check directly + disable next
System Decision Point: Select Users
-
If users are missing -> show link to switch to administration page + disable next
Case 2: The operation planner designs communication flow and operational flows, and marks the flows as completed
System Decision Point: Edit Communication Flow
-
If existed equipments are missing -> show link to switch to administration page + disable set as completed
-
If machines/services/client are missing -> show link to switch to administration page + disable expanding other panels
System Decision Point: Validate Communication Flow
-
If some machines are not connected -> disable set as completed + show reason + highlight non-connected machines
-
If some exposed inputs/outputs are not connected -> disable set as completed + show reason + highlight non-connected inputs/outputs
-
If diagram is not optimized -> show reason, add msg "diagram can be reverted anytime" + highlight optimization button
-
If key steps in routings are not included -> disable set as completed + show reason + list all missing key steps
-
If no flow from machine to PCo to MES -> disable set as completed + show reason
Case 3: The technical planner designs message flows, and marks the flows as completed
System Decision Point: Edit Message Flow
-
If existed services are missing -> show link to switch to administration page + disable set as completed
-
If existed operational routings are missing -> show link to switch to project page + disable set as completed
-
If inputs or outputs inside PCo item are missing -> show link to switch to communication flow page + disable set as completed
-
If client proxies inside PCo item are missing -> show link to switch to operational flow page + disable set as completed
System Decision Point: Validate Message Flow
-
If no PCo item is included -> disable set as completed + show reason
-
If some exposed inputs/outputs/client proxies are not connected -> disable set as completed + show reason + highlight non-connected items
-
If no flow from PCoUA Server to Client Proxies to PCo output -> disable set as completed + show reason
-
If key steps in operational flows are not included -> disable set as completed + show reason + list all missing key steps
-
Edge Cases
I identified key edge cases to illustrate how the system prevents errors, communicates clearly, and helps users recover without losing work.
Edge Case 1: Activate Project Fails
Before activation, the system validates whether all required configurations are complete and correctly linked. If any blocking issues are detected, the project cannot be activated and enters a Blocked state.
Blocking Conditions:
-
Required operational, communication, or message flows are missing
-
Operational, communication, or message flows are not linked to any routings
-
Operational or message flows are not connected to a communication flow
-
Message flows are not associated with any operational flows
-
Operational, communication, or message flows are missing required parameters and conditional logic
System Behavior:
-
Displays a consolidated validation message explaining all blocking issues
-
Highlights the missing or incorrect elements
-
Provides deep links to the relevant flow managers for quick fixes
-
Sets the project status to Blocked and disables activation
Once all issues are resolved, the user sets the project status back to Completed and reactivates the project.
Case 1: System behavior when project activation fails
Edge Case 2: State Conflicts between Editing and Deployment
After Activation, user attempts to edit an operation/message/communication flow.
System Behavior:
-
Shows read-only state
-
Displays message "this project is already activated"
-
Provides options to create a new version or duplicate the project
Case 2: System behavior when editing an activated project
Edge Case 3: Deployment to Shopfloor Fails
After Activation, deployment to the shopfloor encounters errors.
Blocking Condition:
-
Network failure
-
PCo/MES system returns an error
System Behavior:
-
Project turns into Deployment Failed status
-
Shows a clear explanation of the error
-
Provides actions for user-level failure: wrong parameters or connections, etc
-
Disables activation
-
Provides actions for system-level failure: retry deployment or contact admin
Once all user-level issues are resolved, the user sets the project status back to Completed and reactivates the project.
Case 3: System behavior when shopfloor deployment fails
-
State Changes
In addition to designing system behaviors for edge cases, I defined component states, toast message types, and explicit system states to ensure clarity and consistency across user interactions. By clearly communicating data freshness and system status, the design increases user confidence and enables faster, more informed decision-making.
After defining component and system states, I further established clear project states on the Project Detail page to reflect progress and system behavior throughout the project lifecycle.
New
In Progress
View Block Status from the Hierarchy View
Blocked
Activation Failed
Completed
Deploying
Deploy Failed
Deployed
UI Design
-
Design Specifications
At this stage, we established the visual foundation for the high-fidelity wireframes. We began by defining the layout anatomy, spacing system, and design tokens to ensure visual consistency and clear hierarchy. From there, we developed the core component library, including key states for buttons, cards, modal templates, and icon sets.
-
High-Fidelity
The final design showcases draggable flow editors with drill-up and drill-down navigation, enabling users to manage the entire production process in one place and seamlessly deploy configurations to machine level.
1
Visual Flow, Zero Code
Transforms complex coding and logic into intuitive visual workflows.
2
See the Big Picture, Dive into Details
Introduces hierarchical navigation that allows users to easily drill up or down between different levels of flows and machines.
3
A Single Source of Truth
Unifies multi-system data into a single model and visual hierarchy for cross-role collaboration.
Deliver
After completing the mockups, We conducted usability testing to evaluate how effectively users could navigate and manage flows within the new system. A SWOT analysis was performed to assess design strengths and improvement areas. Insights from these evaluations guided several iterations to refine navigation, workflow clarity, and overall usability.
Usability Test
I conducted usability testing for the CDT project with 7 participants, 3 with experience in production planning and 4 in technical operations. The sessions were held onsite at the local factory, allowing me to observe how users interacted with the new flow management system in real time.
After gathering feedback, I analyzed the results and summarized the usability insights in a SWOT analysis, which helped uncover key pain points and opportunities for improvement. These findings guided the next round of design iterations.
-
SWOT Analysis
Iterations based on Feedback
Through usability testing in the CDT project, we identified three major iterations to improve the original design, focusing on enhancing workflow efficiency, clarity, and overall user experience.
1
Reduced Time to Troubleshoot
Introduced a machine modal and a project hierarchy button, allowing users to quickly identify the root cause of issues.
2
More Seamless User Experience
Minimized prompts by updating the navigation style and consolidating prompts for multiple tasks, helping users stay focused and maintain workflow continuity.
3
One-Click Auto-Connection
A single PCO can connect many services, and auto-connection significantly reduces diagram maintenance effort.
Production Release
The MVP flow was first released in a beta test with several of our key customers. The feedback was overwhelmingly positive, and many additional customers requested to join the beta program. We found that users were significantly more engaged and successful in completing production processes using the CDT solution compared to the previous workflow.
Conclusion
I’m incredibly proud of the work I’ve done on the CDT project. This initiative has helped steer the product in a direction that aligns not only with the company’s business goals but also with the real needs of our end users. From the very beginning, it’s been a user-centered effort—one that has reshaped how we approach design within our production process.
If I could change anything, I’d aim for less perfectionism in the early stages, allowing for more iteration cycles with users and stakeholders to identify issues sooner. I also wish I’d had the chance to speak with more customers to gain deeper insights into their experiences with CDT.
I’m eager to apply these learnings to future projects and continue driving user-centered innovation.
Read more of my case studies
Smart Manufacturing Showcase
The intelligent manufacturing demonstration line achieves highly integrated information flows, enabling rapid responses to market changes.