🌄

YONDR : Reduce the cognitive load of going outside again.

image

2020 was a tough year as we were confined to our homes. Yondr was conceptualized as a way to help people rediscover their city and explore new places (out yonder 🤠).

Table of Contents:

🧙🏻‍♂️ Project Overview

🔬 Research

🔖 Define

💡 Ideate

👨🏻‍💻 Wireframe and Prototyping

👾 Usability Testing

🏁 Design Iteration

The Problem

At the height of COVID-19 lockdown, people isolated and stuck in a loop of, “What else is there to do?”, “What can I do and be safe?”

People are bored because they cannot find places to go or things to do in their areas.

How can we help people begin their discovery of new local places and find their own hidden gems?

My plan is to create an interactive game that utilizes mobile devices' camera and GPS features.

The Solution

Scavenger hunts are a great way to break free from analysis paralysis. By completing external tasks, participants are encouraged to explore their neighborhoods and discover new things.

By simplifying the creation and sharing process, we can eliminate the headache of spreading the word. We incentivize people to share places to visit without relying solely on reviews or stars. Instead, we can focus on the experience of discovery as part of the process.

Project Overview

Yondr aims to turn the scavenger hunt into a community-driven experience. It draws inspiration from board game design and photography to provide users with a clear end goal.

As part of the UX learning process at Careerfoundry, I was assigned to do a project and applied the processes what I was learning in an educational setting.

My Process

Click on the topic to expand.

Research: Why?
Define: What?
Ideate: How?
Wireframes/Prototype: If, Then.
Usability Testing: Where?
Design Iteration: Repeat

Research

Competitor Analysis

The general consensus is that scavenger hunts apps are difficult to manage and the market is mostly dominated by Geocaching. So I had to analyze the strongest Geocaching, along with one that approached the game differently, X App.

Unfortunately, the pandemic made it nearly impossible for to get an accurate reading on usage. This is the context I had to be mindful of throughout the design process.

Geocaching

image

The X App

image

SWOT analysis is a quick way to cover what competing products might be missing.

User Interviews

Research Goals

  • Learn how often user will use their phones while hiking.
  • Understand users' relationship with trusting maps on their phones.
  • Learn how often are users outside aimlessly. Why?
  • How open are users to the concept of discovery?
  • Understand what tasks users hope to achieve while doing a scavenger hunt.

Conclusions

  • People only use their smartphones when they know they will find something that they are looking for. Users are more likely to use an app if there are stakes of gaining bragging rights or something financially interesting like a “Buy one get one free” coupon to a new place.
  • Users have a very shaky confidence in their map comprehension. A good map system will keep the users confidence in your app and will make using an app more enjoyable.
  • Users will usually not aimlessly go someplace. They need a landmark, a north star to follow, per se, so as to say users need a way to store the map information to have a clear pinpoint as to not stray aimlessly.
" I usually stick to my hot spots primarily, and then look for the hidden gems when I have extra time." - Participant 2
  • Users are keen to move more aimlessly if the are near local landmarks and if they they are familiar with the local spots.
  • Discovery is negatively correlated to safety in the eyes of the user. Discovering something means to take a risk, those that the users are not will to make. If there was a method to making users more open to the concept of trying something, they would have to be motivated socially.
" I’m concerned with safety because I am not in a familiar area, getting lost. I hate when things are not up to date." - Participant 1
  • Users are motivated by friends actions and are more likely to take risks if they are able to earn social credibility.

Personas

With a target audience in mind, and an amalgamation of the users interviews and surveys, I can create my user personas. Personas help shift my focus to the perspective of what my users needs are.

image
image

User Journeys

image
image

Ideate

User Task Flows

Inconsideration of my personas, I then mapped out their flows in a way I considered how the well versed hiker/biker will be capable and how someone less tech savvy will have to flow through the app to accomplish what they want.

Task Flow #1
Task Flow #1
Task Flow #2
Task Flow #2
Task Flow #3
Task Flow #3

Information Architecture

Sitemap V3
Sitemap V3

Part IV: Prototype testing and Iteration

Low-fidelity Prototype

Early wireframe of search results
Early wireframe of search results
Early wireframe of active hunt
Early wireframe of active hunt
Early wireframe of create-a-hunt process
Early wireframe of create-a-hunt process

Mid-fidelity Wireframes

Wireframing of search functionality, both from the Map Dashboard and through the search bar.
Wireframing of search functionality, both from the Map Dashboard and through the search bar.

My early wireframes and low to mid-fid prototypes had a hamburger menu in the top left with everything tagged in it. Later on, I opted to remove it as it wasn't being used in user testing and stole real estate from having an outstanding search bar.

Heatmap Flow of the hunt creation process.
Heatmap Flow of the hunt creation process.

Create a Hunt is simplified to single step as to not overwhelm the user. Hitting the arrow progresses to the next step. Showing the simplified flow and highlighting the hotspots and gestures used.

Usability Test Report

Issue: Need a search filter or a category instead of common words.

Severity: Moderate

Evidence: Users expected the associated word to be the first result by title. The search results were an obvious hurdle.

Suggested Change: Separate common keywords into categories instead. Expand a filter into the search menu.

image

Issue: Navigation bar is too subtle and active page not obvious enough.

Severity: High

Evidence: Users don’t often notice the underlining if they were to go to the right most page (profile page) because their thumbs blocks the line.

Suggested Change: Fill square of navigation bar to show active page.

image

Issue: Limitations screen is unclear.

Severity: High

Evidence: Users thought this was a game screen where the placeholder icons made this screen seem like tic-tac-toe more than an options menu.

Suggested Change: Replaced placeholder icons with suitable and added icon titles. Title changed to “Accessibility”

image

Issue: Hitting Play is not an obvious way to activate or add a hunt.

Severity: High

Evidence: Two participants were confused on the wording between "Play" in the app and "Add" when given the task to "Add a hunt to your active hunt list"...

Suggested Change: Add a bookmark or star icon. Separate active hunts and saved hunts by tabs.

image

Design Iteration and Post-Mortem

Accessibility

  • In addition to having a mainstream persona that covers the 95% of users with Lee. I made a mindful effort to keep in mind that there are users like Joanna, who in her example, has a mobile accessibility challenge.
  • Make onboarding in short and easy sentences to not rush users to learning. In future iterations, we need to provide an access point to replay onboarding if needed.
  • Avoid overwhelming the user to forms, I established the hunt creation process into multiple pages by cutting needed information into bit size pages.
  • As we cannot apply universal accessible change to the world, we can apply autonomy by communicating for accessibility. Allowing users to know what accessibilities issues one may find during a hunt.

Design Systems

In post-mortem, the design process could have been smoothed over with an established system to maintain a more consistent, and familiar design language as well as a quicker interface turn around between iterations.

User Testing

  • One positive was being able test designs as much as possible and get feedback as quickly as possible. This meant there was a lot of little changes, in things like sizing or layout, that would make a universal change in user experience.

Design Principles

Before and After Active Hunt Page
Before and After Active Hunt Page
Before and After Search Results Page
Before and After Search Results Page

Thank you for stopping by!

👇 Check out the flow! 👇

image

Do you have any questions?

Drop me an email!