Management
Tracking
Collaborating
Streamlining Project Management for User Success
Role: UX designer and UI lead in a group of 3 members.
Tools: Huly, Figma, Slack, and Zoom.
Project Duration: 3 weeks
The Challenge
In the fast-paced world of project management, tools that promise to simplify workflows often end up complicating them instead. Huly, a promising project management app, found itself at a crossroads. Despite its initial success, user retention rates were dropping, and frustration was mounting. The team at Huly knew they needed to act fast to turn the tide.
Our Mission
Deep dive into the user experience, uncover the pain points, and breathe new life into Huly.
Our Solution
Deliver a streamlined project management tool that prevents user overwhelm through thoughtful design, balancing essential functionality with intuitive navigation to keep teams engaged and reduce abandonment.
Our Approach
We embraced the Double Diamond Design Process, a proven methodology that would guide us through the complexities of user-centered design:
Stakeholder Interviews
User Research
Competitive Analysis
Problem Statement
User Personas
Research Synthesis
Ideation
Wireframing
Prototyping
User Testing
Final Design
Next Step
Problem Space
Understanding the challenge
Solution Space
Creating the solution
Understanding Our Project
We set out to understand the landscape of project management tools and the unique challenges faced by Huly's users
One user's comment stuck with us:
"We switched because our previous tool couldn't handle the complexity of our projects. The transition was difficult at first but worth it in the long run."- Huly’s user
This sentiment encapsulated the paradox we faced – users needed powerful features but longed for simplicity.
Key Insights from User Interviews
-
Feeling overwhelmed with all the functionality ad notifications
-
Struggles with cross-team communication and collab.
-
Want clear data visualization for informed-decision making.
-
Needs a way to track timelines and provide accurate progress updated.
-
Use project management tools for a infinity of purposes, making it hard to tailor their workflow to the tool.
Uncovering the Usability Gaps through Heuristic Evaluation
Before we go any further with the project. Our team conducted a thorough heuristic evaluation of Huly's interface. We uncovered several key issues. These findings gave us clear targets for improvement in our redesign efforts.
-
Lack of system status visibility, especially for incoming messages
-
Confusing issue status indicators that resembled multi-select buttons
-
Inconsistent placement of filter buttons across different views
-
Inability to perform bulk actions, reducing efficiency for power users
Check out below slides for more issue we found through out the Huly app.
Defining the Problem
Now that we’ve thought through our user’s needs, we are ready to define the final problem statement.
Emily is a project manager in need of a simpler and more reliable project management tool, as she's finding it challenging to efficiently handle multiple tasks in her fast-paced work environment.
Based on this problem statement, the next phase of the design process had me considering:
-
How might we help Emily in staying engaged with her tasks and boost her productivity?
-
How might we enhance communication between Emily and her team?
Meet our User Persona
Our persona, which represents our typical user’s experiences and needs, really helped shape our design approach, ensuring that we focused on the target audience's goals, needs, and frustrations.
Emily Robert (34)
New York, NY
Project Manager at a mid-sized tech company in New York.
Insights
Emily juggled multiple projects and teams, constantly seeking that elusive balance between comprehensive oversight and day-to-day efficiency. She loved technology but hated feeling overwhelmed by it. For Emily, and users like her, we needed to create a solution that was both robust and approachable.
Needs
-
A simple, intuitive platform that doesn't require extensive learning for her or her team
-
A flexible, customizable system for her team's specific workflow
-
A sense of progress and motivation through features like checking off tasks
-
Clear task management and prioritization to avoid feeling overwhelmed
-
A consolidated platform that handles tasks, approvals, and meetings in one place
Frustrations
-
Overwhelmed by the volume of tasks and constant notifications
-
Struggles with inefficient communication between teams and departments
-
Difficulty in providing quick, accurate project status updates to stakeholders
Ideation and Prototyping: Bringing Solutions to Life
For wireframing, our group held a studio design session to brainstorm the most valuable features for our users. Using the MSCW method, we determined the essential features needed to reinvent Huly.
-
Dashboard redesign for better overview and task prioritization
-
Improved messaging system for seamless team communication
-
Enhanced Gantt chart for clearer project timeline visualization
Following Jakob’s Law, which states that users tend to stick with familiar design patterns rather than adapting to entirely new ones, we conducted a competitive analysis to ensure our wireframe aligned with user expectations. By examining industry standards and identifying common design patterns, we aimed to create an intuitive experience that feels familiar while still enhancing usability. This approach allowed us to balance innovation with user familiarity, ultimately improving engagement and ease of navigation.
Low-Fidelity
Through a collaborative design studio session, our team ideated solutions for key user challenges. The brainstorming process led to several strategic features and below is the final outcome of our low fidelity:
1. During competitive analysis, we identified that Huly lacked a dashboard feature, which was present in Jira's interface. We designed a customizable dashboard to help users efficiently track and monitor their ongoing projects.
2. We enhanced customization options to provide users with greater flexibility in adapting the interface to their specific workflow needs.
3. Implemented a quick-access shortcut feature enabling users to create tasks and sub-tasks within 15 seconds, improving workflow efficiency.
4. Integrated a Gantt chart timeline visualization to help users track project progress and manage deadlines more effectively.
5. Messaging Box throughout pages, for fastest way for our users to communicate.
Usability Test
After finishing our low fidelity prototype we quickly ran usability tests to see how well our new features worked for project management. Even though we were working with rough wireframes that weren't fully polished, our users gave us fantastic insights. We primarily trying to focus on three main areas - the Gantt chart visualization, how teams create new projects, and the messaging system.
"Dashboard makes it much more clear to see what's going on. I didn’t feel as if I had options before. I feel like I needed to know what I had to do before. Likes messaging icon stuff on right."- Huly’s user
Below is the average result from 3 users.
Challenge
We hit a few bumps in the road during this project. For starters, we had no design system to work with - we were basically starting from a blank canvas. With only three weeks to tackle the whole project and just one week for design, we knew we had to get creative with our approach.
Given the time crunch, I decided to keep things simple and practical by using basic icons as our building blocks. While our client was hoping for something fresh and innovative with the design, I had to have an honest conversation about what we could realistically achieve in such a short time.
Mid-Fidelity
We jumped into Mid-fidelity designs right after testing our low-fi prototype. I put together a basic design system with all the icons, colors, and fonts we needed for the final design. Since our users mentioned they really liked Huly's clean and simple UI, we decided to keep that same vibe but with some subtle upgrades. Plus, with our tight timeline, it made sense to build on what was already working well on their original site rather than starting from scratch.
What we did...
We added more details to the prototype and enhanced it with colors before testing. During our first test, we observed that one user clicked the team option in the top bar when instructed to send a message. We decided to keep the menu in its current position since this was a minor issue, and other users preferred having the message feature at the bottom of each page. We were hoping that by adding more details and colors, users would have a clearer vision of the dashboard and find it easier to navigate.
If we had more time...
If we had more time, we would have loved to spend more time designing the onboarding feature. However, during our kickoff meeting, our client mentioned they are working on an AI feature that will function as an assistant and serve as their onboarding feature. Taking this into consideration, my team and I decided to deprioritize the onboarding design process, as there were other areas we wanted to focus on given our time constraints.
We tested our mid-fidelity prototype, and the results were very similar to the first usability test. We took additional time to analyze what we could change to make our final prototype more polished. We would like to conduct another round of testing in our next steps to better measure user satisfaction.
Final Iteration
-
The interface has no dashboard, only a notification board to track new tasks and activities. Leaving users confused or overwhelmed
-
The interface has no dashboard, only a notification board to track new tasks and activities. Leaving users confused or overwhelmed
-
Adding dashboard and home page leads clearer vision of the projects.
-
By dividing each category by colors, we made it easier for users to skim through project and which item they need to focus on.
-
The Progress bar visually shows how far users have advanced in their project, motivating them to complete their tasks by providing a satisfying sense of achievement as they watch their progress increase.
-
Having customization dashboard gives users to tailor their home page as their needs.
-
We're keeping the notification tab while also adding a latest activity feed on the home page for a bird's-eye view of team activities when needed.
-
Users can always click the Huly logo to return to the home page when they feel overwhelmed or after they've completed creating tasks or documents.
Before
After
Before
After
