BuildLink

💡 Inspiration

We noticed a massive disconnect in the construction industry. Homeowners struggle to visualize their ideas ("I want a modern villa") into technical terms, while licensed architects struggle to find qualified leads that match their specific style. We wanted to build a bridge—a tool that acts as a translator between imagination and construction.

🤖 What it does

BuildLink is an AI-powered architectural ecosystem.

• For Clients: It turns text prompts into technical CAD-style blueprints and converts basic sketches into photorealistic 3D renders using Google Gemini & Imagen. It then matches them with local architects.
• For Architects: It provides a professional "Operating System" to find leads, manage projects via a Kanban board, and verify their identity using biometric video authentication.

⚙️ How we built it

We built the entire application using React and TypeScript for type safety.

• UI/UX: We aimed for a premium, high-performance "Dark Mode SaaS" aesthetic using Tailwind CSS and Framer Motion for fluid animations.
• AI Power: We integrated the Google GenAI SDK. We used imagen-3.0 for blueprint generation and gemini-1.5-flash for the multimodal "Reality Renderer" (image-to-image processing).
• Data: We simulated a robust backend using a custom LocalStorage Context architecture to manage user sessions, projects, and chat messages without a server.
• Verification: We utilized the native browser MediaRecorder API to capture live video for the architect verification flow.

🧠 Challenges we ran into

The biggest challenge was Prompt Engineering for the AI. Initially, the AI generated artistic paintings of houses instead of technical blueprints. We had to implement a system of "hidden system prompts" that injects technical constraints (e.g., "top-down CAD view, blue paper, white lines") behind the scenes to ensure the output looks like a real architectural drawing.

🏅 Accomplishments that we're proud of

We are incredibly proud of the UI System. Achieving the deep dark aesthetic with subtle glows and glassmorphism required precise CSS tuning. We are also proud of the Biometric Verification feature, which makes the platform feel secure and professional.

📚 What we learned

We learned how to handle Multimodal AI (mixing text and images in one request) and how to manage complex global state in React without a traditional database. We also deepened our understanding of the Gemini API capabilities regarding image analysis.

🚀 What's next for BuildLink

The next step is to integrate a real backend (Supabase or Firebase) for live data syncing across devices. We also plan to add a 3D Model Viewer using Three.js so clients can walk through their AI-generated homes in real-time.

Built With

• css3
• framer-motion
• google-gemini-api
• html5
• javascript
• lucide-react
• react
• tailwind-css
• typescript
• vite