Streamlining PM Workflows Increasing KPIs by 20%
Streamlining PM Workflows Increasing KPIs by 20%
Overview
Fundvis is a B2B SaaS Project Management platform dedicated to providing an all-in-one solution for managing and creating financial funds. In 2023, Fundvis earned the ‘Most Promising Financial Startup’ award at the 'European Finance Summit’.
Challenge
In response to critical customer feedback on the previous version of their task flow, and to incorporate new features, Fundvis faced the challenge of redesign the 'task details flow' of their app. This project demanded a thoughtful and analytical approach, catering to the diverse user groups supported by the platform.
Role
As Design Lead for this project I directed and executed all design activities, conducted evaluative user research and worked collaboratively with the product owner and developers to achieve our goals.
Client Fundvis
Industry Fintech
Project lenght 3 weeks
Tools Figma, Notion, Jira
Team
Me / Product Designer
Leonhard K / Product Owner
Flavio R / Frontend Engineer
Mattia R / Frontend Engineer
Ciprian O / Backend Engineer
Design approach
In order to guide my design process, I decided to use the double diamond framework.
1
Discovery stage
Understanding the key pain points associated with the previous flow and align them with the business goals. This involved:
Critical customer feedback analysis
Business goals definition
Moderated usability testing sessions
2
Definition stage
Filtering through all the information to define challenge and consequent design opportunities. This involved:
Evaluative research analysis
Key pain points definition
3
Development stage
Collaborating with the development team ensured me to fully understand the technical feasibility of my ideas at an early stage. This involved:
Competitive analysis
Flowchart definition
Wire-framing
Feedback sessions with the team
Hi Fi prototyping
4
Delivery stage
Testing out the Hi Fi prototype at a small scale and iterating depending on customers feedback. This involved:
Prototype testing
Hi Fi finalization and documentation
Delivery to the development team
Starting point
Multiple instances of critical customer feedback highlighted usability issues with the task details.
LP
Hey guys, can you please make the objectives more clear in the task details?🙏 Completing a task is SO TIME CONSUMING otherwise, like I don't understand what I have to work on and many times my task is declined because of it... Thanks. Lucas.
JK
The comment section feels a bit useless. Nobody from our team really uses it.
Business goals
In collaboration with the business team and the product owner, we identified three primary business goals.
1
Improve time on task for 'pending' and 'in progress' statuses
Decrease the task completion time for tasks with 'pending' and 'in progress' statuses, making the overall flow more efficient and improving the user experience.
2
Unify comments and updates
Improve the current commenting experience, making it consistent and easy to use. Visualise the task updates in it.
3
Introduce a new multi-user task collaboration feature
Enabling up to ten users to work on the same task. Previously just one user could work on each task.
Key Performance Indicators (KPIs)
Three KPIs were measured within tasks in the previous flow and targeted for improvement in the new design.
Behavioural UX KPIs
Time on task: Measure task progression time (e.g., 'In Progress' to 'In Review' and 'In Review' to 'Completed') using analytics to optimize user journey efficiency
Task success rate: Assess user goal achievement without errors to gauge overall usability and identify areas for improvement.
Attitudinal UX KPIs
Overall Customer Satisfaction Score (CSAT)
Discovery stage
To support business goals, I identified the critical user pain points through evaluative user research.
Research questions
Why do users spend so much time on each task?
Do users feel disconnected from the team in the context of each task? If so, why?
What is the relationship between the task success rate and the current UI?
Methodology
I opted for moderated usability testing as my research method to assess the previous flow and measure the KPIs established during the business goal definition. This qualitative approach was chosen due to time and budget constraints, as it provided a comprehensive understanding of the task flow's usability.
Participant selection
I selected participants from Fundvis's existing user base to represent diverse demographics, including age, gender, location, and profession. This approach aimed to ensure that the test results closely matched real-world usage and aligned with the application's user personas.
Conducting
The tests were conducted remotely using Zoom. Each session involved participants completing both exploratory and specific tasks at different stages within the task flow while thinking aloud. The sessions were recorded for later analysis. Following a pilot test, all five tests were conducted over a few days.
Synthesis
The analysis of recorded tests guided the creation of user journey maps for each user type supported by the platform. This process was instrumental in identifying usability pain points within the old task flow, particularly for the three distinct user typologies, each represented in its own user journey.
Definition stage
Following the discovery stage, I sifted through the information and identified all customer pain points, highlighting the most critical ones.
1
Confusing and hard-to-use commenting UX
Lack of task history made it challenging to link comments to specific actions.
No tagging or direct messaging, causing uncertainty about recipients.
2
Unclear information hierarchy and navigation
Ambiguous information hierarchy and navigation led to task execution confusion.
Resulted in increased task completion times and lower success rates.
3
Ambiguous 'pending task' flow for project managers
Project managers found it challenging to assign tasks, set deadlines, and track task updates.
This led to project managers seeking information on other messaging platforms.
Design Strategy
Due to time and development constraints, I strategically prioritized what to design, reserving the remaining aspects for future releases.
1
Tackling first business goal: Improve time on task
This would involved the restructuring of the information hierarchy of tasks. The objective was to enhance the clarity of tasks, ultimately reducing the time it takes to complete them.
2
Tackling second business goal: Unify comments and updates
In this step, there would be a comprehensive overhaul of the user experience and messaging on Fundvis. This included implementing task history and introducing user tagging. Additionally, the goal was to make all task collaborators visible to clarify who receives notifications regarding new comments on the task.
3
Tackling third business goal: Introduce a new multi-user task collaboration feature
This step would entail redesigning the UI for task assignee visualization. It also involved creating a new submission form for users, featuring statuses that track the progress of each user's submission.
4
Tackling Critical pain point found during evaluative research: Confusing 'pending task' flow for project managers
Addressing the challenge project managers faced with collaboration on Fundvis, this step focused on redesigning the UX of the 'pending task.' New features would need to be implemented, such as the ability to modify deadlines and assignees in tasks in progress, along with the addition of task history.
Development stage
Collaborating with the development team during Low-Fidelity prototyping allowed me to grasp the technical feasibility of my ideas early on.
Competitive Analysis
The development phase started with a competitive analysis of similar project management solutions. This analysis inspired the new UI/UX and refined solutions from the pain point analysis.
Task Journey Flow Chart and feedback
I created a flow chart depicting interactions for three user types (Power User, Working User, Executive User) to complete tasks. This flow incorporated new features and served as a precursor to low-fidelity development, facilitating team discussions on technical constraints, UX suggestions, and feedback.
Sketching and Wireframing
Following development team feedback on the user journey, I created detailed wireframes to lay the foundation for the final design.
High Fidelity prototyping
Prototyping and improving the product performance through usability testing.
Hi-Fi Explorations on Figma
I leveraged the design system I had previously established over the past months as a reference and foundation. It's worth noting that not all sections were updated with the new design system at that time. By utilizing a constrained set of components, I streamlined the high-fidelity design process, anticipating a corresponding acceleration in frontend development by the engineering team.
Moderated testing and iteration
Finally, it was time to test the solutions, focusing on usability and measuring the KPIs established at the project's outset. The results highlighted the need to make certain changes to enhance the clarity of both the flow and UI, such as addressing unclear UI elements and accessibility problems with the font sizes of tags. These insights were incorporated into the final prototype, visible in the images below.
Upon finalizing the user interface and all interactions, I proceeded to generate comprehensive documentation to share with the team, ensuring a smooth and informed development process.
Positive impact
After launching the update, our focus shifted to collecting user feedback and monitoring key metrics.
84%
Task success rate, compared to 62% average of before. Measured across four key user tasks identified for analysis.
↑20%
Increase of the number of comments per task, thanks to the new tagging feature and the task history implementation. Overall decrease of leakage of customers to other messengers.
4.5/5
Avg. rating (CSAT) for the new page from qual study (52 users).
Design approach
In order to guide my design process, I decided to use the double diamond framework.
1
Discovery stage
Understanding the key pain points associated with the previous flow and align them with the business goals. This involved:
Critical customer feedback analysis
Business goals definition
Moderated usability testing sessions
2
Definition stage
Filtering through all the information to define challenge and consequent design opportunities. This involved:
Evaluative research analysis
Key pain points definition
3
Development stage
Collaborating with the development team ensured me to fully understand the technical feasibility of my ideas at an early stage. This involved:
Competitive analysis
Flowchart definition
Wire-framing
Feedback sessions with the team
Hi Fi prototyping
4
Delivery stage
Testing out the Hi Fi prototype at a small scale and iterating depending on customers feedback. This involved:
Prototype testing
Hi Fi finalization and documentation
Delivery to the development team
Starting point
Multiple instances of critical customer feedback highlighted usability issues with the task details.
LP
Hey guys, can you please make the objectives more clear in the task details?🙏 Completing a task is SO TIME CONSUMING otherwise, like I don't understand what I have to work on and many times my task is declined because of it... Thanks. Lucas.
JK
The comment section feels a bit useless. Nobody from our team really uses it.
Business goals
In collaboration with the business team and the product owner, we identified three primary business goals.
1
Improve time on task for 'pending' and 'in progress' statuses
Decrease the task completion time for tasks with 'pending' and 'in progress' statuses, making the overall flow more efficient and improving the user experience.
2
Unify comments and updates
Improve the current commenting experience, making it consistent and easy to use. Visualise the task updates in it.
3
Introduce a new multi-user task collaboration feature
Enabling up to ten users to work on the same task. Previously just one user could work on each task.
Key Performance Indicators (KPIs)
Three KPIs were measured within tasks in the previous flow and targeted for improvement in the new design.
Behavioural UX KPIs
Time on task: Measure task progression time (e.g., 'In Progress' to 'In Review' and 'In Review' to 'Completed') using analytics to optimize user journey efficiency
Task success rate: Assess user goal achievement without errors to gauge overall usability and identify areas for improvement.
Attitudinal UX KPIs
Overall Customer Satisfaction Score (CSAT)
Discovery stage
To support business goals, I identified the critical user pain points through evaluative user research.
Research questions
Why do users spend so much time on each task?
Do users feel disconnected from the team in the context of each task? If so, why?
What is the relationship between the task success rate and the current UI?
Methodology
I opted for moderated usability testing as my research method to assess the previous flow and measure the KPIs established during the business goal definition. This qualitative approach was chosen due to time and budget constraints, as it provided a comprehensive understanding of the task flow's usability.
Participant selection
I selected participants from Fundvis's existing user base to represent diverse demographics, including age, gender, location, and profession. This approach aimed to ensure that the test results closely matched real-world usage and aligned with the application's user personas.
Conducting
The tests were conducted remotely using Zoom. Each session involved participants completing both exploratory and specific tasks at different stages within the task flow while thinking aloud. The sessions were recorded for later analysis. Following a pilot test, all five tests were conducted over a few days.
Synthesis
The analysis of recorded tests guided the creation of user journey maps for each user type supported by the platform. This process was instrumental in identifying usability pain points within the old task flow, particularly for the three distinct user typologies, each represented in its own user journey.
Definition stage
Following the discovery stage, I sifted through the information and identified all customer pain points, highlighting the most critical ones.
1
Confusing and hard-to-use commenting UX
Lack of task history made it challenging to link comments to specific actions.
No tagging or direct messaging, causing uncertainty about recipients.
2
Unclear information hierarchy and navigation
Ambiguous information hierarchy and navigation led to task execution confusion.
Resulted in increased task completion times and lower success rates.
3
Ambiguous 'pending task' flow for project managers
Project managers found it challenging to assign tasks, set deadlines, and track task updates.
This led to project managers seeking information on other messaging platforms.
Design Strategy
Due to time and development constraints, I strategically prioritized what to design, reserving the remaining aspects for future releases.
1
Tackling first business goal: Improve time on task
This would involved the restructuring of the information hierarchy of tasks. The objective was to enhance the clarity of tasks, ultimately reducing the time it takes to complete them.
2
Tackling second business goal: Unify comments and updates
In this step, there would be a comprehensive overhaul of the user experience and messaging on Fundvis. This included implementing task history and introducing user tagging. Additionally, the goal was to make all task collaborators visible to clarify who receives notifications regarding new comments on the task.
3
Tackling third business goal: Introduce a new multi-user task collaboration feature
This step would entail redesigning the UI for task assignee visualization. It also involved creating a new submission form for users, featuring statuses that track the progress of each user's submission.
4
Tackling Critical pain point found during evaluative research: Confusing 'pending task' flow for project managers
Addressing the challenge project managers faced with collaboration on Fundvis, this step focused on redesigning the UX of the 'pending task.' New features would need to be implemented, such as the ability to modify deadlines and assignees in tasks in progress, along with the addition of task history.
Development stage
Collaborating with the development team during Low-Fidelity prototyping allowed me to grasp the technical feasibility of my ideas early on.
Competitive Analysis
The development phase started with a competitive analysis of similar project management solutions. This analysis inspired the new UI/UX and refined solutions from the pain point analysis.
Task Journey Flow Chart and feedback
I created a flow chart depicting interactions for three user types (Power User, Working User, Executive User) to complete tasks. This flow incorporated new features and served as a precursor to low-fidelity development, facilitating team discussions on technical constraints, UX suggestions, and feedback.
Sketching and Wireframing
Following development team feedback on the user journey, I created detailed wireframes to lay the foundation for the final design.
High Fidelity prototyping
Prototyping and improving the product performance through usability testing.
Hi-Fi Explorations on Figma
I leveraged the design system I had previously established over the past months as a reference and foundation. It's worth noting that not all sections were updated with the new design system at that time. By utilizing a constrained set of components, I streamlined the high-fidelity design process, anticipating a corresponding acceleration in frontend development by the engineering team.
Moderated testing and iteration
Finally, it was time to test the solutions, focusing on usability and measuring the KPIs established at the project's outset. The results highlighted the need to make certain changes to enhance the clarity of both the flow and UI, such as addressing unclear UI elements and accessibility problems with the font sizes of tags. These insights were incorporated into the final prototype, visible in the images below.
Upon finalizing the user interface and all interactions, I proceeded to generate comprehensive documentation to share with the team, ensuring a smooth and informed development process.
Positive impact
After launching the update, our focus shifted to collecting user feedback and monitoring key metrics.
84%
Task success rate, compared to 62% average of before. Measured across four key user tasks identified for analysis.
↑20%
Increase of the number of comments per task, thanks to the new tagging feature and the task history implementation. Overall decrease of leakage of customers to other messengers.
4.5/5
Avg. rating (CSAT) for the new page from qual study (52 users).
Design approach
In order to guide my design process, I decided to use the double diamond framework.
1
Discovery stage
Understanding the key pain points associated with the previous flow and align them with the business goals. This involved:
Critical customer feedback analysis
Business goals definition
Moderated usability testing sessions
2
Definition stage
Filtering through all the information to define challenge and consequent design opportunities. This involved:
Evaluative research analysis
Key pain points definition
3
Development stage
Collaborating with the development team ensured me to fully understand the technical feasibility of my ideas at an early stage. This involved:
Competitive analysis
Flowchart definition
Wire-framing
Feedback sessions with the team
Hi Fi prototyping
4
Delivery stage
Testing out the Hi Fi prototype at a small scale and iterating depending on customers feedback. This involved:
Prototype testing
Hi Fi finalization and documentation
Delivery to the development team
Starting point
Multiple instances of critical customer feedback highlighted usability issues with the task details.
LP
Hey guys, can you please make the objectives more clear in the task details?🙏 Completing a task is SO TIME CONSUMING otherwise, like I don't understand what I have to work on and many times my task is declined because of it... Thanks. Lucas.
JK
The comment section feels a bit useless. Nobody from our team really uses it.
Business goals
In collaboration with the business team and the product owner, we identified three primary business goals.
1
Improve time on task for 'pending' and 'in progress' statuses
Decrease the task completion time for tasks with 'pending' and 'in progress' statuses, making the overall flow more efficient and improving the user experience.
2
Unify comments and updates
Improve the current commenting experience, making it consistent and easy to use. Visualise the task updates in it.
3
Introduce a new multi-user task collaboration feature
Enabling up to ten users to work on the same task. Previously just one user could work on each task.
Key Performance Indicators (KPIs)
Three KPIs were measured within tasks in the previous flow and targeted for improvement in the new design.
Behavioural UX KPIs
Time on task: Measure task progression time (e.g., 'In Progress' to 'In Review' and 'In Review' to 'Completed') using analytics to optimize user journey efficiency
Task success rate: Assess user goal achievement without errors to gauge overall usability and identify areas for improvement.
Attitudinal UX KPIs
Overall Customer Satisfaction Score (CSAT)
Discovery stage
To support business goals, I identified the critical user pain points through evaluative user research.
Research questions
Why do users spend so much time on each task?
Do users feel disconnected from the team in the context of each task? If so, why?
What is the relationship between the task success rate and the current UI?
Methodology
I opted for moderated usability testing as my research method to assess the previous flow and measure the KPIs established during the business goal definition. This qualitative approach was chosen due to time and budget constraints, as it provided a comprehensive understanding of the task flow's usability.
Participant selection
I selected participants from Fundvis's existing user base to represent diverse demographics, including age, gender, location, and profession. This approach aimed to ensure that the test results closely matched real-world usage and aligned with the application's user personas.
Conducting
The tests were conducted remotely using Zoom. Each session involved participants completing both exploratory and specific tasks at different stages within the task flow while thinking aloud. The sessions were recorded for later analysis. Following a pilot test, all five tests were conducted over a few days.
Synthesis
The analysis of recorded tests guided the creation of user journey maps for each user type supported by the platform. This process was instrumental in identifying usability pain points within the old task flow, particularly for the three distinct user typologies, each represented in its own user journey.
Definition stage
Following the discovery stage, I sifted through the information and identified all customer pain points, highlighting the most critical ones.
1
Confusing and hard-to-use commenting UX
Lack of task history made it challenging to link comments to specific actions.
No tagging or direct messaging, causing uncertainty about recipients.
2
Unclear information hierarchy and navigation
Ambiguous information hierarchy and navigation led to task execution confusion.
Resulted in increased task completion times and lower success rates.
3
Ambiguous 'pending task' flow for project managers
Project managers found it challenging to assign tasks, set deadlines, and track task updates.
This led to project managers seeking information on other messaging platforms.
Design Strategy
Due to time and development constraints, I strategically prioritized what to design, reserving the remaining aspects for future releases.
1
Tackling first business goal: Improve time on task
This would involved the restructuring of the information hierarchy of tasks. The objective was to enhance the clarity of tasks, ultimately reducing the time it takes to complete them.
2
Tackling second business goal: Unify comments and updates
In this step, there would be a comprehensive overhaul of the user experience and messaging on Fundvis. This included implementing task history and introducing user tagging. Additionally, the goal was to make all task collaborators visible to clarify who receives notifications regarding new comments on the task.
3
Tackling third business goal: Introduce a new multi-user task collaboration feature
This step would entail redesigning the UI for task assignee visualization. It also involved creating a new submission form for users, featuring statuses that track the progress of each user's submission.
4
Tackling Critical pain point found during evaluative research: Confusing 'pending task' flow for project managers
Addressing the challenge project managers faced with collaboration on Fundvis, this step focused on redesigning the UX of the 'pending task.' New features would need to be implemented, such as the ability to modify deadlines and assignees in tasks in progress, along with the addition of task history.
Development stage
Collaborating with the development team during Low-Fidelity prototyping allowed me to grasp the technical feasibility of my ideas early on.
Competitive Analysis
The development phase started with a competitive analysis of similar project management solutions. This analysis inspired the new UI/UX and refined solutions from the pain point analysis.
Task Journey Flow Chart and feedback
I created a flow chart depicting interactions for three user types (Power User, Working User, Executive User) to complete tasks. This flow incorporated new features and served as a precursor to low-fidelity development, facilitating team discussions on technical constraints, UX suggestions, and feedback.
Sketching and Wireframing
Following development team feedback on the user journey, I created detailed wireframes to lay the foundation for the final design.
High Fidelity prototyping
Prototyping and improving the product performance through usability testing.
Hi-Fi Explorations on Figma
I leveraged the design system I had previously established over the past months as a reference and foundation. It's worth noting that not all sections were updated with the new design system at that time. By utilizing a constrained set of components, I streamlined the high-fidelity design process, anticipating a corresponding acceleration in frontend development by the engineering team.
Moderated testing and iteration
Finally, it was time to test the solutions, focusing on usability and measuring the KPIs established at the project's outset. The results highlighted the need to make certain changes to enhance the clarity of both the flow and UI, such as addressing unclear UI elements and accessibility problems with the font sizes of tags. These insights were incorporated into the final prototype, visible in the images below.
Upon finalizing the user interface and all interactions, I proceeded to generate comprehensive documentation to share with the team, ensuring a smooth and informed development process.
Positive impact
After launching the update, our focus shifted to collecting user feedback and monitoring key metrics.
84%
Task success rate, compared to 62% average of before. Measured across four key user tasks identified for analysis.
↑20%
Increase of the number of comments per task, thanks to the new tagging feature and the task history implementation. Overall decrease of leakage of customers to other messengers.
4.5/5
Avg. rating (CSAT) for the new page from qual study (52 users).