All Case Studies

Post a Task

Post a Task

Post a Task

Users (aka. Posters) can post their task within the Taskpin platform to be done by the professionals (aka. Taskers).

What is Taskpin?

Tools

Figma, Hotjar, Meet, Jira

Role

Product Designer

Timeframe

1 month

Preview

taskpin.ca/post-task

Study Overview

Problem Statement

The Post a Task process had numerous issues, making it confusing and difficult to complete. There were too many steps without any hints, preventing users from successfully posting their tasks.

Study Goals

In this case study, I aimed to revamp the "Post a Task" process to make it efficient, easy to understand, and less error-prone, helping Taskpin users post their tasks with minimal complications.

Solution Impact

Since I redesigned the entire process, we initially experienced a significant improvement.

22%

Improvement in Task Completion Rate

22%

Improvement in Task Completion Rate

22%

Improvement in Task Completion Rate

My Role

As a product designer, I work closely with the product team to identify user challenges, communicate design solutions, prioritize outcomes, lead the design process, and align expectations with development teams.

Taskpin Story

Suggested Article

Read a full overview of Taskpin to learn about my contributions and how I collaborate with the team.

Read the Story

Taskpin Story

Suggested Article

Read a full overview of Taskpin to learn about my contributions and how I collaborate with the team.

Read the Story

Taskpin Story

Suggested Article

Read a full overview of Taskpin to learn about my contributions and how I collaborate with the team.

Read the Story

  1. Discover the Challenge

Behavioral analysis

Using Google Analytics & Hotjar

Using Google Analytics reports, I identified our step-by-step Abandonment Rate, which led me to analyze user behavior in the flow by reviewing Hotjar recorded sessions.

4

4

Inefficient or no messages for feedback on input error.

1

1

Too many text fields in one page.

The ‘Next’ button remains disabled without a color change until sufficient text is entered, resulting in frustration and frequent ‘rage clicks’ on both the step bar and the button.

5

5

Some users overlook the character count indicator, while those who do notice it often struggle with creating sufficient content.

3

3

2

2

Users are encountering issues with character limits in the task title and description fields, where inputs are highlighted in red if they are too short.

1

2

3

4

5

1

It’s unclear to users how many attachments they can upload. The limit is set to 8 files, but no assistive text is provided.

3

3

1

1

Technically, this is the second step, but it’s placed as the first step, which has caused confusion for some users.

2

2

Based on the product roadmap, we decided to discontinue this feature.

3

2

3

2

3

2

1

3

2

1

The ‘Next’ button remains disabled without a color change until sufficient text is entered, resulting in frustration and frequent ‘rage clicks’ on both the step bar and the button.

3

3

Users are restricted to selecting dates within a two-week timeframe.

2

2

1

1

This field is mandatory, yet it is incorrectly marked as optional, leading to user confusion.

1

2

1

2

The ‘Next’ button remains disabled without a color change until sufficient text is entered, resulting in frustration and frequent ‘rage clicks’ on both the step bar and the button.

2

2

1

1

Users are often unsure about the budget required for their task, leading to a higher bounce rate at this step compared to others.

4

4. Inefficient or no messages for feedback on input error.

1

1. Too many text fields in one page.

5. The ‘Next’ button remains disabled without a color change until sufficient text is entered, resulting in frustration and frequent ‘rage clicks’ on both the step bar and the button.

5

3. Some users overlook the character count indicator, while those who do notice it often struggle with creating sufficient content.

3

2

2. Users are encountering issues with character limits in the task title and description fields, where inputs are highlighted in red if they are too short.

1

2

3

4

5

1

2. It’s unclear to users how many attachments they can upload. The limit is set to 8 files, but no assistive text is provided.

3

1

1. Technically, this is the second step, but it’s placed as the first step, which has caused confusion for some users.

2

3. Based on the product roadmap, we decided to discontinue this feature.

3

2

3

2

1

3. The ‘Next’ button remains disabled without a color change until sufficient text is entered, resulting in frustration and frequent ‘rage clicks’ on both the step bar and the button.

3

2. Users are restricted to selecting dates within a two-week timeframe.

2

1

1. This field is mandatory, yet it is incorrectly marked as optional, leading to user confusion.

1

2

2. The ‘Next’ button remains disabled without a color change until sufficient text is entered, resulting in frustration and frequent ‘rage clicks’ on both the step bar and the button.

2

1

1. Users are often unsure about the budget required for their task, leading to a higher bounce rate at this step compared to others.

Usability Test

Using Loopback

To identify pain points in our ‘Post a Task’ flow, I planned and conducted a usability test with four users.

The process felt overwhelming, and I gave up

Posting my task took too long

I couldn’t figure out what was wrong with the form

As a first-time user, I had no idea how to set a budget for my task

  1. Define the Problem

User Journey Map

Based on behavioral analysis and usability test data, I created a user journey map to highlight users’ emotions at each stage of the process.

User Interview

The other persona in our product is the individual who makes an offer for a task (aka Tasker). To deepen our understanding, I conducted several interviews with Taskers to learn what is important to them when searching for tasks.

Will • Mechanic

Will • Mechanic

Will is a full-time mechanic in Toronto. He gained experience with online platforms during COVID but prefers not to use them as his first option.

Will is a full-time mechanic in Toronto. He gained experience with online platforms during COVID but prefers not to use them as his first option.

Will is a full-time mechanic in Toronto. He gained experience with online platforms during COVID but prefers not to use them as his first option.

Mary works as a cleaner and previously used an app to find clients, but she’s dissatisfied with the experience.

Mary works as a cleaner and previously used an app to find clients, but she’s dissatisfied with the experience.

Mary works as a cleaner and previously used an app to find clients, but she’s dissatisfied with the experience.

"The task prices just don’t seem fair to me."

"The task prices just don’t seem fair to me."

"The task prices just don’t seem fair to me."

There are tons of offers for each task, so it's tough to actually land one. I end up having to talk to a bunch of clients just to clear up the details, and it eats up a lot of my time.

There are tons of offers for each task, so it's tough to actually land one. I end up having to talk to a bunch of clients just to clear up the details, and it eats up a lot of my time.

There are tons of offers for each task, so it's tough to actually land one. I end up having to talk to a bunch of clients just to clear up the details, and it eats up a lot of my time.

I have to send my offer before I can even talk to the job owner and clear up the details.

I have to send my offer before I can even talk to the job owner and clear up the details.

I have to send my offer before I can even talk to the job owner and clear up the details.

I have to spend a lot of time figuring out what the client wants and getting all the task details sorted.

I have to spend a lot of time figuring out what the client wants and getting all the task details sorted.

I have to spend a lot of time figuring out what the client wants and getting all the task details sorted.

Mary • Cleaner

Mary • Cleaner

Mary • Cleaner

Research Findings

I've organized my findings on these sticky notes.

Possible Solutions

The following cards outlined two possible approaches to tackle the challenge. Since our goal was to increase the Task Completion Rate for our users, I decided to proceed with the second approach.

Optimize the Existing Design

Focus on addressing user challenges within the current design framework by enhancing various parameters to make the process more user-friendly.

Pros

  • Requires less development time

  • Involves minimal design work, allowing quicker deployment

Cons

  • May still result in poor UX if users’ needs and backgrounds are not fully addressed

  • Some new research findings might not be feasible to implement within the existing structure

Restructure the Process

Completely redesign the “Post a Task” process by rethinking the order of elements and gathering more relevant information from users.

Pros

  • Allows the process to be redefined based on fresh research and user insights.

  • Provides opportunities to deliver a more intuitive and effective UI/UX experience.

Cons

  • Requires significant time and effort for research, ideation, and development.

  • Could delay implementation compared to optimizing the existing design.

  1. Craft new Solution

Wireframing

After gathering all the data, I designed a low-fidelity wireframe template for all steps, reflecting the key user expectations. The sticky notes indicate the reason behind these changes.

4

4

Assistive text can help users input information more easily.

1

1

The step title indicates the user's location within the process.

2

2

The progress bar indicates how far the user has proceeded in the process.

3

3

A single question helps the user focus and reduces their cognitive load. It also simplifies error handling, as the user understands that the error is related only to this step.

Heuristic Evaluation

I conducted a heuristic evaluation using Nielsen and Norman’s 10 usability heuristics for user interface design to address potential shortcomings.

The flow starts with high cognitive load tasks, making the initial steps difficult to complete.

The flow starts with high cognitive load tasks, making the initial steps difficult to complete.

The flow starts with high cognitive load tasks, making the initial steps difficult to complete.

Each step asks one question to keep the user focused and make the process simple to follow.

Each step asks one question to keep the user focused and make the process simple to follow.

Each step asks one question to keep the user focused and make the process simple to follow.

Aesthetic and Minimalist Design

I focused the content and visual design of the UI on the essential elements, asking one question per step to keep the flow simple and easy to understand.

Aesthetic and Minimalist Design

I focused the content and visual design of the UI on the essential elements, asking one question per step to keep the flow simple and easy to understand.

Match between the system and real world

Users should not feel uncertain or overlooked. They shouldn’t be forced to seek explanations elsewhere or leave the platform to complete their task.

Match between the system and real world

Users should not feel uncertain or overlooked. They shouldn’t be forced to seek explanations elsewhere or leave the platform to complete their task.

Users were required to enter an exact number in the budget input field.

Users were required to enter an exact number in the budget input field.

Users were required to enter an exact number in the budget input field.

Offering a budget range for posters to select, along with an option to enter an exact number, accommodates their preference and leaves room for negotiation.

Offering a budget range for posters to select, along with an option to enter an exact number, accommodates their preference and leaves room for negotiation.

Offering a budget range for posters to select, along with an option to enter an exact number, accommodates their preference and leaves room for negotiation.

The flow begins with high cognitive load tasks, making the description field difficult to complete.

The flow begins with high cognitive load tasks, making the description field difficult to complete.

The flow begins with high cognitive load tasks, making the description field difficult to complete.

The task description field was moved to the end of the flow, with added tips to assist users in completing it.

The task description field was moved to the end of the flow, with added tips to assist users in completing it.

The task description field was moved to the end of the flow, with added tips to assist users in completing it.

Error Prevention

I prioritized simplifying the flow by addressing high-effort tasks and preventing costly errors early on to reduce user frustration

Error Prevention

I prioritized simplifying the flow by addressing high-effort tasks and preventing costly errors early on to reduce user frustration

Recognition Rather than Recall

Users should not have to remember information from one part of the interface. It’s important to minimize this and provide contextual help where needed.

Recognition Rather than Recall

Users should not have to remember information from one part of the interface. It’s important to minimize this and provide contextual help where needed.

Before posting a task, users are presented with a summary of the information they have entered.

Before posting a task, users are presented with a summary of the information they have entered.

At the end of the flow, a congratulatory message is displayed.

At the end of the flow, a congratulatory message is displayed.

At the end of the flow, a congratulatory message is displayed.

Help Users Recognize, Diagnose, and Recover from Errors

Error messages should be expressed in plain language (no error codes), precisely indicate the problem, and constructively suggest a solution.

Help Users Recognize, Diagnose, and Recover from Errors

Error messages should be expressed in plain language (no error codes), precisely indicate the problem, and constructively suggest a solution.

The error messages only highlighted the issue without providing guidance on how users could resolve it.

The error messages only highlighted the issue without providing guidance on how users could resolve it.

The error messages only highlighted the issue without providing guidance on how users could resolve it.

Error messages inform users of the issue and provide guidance on how to resolve it.

Error messages inform users of the issue and provide guidance on how to resolve it.

  1. Deliver new Designs

Visual Design

Mobile Version

Given that most of our users access the platform via mobile devices, we adopted a mobile-first design approach.

Visual Design

Desktop Version

The fresh look and feel of the desktop version offers a new and improved experience for our users.

Recap

Design Impact

After implementing improvements, we achieved about a 22% increase in form completion rates by:

Simplified Steps

Reduced the number of fields per step and provided clear labels.

Real-time Errors

Added real-time feedback for form field errors.

Intuitive Input Types

Made the UI more intuitive by using suitable input types for each field.

User Needs Interviews

Interviewed Posters and Taskers to understand their needs.

New User Journey Map

After implementing improvements, I developed a new user journey map to capture users’ emotions at each stage of the redesigned process.

End of First Iteration

This is the first iteration of the Post a Task process.

Next Iterations

Generative AI

Based on our interviews, one obstacle that prevents users from posting their tasks is adding details. They have no clue where to start. I took advantage of Gen AI to provide a starting point, which they can then edit based on their context.

Project Page

Taskpin Story: How a Failed Product Achieved Product-Market Fit

Project Page

Taskpin Story: How a Failed Product Achieved Product-Market Fit

Project Page

Taskpin Story: How a Failed Product Achieved Product-Market Fit

Next Case Study

Taskpin Design System: Boosting Efficiency and Consistency

Next Case Study

Taskpin Design System: Boosting Efficiency and Consistency

Next Case Study

Taskpin Design System: Boosting Efficiency and Consistency

Do you have any questions?

If you’d like to know more about this case study, let’s chat!

Schedule a call

Let's Connect

Do you have any questions?

If you’d like to know more about this case study, let’s chat!

Schedule a call

Let's Connect

Do you have any questions?

If you’d like to know more about this case study, let’s chat!

Schedule a call

Let's Connect

Hussein Shirvani

Buy me a coffee

Hussein Shirvani

Buy me a coffee

Hussein Shirvani

Buy me a coffee