Role: Designer
Tools: Sketch, Marvel, Balsamiq
Project: Capstone - Careerfoundry
Year: 2017
Overview
For my UX design course at CareerFoundry; the brief was to build a project management application from scratch. This capstone project was designed to utilize all the elements of end to end UX design process.
Challenge
Most project management applications in the market are made for businesses, consists of too many features and could cost a substantial fee. The rest are simple to-do lists that offer too little in features. The challenge is figuring out how to fill the market need for a project management app catered to both personal and business use.
For my UX design course at CareerFoundry; the brief was to build a project management application from scratch. This capstone project was designed to utilize all the elements of end to end UX design process.
Challenge
Most project management applications in the market are made for businesses, consists of too many features and could cost a substantial fee. The rest are simple to-do lists that offer too little in features. The challenge is figuring out how to fill the market need for a project management app catered to both personal and business use.
🔬 Research
Competitive Analysis
I conducted a competitive analysis of the three most popular project management apps to determine what Rocketlist can bring to the table to compete in an already saturated market. For each competitor, I included an overview of their target market and marketing strategies, SWOT profile, and a UX/UI audit of their software.
I conducted a competitive analysis of the three most popular project management apps to determine what Rocketlist can bring to the table to compete in an already saturated market. For each competitor, I included an overview of their target market and marketing strategies, SWOT profile, and a UX/UI audit of their software.
User Research and Interview
In order to assess and understand the user's needs and discover pain points on other project management apps, I surveyed 30 participants and conducted 3 in-person interviews.
📝 Define
Minimum Viable Product (MVP)
The previous research phase enabled me to identify user needs and goals. Accordingly I was able to create Rocketlist's MVP with the following features; Clean and intuitive UI design, dashboard giving an overview of tasks and projects, and a team chat function
Personas
To create a successful app, it is important to understand the types of people who will be using it. In order to achieve this, I created 3 personas that represent the major needs of the most important user groups based on the results of my competitive analysis and user interviews.
The previous research phase enabled me to identify user needs and goals. Accordingly I was able to create Rocketlist's MVP with the following features; Clean and intuitive UI design, dashboard giving an overview of tasks and projects, and a team chat function
Personas
To create a successful app, it is important to understand the types of people who will be using it. In order to achieve this, I created 3 personas that represent the major needs of the most important user groups based on the results of my competitive analysis and user interviews.
With a clear understanding of our target audience, the next step was to create a task model and user journey map to help me understand what steps potential users would go through, their expectations and behaviors, possible pain points and problem areas and how I can connect these experiences to help me create a user-centric design.
Now that I have an idea on how the users are going to use Rocketlist, it's time to get the content and features structured and organized.
I started with a content audit of Rocketlist's competitors, then moved on to conducting a live and online card-sorting exercise, and based on those results, I created a sitemap to give me an overview of how the app and its website will be structured.
These will serve as reference points when designing wireframes and prototypes.
🔄 Ideate
Sketching and Paper Prototypes
During this phase I started sketching different iterations and features and began doing a quick usability test with different users.
During this phase I started sketching different iterations and features and began doing a quick usability test with different users.
From Taskly to Rocketlist
One of the main feedback that I received was that they were not sold on the name "Taskly." One user said that if I want this app to stand out from all the different project management apps on the market, I would need a catchier name. I needed a name that can describe the quickness and efficiency of my app. After some deliberation, I landed on the name "Rocketlist". I conducted some A/B tests with the name Taskly and Rocketlist. Rocketlist overwhelmingly garnered more positive feedback.
One of the main feedback that I received was that they were not sold on the name "Taskly." One user said that if I want this app to stand out from all the different project management apps on the market, I would need a catchier name. I needed a name that can describe the quickness and efficiency of my app. After some deliberation, I landed on the name "Rocketlist". I conducted some A/B tests with the name Taskly and Rocketlist. Rocketlist overwhelmingly garnered more positive feedback.
✍️ Prototyping and Testing
Wireframes
After the first iteration of paper prototypes were done and tested, the next step was to create lo-fi wireframes with improvements based on user feedback.
Usability Tests
Several rounds of testing were conducted with different iterations of the wireframes. A few issues I ran into prior to finalizing the design were placement of the features, layout design, and ease of understanding when it comes to icons and navigation.
🎨 Design
User Interface
With the structure and layout finalized, the next step is to create the visual design of Rocketlist. Ongoing tests were still conducted to get the right visual style and aesthetics.
With the structure and layout finalized, the next step is to create the visual design of Rocketlist. Ongoing tests were still conducted to get the right visual style and aesthetics.
Applying Feedback
Visual cues were applied in the final design based on user testing feedback. One example is color-coding and categorizing tasks in the Dashboard page to visually communicate prioritization.
Visual cues were applied in the final design based on user testing feedback. One example is color-coding and categorizing tasks in the Dashboard page to visually communicate prioritization.
📪 Delivery
Development
With the app ready to go, the last step would be handing off the specs for development.
With the app ready to go, the last step would be handing off the specs for development.
