Family's Western Food
A live bilingual site for a neighbourhood Western food stall in S11 Food Court, Yew Tee — built around the stall's own menu board, its opening hours and the one thing it wants visitors to do: come and find it.
- Role
- Design + build
- Services
- UI/UX design · Creative frontend · Content strategy · Localisation (EN + ZH) · SEO foundations
- Year
- 2026
- Status
- Live site
Overview
The brief
A hawker stall has almost nothing published about it: no official menu online, no confirmed hours, no photography that anyone owns. Most of what the internet says is second-hand. The site had to feel warm and appetising while being honest about which facts were actually established — and it had to work for the stall's Chinese-reading neighbours as well as its English-reading ones.
Built independently for a real stall and deployed on its own domain. The owner supplied the opening hours, the ordering number, the menu prices and the menu photography; the site is still set to noindex until they sign it off for public launch, and the hero image, two stall-front photographs and the usage terms for the menu photography remain to be confirmed. Not an official or affiliated publication of the business.
Approach
How I built it
Made evidence part of the type system: every business fact lives in one content file with an evidence status attached, so an unconfirmed claim cannot quietly reach the page as if it were verified.
Rebuilt the menu from a photograph of the stall's own board — 23 items across five categories with their board prices, later confirmed by the owner — and wired the business's own dish photography to it, one frame per board number.
Derived the whole opening-hours surface from a single schedule: the seven rows in the Visit card, the closed-day line in the top strip, the live Open now / Closed badge evaluated in Asia/Singapore, and the schema.org opening hours.
Kept the conversions to what the stall can actually honour — Get Directions on a keyless, lazy-loaded map embed, and a call-ahead dialog using the number the owner supplied. No delivery platform is named, because none was confirmed.
Shipped English and Simplified Chinese as two static routes off one dictionary, so each language arrives as its own document with no client-side switching cost.
Set the design as modern hawker editorial: cream ground, charred-brown ink, sign-yellow and tomato accents, Baloo 2 over Instrument Sans — no UI kit, no icon library and no animation library, with motion in CSS behind a single IntersectionObserver.
Key features
What makes it work
- Evidence-status content model — every fact typed with how it is known
- 23-item menu transcribed from the stall's own board, owner-confirmed prices
- Live Open now / Closed badge from one Asia/Singapore schedule
- English + Simplified Chinese as two static routes from one dictionary
- Get Directions and call-ahead as the only conversions offered
- Three client components in the whole build; all motion in CSS
Gallery
A closer look
Build
Under the hood
- Deployed to production on its own domain and serving both languages
- Build, type-check and lint clean; verified at 1440 / 768 / 390 with no horizontal overflow
- Ships noindex until the owner signs the site off for public launch
Reflection
Looking back
The useful part is the evidence model: typing how each fact is known turned "we don't have that confirmed yet" from an awkward gap into something the page could handle gracefully. It also made the owner conversation concrete — the outstanding questions are a list, not a feeling.