PAYLOCITY · MOBILE IA & CONCEPTS
Rebuilding the Information Architecture for Paylocity Mobile
COMPANY
Paylocity
ROLE
Product Design Manager
IMPACT
Org-wide adoption
TEAM
Me + 2 Senior Designers, Mobile PM, 4 Engineers
The Challenge
Paylocity Mobile had grown feature-by-feature — Home, Pay, People, the app launcher, and Inbox were each designed in isolation, on their own timelines, by different teams. There was no shared structural model tying them together: navigation patterns, list items, and card states were re-invented per feature, and it wasn't clear where a new capability was supposed to live. Every new request risked adding another one-off pattern instead of extending something that already existed.
What We Built
A full wireframe pass across the app's five core destinations, establishing one consistent IA before any visual design started.
-
Home centers on a contextual punch-card widget with minimized and expanded states, quick-action chips, upcoming shifts, and a recent-activity feed.
-
Pay restructures the check list around a segmented check-details view (summary, earnings, deductions) and surfaces On-Demand Pay contextually rather than as a separate destination.
-
People separates "recently viewed" from the full team directory.
-
My Paylocity becomes the overflow launcher for every module that doesn't warrant its own tab.
-
Inbox unifies notifications and tasks under one segmented control with grouping and filtering.
Every flow — punch in → view shift details, check → check details, notification → related task — was mapped end-to-end in a journey diagram before wireframes were finalized, so transitions between screens were validated structurally before a single pixel of visual design was spent.
I led the information architecture, interaction model, journey mapping, and two senior designers translated it into visualizations used to communicate the new experience to product teams and leadership. Together, these artifacts helped demonstrate how the model addressed user needs and created a more cohesive product experience.
Home
Punch card, quick actions, activity feed
Pay
Check list > check details (earnings / deductions)
People
Recently viewed team directory
My Paylocity
Launcher for every other module
Inbox
Notifications + tasks, grouped & filtered
With the app’s structure, navigation, and key journeys validated through wireframes, we moved beyond the conceptual phase with a shared foundation for all five destinations. Each product team could now focus on bringing its experience to life through visual design, interaction details, and illustration—without reopening core decisions about hierarchy, flow, or how the pieces connected across the app.
Impact
The new IA shipped into production and now underpins the primary navigation of Paylocity Mobile as well as the desktop experience. Design and engineering share one structural model for where new features belong instead of negotiating it feature-by-feature, and the cross-screen flows validated in the journey map carried straight through to the shipped product with minimal rework.
