Home/Case Studies/Officebanao
CASE STUDYSAAS / B2B SOFTWARE · COLLABORATIVE 2D SPACE PLANNING TOOL

Officebanao

A commercial interiors platform pairing a collaborative 2D space planner with real-time multi-user editing and Git-like version control, plus end-to-end procurement management.

53Weeks operated
8k+Hours of work
8Engineers

The brief

Build and extend a multi-product platform for OfficeBanao — a seed-stage commercial interior design and procurement company — covering a 2D space planning tool for architects/designers, a full-stack B2B procurement/OMS system for furniture/fit-out procurement with vendor management and approvals, a Shopify-based B2B e-commerce store, and a project/workbench management system for construction project tracking.

What we built

A comprehensive commercial interior design and procurement platform consisting of four interconnected products:

  • Space Planner – a browser-based 2D layout editor with drag-and-drop walls/doors/furniture, real-time multi-user collaboration via WebSockets, a Git-like version control system (commits, branches, forks, rollback), role-based access control, markup mode, comment threads with Redis Pub/Sub, circuit breaker resilience, and a dark-mode UI
  • OMS/Procurement Platform – end-to-end vendor and order management covering quotation-to-order flow, VPO/PI/IPO 2-level approvals, ASN/W-ASN, GRN with warehouse cost-price calculation, returns with e-way bill, debit/credit notes, supplier payouts, TAT engine, pricing engine with vendor-region-cost-price mapping, bulk SKU management, and LeadSquared + AiSensy WhatsApp integrations
  • Shopify E-Commerce Storefront (officebanao.store) – a B2B storefront with custom authentication, Request Quote flow, price hiding by SKU/category, area/project-based cart, shareable cart links, and Google Analytics user tracking
  • Workbench – a construction project management tool with BOQ (addendum, descoping, approval), payment milestones, project flow, task manager, design quiz, site attendance, MIS dashboard, and Excel-based reporting.
⊛ Live in production

Space Planner canvas on production with version control, real-time locking, and comment system (released Nov 28 2025 with circuit breaker added Mar 2026); OMS procurement platform on production with VPO/PI approvals, returns, e-way bill, supplier payouts, pricing engine, and WhatsApp/LeadSquared integrations; Shopify storefront live at officebanao.store with custom auth, Request Quote, and project-based cart; Workbench live with BOQ addendum, payment milestones, project flow, and MIS dashboard.

How it was built, phase by phase.

8 workstreams across 53 weeks of operated delivery

  1. (001)BUILDWeek 1 – Week 53

    Space Planner – 2D Layout & Canvas Engine

    Core drag-and-drop 2D floor-planning canvas with walls, doors, windows, rooms, furniture, real-time measurements, layer control, and property panels for every element type. Iterated extensively throughout the engagement.

    ✓ Full-featured 2D layout editor with multi-element property panels, dark mode, floor management, and persistent canvas state.

    React JsNode JsSocket.ioRedisAWS S3MUI
  2. (002)BUILDWeek 1 – Week 53

    Procurement & Order Management System (OMS)

    End-to-end procurement platform: quotation-to-order flow, VPO lifecycle (draft, approval, dispatch), ASN/W-ASN, GRN, PI/IPO approvals, vendor onboarding, returns, debit/credit notes, supplier payouts, and short-close.

    ✓ Full-stack procurement platform live with VPO 2-level approvals, GRN, returns, e-way bill, debit/credit notes, supplier payouts.

    React JsNode JsTypesenseSAPAiSensyE-Way Bill API
  3. (003)BUILDWeek 2 – Week 32

    Moodboard & DAM Library

    Design Asset Management library integrated with moodboard creation flow including furniture/render/3D data, DAM tagging, duplicate-name resolution, marker copy, and a full redesign using React Design Editor.

    ✓ Redesigned moodboard with drag-and-reshape for all shapes, DAM library tagging, duplicate name handling, and marker/asset copy.

    React JsNode JsReact Design EditorAWS S3DAM
  4. (004)BUILDWeek 4 – Week 20

    Version Control System (VCS) for Drawings

    Git-like version control for design drawings: commits, branches, auto-save, rollback, forking, collection/option duplication, a full commit graph API, and a side-panel UI with timeline history.

    ✓ Full commit-graph, branching, forking, and rollback system for drawing files with Swagger-documented APIs and frontend side-panel.

    Node JsReact JsReduxMUI TimelineAWS CodeCommitSwagger
  5. (005)BUILDWeek 4 – Week 43

    Shopify E-Commerce Storefront & Custom Authentication

    Custom Shopify storefront for officebanao.store: multi-layer navigation, product filters, price hiding by tag/category, Request Quote flow with custom auth, cart with area-based project selection.

    ✓ Live e-commerce store at officebanao.store with B2B quote-request flow, custom auth, price hiding, area/project-based cart, shareable cart links.

    ShopifyLiquidReact JsGoogle AnalyticsWhatsApp APIAWS S3
  6. (006)INTEGRATEWeek 5 – Week 43

    Real-Time Collaboration – Locking, Sockets & Pub/Sub

    WebSocket-based multi-user collaboration with file locking (heartbeat), read/write user roles, Redis adapter, Pub/Sub for comment notifications, and circuit breaker resilience pattern.

    ✓ Production-grade real-time collaboration with heartbeat locking, Redis Pub/Sub comment notifications, tab-duplication lock isolation.

    Socket.ioRedisNode JsCircuit Breaker patternAWS
  7. (007)INTEGRATEWeek 10 – Week 30

    WhatsApp & CRM Integration (AiSensy / LeadSquared)

    WhatsApp automation via AiSensy for ASN OTP, e-way bill notifications, order listing chatbot, escalation/concern tickets, and full LeadSquared CRM bidirectional sync for accounts, RFQs, and opportunities.

    ✓ Live WhatsApp OTP, order-status chatbot, raise-concern flow, e-way bill notifications, and LeadSquared bidirectional sync for accounts, RFQs.

    AiSensyWhatsApp Business APILeadSquaredNode JsAWS S3Webhooks
  8. (008)BUILDWeek 20 – Week 38

    Pricing Engine & Vendor Region Cost Price

    Dynamic pricing engine with vendor-region-group cost price mapping, list price / discount / markup management, bulk upload/download with Excel, SKU-level margin tracking, price-change logs, and cron-based export.

    ✓ Live pricing engine with region groups, vendor-CP mapping, bulk upload/download, price-change logs, margin management.

    Node JsReact JsExcel/XLSXCron JobsAWS S3Typesense

Related work

More case studies from the same space.

Compport
SaaS / B2B Software(001)

Compport

Comp SaaS Enterprise Scaling

An enterprise compensation platform hardened for tenants of 100K+ employees, with interactive org charts, multi-level approval workflows, and 30+ analytics report widgets.

89 weeks27 engineers
Fanclash
SaaS / B2B Software(002)

Fanclash

Kafka Event Driven Video Pipeline

An esports fantasy platform spanning mobile and web gameplay, with a real-time Kafka video pipeline that auto-generates highlight clips and publishes them to social media.

85 weeks12 engineers
Voiro
SaaS / B2B Software(003)

Voiro

Adtech SaaS Feature Augmentation

Feature and QA acceleration for a leading ad-ops SaaS, delivering media planning workflows, an RBAC console, a self-service brand portal, and a full automated test suite.

92 weeks6 engineers

Stop renting hours. Start running functions.

Pick the function you want off your plate. We map the brain and name the outcome before you commit.

Talk to us →All case studies