AI-Powered Floor Plan Lighting Design Canvas

My Role: Senior Full-Stack Developer

Tech Stack: Next.js, React, TypeScript, Fabric.js, AI, PostgreSQL, Tailwind CSS, Vercel

An AI-powered web application for designing, visualizing, and managing lighting layouts directly on architectural floor plans.

I developed an interactive canvas workspace where users can upload floor plans, place and customize lighting fixtures, use AI-assisted design suggestions, manage projects, and share layouts with clients and teams.

Manual lighting design is time-consuming and repetitive

Precise fixture placement across floor plans can be challenging

General-purpose tools require significant manual editing

Managing revisions and project versions can become disorganized

Client feedback and design sharing can be inefficient

AI-assisted lighting layout and fixture recommendations

Interactive Fabric.js canvas for floor plan editing

Drag-and-drop fixture placement and customization

Project management with auto-save and version history

AI-assisted workflows to reduce repetitive design work

Export and sharing functionality for client collaboration

Responsive UI focused on a fast and intuitive design experience

AI-powered lighting design assistance

Interactive Fabric.js canvas

Floor plan upload and visualization

AI-based fixture placement suggestions

Drag-and-drop lighting fixtures

Fixture positioning, resizing, and editing

Project management

Auto-save

Recent projects

Design export and sharing

Client collaboration workflows

Responsive UI/UX Web and Tablet

Built with Next.js, React, TypeScript, Fabric.js, AI, PostgreSQL, and Tailwind CSS.

I developed the interactive canvas engine using Fabric.js, including floor plan rendering, fixture placement, object manipulation, editing, and layout interactions. I also integrated AI-assisted lighting workflows that allow users to generate design suggestions and refine them directly on the canvas.

A key challenge was combining AI-generated suggestions with a flexible canvas editor, giving users full control to review, modify, and fine-tune AI-assisted lighting layouts.

Streamlined lighting design directly on architectural floor plans

Reduced repetitive manual design work through AI assistance

Enabled precise fixture placement through an interactive canvas

Simplified project and revision management

Improved the design review and collaboration workflow

Created a scalable foundation for AI-powered architectural design tools