MyBTO: BTO unit ranker (HDB June 2026 exercise)
Live: https://mybto.sg (the old address mybto.web.app redirects here)
Ranks every sale unit of the June 2026 BTO projects by each user's own importance weights.
| Type | Projects |
|---|
| Plus | Kebun Baru Breeze, Kebun Baru Ridge (Ang Mo Kio) |
| Prime | Berlayar Rise (Bukit Merah), Lakeview Cascadia (Bishan) |
| Standard | Sembawang Brook, Sembawang Portico (Sembawang), Woodgrove Acres (Woodlands) |
Stack: a static site on Firebase Hosting (public/, free Spark plan, no Cloud Functions, no sign-in) at https://mybto.sg (mybto.web.app redirects to it).
Rankings and shortlists are stored in a Google Sheet through a Google Apps Script web app (apps-script/, free). The Analytics page
reads combined results from the same web app. The browser knows the web app's address from public/js/config.js (SHEETS_URL).
Data status: real (all 7 projects, 6,952 units, from pipeline/raw/real/, published by python3 pipeline/build_real_data.py --publish)
The notes below describe the older sample pipeline.
Sample pipeline (legacy)
public/data/units/*.json is generated by python3 pipeline/make_sample_data.py.
Berlayar Rise's unit list (blocks, storeys, unit numbers, flat types, 1,976 units) is real; every other attribute,
and all units of the other six projects, are placeholders.- Facilities at the 1st storey (void deck), including future amenities/facilities, are real for all seven projects
(
pipeline/raw/facilities_1st_storey.json, read off the HDB brochures); other facility values are placeholders.
- Multi-storey car park distance (
mscp_m, mscp_near = within 100 m) uses the real car park blocks and block numbers from the
brochure site plans, but the distances are by-eye estimates (about 10 m, 20 m for Sembawang Brook), in
pipeline/raw/mscp_distance.json (with the pixel positions used). wind_open (no block within 30 m on the SE to E side) is a
placeholder correlated with facing in the sample data; build_dataset.py computes it from site-plan stack positions.
public/data/sample_submissions.json (420 sample users, npm run sample) is copied into the sheet's "Sample" tab by
importSample() and mixed into Analytics so the charts have something to show. Turn off by setting cell B1 of the "Settings" tab to FALSE.- The real-data pipeline (
pipeline/build_dataset.py) builds the same JSON plus the Excel workbook
(tabs Plus / Prime / Standard) from the reconciled brochure extractions in pipeline/raw/.
Pages
/ ranking (same as /rank) · /shortlist · /archive/analytics (Analytics is archived: /analytics and /analysis redirect to /, the tab and button come back with ANALYTICS_ENABLED: true in public/js/config.js; ads are off with ADS_ENABLED: false) · /archive/home (old home page). /account, /archive/account and /archive/dashboard redirect to / (see firebase.json).
Inner pages are generated from one shell: edit pipeline/build_pages.py, then python3 pipeline/build_pages.py.
Images in public/img/ are artist's impressions from HDB's June 2026 BTO brochures (© HDB), credited in the footer.
Features
- Rank: project, one housing type, blocks, storey range and floor priority (higher / lower / none).
Facings are only NE, SE, SW or NW. Equal scores share a rank and the next score gets the next number; minus
scores are shaded below a red line. Importance −5…+5 per selected block,
sun direction, 2-Room Flexi design and the other factors (including faces the prevailing wind SE to E, not blocked
from the wind, and within 100 m of a multi-storey car park). Floor priority defaults to Higher. Only factors that exist in the selected blocks are shown.
- Ad pop-up: the first press of Rank units in a browser session opens a placeholder ad (300x250) and the NUS research
notice. "Show my ranking" turns on after 5 seconds; agreeing is the consent.
Every ranking is then sent to the sheet with the full order of all matching units; the page shows only the top 100.
The visitor is only an anonymous random id kept in the browser (
mybto:uid). The last filters and weights per project stay in the browser (mybto:last:<project>).
The ad and the rewarded video are placeholders in public/js/ads.js (one place to plug in a real ad network).
- Shortlist: ★ units into a separate list; reorder by drag or arrows. Kept in the browser and sent to the sheet (about 2 seconds after the last change).
- No sign-in. Nothing is tied to an account or device other than the anonymous id.
- Analytics (one project, not interactive): a 15 second rewarded video placeholder comes first (remembered per project
for the browser session). Then lowest and highest storey distributions, sun directions, blocks and
factors ranked, floor preference, facilities and housing types, shown as a dashboard of KPI tiles and Chart.js charts (each carries a faint mybto.sg watermark). No unit ids are shown or returned. Only rankings with consent count, and only each visitor's latest ranking per project. Until
SHEETS_URL is set it says "Analytics will appear here soon."
- Data: open the Google Sheet (tabs Rankings, Shortlists, Sample, Settings). File > Download > Microsoft Excel gives a spreadsheet.
- Legend: diagram + explanation for each factor.
Security and search
firebase.json sends a strict CSP and the usual security headers. Chart.js (archived Analytics only) loads with SRI. No Firebase JS runs on the site.robots.txt and sitemap.xml let search engines list the pages but not /data/. Steps to get into Google: docs/GOOGLE_INDEXING.md.- Apps Script limits (project allowlist, per-user throttle, hourly ceilings) are in
apps-script/; re-paste and publish a new version to apply them.
Visitor analytics
Google Analytics 4 (GA_ID in public/js/config.js, loader public/js/ga.js, live site only) counts visits and the actions rank, shortlist add/remove, share, legend and coffee click. See analytics.google.com.
Ads
Google AdSense Auto ads (ADSENSE_CLIENT in public/js/config.js, loader public/js/adsense.js, public/ads.txt, privacy policy at /privacy). Placement is controlled in the AdSense dashboard.
Setup (one time)
1. Google Sheet and Apps Script
Follow apps-script/README.md. At the end you have an address ending in /exec. Put it in public/js/config.js as SHEETS_URL.
2. Firebase Hosting
- https://console.firebase.google.com > Add project (Google Analytics not needed). The project is
mybto-ce84f, set in .firebaserc; Hosting uses the extra site mybto (mybto.web.app, with the custom domain mybto.sg on top).
- Build > Hosting > Get started. The site name must be
mybto so the default address is https://mybto.web.app (otherwise change the name in the Apps Script SAMPLE_URL).
- Deploy (needs a person to approve):
npx firebase-tools login, then npx firebase-tools hosting:sites:create mybto --project mybto-ce84f (once), then npx firebase-tools deploy --only hosting:site.
The old Vercel site and the old Firestore project are no longer used by the code.
Local development
npm install # no runtime dependencies; this only sets up the lockfile
npm run dev # http://localhost:3000, static site; SHEETS_URL in js/config.js decides where rankings go
npm run dev:fake # same, with a fake in-memory Google Sheet at /fake-sheets (what the browser test uses)
npm test # unit tests (scoring + analytics maths from apps-script/Analytics.js)
CHROMIUM=/opt/pw-browsers/chromium node test/e2e.browser.js # browser test of the full flow (needs Playwright)
