Thorugh user feedback and competitor analysis, we identified that the legacy Teamwork's Resource Scheduler had become outdated and unintuitive. As the lead UI designer, I worked with a UX researcher, product manager, and developers to redesign the overall experience for our main persona.
Before
After
Teamwork’s Scheduler is a resource management tool that helps teams plan, allocate, and track work on a visual timeline. It enables managers to see staff availability, assign tasks, and balance workloads in real time, ensuring projects stay on track and resources are used efficiently.
Through user feedback gathered via Pendo analytics, we discovered that users found the interface unintuitive and difficult to navigate. Additionally, a competitor analysis revealed that Teamwork’s scheduling tool lacked essential features that modern users expected.
To better understand pain points, I worked closely with a UX researcher to analyze those qualitative data and had some insights on both user and business needs.
User insights
Using Pendo analytics and user interviews carried (the latter carried out by the project manager), we learned that:
Business Insights
Our assumption that our timeline was dated was confirmed through a competitor analysis, we learned that:
At Teamwork.com, we had well-defined personas, and for the Resource Scheduler redesign, Olivia (Operations Manager, Project Manager, or Resource Manager) was our primary user. She is responsible for ensuring that projects have sufficient resources throughout the year, planning ahead to allocate time effectively to staff, and identifying potential resource gaps before they become issues.
Olivia's persona profile.
One of Olivia's top jobs aligned directly with Resource Scheduler's jobs.
With Olivia in mind, we proceeded to define some jobs to be done to guide our next steps. Through some workshop sessions, these were the final JTBD:
Since we were improving an existing feature rather than designing the timeline from scratch, we skipped low-fidelity sketches and I jumped straight into an interface audit to identify usability issues, address technical debt, and find opportunities to enhance Olivia’s overall experience.
Here's a snapshop of my UI audit and recommendations. Always keeping in mind business and user insights and Olivia's JTBD.
Before
After
Before
After
Before
After
To ensure that our assumptions, analysis and recommendations were correct, we conducted a series of user tests to validate our choices.
For this one in particular, I focused on validating the interaction for adding a new project or user to the timeline, assessing whether it was intuitive and easy to find the call to action.
The results were positive, confirming that users found the process straightforward and accessible.
In Maze, I designed a prototype test, with clear tasks to be followed and a desired path that users should follow. 92% of users followed the intended path.
A follow up question confirmed that 86% of the users found the action intuitive to complete.
With the redesign phase complete, I prepared a handover document communicating all changes and giving detailed guidance on UI implementation using internal conventions to identify when existing components and design tokens should be applied.
Developers had access to our main Figma file, being able to ask questions and make suggestions. This makes the communication between designers and devs very efficient.
Timeline sizing, margin, paddings
With a complex grid, I pointed out measurements for days, weekends, row heights and separators. In we can see references to design tokens.
Top insight bar
Outlining design details for top insight bar, such as spacings and design tokens.
Cursor interactions
Showing how elements should react to cursor interactions.
Allocation bar and details popover
Specification with design tokens and components.
Flow of expanding and collapsing the insights bar
Example of a flow explaining how the expand/collapse for insights bar should work.
And much more...
Very rarely is product design ever finished with the first release. This time was no different.
We learned through user feedback and customer support tickets, that users were craving for a way to group information by user roles. For example: filter and/or group users by "Designers" or "Developers".
The sketch below was handed over to me and my task this time was to translate the wireframes into high fidelity designs. Again, keeping in mind the Teamwork's design system library.
Provided wireframe
Final high fidelity design
In this recording we're adding a time allocation to a user and later adjusting its start and end date using a drag and drop interaction.
Any questions or eager to see more?
If you have any questions or would like to get more in-depth on any of the above, I will be happy to share more details with you. 😊
