I completed this project during my time at Pathlight, a small 40-person SaaS startup.
Product Designer
Jan - Dec 2022
Me (Design)
1 Product Manager
2 Engineers
Figma
During my time at Pathlight, I was their only product designer and led all aspects of design from defining the design system to launching new product initiatives. In addition to spearheading design efforts, I collaborated closely with cross-functional teams to ensure alignment between design, engineering, and product management, resulting in streamlined processes and successful project delivery.
*Pathlight pivoted in product direction after my time there, and is now known as EchoAI
This was the key question we focused on at Pathlight, and we wanted to use it to guide our product thinking for this new product. Our primary stakeholder was customer support agents and their managers, all who have a shared goal of fostering excellent support for their customers, who are our secondary stakeholders. By prioritizing the needs and goals of our primary stakeholders, we aimed to ultimately elevate the overall satisfaction and loyalty of our secondary stakeholders, driving sustained business success and growth for both them and ourselves.
Primary Stakeholders
Secondary Stakeholders
Over the course of three months, I collaborated with a product lead and a team of three engineers to design and build this product from scratch. As the sole designer on the team, I was responsible for creating the user experience and interface, conducting user research, and iterating based on feedback from both internal stakeholders and customers.
Through this project, we were able to create a solution that streamlined the attendance tracking process, saving our customers significant time and reducing the risk of errors. We also received positive feedback from customers, who found the product intuitive and easy to use.
*Inspired by a 2009 Accenture graphic
Workforce management (WFM) is essentially about smartly organizing your team and resources. It involves keeping track of who's on the clock, making sure everyone follows the rules, and adapting to any changes in labor laws. The main goals are to make sure everyone's working efficiently and to avoid any legal trouble.
To break into the workforce management space, my team and I decided to focus on the first three buckets of WFM: forecasting, scheduling, and attendance. We decided to start with attendance since it was the easiest to build from a technical perspective, and would help lay the foundation for the other parts of WFM.
I worked with the product manager for this project to gather user requirements by talking to our various customers to understand how they currently do scheduling and what they would like to see in a new scheduling product.
I want to know that an employee has shown up for work.
I also want to know that an employee is sticking to their schedule.
I want to know where to look for information to validate the hours reported.
I want to be able to quickly and accurately report on my hours worked.
I met with my product manager and an engineering lead to brainstorm requirements and key user journeys before starting on designs. I translated our whiteboard session onto Figma and separated the key journeys into two buckets: time-clock attendance and time-card attendance.
Time-clock attendance would allow agents to clock in and clock out, thus capturing their hours in the most accurate way possible. While we wanted to pursue this portion of attendance eventually, we decided that it would be too much upfront engineering effort for the timeline we had.
Because of this, we decided to focus first on time-card attendance, which allows agents to log their hours after they have completed their work day.
I noticed that competitors seemed to take two main approaches: calendar views and table views. A calendar view intuitively felt right to me, especially since I’m very familiar with using Google Calendar for my day to day work scheduling, but I wanted to explore both to understand which may be best for our users.
I explored a calendar view of attendance, where users would be able to enter time by dragging and dropping within the calendar. I took heavy inspiration from the visual competitive analysis I did.
To contrast with the calendar view exploration, I explored what a table view version would look like. This was heavily inspired by the very basic timecards we saw companies make in something simple as an Excel sheet.
This was the key flow to the frontline employee’s goal of being able to quickly and accurately report hours as well as the manager’s goal of knowing that an employee is sticking to their schedule.
I initially explored what a timecard submission flow would look like from the calendar view. Although we later decided not to move forward with the calendar view, the flow and interactions here were helpful to sketch out and have as a visual anchor for conversations with my product manager and engineering lead.In this wireframe, I continued explorations from the calendar view and what it would look like to submit a timecard.
Through feedback from my team, I cleaned up the designs by consolidating certain actions into a more compact area.
Removed the side list view
Consolidated actions at the bottom for easy navigation
Although I initially explored a lot of options in the calendar view, and was leaning towards that design as the more user friendly option, we ultimately decided to go with the table view for our MVP because it was less engineering effort and we were on a tight timeline. We tabled the calendar view for later iterations of this product.
From a user perspective, we also realized this would still fulfill our initial user goals while remaining an intuitive and simple solution. Several of our customers use Excel sheets to monitor their agents’ scheduling processes, so the table view design would more closely mimic what they are already familiar with.
A high level glance at the various flows I worked on.
For the final prototype, I worked with my team to remove a number of features that we decided were out of scope for our MVP. Some features we removed were the ability to export a timecard, ability to switch from a table to calendar view, and the ability to customize the timecard view on the admin side.
A launched new initiative with budding customer interest
I collaborated closely with our engineering team to get our product up and running during the quarter. While we did not have actual users in the initial month following launch, there was increasing interest from both existing and potential customers about using attendance features in Pathlight's WFM.
This project marked my first major initiative from scratch to finish at Pathlight, where I took full charge of the design process. After finishing our initial version, I fine-tuned the designs based on feedback from more customers, getting ready for future improvements and to expand WFM through other new products.
Since this project was a 0 to 1 effort, I had the opportunity to create a lot of new components. When creating these components, I paid careful attention to ensuring consistency in visual details such as color, typography, and border radius.
As the only designer at Pathlight, this was one of the more challenging parts of this project. Iterating fast often led me to create many different versions of a design, and I didn’t always have the time to focus on whether my iterations were visually consistent with what I already created.
To better manage this, I asked my engineering partners to work with me to create a component library within the codebase that directly matched what I created in Figma. This ensured consistency in design before even building out the product itself, and allowed me to worry less about having to quality control designs on the level of color and sizing once they were built.
Although this was not the first time I was the only designer at a company, it was still quite a challenge being the solo designer because the project had such an ambitious scope compared to my previous experiences. Absent of a design team, my product and engineering partners were incredibly helpful in providing me the feedback and support necessary to effectively iterate on designs.