BrixoAI
Studio Platform & Website
Overview
BrixoAI is an AI-first technology & creative studio platform — a fully custom-built website and SaaS scaffold showcasing services in AI, data engineering, web development, and UI/UX design.
The platform features a RAG-powered AI assistant (BrixoAI) that answers questions about the studio's services and capabilities using a curated knowledge base. An admin portal and client dashboard are backed by Supabase authentication and role-based access control.
Built end-to-end — from brand identity and design system to full-stack development and AI integration — the project demonstrates the exact capabilities it promotes.
Architecture & Technologies
The front end is built on Next.js 14 (App Router) with TypeScript and Tailwind CSS, deployed to Vercel. The UI is driven by a custom CSS design system — responsive grid layouts, animated geometric shapes, and component-level class naming for consistent visual language across all pages.
Authentication and access control are handled by Supabase (PostgreSQL), enabling role-based routing for admin users and a client-facing dashboard. Contact form emails are dispatched via Resend. The project is structured around a clean monorepo with a separate FastAPI service for AI inference.
The AI back end is a FastAPI service powered by LangChain, ChromaDB for vector storage, and Sentence Transformers for document embeddings. The RAG pipeline indexes Markdown knowledge-base files and retrieves context to augment LLM responses served through Groq.
RAG-Powered AI Assistant
BrixoAI is a context-aware chatbot embedded in the studio website. It uses a Retrieval-Augmented Generation (RAG) pipeline to answer questions about services, approach, pricing and project case studies from a curated set of Markdown knowledge-base documents.
The pipeline splits documents into overlapping chunks, encodes them with Sentence Transformers, and stores the resulting vectors in ChromaDB. At query time, the top-K most semantically relevant chunks are retrieved and injected into the system prompt alongside conversation history before being sent to the LLM.
Category-based routing directs questions about specific service areas — AI & Chatbots, Data Engineering, Web Development, Design & UX — to tailored prompt templates, keeping responses focused and accurate.
Brand Identity & Design System
The BrixoAI brand pairs a deep dark-indigo base with a bold coral-red accent, conveying technical precision and creative energy. Geometric floating shapes scattered across hero sections give the interface a sense of depth and motion without relying on heavy animation libraries.
A custom CSS design system underpins the entire UI — variables for colour, typography and spacing ensure consistent styling across components. Icons from Font Awesome and Phosphor are used throughout to reinforce content hierarchy and usability.
Client Portal & Admin Dashboard
Supabase Auth powers secure login and session management across the platform. Role metadata stored in user profiles distinguishes admin users from standard clients — Next.js middleware enforces route protection and redirects unauthenticated requests before they reach protected pages.
The admin dashboard provides a central hub for managing client accounts and project data stored in Supabase's PostgreSQL database. The client-facing dashboard gives each user a personalised view of their active projects, status updates and shared deliverables.