Project Overview
I redesigned and extended a SaaS-based employee portal that brought multiple business and employee workflows into a more connected experience. The work covered employee self-service as well as operational flows across HR, procurement, payroll, infrastructure, and related teams.
One connected employee experience
The portal brought together activities such as time tracking, employee information, leave, documents, approvals, and other services instead of making employees move between disconnected touchpoints.
Beyond time tracking
I also developed flows for procurement, HR hiring and onboarding, employee termination, payroll, infrastructure, and supporting operational activities. The experience had to work across different roles, permissions, and business needs.
My Role
I started with the complete application rather than a single screen. My responsibility was to understand how the product worked end to end, define a scalable experience direction, and help the team deliver connected flows without losing consistency.
Application lifecycle & architecture
I reviewed the overall application, existing flows, roles, dependencies, and recurring tasks. I mapped the application lifecycle and developed the product architecture so new modules could fit into a common structure.
Principles, KPIs & product direction
I defined experience principles with business heads and stakeholders, discussed the problems and priorities with them, and defined KPIs that helped the team focus on usability, adoption, task completion, consistency, and reduction of broken or missing flows.
Design system & team delivery
I established the design system and reusable interaction patterns, then distributed flows across the design team. I reviewed work across modules so different designers could complete their assigned areas without creating separate conventions.
Release and continuous improvement
I supported stage-wise releases to teams so we could identify usability issues, cognitive-load problems, missing steps, and broken flows early. Findings were used to refine the experience before the next stage.
The Challenge
The challenge was not simply to add screens. The application already had processes, data, roles, and dependencies. The larger challenge was to make the complete experience understandable while extending it across multiple business functions.
Fragmented employee journeys
Employees had to understand where different activities lived and how separate services connected. This created unnecessary navigation and increased the effort required to complete routine work.
Many business functions
HR hiring and onboarding, termination, payroll, procurement, infrastructure, time tracking, approvals, documents, and employee information each had different rules and stakeholders.
Different roles and permissions
Employees, managers, HR, procurement, payroll, infrastructure, and other teams needed different information, actions, and levels of access without creating a completely different product for each role.
Missing and broken connections
As the application evolved, some flows were incomplete or disconnected. I treated these gaps as experience problems and looked for the missing steps, dependencies, and handoffs rather than designing isolated screens.
Mobile experience
The mobile experience extended the portal to employees working remotely and on-site. I designed the mobile flows around the same product structure and interaction principles so the experience remained familiar across devices.
From Evidence to Insight
Before redesigning individual flows, I studied the whole application. I reviewed the existing screens, functions, process dependencies, roles, and recurring tasks to understand where people were spending effort and where the experience was breaking down.
I mapped the complete application
I first checked the total application and its flows. This helped me understand how one module affected another and where employee, manager, HR, payroll, procurement, and infrastructure activities crossed each other.
I identified cognitive load
I looked for places where users had to remember too much, move between unrelated areas, interpret unclear statuses, or repeat information. These observations shaped the information architecture and interaction patterns.
I found missing and broken flows
I traced end-to-end tasks instead of validating only individual screens. This exposed missing steps, unclear handoffs, inconsistent states, and dependencies that could easily be missed when designing one module at a time.
I converted findings into priorities
I used stakeholder discussions, process understanding, and usability feedback to decide what needed to be simplified, connected, standardized, or validated before the next release stage.
Architecting the Experience
I turned the findings into a product architecture that could support multiple business functions without making the employee experience feel like a collection of separate systems.
Application architecture
Experience principles
Design system
I defined reusable patterns for navigation, forms, tables, cards, filters, approvals, calendars, status, feedback, responsive behavior, and other recurring interactions. I distributed these patterns to the team so individual flows could be completed faster without creating inconsistent experiences.
The Decisions Behind the Design
The main design decisions were driven by the need to make a large SaaS application feel clear and manageable for people who used only a small part of it at a time.
Role-based progressive disclosure
I showed relevant information and actions based on the user's role and context rather than exposing every capability at once. This reduced unnecessary choices while keeping deeper functions available when needed.
Tasks before system structure
I organized flows around what people needed to accomplish rather than making users understand the application's internal structure first.
Consistency across a distributed team
I used the design system and shared interaction rules as the common language for the team. I reviewed distributed flows to keep navigation, forms, statuses, feedback, and responsive behavior consistent.
Stage-wise validation
I released developed flows to teams in stages. This allowed usability issues, cognitive-load problems, missing states, and broken connections to surface earlier and be improved before the next release stage.
Impact & Outcomes
The work created a stronger foundation for the SaaS application and a more connected employee experience. The impact was reflected in the way the product could be extended, reviewed, and released across multiple teams.
Connected employee experience
Employee services and operational workflows were brought into a more structured portal instead of relying on disconnected experiences.
Scalable architecture
The application architecture gave new business flows a clearer place within the product and reduced the need to solve the same structural problem repeatedly.
Consistent team delivery
The design system and shared principles helped multiple designers work on different flows while maintaining a common experience language.
Continuous usability improvement
Stage-wise releases created opportunities to identify usability issues, reduce cognitive load, and fix missing or broken flows before they became larger product problems.
What this project strengthened in my practice
I learned to approach a large SaaS product as a connected system rather than a set of screens. Understanding the complete lifecycle, architecture, business rules, people, and dependencies helped me make better UX decisions and support the team from early structure through implementation and release.