UI/UX Design / Mobile App
Pinned.
A community-driven street food discovery map for Bangkok. Built for the people who eat, not the people who own.
Overview
Bangkok's best food isn't on the map.
Bangkok has more street food stalls than almost any city on earth. Most of them have never appeared on Google Maps and probably never will.
I — REALITY
Google Maps works great for restaurants, bars, and cafes. Street food stalls are almost completely absent.
II — BREAKDOWN
Stall owners are focused on cooking and making a living. Setting up a digital profile isn't something they have time nor need.
III — INSIGHT
Many stalls move, close early, or only open certain nights. Even when a stall is listed, there's no way to know if it's still there today.
"I walked 20 minutes to a stall I'd been to before. It wasn't there. No way to know until you show up."
— Randy, Bangkok resident
The problem isn't finding food.It's trusting that it's still there.
Solution
So we pinned it there. Together.
Pinned is a community-driven street food discovery map for Bangkok. No sign-ups required from stall owners. No corporate listings. Just people who eat street food, sharing what they find.
I — MAP FIRST
Every stall starts as a pin on a map. Not a feed, not a list. Because street food is about location — what's near you, right now.
II — ANYONE CAN PIN
Spot a great stall? Drop a pin in under a minute. Add a photo, a food type, a quick note. The map grows every time someone eats.
III — THE COMMUNITY UPDATES IT
Pins don't just get added, they get maintained. Every user can confirm a stall is still there, keeping the map accurate without any central team managing it.
Process
Structure before style.
Before any colour or component, every screen was mapped as a wireframe. Six screens, one clear flow.
Design System
Built to be consistent.
Every colour, type size, and component was defined before the first high fidelity screen was touched. This made every decision faster and every screen more cohesive.
Screens
Six screens. One flow.
Every screen was designed to get the user to the food as fast as possible.
Map View
The map is the app.
Opening Pinned drops you straight into the map. No feed, no onboarding, no friction. Filter chips let you narrow by food type. The FAB lets you add a pin in one tap.
Pin Detail
Everything you need before you walk there.
Tapping a pin slides up the detail sheet. Photo, rating, food type, timestamp, and location. Confirm Still Here and Add Review live here — the two actions that keep the map alive.
Cluster View
When one pin isn't enough.
Some areas have dozens of stalls in one block. The cluster pin groups them together so the map stays readable. Tap the cluster to expand and browse everything in that area.
Drop a Pin — Step 1
Drop it where it is.
Step one is location. Drag the map to place the pin exactly where the stall is, or search by area name. The map stays honest because the person placing the pin was just there.
Drop a Pin — Step 2
Name it, tag it, rate it.
Step two captures the details. Food type, stall name, a quick note, and a rating. A photo is optional but encouraged. The whole flow takes under a minute.
Profile
Your pins, your reputation.
The profile shows what you've contributed — pins dropped, stalls visited, followers. Tier badges reward active contributors. No follower pressure, just a record of good finds.
Feature
A map that stays alive.
The biggest problem with crowd-sourced location data isn't adding it, it's keeping it accurate. Stalls close. They move. They take random days off. A pin that was true six months ago might be useless today.
CONFIRMED
Pinned or confirmed within 3 hours. Someone was just there.
UNCONFIRMED
Last seen today. Likely still there but unconfirmed.
STALE
No confirmation in over 24 hours. May have moved or closed early.
FOR THE EATER
You know what you're looking at is real. The amber and grey states tell you when to be skeptical before you make the trip.
FOR THE STALL
Great stalls get confirmed more. That confirmation history becomes their reputation, built organically, without them ever touching an app.
Every pin makes the map better.
Core Mechanic
Confirm still here.
Street food data goes stale fast. Confirm Still Here is a one-tap community update system that keeps the map honest without requiring stall owners to do anything.
Step 1 — Pin Added
A user spots a stall and drops a pin. It goes live on the map immediately, marked green.
Step 2 — Time Passes
No confirmation comes in. The pin shifts to amber, then grey. The map is honest about uncertainty.
Step 3 — Confirmed
Someone walks past and taps Confirm Still Here. One tap. Pin goes green again.
FOR THE EATER
Green means someone was just there. Amber means proceed with mild caution. Grey means call ahead or explore nearby.
FOR THE STALL
No app needed. No account needed. Good stalls naturally get confirmed more, building a reputation purely through foot traffic.
No admin team. No manual updates.The community does it naturally.
Reflection
What I learned from this project.
1
No reference point forces better thinking.
There's no app like Pinned, which meant every decision had to be justified from first principles. That constraint made me a sharper product thinker.
2
The hardest problem wasn't visual. It was systemic.
Designing a map that stays accurate without anyone maintaining it pushed me beyond UI into product architecture and community behavior.
3
Component libraries pay off fast.
My first time using Figma variables properly. It slowed me down at the start and saved me on every screen after.
4
Timebox your explorations.
With no reference, small decisions took too long. Next time I'd set a hard limit on exploration and commit sooner.