New Feature: Task Movement Between Groups - Research & Design
Created the feature to move tasks between groups
Design project for Snapfix, a task management tool with 400+ global customers.
The goal of this project was to research and design this new feature as it was an element that was demanded by users and that its absence made it difficult to work smoothly with the product.
Given that Snapfix is predominantly used on the app (75%) compared to the website (25%), we first designed the feature for the app and then adapted it for the website version.
❗ Problem
Users are working by managing multiple tasks and sometimes they would contact the company to move tasks internally to streamline the process. This process is tedious and not appealing.
🎯 Solution
Implementing an option to move tasks between groups to give users the freedom to manage their tasks easily, edit options quickly and intuitively by themselves. Makes the process more smooth and autonomous.
As we know from the stakeholders' feedback about the user demand for this feature, I began to ask myself questions that would be answered during the research process.
⚖️ Decisions to take into account
Should the user be able to move only one task or multiple tasks at a time?
To make it easier for users to find and move specific tasks. Include Search bar, Sorting, filtering options?
Should the feature allow for the creation of new groups or categories, or only allow tasks to be moved between existing groups?
Will the user remain on the same screen or be directed to the new group where the task has been moved?
Allow users to revert a task move if they made a mistake. Undo? Confirm option before move?
Should the feature enable the user to navigate to the new location of the task after it has been moved?
Next, I'll show you the design process I followed to address those questions and find the solutions that best align with the needs of Snapfix users.
UX Design process
Competitive Benchmark
System Setup
Sketches & Mockups
Online Survey
A/B Testing
High-Fidelity Prototype
Apr - May 2023
01. Competitive Benchmark
Firstly, I conducted a competitor benchmark to analyze the market. I summarized all the information in the following table.
To ensure ease of use and understanding for everyone, I reviewed our direct competitor that I could access without an account, as well as popular applications that are familiar to everyone. By implementing the function in an intuitive way, we aimed to make it user-friendly.
We focused on observing how other apps handle a feature that users are familiar with in other contexts. We specifically looked at the screens that appear after task movements and the information they provide. This helped us answer some of the initial questions I had in mind and informed me of our design process.
💡Opportunities
Offer different ways to move tasks: Common in management tasks apps, and useful as the user may need to use that funciton in differnt moments, while they are in the task itself, or checking the list group.
Find clear feedback: Important to show clear feedback to make the user understand that a task have been moved to a new location. Find out what the Snapfix users need in their day to day duties.
Drag and drop: is intuitive and used for familiar apps. Can improve the user experience, but trying to change the task status, not moving tasks between groups, too complex for that. Taking into account in further design.
02. System Setup
The system setup of Snapfix is a bit complex, which required me to understand how it works in order to create this feature that fits seamlessly within the existing setup.
In the image, you can see that each task involves different users and tags. It is important to know that when attempting to move Task 1 from Condition Surveys to the new group in Punch list, the users and tags won't align with the new location. This could lead to data loss.
After gaining a clear understanding of the system setup, I was able to start brainstorming and sketching my ideas.
03. Sketches & Mockups
The initial idea was to conduct an online survey before starting the design process. However, I had to wait to obtain the contact information of the participants, who were real users of the app managing tasks every day.
In the meantime, I presented three options of the feature to the Product Manager, highlighting the pros and cons of each. I began with sketches and then transferred them to Figma as mockups. Since the screens are fairly simple, I skipped wireframes in this case.
Here I'll show you each option with a brief description of the pros and cons, along with the mockups and sketches.
Option 1
PROS👍
Long press to select a task.
Multiple selection available.
Through this option the user won't loss any data, and during the process of moving a task all the tags and users will be added in the new location
CONS👎
Long process
Too complex
Time-consuming
Option 2
PROS👍
Long press to open a single task menu with the quick actions like move.
Feedback message that helps you to reassign data.
CONS👎
Only one task at a time
Long process
Too complex
Time-consuming
🏆Option 3
PROS👍
Quick process
Simple
CONS👎
Loss of data
I selected Option 3 in collaboration with the Product Manager for the initial stage of the new feature, focusing on task movement. By observing user interactions, we'll determine where to invest further efforts.
Regarding task selection, a preference test was conducted with real users to identify the most effective approach. I'll share the results later to showcase which option better meets users' preferences and needs.
04. Online survey
Once I obtained the participant contacts, I launched the user survey:
Details
• Release date: 26/04/23
• Closure day: 01/05/23
• Participants: 19
• Number of questions: 5
• Language: English
We were able to gather insights into user needs and expectations regarding the feature we were designing. This feedback was used to iterate on the mockups and incorporate user preferences into the final design.
👁️ Insights
Majority of users need the feature: The survey showed that most users expressed a strong need for the feature, confirming its importance.
Users work with multiple tasks: Many users reported managing multiple tasks simultaneously, highlighting the significance of including a multiple selection option.
Users want additional functionalities: Users expressed interest in features such as assigning users and creating tags while moving tasks, indicating potential opportunities for future enhancements.
User expectations after task movement: We also gained insights into what users expected to see on the screens or messages after moving tasks. The top ones were: Staying on the list of groups that you were, Having the option to move to the new location and Undo of the move.
05. A/B Testing
In the last question, we proposed a preference test, and the results showed an even split of 50/50 between the options. This indicated that both options were valuable and had their merits.
The users who preferred Option A found the multiple selection feature useful for managing multiple tasks simultaneously. They compared it to moving photos on a mobile device and found it intuitive. On the other hand, users favoring Option B emphasized the need for more noticeable screen changes for the Option A, and one user was an edge case who primarily worked with a single task.
Based on the feedback I chose to keep working on the option that appeared to be more user-friendly and aligned with the project's goals which was Option A, as it allows multiple selections.
To address the issue of visibility, we decided to enhance the menu by adding an animation effect similar to the one used in Google Photos, where it appears from bottom to top. This can be seen in the video on the left. Additionally, we adopted the background color style from Google Drive on the right to make it more noticeable and visually appealing.
06. High-Fidelity Prototype
After gathering all the research information, I iterated on the designs and included basic animations. You can find the final prototype here.
Now, let's briefly discuss the design decisions guided by the initial questions and aimed to create a user-friendly experience:
Selecting tasks:
To select tasks, users can perform a long press on a task, which provides an intuitive way of selecting them.
Multiple tasks can be selected simultaneously, allowing users to efficiently manage multiple items at once.
The top menu appears with an animation from the top, enhancing its visibility and ensuring it stands out to users.
Choosing the new group
A search bar will be included to enable users to search for specific groups, as seen in competitor apps and other features within the Snapfix app.
Despite users expressing the desire to add tags or create new users during the task movement process, it was decided to prioritize simplicity for the initial stage of the feature.
To streamline the process, there will be no need to click "Next" after selecting the desired group. Instead, the group will be selected directly, and the feedback message will be displayed.
Due to the complexity of reassigning "User" and "Tag", they will be excluded from the initial stage of the feature. The focus will be solely on moving tasks, which may result in the loss of some information but will fulfill the basic needs of the users.
Feedback message
To inform users about the potential loss of data, we will display Message B, as shown in the next image. The exact names of users and data will not be included because when moving multiple tasks, it would result in lengthy and confusing text for users.
As seen in Option A, it could be useful for a single task, but for multiple tasks, it would be confusing.
By presenting the options to proceed or cancel, we can analyze how users prefer to handle this situation in real life. They may choose to cancel and find an alternative method or proceed with the task movement, accepting the loss of information.
Screen after moving task
After moving the tasks, the result will be displayed in the same group list where they were originally located, but now updated without the moved task. So users can continue editing if necessary
Another feedback message will appear at the bottom of the page, informing the user that "X task has been moved to the new group."
Only the "View" option will be included, allowing users to navigate to the new list of tasks in the new group and continue editing in the new location.
The "Undo" option is not used because it would be redundant. The previous message already confirms the user's intention to move the task. Additionally, depending on the length of the group names, including all the information could cause text overlap and make it difficult to read.
After designing the primary version, which has been the focus of this study, I also created an additional variation for moving tasks from within the task itself and a version specifically tailored for desktop. While adhering to the same principles, I customized the designs to suit each specific version. This approach ensured a comprehensive and user-friendly experience across different contexts and platforms.
Learnings
This experience has taught me valuable lessons about working in a real-world environment. I learned the importance of prioritizing tasks based on available resources. When launching a new feature, it is crucial to start with the basics to understand its functionality and determine if further investment is needed.
I realized that the prototyping process is not always the most critical aspect.
Effective communication of ideas, using real-life examples from other apps and clear annotations, can help developers understand the intended outcome without the need for animating every possible variation, especially when time is limited.
Throughout the project, I presented weekly updates and improved in terms of sharing key elements instead of sharing every single detail of my progress.
It was an enriching and positive experience that has further motivated me to continue learning and growing in my journey as a UX designer.
💌 Thanks for stopping by!
If you want to learn more about me or just want to chat, you can send me an email at georginalardies@gmail.com or head over to calendly.com/georginalardies if you're ready to schedule a meeting!
UX Designer