Colla

A real-time AI search engine for developers that lets you share your screen, talk to AI, and debug code instantly.

Comment

login to test the product email : adewaleayomide619@gmail.com password: Richieart123

https://colla-524919266044.europe-west1.run.app/

Inspiration

As developers, we spend too much time context-switching between searching Stack Overflow, reading docs, and debugging. We wanted a single tool that could see what we see, hear what we describe, and respond intelligently in real time like a pair programmer that never sleeps.

What it does

Colla is a real-time AI-powered search engine built for developers. It combines:

AI Chat — context-aware conversations about your code Screen Sharing — share your screen so the AI sees your IDE, terminal, and browser in real time Voice Interaction — describe problems out loud and get instant spoken and written responses Live Code Analysis — bugs, optimizations, and security issues surfaced before they ship

How we built it

Frontend: React, TypeScript, Vite, Tailwind CSS, Framer Motion, Three.js (3D hero sphere)

Backend: Lovable Cloud (Supabase) for authentication, database, and edge functions

AI: Google Gemini API for real-time code analysis and conversational debugging

Gemini API — What We Use It For Colla uses the Google Gemini 2.5 Flash model through for all AI-powered features:

Real-Time Screen Analysis (Vision Mode) When a user shares their screen, Colla captures frames and sends them as base64 images to Gemini. The model analyzes visible code for bugs, anti-patterns, security issues, and provides a quality score (1-10).

AI Chat (Pair Programming) — A conversational chat where developers ask coding questions. Gemini maintains full conversation context and can also see the user's screen if sharing is active, acting like a smart colleague looking over their shoulder

Voice-to-Code Analysis — Voice input is transcribed and sent to Gemini, which interprets what the developer is describing and provides relevant code suggestions and fixes.

Code Correction & Debugging — Dedicated modes where Gemini acts as a code correction specialist or debugger, identifying syntax errors, logic bugs, memory leaks, and security vulnerabilities with severity-rated output.

Session Summaries — After a live analysis session, Gemini summarizes all findings into a structured code review report.

How it works technically: The frontend sends requests to a backend function (gemini-analyze), which constructs the appropriate system prompt based on the mode (voice/vision/chat/debug/correction), attaches any screen capture as an image, and calls the Gemini API. Responses are returned as markdown.

Deployment: Docker, Google Cloud Run, Nginx

Google Cloud Run — What We Use It For Colla is deployed on Google Cloud Run as a containerized application:

Hosting — The React frontend is built inside a Docker container with an Nginx server, then deployed to Cloud Run for scalable, serverless hosting.

Auto-scaling — Cloud Run automatically scales from zero to handle traffic, meaning we only pay for what we use.

Region — Deployed in europe-west1 for low-latency access.

CI/CD flow — We build the Docker image with docker build, push to Google Container Registry (gcr.io), and deploy with gcloud run deploy.

In short: Gemini is the brain (AI analysis), Cloud Run is the body (hosting and serving the app).

Challenges we ran into

1)Getting environment variables to persist correctly during Docker builds for production deployment

2) Handling z-index layering issues with navigation buttons across multiple pages

3) Making the Supabase client resilient so the app renders even when backend credentials are missing at build time

4) Optimizing the 3D sphere animation for mobile performance

Accomplishments that we're proud of

1) Built a fully functional AI-powered developer tool with screen sharing and voice input

2) Clean, modern landing page with smooth animations and responsive design

3) Real-time code analysis that surfaces bugs and suggestions as you work

4) Seamless authentication flow with email and Google sign-in

What we learned

How to integrate real-time AI analysis with screen capture APIs

Building resilient frontend apps that gracefully degrade without backend services

Docker multi-stage builds with environment variable management

The importance of z-index management in complex layered UIs

What's next for Colla

Built With

Share this project:

Updates