Anfold

Client

Timesheet Portal Anfold

Type

Product design

Year

2023

Anfold
My role:

- User Experience Designer for Systematic Inventory View (SIV)
- Redesign HelloFresh’s design system: 

Figma Design system

Anfold

The Timesheet Portal is a robust platform used by companies to manage not just timesheets, but also project tracking, leave management, expenses, and even client billing. When I took on the challenge to redesign the platform, it became clear that our goal wasn’t just to enhance one feature but to rethink how the entire suite of tools could work together seamlessly. The challenge was to create a unified, intuitive experience that catered to a broad user base—from employees submitting their hours, to project managers tracking budgets, and HR teams managing leave requests.

This case study explores the process of redesigning a complex, multi-functional system and highlights the key insights that guided our work.

Design Process

My approach involved taking a holistic view of the platform’s different modules and understanding how users interact with them throughout their workday. The redesign required a balance between simplifying individual workflows while maintaining the depth and flexibility the platform offers.

Understanding Diverse User Needs

The first step was understanding the full scope of how users engaged with the platform. I conducted extensive user research, speaking with employees, project managers, HR administrators, and even finance teams. Through interviews and usability testing, several common pain points emerged.

Employees often felt overwhelmed by the interface, which they described as “a bit of everything, all at once.” The platform’s many features were powerful but could feel cluttered, especially when users only needed to interact with a few tools, like time tracking or expense submission.

Project managers, on the other hand, expressed frustrations with managing project budgets, tasks, and timelines. They needed clearer dashboards that allowed them to see project status, resource allocation, and potential bottlenecks at a glance. Meanwhile, HR teams struggled with leave management and the approval process, citing that the workflows were overly complicated and prone to errors due to miscommunication.

One particularly insightful finding was that users wanted a more modular experience. They didn’t necessarily need to see everything the platform offered all the time; instead, they wanted to focus on the features relevant to their specific roles, with the option to access more advanced tools when needed.

Creating a Modular Interface

Based on these insights, I began ideating on ways to streamline the experience without sacrificing functionality. The key concept was modularity—designing the interface to adapt to different user roles and needs. We explored several approaches, including customizable dashboards where users could “pin” the tools and features they use most frequently.

For example, an employee primarily using the platform to log hours and request leave could have a simplified view with just those two modules, while a project manager could have quick access to budget tracking, team scheduling, and task management.

We also focused heavily on enhancing the visual hierarchy, reducing clutter, and making navigation more intuitive. One prototype introduced a centralized navigation hub that organized the platform’s wide array of features into clear categories: Time Management, Project Management, HR, and Reporting. This structure allowed users to easily locate the tools they needed while making it easier for new users to learn the platform.

Another area of improvement was in the approval workflows. We streamlined processes for timesheets, expenses, and leave requests by introducing a unified approval interface. This meant that managers could approve or reject all types of submissions in one place, with clear visibility into any pending actions.

Refining the Experience Across Multiple User Journeys

After developing mid-fidelity prototypes, we entered a rigorous testing phase. We observed how different types of users navigated the platform and iterated based on their feedback. One interesting insight from testing was that users often felt “lost” within certain modules, particularly when moving between different tasks like logging hours and submitting expenses.

To address this, we integrated contextual guidance that offered tooltips and in-app walkthroughs tailored to the user’s current task. We also introduced quick links and shortcuts, allowing users to move fluidly between related features—like jumping from a project budget overview directly to time tracking for that project.

Project managers particularly appreciated the new project dashboards, which provided a visual summary of progress, budget usage, and task completion rates. One manager said, “This gives me the pulse of my projects in a glance, without needing to dig into multiple screens.” These dashboards became a focal point of the redesign, integrating key metrics and alerts so that users could act on real-time information without switching between different tools.

Rolling Out a Cohesive Multi-Feature Platform

When I rolled out the redesigned Timesheet Portal, I did so in phases, starting with pilot groups to ensure that all major workflows were thoroughly tested. The feedback was overwhelmingly positive, especially from organizations with more complex needs. Users reported that the platform now felt more aligned with their daily routines, offering just the right amount of information and tools based on their roles.

HR teams saw a reduction in processing times for leave requests and expense approvals due to the unified interface. Project managers noted that they could manage resources more effectively with the new dashboard features. Employees, who initially felt overwhelmed by the breadth of the platform, now felt empowered by a more focused, role-specific experience.

One unexpected benefit was how the modular design allowed organizations to better tailor the platform during onboarding. New employees could start with a simplified setup and gradually access more features as they became familiar with the system

Visual Design and branding

Through this process I aimed to develop a design system that is engaging, intuitive and simple, recognizing the need for a seamless experience across devices, I ensured that the redesigned platform embraced responsive design principles. I designed layouts, optimized interactions, and tested the platform on various screen sizes and resolutions.

This cross-platform compatibility enabled users to access the Timesheet Portal from their desktops, laptops, tablets, and mobile devices with equal ease and functionality.

Collaboration and Development Handoff

I collaborated closely with developers, maintaining open lines of communication to ensure the smooth translation of design concepts into fully functional features. I provided detailed design specifications, guidelines, and assets, and actively participated in discussions and code reviews. This collaborative method encouraged a sense of understanding and agreement, between the design and development teams guaranteeing that the intended design vision was successfully achieved.


Prior to the platform's launch, I conducted rigorous user acceptance testing with a diverse group of users, including clients and internal stakeholders. This testing phase allowed us to gather valuable feedback, validate the design decisions, and make final refinements to enhance the overall user experience.

Once the platform met the expectations and needs of our users, it was confidently launched, ready to empower businesses with streamlined time tracking, project management, and profitability insights.


Takeaways

Through a comprehensive and iterative design process, the UX and UI of the Timesheet Portal platform were successfully redesigned, resulting in a user-centered, visually captivating, and seamlessly functional platform.

The latest version of our platform addressed the issues faced by clients, made time tracking more efficient and offered businesses tools for managing projects and contracts smoothly. Additionally, we noticed an increase of 25% in user satisfaction rates. This was confirmed by the results of our redesign survey and positive feedback, from our users.

Users reported a higher level of ease and efficiency in navigating the platform, recording their time, and managing projects and contracts. The intuitive design and streamlined user flows resulted in a significant reduction in the time required for employees to enter their timesheets accurately, improving productivity and time tracking accuracy.

The new user experience and intuitive design encouraged more users to engage with the platform, contributing to higher participation and more accurate time reporting. User errors in timesheet submissions were reduced by 20%, thanks to clearer instructions, intuitive interface elements, and informative error handling mechanisms.

Businesses benefited from the redesign as well, experiencing a siginifcant reduction in administrative time spent on timesheet management for project managers. This streamlined contract and project management, allowing project managers to focus more on strategic planning and execution.

Lastly, the visually captivating redesign received positive feedback from both clients and employees, contributing to a professional and engaging user experience.

The UI Improvements, intuitive navigation, and consistent UX enhanced the overall functionality of the platform.

In conclusion, the redesign of the Timesheet Portal platform resulted in tangible improvements and positive outcomes. It successfully addressed client pain points, improved time tracking efficiency, and empowered businesses to manage projects and contracts more effectively.

Other work