Quick Insights into Employee Time & Attendance
5,000+ restaurant and retail managers were navigating 4 to 5 taps just to find a pending time-off request. Over 11 months, I designed the mobile dashboard that replaced that, a tab-based prioritization system that became the foundation for mobile-first dashboard thinking across Paycom's platform.
ROLE
TEAM
TIMELINE
TOOLS
Context
Time management sits at the center of daily restaurant and retail operations. Managers approve time-off requests, correct timecards, monitor attendance, and plan staffing, all while handling floor responsibilities and responding to immediate operational needs.
Paycom's Time & Attendance module handled these workflows on desktop, but mobile lacked a unified entry point. Managers received notifications and emails about pending actions but had to hunt through nested menus to find where those actions lived. The result: delayed approvals, frustrated staff, and managers defaulting to desktop despite being constantly on the move.
This project focused on designing a mobile dashboard that didn't just display information, but helped managers identify and act on what mattered most without navigating the entire system.
The Problem
Mobile had no centralized view of time and attendance activity. Managers navigated multiple menu options, relied on notifications to know what needed attention, and spent time searching for pending actions they knew existed but couldn't quickly locate.
Fragmented navigation
The main menu split time and attendance into two sections. Most dashboard-relevant actions lived within those sections, requiring managers to dive in, complete a task, back out, and repeat
Alert fatigue
Managers were notified via email and in-app alerts but had no single place to see everything requiring action. The main menu showed "(x actions pending)" but didn't reveal what those actions were or where to find them.
Slow task completion
To approve a PTO request: main menu → time off requests → scroll through all requests → find active requests → tap to view details → approve or deny. Similar multi-step paths existed for timecard corrections, attendance issues, and schedule gaps.
Real impact
Staff frustration when approvals sat unaddressed. Timecard corrections required employee follow-up to get manager approval before payroll processing. Managers often left approvals until the last minute, creating bottlenecks.
"I get bombarded with notifications about requests. When I open the app, I have to hunt down where each one lives."
- Manager
My Role
As Lead Mobile Designer, I owned the dashboard strategy, interaction architecture, and cross-team coordination across an 11-month build. I worked with the PM to define tab structure and widget prioritization, partnered with 2 desktop designers to align patterns with existing Time and Attendance functionality, and coordinated 4 mobile designers expanding interactions across connected system modules. I ran design reviews, facilitated critique sessions with design leadership, and presented direction to stakeholders.
Research & Discovery
Research focused on understanding what managers actually needed to see and act on during their day, and how to surface that information without replicating desktop density on mobile.
Understanding existing patterns
I partnered with desktop designers to map the Time & Attendance module and identify all manager touchpoints: approvals, corrections, attendance monitoring, scheduling, budget oversight, and staffing projections. This revealed that most actions lived 3-4 taps deep in nested menus.
Validating information hierarchy
I consulted with Paycom's research team to understand principles around dashboard design: which graph types were easiest to scan on mobile, and when widgets became overwhelming rather than helpful.
Testing prioritization with managers
I conducted card sorting sessions with 3 internal managers to validate widget prioritization. Managers sorted widgets into categories: critical (needs immediate action), current overview (operational visibility), and looking ahead (planning context).
What surprised me: Managers categorized "employees working overtime" as overview, not critical. I had assumed overtime was urgent. They clarified: overtime is important context for planning, but not an immediate action item.
Managers also didn't want timecard change request breakdowns on the critical tab. They wanted direct links to pending requests instead. This shifted the critical tab from informational to purely action-oriented.
One thing that surprised me: managers categorized employees working overtime as overview, not critical. I had assumed overtime was urgent. They clarified it is important context for planning, not an immediate action item. That one insight reframed the entire critical tab.
Defining the Product Direction
Early conversations surfaced tension between comprehensiveness and clarity. Product initially leaned toward showing everything managers might need in one scrollable view. I pushed for tab-based navigation that separated urgent actions from operational context.
The question became:
Should we replicate desktop information density on mobile, or design a prioritization system that surfaced what mattered most first?
We anchored on a principle:
If everything is yelling for attention, nothing gets done. The dashboard needed to guide managers to what required action, not just display what existed.
Key Constraints That Shaped the Experience
Limited mobile screen real estate
Managers needed visibility into multiple operational areas without endless scrolling. This constraint drove the tab structure and informed the "no more than 3 widgets per screen" guideline.
Integration across existing system
Widgets linked to various Time & Attendance modules. Mobile designers needed to update interaction patterns across those connected screens to maintain consistency now that they all fed from a central dashboard.
Mobile-first design approach
Desktop had a bare-bones dashboard with only critical number hyperlinks and basic request widgets. The mobile dashboard became the foundation, with desktop patterns updated afterward based on mobile work.
Design Decisions
Advocated for tab-based navigation over single scrolling view
The PM resisted tabs initially, concerned about adding clicks between content. But testing the single-page prototype revealed a hierarchy nightmare: managers scrolled endlessly trying to relocate information they'd seen moments earlier.
I built a clickable prototype demonstrating tab-based navigation: Critical for immediate actions, Current Overview for operational visibility, Looking Ahead for planning context.
The PM scanned information faster in the tabbed version. The structure made it clear where to look for specific needs rather than requiring visual parsing of a long scrolling list.
The PM initially pushed back on tabs, concerned about adding clicks between content. I built a clickable prototype showing both approaches side by side. He scanned information faster in the tabbed version. We moved forward. Trade-off: one extra tap. Payoff: a clear mental model for where information lives.
Trade-off: Added one tap to switch contexts, but eliminated cognitive load of scanning an overwhelming single view.
Designed widgets as entry points, not endpoints
Widgets didn't try to contain all information. They surfaced key signals and provided direct links into relevant workflows. This kept widgets scannable while enabling immediate action without multi-step navigation.
Standardized interaction patterns for actionable lists
Widgets linked to list pages where managers could act on items. I worked with mobile designers to establish swipe actions (approve, deny, notify) directly on list items, eliminating the need to tap into detail pages for routine decisions.
Prioritized urgency over chronology
The PM and I initially debated whether to show newest items first (chronological) or most urgent items first (prioritized by time sensitivity).
Card sorting sessions validated urgency-based prioritization. Managers needed to see time-sensitive items first because many decisions directly affected current or upcoming shifts and payroll processing.
Impact
0+
0+
Daily active users at launch
0st
0st
Mobile dashboard became the foundation for mobile-first dashboard design across Paycom's platform
Reduced
Support tickets related to navigation and pending action discovery post-launch
v0
v0
Widget prioritization model directly informed the v2 customization roadmap
Reflection
This project reshaped how I think about dashboard design. The challenge wasn't organizing information. It was deciding what deserved attention first and designing a system that guided focus rather than just displaying data.
The tab structure debate taught me that adding a single interaction (one tap to switch tabs) can reduce cognitive load significantly if it creates clear mental models for where information lives.
What I would do differently
Test with actual client managers earlier.
Internal manager testing validated prioritization, but external client testing would have surfaced edge cases in workflow variation across different industries (retail vs. hospitality vs. healthcare).
Instrument widget usage from launch.
We tracked overall adoption but not per-widget interaction data. Knowing which widgets were used most vs. ignored would have informed faster iteration on widget prioritization and v2 customization work.
Push harder for widget customization in v1.
Manager needs vary by role and team size. Letting managers choose which widgets appeared would have increased relevance, but timeline constraints deprioritized it. This became a v2 priority.
Other Projects
SUCCESSION PLANNING
Optimizing talent management
Case Study
Case Study
DIGITORY