Go Local: UX Design of a Local Entertainment App

go local logo square.png

My Role

This project was completed during a Prototyping class in the HCI Master of Science program at DePaul University. I made the following contributions to this project:

  • Created initial sketches, mid fidelity and high fidelity prototypes for sign up and preference setting screens

  • Recruited participants for usability testing

  • Wrote the usability testing protocol and test script

  • Conducted usability testing on mid fidelity prototype

  • Wrote the usability testing results

  • Wrote the product goals and direction

  • Created the style guide

  • Wrote the project summary

Project Brief

Go Local is an entertainment focused app that helps users discover places and events of interest near them, through GPS. Our goal is to provide activities that match the interests of users, so they can spend their time enjoying themselves, instead of searching for new things to do. Go Local learns users’ preferences through repeated app use, which creates more customized suggestions. We give users flexibility in how and when they are notified of events, whether they like to plan ahead, or on the go.

Ideation

Sketches

We generated the idea for an app that provides information about events as you pass by them, so users can discover new things to do in the moment. We conducted a design charrette to explore each team member’s ideas for various parts of the app, including the onboarding and preference setup, and suggested event listings. We also sketched potential dialogue options for hands free voice interaction, which could be enabled while driving.  

Mobile app: User onboarding and preference setup
Mobile app: A home screen that lists all the events of interest and an event page that shows more information about an event
In car voice interaction: Learning about events the user sees while driving

Mood Board

After completing the sketches, we compiled a mood board that captured the energetic vibe we wanted Go Local to have. We hoped to create a clean, playful look that would let users know discovering local events through Go Local would be a fun and functional experience.

Screen Shot 2020-06-15 at 9.36.08 PM.png

Personas

We created three simple personas to represent potential Go Local users. One user is looking for things to do in a city he just moved to. Another is a world traveler, trying to find local hot spots in the cities she visits. Our final persona has lived in his neighborhood for a while, and is too busy to look for new activities to do with his friends.

Scenario

We decided to focus our efforts on our persona James, who we call a “longtime local”. We created a brief scenario to summarize how he might use the Go Local App. This helped inform our product goals and direction. It also allowed us to select the parts of the app we wanted include in our narrative prototype.

Scenario.jpg

Product Goals

We wanted to keep the Go Local app as simple as possible for users, and do most of the work for them. This led us to three primary product goals:

  • Help people discover places and events of interest nearby

  • Give users multiple channels to conveniently receive real-time updates on the go

  • Learn user habits and preferences to improve recommendations and notifications

Product Direction

We considered the important high level information we needed to share with users and stakeholders, to educate them on how Go Local is unique from other event apps on the market.

How Go Local Works

Uses GPS on a mobile device and car connects to car bluetooth to alert users about places and events near them that match preselected interests.

Go Local Provides Info When Users Want It

Allows users to get additional information on places and events in the moment, or saves information for later when users are busy or driving.

Go Local Uses Voice Interaction

While driving, the user interacts with the app exclusively through voice command and is notified by voice to ensure hands free use. 

Go Local Lets Users Control Notifications

Provides flexibility in the frequency of notifications, if these are received by text or voice and the radius covered.

Digital Narrative

We created a digital narrative, or non-interactive prototype, to tell the story of how Go Local works in a scenario. We focused on our “longtime local” James to create a series of key screens that would take him through the task flow highlighted in his scenario.

Screen Shot 2020-07-12 at 4.21.36 PM.png
  1. James installs the Go Local app on his phone and opens it for the first time. He creates a profile and goes through the on boarding process so the app can learn about his interests and preferences.

Screen Shot 2020-07-12 at 4.23.20 PM.png

2. Afterwards, James closes the app and goes about his day. The next day, James drives to his friend’s house. Go Local is keeping tabs on his location using GPS, and records all the events along his path. After his drive, James receives a notification informing him that he passed by a few events that he might be interested in.

Screen Shot 2020-07-12 at 4.24.42 PM.png

3. James wants to learn more about these events so he clicks on the notification, which opens Go Local and shows him a list of the events. One of the events is a rock concert happening nearby and James is in the mood for some live music. James clicks on events, which takes him to a screen showing key information about the event. James tells his friend about the event and they agree it sounds like a good time. He purchases two tickets on the app.

Design Tenets

We compiled a list of design tenets that we wanted to implement in the Go Local app, which focus primarily on ease of use.

  • Make the experience unique and rewarding

  • Minimize the amount of effort on the user’s end

  • Give users a sense of control

  • Provide useful information without being intrusive or disruptive

Personalize the app by learning from the user’s behavior

Mid-fi Prototype

We built a mid-fi prototype that follows the tasks of the scenario we highlighted in our narrative prototype. To represent the voice interaction feature for use while driving, we created a voice interaction flow diagram. This showed potential user input and corresponding app input.

Mid-fi Prototype Task Flow

  • Signing up

  • Setting up preferences

  • Viewing recommended and favorite events

  • Adding events to favorites

  • Purchasing tickets

  • Enabling driving mode

  • Learning about nearby events while driving

Mid-fi Prototype Key Screens

Signup and preference setup

Signup and preference setup

Viewing events and purchasing tickets

Viewing events and purchasing tickets

Voice interaction flow diagram

Voice interaction flow diagram

Usability Testing

We tested a total of four participants, due to time and availability constraints. Three tests were conducted in person on a mobile phone, and one test was conducted with screen sharing and video recording on Zoom.  

To test the primary features in our mid-fi prototype, we created six tasks for our test participants to complete:

  1. Sign up for an account on Go Local

  2. Set up preferences

  3. View recommended events

  4. Add an event to favorites

  5. Purchase tickets

  6. Ask Go Local about nearby events while in driving mode

We followed a test script that gave participants a brief explanation of the Go Local app, and asked them to complete each of the tasks. We followed with a series of post-test questions to gauge usability and find out if users had any likes or dislikes with the app. 

After synthesizing our test results, we concluded that there were no issues that prevented users from completing the tasks, but agreed that we needed to make some adjustments to create a better user experience.  We selected three areas of focus to improve in the final hi-fi iteration of the prototype.

Provide More Control to Users During Setup

Issues: 

  • The profile setup process feels tedious and redundant, and did not allow users to skip parts of the process. 

  • There is confusion around some of the verbiage used on the setup screens.

Proposed changes: 

  • Allow users to bypass parts of the setup to shorten the setup process.

  • Adjust the verbiage on some of the setup screens,redesign layout to reduce user confusion and simplify the process of setting up preferences.

Provide Better Ways for Users to Find Events of Interest

Issue: 

  • There is no way to adjust the events list to fit the user’s current desires.

Proposed change: 

  • Add filters on the events page.

Improve Voice Interaction

Issues: 

  • There is too much back and forth required to get a response from the system in driving mode.

  • Giving the user the option to set up their preferences with voice interaction led to confusion.

Proposed changes: 

  • Have the app use more of the phone’s contextual data instead of asking the user.

  • Eliminate the voice interaction feature in preference setup.

Hi-fi Prototype

We built a hi-fi prototype that focuses on the same task flow as the mid-fi prototype, but implemented the changes that we decided we needed to make, based on usability testing.

Style Guide

We selected colors and fonts in our style guide to emphasize the exciting and spontaneous aspect of our concept and brand. We chose complementary colors that playfully pop on the screen. All fonts are rounded sans serif styles, which add to the casual, fun vibe of the app.

Screen Shot 2020-05-31 at 3.15.25 PM.png

Changes to the Hi-fi Prototype

We iterated on our existing mid-fi prototype, integrated changes based on input from usability testing and refined the style of the app to make the hi-fi prototype feel more realistic. 

These are the changes we made to high-fi prototype:

Shortened the signup process and made adjusting preferences easier

In our mid-fi prototype, we required the user to set up all preferences at one time, before they had a chance to explore the app. We decided to shorten the sign up process, by allowing users to select initial events of interest with a playful swipe motion, but allowed users to bypass this if they preferred. Preferences such as notification frequency, driving mode and radial distance of events were moved to a seperate profile page, which the app encourages users to explore at any time.

Simplified searching for events

For the mid-fi prototype, we included an upcoming events page, but decided this separation of events was confusing. For the events page, we merged all events lists into one. We added filters to the page, to allow users to easily narrow the list of events to find what they are looking for by date, price, distance and category.

Built out voice interaction prototype

To simulate the voice prototype that can be used in driving mode, we created a series of potential voice interaction flows and recorded the scenarios with brief videos. These include:

  • Inform user of an event

  • Learn more about an event

  • Update driving mode notification settings

  • Toggle notification mode

  • Turn off driving mode

Hi-fi Prototype

Hi-fi App

Screen Shot 2020-07-12 at 4.35.07 PM.png

Intent 2: Learn more about an event

Screen Shot 2020-07-12 at 4.56.00 PM.png

Intent 3: Update driving mode notification settings

Screen Shot 2020-07-12 at 4.57.09 PM.png

Intent 4: Toggle silent mode

Screen Shot 2020-07-12 at 4.58.07 PM.png

Intent 5: Turn off driving mode

Screen Shot 2020-07-12 at 4.58.59 PM.png

Key Screens

Splash screen, Event Interests screen and Profile screen
Events screen, Event Detail screen and Ticket screen

Summary

This report tells the story of how our three person team took an initial concept and turned it into a high-fi prototype over the course of eight weeks. We followed a standard iterative design process, but encountered some unique challenges due to Covid-19, and were limited in our abilities to perform usability testing in person. 

Even with the tight deadlines and challenges, we met virtually on a regular basis to thoroughly discuss design details throughout all stages of the design process. This communication allowed us to improve the usability and utility of the app with each iteration.

If time permitted, we would have conducted usability testing on the hi-fi prototype, to confirm that the changes we made successfully addressed the issues we identified in our mid-fi prototype. We had also hoped to explore the use of VR with our app, but decided it was more important to focus on the aspects of the app that we have included in this report. Given the time and resource constraints, we feel that we did the best we could in the time we had. Overall, we’re proud of what we accomplished with Go Local in this timeframe, and believe we are all better designers for it.

Previous
Previous

Exploring the Use of Participatory Design to Improve Inclusivity: A Research Paper