Create tasks from your conversations, delegate them if needed and monitor their progress.
I was asked to design a simple project management app that lets users set up free accounts, add team members, create projects, and manage basic timelines and statuses per project. They hope a visually appealing tool with necessary features will persuade individuals, freelancers, and small companies to use our tool to do their works.
This is an Interaction Design Foundation UX Bootcamp project.
I was fortunate to design the whole project from scratch with the guidance and critiques of my mentor Nikos Kotsakis, from discovery through the research and interviews to ideating, creating, testing, and finally delivering the final MVP after enough iterations.
This project has been particularly interesting for me for the challenging relation I, besides many of my friends, had with the project management tools. My various attempts to turn these applications into a complementary and useful part of my work had failed and I needed to figure out a solution for these problems.
The project brief presented the challenge based on an assumption. However, I start any project with a beginner's mind.
During the competitive analysis, I noticed how so many similar tools all want to appeal to the same niche of users with similar approaches. What differentiates these tools from each other is their different levels of complexity, ranging from primitive "checklist apps“ to complex "work management tools“ with Kanban Boards, Spreadsheets, Gantt Charts, and more.
Small companies and freelancers want small project management tools where they can create projects and sub-projects to assign and track.
How can we create a management tool that can persuade small companies and freelancers to start to use our service?
Based on the users' niche suggested by the client I conducted a survey and then interviewed users from different fields but mostly working in small companies as a freelancer or off-site worker with management and coordination duties and what I found out couldn’t be more exciting!
Most of my task management happens through constant messaging with others, and no project management tool lets me do that as the messengers do.
I can quickly and effectively, although inefficiently, assign the tasks, coordinate the project, discuss the problems, inform the decisions and changes, ask for feedback, arrange meetings, even somehow monitor the progress and have the archive of all of it with me everywhere and in one place.
The findings during the discovery phase challenged our initial assumption about the users' needs and want. As a result, I went back to the starting point and reformulated our challenge based on the new empathetic findings.
What I discovered.
In a classic company project, most of the project management happens partially or totally through the communication between teams in the same company working in the same place.
On the contrary, due to the nature of their works, freelancers and off-site workers have to be in touch simultaneously with many stakeholders from many separate fields and locations for real-time information, assignments, or feedbacks.
Therefore, they use messengers, although inefficient for task management.
For freelancers and off-site workers project management happens through conversations and they want to have a messaging tool that beside an efficient conversation helps them managing their tasks easier and better as well.
This assumption leads to a total reformulation of my initial design challenge.
How can we create a tool which appeals to freelancers and off-site workers by not only assuring perfect communication but also helping them to collaborate effectively, coordinate efficiently and manage coherently their workflow?
This reformulation will reshape the whole project solution and also cover an interesting market gap through a truly innovative solution.
This challenge leads to a unique product. A product which provides an intuitive messaging service as its core functionality and then evolves a simple task management through this communication functionality.
This is fundamentally different to the existing tools in the market which are basically management tools with messaging service as a side functionality.
The only apps that get close to this sort of functionality are the two recent Microsoft products, Teams and Kaizala.
Maria who is a freelancer in a small company wants a messenger app that helps her manage her work more systemized and optimized because she is managing her work manually through text messages and finds it very inefficient and disorganized
The simple fact that our users have been using the existing messengers and project management tools to solve some of their problems and at the same time being unhappy with them shows the potentials of these systems to inform my innovation process.
I used this opportunity to look at these products with different lenses and search for innovative breakthroughs.
Maria’s needs as our primary persona will shape our products. Our product's ultimate goal is her transition from a lead to a fan user by minimizing her pains and maximizing her gains from our product.
Q: Can I substitute any shape or color for a better outcome?
A: Different shapes and colors between messages and actions.
Q: What functions can I combine to get a better result?
A: Action + comments = Actions message threads
Q: What functions of other products can I adapt?
A: A floating action button.
Q: Which other target groups could use it?
A: Teachers, Students, Coaches, Entrepreneurs and more.
This means that the various aspects of the product not only should work alone but also should altogether deliver consistency.
In the flow, we can see the interconnectivity of messaging and the task managing functions aligned with our Intentions and passed with our metrics.
Colors play a crucial role for tasks with their various status and priority and my moodboard uses the correlation between those two to inform the design guideline and brand identity of our tool.
Users can during every chat create and send their tasks for action through a floating action button. The action buttons are categorized based on topics, varying from tasks to meetings, questionnaires, and more.
For each action the users can add the assignees, attach files, set the due date, the priority, and notify the assignees about them. Besides, for a better categorization, users can tag the actions as well.
The users can also arrange the buttons and create new ones based on their personal needs.
Visually recognizable sent actions help the users immediately notice and differentiate them from the rest of the conversations on the chat screen.
The main information about each action as well as its status is also quickly skimmable and users can track and change the status with an attractive and clear button.
Each action has also its message thread helping the users to have a more organized and topic-related conversation.
Here the users can check their workflow and all their upcoming actions.
The actions are arranged based on their due date and categories. Besides, the users can also search and filter the tasks based on the priority, estimated time, assignee, sent/ received, and tags.
In addition to the actions shared with others, users are also able to manage their personal tasks from a shopping list to their thoughts.
My corner section beside Checklist and Notes leaves them the space to create the desired category of personal actions and manage them.
Workload enables users to check the team's workload.
Based on the number of the projects and their status beside their required estimated time, users can have a better and easier distribution of projects.
Users can balance the workload by simply drag and drop the task from one user to another.
Users will not struggle anymore to find their data. Every data can be tagged and every message can be bookmarked. As a result, users will have a great data arrangement which ensures a fast and easy data accessibility.
Besides the archive in each chat group, the users can also here search through all their data arranged by their types and find what they need. While all the sent and received data in chats will be gathered under the chat category, users have also their personal library where they can upload their data and use them whenever they need it.
When it comes to the business use of a messenger, on one hand, the number of contacts grows exponentially and on the other hand, the main contacts change from one project to another, for that the users can pin their favorite contacts for faster access.
Users can also make sure that their text will deliver their most important points clearly by differentiating these key points with different text colors and styles.
Any novel solution, besides all, needs to be desirable. Teletask also, like any other innovative idea, needed to be tested for that by real users.
Therefore, I tested the idea- from very basic sketches to middle fidelity wireframes- several times. The positive users' feedback was the approval for further development and more detailed testings.
Here are some of the changes that I implemented to the design as a result of various sessions of testings and iterations.
Searching easier and faster.
During the testing, I noticed how searching has a crucial role for our users due to the management functionality of Teletask.
Therefore I decided to decrease the users' taps by locating the expanded input field on the top hierarchy.
Lo-fi before testings
Hi-fi after testings
Adding contacts to the Favorites list.
Users were confused about how to add the contacts to favorites, especially the contacts who were not on the chat list.
I solved this problem by providing an add button to the list.
Lo-fi before testings
Hi-fi after testings
Moving the "Workload" button to the "Action" screen.
Workload enables the users to control the distribution of the action among themselves. I initially had placed it on the message screen as it is our central screen but then found out that users search for it in actions.
So I trusted the users' intuition and moved the button to the action screen so that they can find it where they expected it to be.
Lo-fi before testings
Hi-fi after testings
Creating personalized actions.
Users from different professions have different needs.
Therefore I enabled them to create their own type of actions by clicking the "more“ button and add their own categories of actions.
I also changed each button title from "a subjective title" to a "calling for action" title.
Lo-fi before testings
Hi-fi after testings
A more clear title for the CTA Button.
The actions are sent to the message thread like any other message and the submit title for the button was confusing for the users.
I changed button title from "Submit" to "Send" which is a better recognizable title.
Lo-fi before testings
Hi-fi after testings
In this project, the most important learning for me was how important is to set aside our assumptions and start with a beginner’s mind if we want a true understanding of the users' needs. This may lead us to shape a product that is different than what we initially aimed for.
Run more iteration to reach a well-improved product to launch the first live prototype.
