Our Process

Initial Sketches

These sketches feature a clean and simple design. The three tabs are organized to display the status of challenges (in progress, completed), a list of available challenges along with special event challenges, and the final tab showcasing the user's profile, where they can document their experiences and create lasting memories.

In this paragraph you can include any content you would like to share with the user. Just click "Edit Text" or double click to add your own text and make changes to the font.

Brand Identity

Our inspiration and mascot.

We had inspiration from many different apps including duolingo and their reward system of a streak. With the main goal of the user being motivated by their own determination (learning a language, exploring a city), we wanted to introduce a gamified way to reward users to explore their new city.

Artistically we took inspiration from many NFTs as they often have simple yet visually appealing mascots for their coins.

Color Palette

Font

VanVentures

An application that provides incentive for users who wish to explore their new environment, socialize with other users, and document their activities.

Foolish Talk

Aristotelica Display

Rounded text for headers and important information for users to perceive the application as cute. Rounded and sans-serif fonts for users to easily read.

A green themed app to represent the outdoorsy theme of Vancouver within the application. Hints of orange to break the monochromatic theme. Illustrations/badges will have a variety of colour.

Our 3 Design Pathways

Our team explored three different navigation pathways.

1

A hamburger style navigation menu is beneficial because it hides the navigation buttons. This allows for more visual space in the application creating an clean and easy to navigate interface

(Soegaard, 2024).

2

Long scrolling has benefits such as translating well to mobile devices, or having more potential to engage users

(Nick Babich, 2017)

3

Navigation bars (nav bars) provide access to three to five destinations. One navigation destination is always active.

Achievement Badges

We developed our badges into a pixelated art style so we could all collaborate with making them without changing the art-style.

It also provided for a cuter look for the badges.

Phase 1

Our First Prototype

Our team had decided to move forward with the navigation bar as our main user pathway throughout the application. We also took design aspects from each of our designs and merged them into a single prototype. From here, we used different tools in Protopie such as variables and triggers to create a working prototype. We mainly used single taps for each of our icons, as well as horizontal and vertical scrolls to navigate. We implemented text input for users to write in their own journal entries as well.

Home Page

Challenge Page

Profile Page

User Testing

We had conducted user tests with specific questions to help improve our application.

We used the Think-Aloud Testing method to capture the user’s thought process during their interactions.

1. Pre-Test Questions (To understand the user's expectations)
2. Task-Oriented Questions (While the user is interacting with the prototype)
3. Post-Test Questions (To gather feedback on the overall experience)

SANDY

Age: 19
Occupation: Student
Location: San Diego
Interview Type: Via Zoom

KRISTIN

Age: 21
Occupation: International Student
Location: Vancouver
Interview Type: In Person

CAITLYN

Age: 24
Occupation: Student
Location: Vancouver
Interview Type: In Person

JEANETTE

Age: 20
Occupation: Student Studying Abroad
Location: Hong Kong
Interview Type: Via Zoom

What design issues have we identified from our studies?

The location of the feature of the GPS location notification is unclear Certain aspects seem less noticeable as it is not very big or colourful Certain sections can improve on hierarchy

It is not intuitive for the user to click on the specific functions for them to fully experience the application. Due to the nature of our application wanting to be more creative and self-exploratory, our team wants to ensure that it’s easy to understand and use all aspects of our app.

Can have a more specific choice of words to describe certain functions Have multiple buttons saying similar things

Through using certain phrases, it could confuse the user as to what the function is for a button. We want to simplify the usability of our app through direct word choice. Also removing buttons that are unneeded as it creates clutter within the limited framework of our mobile application.

Interactions with certain buttons sends users to unexpected location

This creates confusion for our user and disrupts the use of application of a whole. We understand that some of our buttons would send the user to a page when a pop-up screen would be a better option.

Overall

Integrating features that amplify the sociability of the app such as messagingIncrease the creative freedom for users by implementing the customization of the user’s profile Adjust layout hierarchy in terms of relativity for the features within the pageImplement more artwork/badges to motivate the user to use the app.

Phase 2

Final Prototype

home page

challenge detected pop-up

special event info pop-up

user issue report

app's feedback response

The home page displays brief information such as:
Nearby Challenge (ex. Breka Bakery and Café)
Recent Achievement (ex. Added first friend)
Recent Activity (Displays friends activity)

Special events will be displayed at the top which will correspond to holidays. Currently there is a “December Special” which presents three Badges. Users can tap on it to receive more info on it.

Challenge Detected Pop-Up: A pop-up will appear on the screen to inform the user that a challenge is near by. It will prompt them to enter their journal where they can document their experience

Phase 2

Final Prototype

challenges page

new friends pop-up

coming soon pop-up

challenge journal entry

challenge info pop-up

The challenges page: displays a list of currently accessible challenges and the completed challenges on the other tab. Clicking on the list of challenges will present an info pop-up displaying the location and a brief description of that challenge.

Locked Challenges: These challenges are hidden to limit and control the length of the list. Prevents overloading the page and is intended to unlock more when users complete more challenges.

Challenge Journal Entry
After the app detects the location of a challenge, it will give the user an option to write and document their experience which will be saved into their journal.