TNC Housing — Responsive Property Booking Experience

Modernized a real-estate marketplace with responsive UX, lead scoring, and real-time inventory sync across partner CRMs.

Role: Frontend + platform engineerTimeframe: 6-week engagementStack: Next.js • Tailwind • Express • PostgreSQL • Mapbox • SendGrid
ReactNext.jsTailwindExpressPostgreSQLMapsAnalytics
TNC Housing — Responsive Property Booking Experience
At a glance
  • Problem
    Modernized a real-estate marketplace with responsive UX, lead scoring, and real-time inventory sync across partner CRMs.
  • Role
    Frontend + platform engineer
  • Timeframe
    6-week engagement
  • Stack
    Next.js • Tailwind • Express • PostgreSQL
  • Focus
    React • Next.js • Tailwind
  • Impact
    Lead quality: +25%
Lead quality
+25%
Mobile conversions
+33%
Page load
-47%

Problem

Modernized a real-estate marketplace with responsive UX, lead scoring, and real-time inventory sync across partner CRMs.

Context

S — TNC Housing matched students with affordable rentals but ran on a legacy UI that broke on mobile and left agents blind to funnel analytics. Inventory came from three different CRMs with conflicting schemas. T — Deliver a responsive experience, unify listings, and add lead scoring so sales only respond to verified prospects.

Responsive property booking UX with lead scoring

Next.js UI boosts mobile conversions and clarity.

Lead scoring enriches agent follow-up with verified context.

Inventory normalization + analytics for a housing marketplace

Listings are deduped and synchronized across partner CRMs.

Search filters and map performance improve discovery.

Architecture

  1. Built a Next.js front-end with skeleton loading, card-based IA, and offline-friendly image handling to keep mobile sessions sticky.
  2. Normalized listings through an Express API + cron jobs that dedupe by geohash + landlord ID, flagging anomalies for manual review.
  3. Designed filterable search (price bands, transit time, roommate policy) backed by Postgres materialized views for snappy queries.
  4. Implemented lead scoring using hidden fields + SendGrid automations; agents get enriched context (budget, move-in date, docs status).
  5. Optimized map interactions by lazy-loading Mapbox tiles and offering list-first view to avoid GPU spikes.
  6. Added analytics dashboards so ops can see conversion per traffic source and adjust ad spend.

Security / Threat Model

  • Listings desynced nightly, creating duplicates and stale pricing.
  • Search UX lacked filters for budget, commute, or amenities.
  • Forms produced unqualified leads, wasting agent hours.
  • Map embeds tanked performance on mid-range Android devices.

Tradeoffs & Lessons

Marketplaces win trust when data, UX, and sales ops feel aligned. Owning the ingest pipeline plus the UI let us police inventory quality and prove impact quickly to business stakeholders.

Results

Qualified leads rose 25%, mobile conversions jumped 33%, and page load times nearly halved. Agents cut follow-up time because submissions now include verified preferences, and duplicate listing complaints dropped to near zero. The refreshed UX became the reference build for TNC’s white-label partners.

Stack

Next.jsTailwindExpressPostgreSQLMapboxSendGrid

FAQ

How are duplicate listings reduced?

Geohash + landlord ID deduping with nightly sync keeps inventory clean.

How is mobile performance improved?

Lazy loading and list-first map views reduce GPU and network strain.

What outcomes were achieved?

Lead quality and mobile conversions increased while load times dropped.

    TNC Housing — Responsive Property Booking Experience — Case Study