Google's UX Design Certificate
Case Study
Google's UX Design Certificate
Case Study
The Project
The Project
As part of Google's UX Design Certificate Program, I am working through different stages of the UX design process (research, wire framing, prototyping, mock ups). Check back often for updates!
As part of Google's UX Design Certificate Program, I am working through different stages of the UX design process (research, wire framing, prototyping, mock ups). Check back often for updates!
Step 1: Setting Up
Step 1: Setting Up
Step 2: Background Research
Step 2: Background Research
I started by doing some research about Honolulu, Hawaii and the types of movie theaters there. I also did a lot of research about the native Hawaiian language and common slang terms, this is how I came up with the name Onolicious.
I started by doing some research about Honolulu, Hawaii and the types of movie theaters there. I also did a lot of research about the native Hawaiian language and common slang terms, this is how I came up with the name Onolicious.
Step 3: User Research
Step 3: User Research
I started by conducting interviews with 5 different people and was able to come up with two different personas who displayed common pain points. From there I created user empathy and user journey maps.
I started by conducting interviews with 5 different people and was able to come up with two different personas who displayed common pain points. From there I created user empathy and user journey maps.
Step 4: Competitive Audit
Step 4: Competitive Audit
I completed a competitive audit for Onolicious with 3 different websites and apps for both direct and indirect competitors. I found that users would like additional features such as movie times and ticket purchasing in addition to snack ordering.
I completed a competitive audit for Onolicious with 3 different websites and apps for both direct and indirect competitors. I found that users would like additional features such as movie times and ticket purchasing in addition to snack ordering.
Step 5: Paper Wireframes
Step 5: Paper Wireframes
I created 5 different iterations of the home screen using the Procreate app on my iPad. Trying out different ideas ensured that the elements that made it to digital wireframes would be well-suited to address my user’s pain points.
I created 5 different iterations of the home screen using the Procreate app on my iPad. Trying out different ideas ensured that the elements that made it to digital wireframes would be well-suited to address my user’s pain points.
Step 6: Digital Wireframes
Step 6: Digital Wireframes
I chose my favorite home screen layout from the paper wireframes and built it out in a little more detail using Figma. I then created a user flow from the home screen to the chatbot, which is the main feature of the app.
I chose my favorite home screen layout from the paper wireframes and built it out in a little more detail using Figma. I then created a user flow from the home screen to the chatbot, which is the main feature of the app.
Home screen → Learn more → Navigation bar → Chatbot
Step 7: Low-Fidelity Prototype
Step 7: Low-Fidelity Prototype
I wanted to add a little more detail during this phase of the project so I added in the "My Account/Profile" feature so the user flow would be more complete and users will be able to experience more in the upcoming usability study. Click here to test it out!
I wanted to add a little more detail during this phase of the project so I added in the "My Account/Profile" feature so the user flow would be more complete and users will be able to experience more in the upcoming usability study. Click here to test it out!