UX CASE STUDY

Project management app

Overview


The challenge

The challenge was to create a project management app, which at the time I was not familiar with.

The context

I was in charge of developing the app as part of my Career Foundry UX design course.

Timeline

4 months

My role

UX research, design and UI design

Tools

Pen and Paper, Sketch, Adobe Illustrator/Photoshop, InVision, Framer

Research and Analysis


What the internet says...

When I first dived into the challenge, I was quickly overwhelmed by the amount of project management apps out there. I started looking up online and I found plenty of forums with users’ reviews on current project management apps. Below are the main issues I noticed users encountered:

  • Too many features
  • Inability to see all projects at once
  • Lack of authority 
  • A chat option within the app
  • Lack of time tracking and reporting

A lot of people mentioned that they liked scrum and kanban board as an easy way to see and organize tasks.

Competitor analysis

I created a competitor analysis list comparing 3 competitors: Asana, Basecamp and Trello.

I broke down each competitor’s profile, marketing profile, core business, SWOT profile, UI/UX, content, design, and performance quality.

Based on this analysis, I defined Taskly’s main industry and target: Designers. My core customers are Art Directors, Graphic Designers/Motion Designers and UX/UI Designers as freelancers or working in small companies. I also made an MVP with core features which I redefined after doing a survey and setting up interviews.

What the surveys and interviews say

I created a survey to collect quantitative data in order to validate (or invalidate) customers needs and core features of Taskly’s MVP.

Hypothesis & Core Assumptions: Are current project management apps tools too complicated to adopt?

Insights:

  • My assumptions about adopting the Kanban methodology system, the ability to assign tasks and sub-tasks to multiple users, project overview 
 were validated.
  • 68% of the participants find their project management app’ tools too tedious and complicated.
  • Users didn’t express the need to have a chat/messaging option as they already use an outside source to communicate.
  • Most participants use more than one software to store project information which seems to have an impact on productivity.

From this survey, interviews and previous researches came Taskly’s MVP:

  • Calendar displaying tasks by priority (colored)
  • Assigning tasks to multiple users
  • Prioritizing tasks
  • Kanban board with drag and drop

"68% of the participants find their project management app’ tools too tedious and complicated."


User personas

I created 3 user personas of target customers based on real people to illustrate the core target audience, with focus on the major needs of the most important user groups.

Task models

I created a task model including descriptions of complex evaluation, controlled evaluation, and direct connection.

Customer experience map

I built a customer experience map for one of Taskly’s user personas to better understand users behavior.

Information architecture


Card sorting and site map

I conducted live and remote card sorting exercises (with optimalworkflow) which helped me generate the information architecture for the app.

Based on those results I created the sitemap.

Prototypes and wireframes


Paper prototypes

Paper prototypes helped me organized Taskly’s main features and solve various problems.

I started crafting simple paper prototypes and slowly moved to prototypes with slightly more detail.

Wireframes

Wireframes were created to validate and redefine Taskly’s core features. The wireframes went through iterations following user testing. My target audience really liked the simplicity of the design and the flow in general. Wireframes were then imported into InVision. This helped identify the user flow and its pain points. I tested again my wireframes with users.

Below are two examples of the iterations.

I modified the “New Task” icon as users were getting confused between the + sign to add a new project and the + sign to add a new task.

Users were getting confused with the + sign below the box to assign a new member. So instead I removed the + sign and a new box will appear after selecting one member.

I changed the order of the “Save” and “Cancel” buttons to follow the user flow and be consistent with the Native App. I also changed the term “Save” to “Create” as some users could not make the difference between the previous steps and the action of creating a task.

I moved the icons from bottom to right to allow more room for the pop-up windows.

Visual design and user testing


Responsive design

Desktop

iPad

iPhone 6/7

Native app

iPhone 6/7

UI kit

User testing

Click testing

The test was done using VerifyApp.

Test

Users were asked to click on where they would add a new task.

Result

All users clicked on the colored button.

Conclusion

This test confirmed the importance of having a colored button for a repetitive task in a busy interface.

A/B Testing

I set up an A/B test on the landing page to find out which version would prompt the user to sign up.

Hypothesis

Placing Header 2 above the Call-To-Action button will increase conversions.

Conclusion

Version A gave a better conversion rate with 60%.

Feedback

“Logo is clear and Simple.”

“The description is easier to read on the grey background”

“I like the full picture rather than the greyed out one”

“I liked this because it had more whitespace and the white
grid around your pictures”

Final UI designs

Native app UI

Taskly. Right at your fingertip.

An idea? Don't wait and jump right into it with Taskly app.