Back

Design Project Templates Feature

Role
Product Designer
Company
Taskworld
Timeline
Oct to Dec 2021
Platform
Web
Overview

Taskworld is a cloud-based collaboration platform designed to facilitate project and task management. It allows teams to assign, monitor progression, and measure performance.

Problem/Challenge
Users wasted time creating repetitive projects with the same sets of tasks and task lists. A copy project was suggested, but this impacts analytics data accuracy and can even get accidentally changed by mistake.
Outcome
The custom template becomes the top template users use for creating a project by 9% of new projects used a custom template.
Role
I worked closely with the product manager on analizing user feedback and crafting the solution until handover the designs to the development team
Key Skills
  • User Research
  • Figma wireframing and UI
  • FigJam
Background

The template feature has been one of the top 20 requests in Taskworld. Since this was such a highly requested feature, I was assigned this project to gain a better understanding of our user's needs. I worked in collaboration with the Product Manager to refine the core problems and propose a solution.

Research

I analyzed through all of the support tickets mentioning the request for a project template, and mapped the top requests below.

Affinity Mapping

After synthesizing the data via affinity mapping, we could see a similar theme of the issues users had with the project creation process. Most of the users needed the ability to create their own workflow as a template.

Key Insights
  • Most of the users are managers or team leaders who have to plan a project for their team members.
  • Users have to repeatedly create projects with the same set of tasklists and tasks every time they start a new project.
  • Our support team suggested our users to create a project as a template and duplicate a new project from it. However, the template project affects the accuracy of analytics.
  • Some members go to the template project and make changes to it because they don't know that the project is a template.
Competitor Analysis

I chose and compared the major competitors that have similar services and business models to Taskworld, aiming to find out what aspect we should consider for the template feature.

Design

We have been through several iterations for the template feature in terms of design, solution, and feasibility for the MVP. Due to a limited time frame and technical resources, we decided to go with a solution to save an existing project as a template and have a list of templates available for users when creating new projects.

Save to Template

The option to save a project to a template in the project settings.

Create a new project from a template

When users click on the new project button, they can choose a template they have created.

Manage templates

Users can manage their templates, including the ability to delete previously created templates.

Results

According to the data, the new feature has been used heavily compared with the starter templates we provided to the users.

Blank template has the most usage since it is the default selection. After introducing the custom template feature, it became the third highest-used option for creating a project.

Learnings

1. Understanding User Feedback

User feedback is a vital component of the design process. However, it's not just about blindly implementing every piece of feedback. It requires a deep understanding of users' needs, motivations, and pain points.

When we first introduced the copy project feature, it did not align with the users’ expectations. After conducting user research we were able to further refine the feature to address the user's core concerns.

2. Collaboration with Engineer

Collaborating with an engineering team is challenging, primarily related to time constraints and technical limitations. To address these challenges, I have learned these key insights.

  • Design Annotations: Providing detailed design annotations is crucial. They not only convey what the final design should look like but also how it should behave. I find that clear annotations can reduce misinterpretation and save time during development.
  • Min/Max Width and Height: Defining dimensions is essential for maintaining consistency. Engineers rely on these specifications to ensure that UI elements conform to any screen size.

I am delighted that my design has had a positive impact on addressing our user pain points and enhancing their overall experience according to the metrics.