Missile

Aim, Focus, and Hit Your Targets with Missile.

Role

UX/UI Designer & Researcher

Timeline

4 Months

Approach

Goal-Directed Design (GDD)

Tools

Figma, Figjam, Teams, After Effects

Overview

For my Senior Capstone project, I was part of a team that designed Missile - a productivity app that focuses on building healthy organizational habits and helps users meet their personal and work-related goals. For this project, the Missile team used the Goal-Directed Design process to gather research and produce a prototype that fit marker and user needs.

Since this project was made for class, some parts of the design process were cut out or changed to fit the course. For example, any Stakeholder meetings were instead done by our team since, being a class project, we did not have stakeholders.

Meet the Team

Approach

Goal-Directed Design

For this project, my team used the Goal-Directed Design process (GDD) to make research and prototype Missile. GDD has 6 different phases but since this was done in a classroom setting, we only did the first 5: Research, Modeling, Requirements, Framework, and Refinement.

Research Phase

The first phase in the GDD process is the Research phase. This phase focuses on gathering intel about the domain of the product, the competitors we face, and the user's needs. During the research phase, the Missile team conducted a Kickoff Meeting, Persona Hypothesis, Literature Review, Competitor Audits, User Interviews, and Affinity Mapping.

Kickoff Meeting

A kickoff meeting is usually perfomed at the beginning of a project where many of the people involved meet and discuss expectations of the project. Since this project was completed for a class, a typical Kickoff Meeting was not conducted. Instead, the team combined the Kickoff meeting with the stakeholder meeting and discussed our expectations and assumptions for the project.

During the kickoff meeting, our team determined our problem statement:

The current state of productivity tools has focused primarily on organization. What existing products fail to address is simplicity. Our product will address this gap by creating simple feature that allow users to easily navigate the app to their special needs.

After determining our problem statement, the team then moved on to making assumptions about our product. These assumptions include who our users are, what problems our project will solve, etc.

Persona Hypothesis

After the team completed our kickoff meeting, we moved on to figuring out our persona hypothesis. This exercise was done to help the team determine what our ideal interviewees would look like.

The Missile team determined that we would have 1 type of user. This user would be someone who has personal/professional goals they want to complete. We determined that users with professional goals need a way to keep up with deadlines while users with personal goals need help organizing tasks.

Literature Review

The next step in the research phase is to complete a literature review of the product domain to help us be more effective designers. For our literature review, we did research into:

What causes a lack of motivation in a person
What drives people to be motivated to do their work
How incentives can be used to motivate people
The importance of being organized and how to be organized
The importance of to-do lists.

Competitor Audit

Next, to further our understanding of our product domain, the team completed a competitor audit. For this competitor audit, we chose 3 competitors and gathered information on the positives and negatives of each competitor. For this audit, we chose to look into Notion, Evernote, and Todolist.

Competitor Audit Table

User Interviews

Next, our team conducted user interviews through Teams with 5 people, some in the workforce, some in school, and some in both. for our interviews, we asked a variety of questions:

What methods do you currently use to keep track of tasks/goals?
Do you find it difficult to stay organized and does that effect your motivation to complete tasks?
What challenges do you face in staying organized and productive?
What apps/tools do you currently use to help with productivity?
How do you manage periods of high stress/heavy workload?
Do you have personal goals that you would like to keep track of?
What helps you stay motivated?
How do you prefer to be reminder about tasks and deadlines?

Images of User Interviews

Affinity Maps

After completing our user interviews, the team moved onto completing affinity maps based on the information we gathered. We split our insights up into several categories and then determined if what each interviewee said fit in those categories in order to understand our user needs. Our categories include:

Tools used
Difficulty in organization
Likes & Dislikes
Motivation
Reminders
Different Methods for Professional/Personal Goals
Management of High Stress Periods

Below I have included an example of one of our Affinity Maps. To view the rest, check out the teams Figjam board.

Example of Affinity Map for Kim

With Affinity Maps completed, the Research phase was wrapped up and the team moved to the next phase of the GDD process: the Modeling Phase.

Modeling Phase

During the Modeling Phase, the team focused on understanding the information we gathered during User Interviews and Affinity Mapping in order to create a persona. We did this by identifying behavioral variables, characteristics, and goals.

Behavioral Variables

The first step in determining what behavioral variables our persona would have was to determine what variables we would be looking at based on our interviews and affinity maps. Some of the variables we decided to gather information about were experience with organizational tools, motivation for organization, professional vs personal goals, etc.

Next, the team put these variables and, using the information from our affinity maps, put our interviewees on a scale. Below is an example of what the table looks like, the full table is on the team Figjam.

Example of Behavioral Variables

When we finished putting all our information on the table, we were able to take note of the behaviors of our personas. We determined these behaviors for our persona:

Has experience with organizational tools
Is motivated to be organized
Wants to keep track of both personal and professional goals,
Is very organized
Manages periods of stress well
Has positive feelings about current organizational tools
Doesn't use many tools for personal goals
Uses physical and digital notes to stay organized
Would prefer collaborative tools
Uses organizational tools frequently

Then, after determining the behaviors of our persona, we worked on their goals. We determined that our personas goals would be to keep track of his work and team tasks, keep track of gym and fitness goals, create healthy organizational habits, and to be stress-free.

With our behaviors and goals listed out, we were finally ready to flesh out our persona.

Persona

Taking our goals and behaviors, were were able to finally put a face and name to our persona and write out his narrative that would help us make decisions while prototyping.

Persona: David Johnson (DJ)

With our persona finalized, we were able to move onto the next phase, the Frameworks phase.

Frameworks Phase

Now that we knew what was needed to make our app useful to our user base, we started to work on the prototyping of our app. During the frameworks phase, the team completed both Low-Fidelity Wireframes and a High Fidelity prototype.

Low-Fi Wireframes

Before we dove straight into a full high-fidelity prototype, our team first worked on a low-fidelity wireframe to get an idea of what our app was going to look like and what key and validation paths our persona would have when using our app.

Wireframing with Key & Validation Paths

Prototyping

After finishing our wireframes and determining the key and validation paths, we began to work on our prototype. The first step to our high-fidelity prototype was determining the name of our app. After talking about it in length, the team decided on Missile. We chose this name because during our discussion we talked about how we wanted our users to be able to hone in on a task and hit their targets, much like a missile. Then, we went about creating our logo and began to work on figuring out the style of our app.

Missile Logo

After figuring out the name, logo, and style, we finally got into prototyping our app. Everyone was assigned a different section to work on and we had frequent meetings to ensure that the whole team was on the same page when it came to design.

My Screens

For this project, I was in charge of creating the logo, creating the opening animations, and creating the onboarding screen. I had my work cut out for me as I had to mess around with the opening animation a lot to make it look right and flow well while also being quick. I also learned how to use Adobe After Effects in order to make the feature videos you see during the onboarding process.

Untitled video - Made with Clipchamp (2) (1).gif

My Screens

With the prototype finished, the team then moved onto the Refinement phase.

Refinement Phase

During the refinement phase, the Missile team interviewed 3 people about the design of the app and asked them their thoughts on the walkthrough of the app. Some of our interviewees stated that some of the screens looked a little weird as they did not go all the way to the edges. However, they overall found the app easy to use and understand. We fixed any issues that were brought to our attention and finished the Refinement Phase with our finished product.

Takeaways

Throughout this entire process, I learned even more about what goes into making a great product and how important having a great team impacts the project. I also learned the importance of speaking up when I see something that I feel we could do better on as it lead to some great discussion with the team and an even greater product in the end.

Overall I am really happy with this project and I am proud to be apart of team Missile.