Launching a street food map of Jakarta
Role
UX Designer
Duration
5 Months
What I Did
I researched, prototyped, ideated and assure the quality of the feature.
Team
Design Lead,
UX Designer (Me),
Visual Designer,
Project Manager,
8 Developers
CHALLENGE
Finding our niche to break into the Indonesian market
With WhatsApp dominating the instant-messaging market, IndoChat needed unique features to stand out — something niche that would capture users' interest, keep them engaged, and connect them with other users. This is how street food popped into our minds.
SOLUTION
A down-to-earth map feature to boost local engagement
We decided to start from mundane things, like street food. Sharing food places, seeing localized information all in one app would surely make the experience of discovering and getting food easier. Our ultimate purpose is to turn IndoChat into a all-in-one social media app.
This is what we made:
✧
Explore food with familiar tags
With localized categories like Kaki Lima (street vendor), Warkop (coffee & snack stand), and Rumah Makan (diner), users can quickly find what they need in a way that feels familiar and relevant.
✧
Seamless Sharing, Effortless Connection
Sharing has never been easier when your favorite location and your chatrooms in the same app.
Users can instantly share their favorite spots and communicate in real time, without needing to switch between different apps, making interactions smoother and more efficient.
✧
Get directions in a blink
With just a tap, you can seamlessly transition from IndoChat to your preferred navigation app. No need to copy-paste addresses — simply tap on the map!
HOW WE GOT THERE
Focus, prototype, and polish
For this project, we took a prototype-first and interview-later approach, trusting that our desktop research would cover common UI patterns in maps. This allowed us to focus on building a solid design early on. When we later interviewed local users, their feedback helped us make several adjustments to better match their needs and preferences.
We also ensured that our app strategically balanced geographical information with social interactions. To stay focused, we refined our MVP to highlight its core purpose: connecting and engaging users.
PRODUCT POSITIONING
Focusing on social interactions while providing adequate geographical info
Since discovery and sharing is related to geographical information and social interactions, I mapped out popular apps for food discovery, food delivery, maps, travel guides, and social media.
We decided to position our street food map in the top right close to the origin— our app will offer more social interactions than pure food delivery and searching applications like Yelp and Perikulinger, and we won’t dive too deep on providing every category of geological information and navigation functions like Google Maps.
SCALING THE MVP
Identifying core functions that aligns with our position
As much as personalized content and search is valued by our interview participants, it was time-consuming for our development team to build. Personalized content requires building a machine learning model, and search required extra effort for data labeling.
Therefore, we finalized 5 key functions for our MVP that are lower in development cost and crucial to the user experience:
01 - Nearby food recommendations
02 - Adding and editing a location
03 - Sharing the location to friends
04 - Seamlessly jump to navigation apps
05 - Curated posts from experts
FLOW & WIREFRAMES
Streamlining the flow and visual concepts
I began checking out competitors, clarifying user flows, and sketching wireframes, collaborating closely with my lead to discuss the concept. This early-stage planning ensured that the design was both logical and user-friendly, allowing us to move confidently into high-fidelity prototyping.
TESTING & ITERATIONS
Tweaking the design to better suite user preferences
We conducted 2 rounds of moderated remote user tests of our hi-fi prototype with 6 Indonesians ranging from 25 - 42 years old, followed with post-test interviews about their street food discovery journey.
While the overall reviews are positive, we made three main changes to the design:
ITERATION 1
Making the navigation button more prominent
The biggest usability problem we discovered is that participants failed to reach the external navigation apps from the location information screen. The button was hidden three layers deep, and participants failed to understand what the icon means.
Therefore, we decided to replace the cover photo with a mini map, and add the navigation icon on the header. This iteration offered multiple entrances for users to access the navigation apps.
ITERATION 2
Adapting vibrant pictograms that are prominent in South East Asian apps
When I was sketching out the first wireframes, I was mostly referencing American applications like Google Maps and Yelp, and I thought Indonesian Apps won’t be too different.
Turns out there’s a whole different style in South East Asian Apps: the use of colorful Icons is prevalent in apps like Grab Food, Shopee Food, and GoFood. Therefore, we worked with an Indonesian visual designer to design vibrant icons that attracts the eye and fits perfectly with the local interface style.
ITERATION 3
Focusing on user posts + multimedia on nearby food recommendations
During our interviews, we discovered that foodie videos and community recommendations is a big thing when it comes to discovering new food spots.
As participants value recommendations from real people, we decided to display user posts in the recommendations instead of location information. The two-column layout also gives a lot more visual weight to videos and photos. The change of content and layout supported the app to be more social interaction-focused, and aligns better with the vision of creating an IndoChat community.
FINAL DESIGNS
Streamlined process of discovery and sharing
Our final design consist of 5 key flows — the onboarding process offers a smooth introduction to the app’s features. Users can easily discover posts through a curated list of user recommendations and explore content geographically using the discovering on the map feature. The detailed location information screen provides comprehensive details and direct links to navigation apps, simplifying the navigation process. Finally, users can easily share a location to chatroom, enhancing social interaction and collaboration.
TAKEAWAY
Humbling myself to different user preferences and cultural norms
I was taught that minimal design is the standard practice, but I learned from this project that this might not apply to every culture — designs that are rich with colors can be equally user-friend too.
At first, I assumed that since Indonesians use Google Maps a lot, their own apps won’t look too much different than American ones. Through user interviews and competitive research in the right direction, I was introduced to a whole different Interface style. I was stunned by how these apps can incorporate many vibrant colors, but still appear to be clean, friendly, and usable. In future projects, I would think of this experience and remind myself to be humble and curious towards cultures and fields that I am not familiar with.
IF WE HAD MORE TIME…
Including moving food stands would be such an interesting task!
Since some of the street food are sold in little stands or carts, they would move around in nearby areas just like ice cream trucks. It would be cool if there is a way to report and track where the street food currently is. It might be possible if one day there is enough users and cooperating food stands!