Home

Munch Map — Interactive App

By:

Briefing

Design and build an interactive application and a web page that showcases, explores, and explains urban data aligned with UN Sustainable Development Goal 11 - Sustainable Cities and Communities.

Our goal

Creating a webpage and an interactive app that encourage people to support small, local businesses instead of big corporations, keeping revenue circulating within the community. This approach strengthens the local economy and reduces urban inequality.

Interactive App

Tools
  • Adobe Illustrator
  • Unity
Role
  • Interactive App Developer
  • Asset Designer
Members
  • Oscar
  • Ânia
  • Mira

The problem: When we spend at big corporations, most of that money leaves the neighbourhood. When we spend at small businesses, it stays and circulates, which strengthens the local economy and helps reduce urban inequality. The thing is, most people don’t think about this when they’re deciding where to get their coffee. Local businesses are often harder to find, and nobody really tells their story.

Telling people to “shop local” wasn’t going to be enough, so we focused on making people care about their community. We split the solution in two:

The web page

It’s connected to the Google Maps API and shows small businesses on a map. It also pulls from our own API, built from our research on each business, so people get real, useful information about them. This part was developed by my project partner.

Gamified app

This was my part. It works as a companion to the web page and turns discovering local businesses into something playful. You earn achievements when you learn more about it, and the app uses the same research from our API. The idea was that curiosity and a bit of friendly progress could do what a lecture can’t.

Font

Milky Coffee font Commissioner font

Color Palette

Munch Map colour palette

Assets

Arrow
Button
Card
Menu card
Information Card
Exit button

All chosen graphics meet the brand’s identity, having the similar style and also using the brands color palette and main font. We chose this style to evoke a nostalgia of childhood games and evoke positive emotions

App Features

Database conectivity

Problem

We wanted to easily update and fix all data inside our game withour having to go through the process inside the game

Solution

All data presented is connected to our own database. We chose to display it though infocards when the user clicks the desired building and through the menu card

Map view with an information card openMenu card with the bakery story

Minigame and Achivement System

Problem

We needed a reason to keep our users interested and motivated to keep playing and discovering the new eateries

Solution

We implemented an achievement system to motivate users. The expectation is for users to experience happiness and satisfaction after collecting a new achievement and being motivated to continue to collect all of them.

Achievement book with locked achievementsJukebox minigameAchievement acquired: Jukebox Hero

Game Navgation and exploration

Problem

We wanted our users to focus on playing the game without asking how it should be played, allowing them to explore and navigate freely

Solution

Users can easily navigate the map and discover information of the eateries in an intuitive way through the clear navigation components provided

Talking to a shop owner in the game
Return button Exit button
Exploring the city map