HR System Architecture & Design
Transformed fragmented, manual workflows into a unified digital HR system for an F&B enterprise.
OVERVIEW
Dian Xiao Er’s HR operations relied on fragmented tools and manual processes, making them difficult to coordinate, track, and scale across the organisation.
I designed a modular HR system spanning recruitment, training, and performance appraisal, structuring these complex workflows into clear, digital systems.
It improved visibility, reduced operational overhead, and enabled more consistent execution at scale.
ROLE
Sole Product Designer & Business Analyst
TEAM
1 Project Manager, 1–4 Software Engineers
TIMELINE
April 2023 – May 2025 • 1 year of active design & business analysis
PROBLEM CONTEXT
Fragmented, manual workflows
Dian Xiao Er is an F&B enterprise with over 600 employees across their HQ, central kitchen, and multiple outlets.
Their existing HR platform (Times Software) served as a system of record for employee data but did not support their end-to-end operational workflows.
As a result, HR processes relied on fragmented tools such as Excel, WhatsApp, and paper forms, leading to manual coordination, repeated data entry, and limited operational visibility.
SCOPE & APPROACH
Filling operational gaps, module by module
Rather than replacing the existing HR platform, the system focused on filling operational gaps, syncing with it via API to maintain a single source of truth for employee data.
The system was developed in phases across three modules — Recruitment, Training, and Performance Appraisal — each following a consistent process from workflow discovery to system definition, validation, implementation, testing, and rollout.
WORKFLOW DISCOVERY
Mapping workflows, identifying pain points
I conducted stakeholder workshops to map existing workflows and identify key pain points across the modules. Through structured questioning and scenario walkthroughs, I surfaced edge cases, dependencies, and logic gaps.
SYSTEM DEFINITION & VALIDATION
Translating workflows into system behaviour
I translated the workflows into structured system behaviour, defining role-based permissions, relationships between users, data, and actions, along with state transitions and decision rules.
These were formalised in a System Requirements Specification (SRS), combining flows, rules, and wireframes into a single reference. The SRS was reviewed with stakeholders to validate the system design and ensure alignment before interface design and development.
SYSTEM DESIGN – RECRUITMENT & PERFORMANCE APPRAISAL
Designing workflow progression
A key part of the Recruitment and Performance Appraisal system design was introducing structured status flows, where the system governed progression through defined stages and the actions available at each point. This created a consistent model for tracking work state.
SYSTEM DESIGN – TRAINING
Managing fixed training cycles and content updates
A key challenge in the training system design was managing the conflict between fixed annual training cycles and frequently updated course content.
I worked with HR to define a versioning system where incomplete learner progress is tied to the active course version and resets when content changes, supported by course publish notes and automated learner notifications to maintain clarity.
INTERFACE DESIGN
Clear, actionable interfaces
I designed clear, actionable interfaces to ease the adoption of the new system, recognising that complex enterprise tools often fail not in capability, but in usability and user acceptance.
Information was structured to align with users’ mental models and workflows, ensuring that key signals such as status and next actions were easy to locate and interpret.
Consistent interaction patterns were applied across modules to ensure predictable behaviour and reduce the effort required to learn the system.
INTERFACE DESIGN HIGHLIGHT 1
Visible statuses
The recruitment workflow required HR to manage a high volume of applications across 17 statuses within a single consolidated table view.
To improve scanability, I grouped these into six broader stages, and encoded them using colour for quick interpretation at a glance within the status column. This reduced cognitive load when reviewing applications, while preserving granular detail through individual status labels and icons.
This structure was also reused across related components such as activity timelines and progression indicators to maintain consistency in how status information is communicated across the module.
INTERFACE DESIGN HIGHLIGHT 2
Consistent interaction patterns
Many HR workflows required employees to be grouped by position, with structures varying by workflow context.
I designed a rank-ordered interface that enables users to split or merge groups while maintaining the organisation’s position hierarchy.
This pattern was applied across both Recruitment and Performance Appraisal modules, creating consistent system behaviour and reducing cognitive load for users.
IMPACT
Smooth adoption, improved visibility, and reduced operational overhead
The system was successfully deployed across all three HR modules. Despite a diverse user base with varying levels of digital literacy, adoption was smooth, requiring minimal training.
By replacing fragmented, manual processes with structured digital workflows, the system improved visibility and reduced operational overhead across HR functions.
The HR team shared that they can’t imagine going back to the old way of working — the system has become an integral part of their day-to-day operations.