← Outer RimMISSION 01 · OASIS

Social · Canvas 2D · Privacy by design

Oasis

A concept for meeting people in a new city. Oasis redraws Bangalore by peak-hour commute time instead of distance, then shows the meetups and communities you could realistically reach as a constellation around you, without ever showing who is there.

RoleSolo: design + build
StackReact, Zustand, Canvas 2D
Seed data12 hubs · 20 anchors
StatusWorking prototype

All data is made up. The hubs, meetups, stories and counts are seed data written for the prototype. No real people are in it.

Three taps, then the city

Onboarding asks for as little as possible, and says why at every step:

  • Neighbourhood. "We only ever store the neighbourhood, never your street or building."
  • Where you work. Used only as an aggregate count; nobody sees your company until you accept an intro. "Between jobs / prefer not to say" is a first-class answer.
  • College, with optional interest chips on the same screen. Tapping a college launches the map; you can also skip and launch.

Skipped answers are dropped from the scoring and the remaining weights are renormalised, so saying less never ranks you lower.

A map warped by commute time

Twelve hubs are laid out by a peak-hour travel-time matrix rather than geography (stress majorization), so Koramangala and HSR sit close and Whitefield drifts far away, the way it feels at 9 a.m. Twenty curated anchors, each with a short story, are placed on that map, with anonymous regulars orbiting them in Fibonacci slots.

Why an anchor pulls you

Each anchor's "gravity" is a weighted match: 0.4 · professional + 0.35 · interests + 0.25 · proximity. Tapping a star opens a sheet with its story, aggregate social proof and the breakdown of that score, so the ranking is never a black box.

You can see that a community fits you before anyone can see you.

Privacy as a design rule, not a setting

  • k-anonymity (k = 3) on every piece of social proof: no count below three is ever shown.
  • You appear as an anonymous dot in the cluster until you signal intent.
  • Three levels of detail cross-fade as you zoom (macro, meso, micro), so detail appears only where you're looking and nothing pops.

Built to stay smooth on a phone

  • The camera lives in a plain object inside the render loop, so pan and zoom never re-render React.
  • Glows are pre-rendered sprites: no shadowBlur, no ctx.filter. Device pixel ratio is capped at 2.
  • Orbiting dots are batched into one path per anchor and culled off-screen; spring physics runs only for the 15 or fewer dots you nudge, and goes idle once they settle.
Oasis · live demoOpen full screen ↗

What I'd do next

  • Swap the seed matrix for real travel times across about 60 hubs (the layout code is already size-agnostic).
  • Test the "signal intent" step with newcomers: is an anonymous nudge enough to make the first meetup feel safe?