Design Thinking Process

Understanding the Problem

5 W's

I used this technique to help me understand the context and specifics of the user experience.

Understanding the Competition

For this project, Career Foundry provided us with a list of location-based apps to analyze. I picked Google Maps and a second one that was not on the list: Eventbrite.

SWOT

I decided to do a swot analysis to have a clear idea of the strengths and weaknesses of each chosen app.

Lessons

After conducting the analysis, I realized that considering Google Maps as a competitor was a mistake, as it is not an event app. However, I could integrate it into my project. If I were to do this analysis again, I would have defined my rationale more clearly and chosen a different major player, such as Eventime or Ticketmaster.

Interviews

I interviewed 5 people over the phone and in person to gain valuable insights into user needs, wants and pain points, to design the product’s features from a user-centric perspective.

Questions

• How do you usually plan your week? What events do you plan to take part in?

• How often in the last month did you take part in an event? when and where?

• What website or app do you use to find events you want to participate in?

• What are the features you like the most about those apps or websites?

• How often last month did you cancel your initially planned event and why?

• What type of information would you like to find in the app?

• Do you study or work from home? How is this playing in how you attend events during the week compared to the pre-pandemic era when (and if) working or studying in a different location?

Results

• 2/5 users wanted to see the price displayed earlier in the search process

• 5/5 users wanted to see all events displayed in one app

• 2/5 users wanted to see curated offers for diverse communities (LGBTQ, Spiritual)

Lessons

After reviewing the results, I came to the realization that the questions I asked didn't effectively help me validate my hypothesis about the social isolation epidemic. If I had the opportunity to redo this project, I would ask different questions to determine its validation. However, due to time constraints, I made the decision to proceed with the project using the data collected during the initial interviews.

User Personas

I created three personas based on the people I interviewed. I consulted them throughout the entire design process to ensure that my project met the needs of the targeted audience.

Definition of the "Jobs to be Done"

Gathering Requirements

I asked myself critical questions and drew from my research to answer them. This process helped me to stay focused on my user persona, their main needs, goals, and behaviours and allowed me to extract key product requirements.

Jobs To Be Done

The Jobs To Be Done (JTBD) framework helped me to understand what causes people to do a particular action. It helped me design adequate solutions that meet user needs. During this stage, I also clarify what the user needs vs what he wants. This will allow me to define the Minimum Viable Product (MVP).

Creation of the MVP (Minimum Viable Product) document

Definition of the MVP

Following Lean UX, this stage allowed me to define essential features to make my product viable and start collecting feedback to further its development in the right direction. I decided to keep the JTDB that are needed and leave the ones that are wanted for the next iteration.

Hypothesis and Success Metrics

Based on my objective and the Jobs To Be Done, I defined what I aimed to achieve with my MVP and its success criteria to measure its impact and validate the hypothesis.

JTDB for MVP Iteration 2

I create a second list with the remaining JTDB (wants) to be released in later versions of the product, once the initial MVP has been proven successful.

User Flow

First, I defined the entry point and success criteria for each JTDB of the MVP. Next, I performed a task analysis to outline each step the user needs to take to achieve their goal.

(Flow for JTBD "When I search for an event, I want to see filters, so I can select events happening on that day")

Afterwards, I consolidated all the flows into a single user flow.

Low-Fidelity Wireframes

I sketched the screens using the Crazy 8s technique for each flow.

Rapid Prototyping

After sketching the screens, I created a prototype using the app Prott and tested it with three potential users.

User Testing

I conducted user testing with three people. It was moderated remotely via Zoom.

Goal

The test aimed to assess the learnability and usability of users to interact with the event app for the first time on mobile phones. I wanted to observe if the users understood the overall navigation, and its value and see how they completed basic initial functions such as purchasing a ticket, RSVP and filters.

Objectives

• To determine how easy it is for the user to purchase a ticket

• To determine how easy it is for the user to RSVP a ticket

• To determine how easy it is for the user to filter with a date

• To determine any point that may confuse the user

• To gather feedback from users on the overall usability of the app

Results

Mood Board

I created two different mood boards to present two options to the hypothetical client or team.

Mood Board 1

I took inspiration from the poster you and I can find in the street, bringing all the events in one place. The idea is to create a sophisticated yet professional atmosphere with the help of more serious UI shapes. The colors are vibrant, bringing energy and motivation to hang out and meet new people, whether it's for making new friends or networking."

Mood Board 2

Again, I drew inspiration from street posters, this time focusing more on the font and bringing a warm, mature, grounded energy. It's an invitation for community, cultural, and networking events in a relaxed environment.

My Choice

I decided to go with moodboard 1 because its colours are suitable for the younger (female users I’ve interviewed) and for queer people (older users I’ve interviewed). Also, I’ll be able to integrate better networking events with this moodboard.

Primary and Secondary Actions

I reflected on the primary, secondary and tertiary actions the user would take to achieve their goal and created buttons. I also made a Style Sheet and began to apply colours and typography to the mid-fidelity wireframes.

A/B & Preference Testing

I conducted a preference test for the payment screen and shared the results with fellow UI/UX design students. This helped me understand how certain design choices were perceived and iterated accordingly.

Feedback received by the users:

• "The pink on the other screen makes me feel like I made an error/did something wrong"

• "The white colour is pleasing to the eye and non-distracting"

• "In the first (screen) I don’t know where I’m supposed to look, because the pink is emphasised, the second is clearer and cleaner :)"

Responsive Grids

To help me design a responsive layout, I established 4 fluid grids for 4 different breakpoints.

Style Guide

High-Fidelity Wireframes

Responsive Design