GT Porfolio logo

Timesheets Admin Checker

Visit online

Case Study: Designing the Synnch Timesheets Checker


R&D Timesheets submitted by staff members will have to be checked by Admins for accurate reporting

I. Introduction / The Challenge

Project Goal: To design an efficient and reliable interface for administrators or managers within Synnch to review, validate, flag issues, and approve staff R&D timesheets, ensuring accuracy and compliance with Australian R&D Tax Incentive requirements.

Product Context: Within the Synnch SaaS platform, accurate and compliant timesheets are fundamental for successful R&D claims. This dedicated 'Timesheets Checker' feature targets Admin users specifically tasked with this critical verification responsibility.

The Problem: Manually verifying potentially hundreds of timesheet entries across numerous staff members is incredibly time-consuming, prone to human error, and lacks a clear, auditable workflow. Admins struggled to efficiently spot inconsistencies, identify non-compliant entries (like non-contemporaneous or unallocated hours), manage high volumes, and proactively encourage staff towards timely submissions required by ATO/AusIndustry.

My Role & Responsibilities: As the UI/UX Designer, I was responsible for designing the entire Admin Timesheets Checker experience, including the overview dashboard with KPIs, the detailed staff review table, targeted validation workflows for specific issues (Unallocated, For Review, Missed), issue flagging mechanisms, approval/rejection interactions, and the corresponding notification/feedback loop for staff members. I collaborated with the Product Owner, Developers, and potentially compliance experts.

Constraints & Timeline: A key constraint was that this module must function purely as a verification and status-tracking tool; it should not allow direct modification of the underlying R&D hours data entered by staff via the main Timesheets UI.

II. Discovery & Research / Understanding the User

Methods: Conducted stakeholder interviews to define precise validation rules and compliance checks (e.g., contemporaneous requirements from ATO/AusIndustry). Analyzed existing manual or semi-manual verification workflows to identify bottlenecks. Held discussions with potential Admin users (or internal proxies) to understand their specific pain points, information needs, and desired level of control. Reviewed R&D compliance guidelines regarding record-keeping.

Process flow of Timesheets Admin Checker
Timesheet Checking Flow: Staff submit their R&D hours, which are then reviewed by admins for accuracy and either approved or rejected—ensuring compliance and data integrity.

💡Key Insights:

  • Action-Oriented Overview Needed: Admins required an immediate, high-level dashboard view highlighting critical issues needing attention across all staff (e.g., total unallocated hours, timesheets pending review, number of staff with missed timesheets). KPIs and global filters were essential for quick assessment.
  • Contextual Staff Assessment: Effective validation required viewing key indicators per staff member within a single table view (e.g., login activity, employment status, R&D hour ratios, submission frequency) to assess compliance contextually.
  • Targeted Issue Resolution Workflows: Admins needed distinct, guided workflows to address specific flagged issues (Unallocated hours, items 'For Review', 'Missed' entries) efficiently.
  • Proactive Compliance Encouragement: The UI needed to empower admins to proactively manage compliance by easily identifying and notifying staff about missed or late timesheets, reinforcing the need for contemporaneous entries.
  • Clear Staff Feedback Loop: A separate, simplified view was necessary for staff members to easily see and address items flagged by admins (e.g., Rejected entries with reasons, Missed periods).
  • Verification, Not Modification: The design must respect the constraint that this is a checker tool; core data edits happen in the main Timesheet UI, while this module manages review status and communication.

III. Ideation & Design Exploration

Process:

  • Sketched dashboard layouts focusing on prominent KPIs and actionable status filters.
  • Designed the main admin table structure, experimenting with information density and using stacked cells for related data points (e.g., Name/Position) to improve scannability.
  • Mapped out the distinct modal/page flows triggered when an admin investigates Unallocated, For Review, or Missed timesheets for a specific staff member.
  • Designed the corresponding Staff view, focusing on clarity of required actions.

Process flow of Timesheets Admin Checker
Sketch of the Admin Timesheet Checker: A draft layout showing key admin actions—reviewing submitted timesheets, spotting missed entries, and flagging unallocated R&D hours.

Iterations:

  • Explored various ways to visually represent the key statuses (Unallocated, For Review, Missed) both globally and per staff member, iterating towards clear numerical indicators combined with clickable actions.
  • Refined the table column order based on feedback regarding admin priorities during review.
  • Considered different interaction patterns for approving/rejecting items within the 'For Review' workflow.
  • Addressed the challenge of visualizing the time-dependent 'Missed Timesheets' status clearly.

Early high-fidelity mockup of the Admin Dashboard — content-heavy and with separate data and status pills, later refined for clarity.

IV. The Solution / Design Execution

Actionable status pills like Unallocated, Missed Timesheets, and For Review help admins focus on what’s urgent in a content-heavy timesheet view.

🧭 Admin Dashboard & Global Filters

Slide the cursor to compare. Admin Dashboard - Comparison of the initial high-fidelity mockup and the final implemented Admin Dashboard — showing refinements in layout, clarity, and data presentation.

Created a top-level dashboard within the Timesheets Checker tab (visible only to Admins).

Displayed key compliance KPIs at a glance:

  • Total R&D Hours
  • R&D %
  • Unallocated Hours
  • Number of Missed Timesheets

Introduced global filter buttons:

  • Unallocated
  • For Review
  • Missed Timesheets

Clicking any filter instantly narrows the main table to highlight only staff with that issue type.

📊 Admin Staff Review Table

Built a detailed, filterable table (by Financial Year) offering a staff-level overview.

Key columns:

  • Staff Name / Position (stacked format)
  • Last Login (sortable – indicates engagement)
  • Employment, BAU, and R&D Hours (% calculated)
  • Submitted Timesheets count
  • Timesheet Cycle
  • Email Reminder Cycle

🚨 Actionable Status Columns

Final table columns act as drill-down triggers for common issues:

  • Unallocated Hours (#)
  • For Review (#, with color-coded statuses)
  • Missed Timesheets (#)
  • Notify Staff button

Clicking these initiates focused workflows for resolution.

🧩 Targeted Issue Workflows (Admin)

Missed Timesheets filter is active
For review filter is active
With unallocated filter is active

Our goal is to simplify admin workflow by displaying these 3 major filters: Missed, Ready for Review, and With Unallocated Hours timesheets.

Unallocated Hours: Unallocated Hours refer to R&D hours that haven't been formally tagged to any specific activity. By the end of the financial year—and especially during R&D tax incentive submission—these hours must be fully allocated, as unallocated hours are considered non-compliant. Ensuring all hours are properly tagged should be a key responsibility for admins during review and submission.

For Review: Displays timesheets requiring admin review. Admins can Approve or Reject with mandatory remarks.

Missed Timesheets:Missed Timesheets are periods within the selected cycle (weekly or monthly) where no R&D hours have been recorded, and the time window has already passed. A monthly cycle allows more leeway, while a weekly cycle enables quicker tracking. The goal is to encourage regular logging of R&D hours by staff and admins—ultimately aiming for zero missed timesheets to ensure accuracy and compliance.

👤 Dedicated Staff Member View

Process flow of Timesheets Admin Checker
Staff View: Displays timesheet statuses giving team members clear visibility into their R&D tracking progress.

Separate Checker view for Staff users, tailored to their needs. Shows personal KPIs and status-based filters:

  • Rejected
  • Missed
  • With Unallocated
  • Open
  • Planned
  • Submitted
  • Approved

Displays individual time periods with:

  • Status
  • R&D totals
  • Unallocated hours
  • Admin remarks (for rejections)
  • Action buttons (e.g., View/Edit, linking to main Timesheet UI)

📁 Data Export

Added CSV export for the Admin table to support offline reviews, audits, and recordkeeping.

Dashboard UI of Staff Members
Dashboard UI of Staff Members

💡 Design Rationale

  • Admin dashboards highlight what needs attention right away.
  • Tables give context before you dive into specific issues.
  • Dedicated workflows tackle each compliance risk efficiently..
  • The staff view creates a feedback loop, guiding users to correct or finish their entries.
  • “Checker” role boundaries are strictly maintained to prevent unintended edits.
  • Encourages a proactive approach to compliance management.

V. Validation & Iteration / Testing

During initial testing, we noticed some confusion between global filter buttons and individual staff action buttons—users needed clearer visual distinctions or supporting tooltips to navigate effectively. Additionally, the way the 'Missed Timesheets' count updated based on the selected cycle wasn’t immediately intuitive, highlighting the need for either clearer UI feedback or an explanatory prompt. Given the information-rich admin table, we also had to fine-tune the layout and typography to maintain readability and reduce visual clutter.

VI. Impact & Results

Outcome: Delivered a comprehensive Admin Timesheets Checker module providing powerful tools for verification, compliance management, and staff feedback within the Synnch platform.

Measurable Impact (Intended/Projected):

  • ✅ Cuts down admin time spent manually checking timesheets
  • ✅ Boosts accuracy and consistency in reviews and approvals
  • ✅ Gives admins clear insights to manage compliance and prompt timely entries
  • ✅ Keeps an auditable trail of each review stage.
  • ✅ Improves staff experience by clearly flagging missing or rejected entries

VII. Learnings & Reflection

🔑 Key Takeaways

Designing for Actionability: This project reinforced how vital it is for admin dashboards to highlight what needs attention—missed entries, errors, or exceptions—rather than just presenting data. Designing with this “action-first” mindset helped prioritize meaningful insights over raw information.

Role-Based Interface Thinking: I learned to approach interface design through the lens of different user roles. While Admins and Staff interact with the same underlying data, their workflows, goals, and interface needs differ. Creating distinct but connected experiences for each role was a valuable design exercise.

Flipping the Design Lens: A key insight was learning to "invert" the typical design focus—shifting from showcasing complete data to intentionally surfacing what's missing or what's wrong. This was especially important for features like missed timesheet alerts or status tracking tools.

Designing for Time-Sensitive Data: Understanding that data status evolves over time (e.g., compliance cycles, submission windows) taught me to think temporally. UI elements needed to reflect these dynamics clearly for effective monitoring and decision-making.

💡 Challenges that Drove Learning

Simplifying Complex Rules: Representing R&D compliance concepts like contemporaneity or cycle-based tracking in an intuitive way was a major UI challenge. I had to find ways to surface these rules clearly without overwhelming the user.

Managing Dense Information: Admin tools required a lot of data in one view. Finding the right balance between information density and ease of scanning meant refining layouts, typography, and interaction feedback carefully.

Protecting Data Integrity: Since the Checker UI was meant for verification only (not editing), I had to clearly define boundaries—ensuring users could take action about data without accidentally modifying it.

🔭 Future Considerations

  • Introduce advanced notification rules or alert systems to help Admins respond more quickly to issues.
  • Explore custom dashboard views to align better with different organizational needs.
  • Investigate deep-linking between the Checker view and the main Timesheet interface to streamline corrective actions.