The Idea
CollabAI explored a simple bet: smaller AI models can feel much more capable when the product gives them durable context, structured memory, and the right collaboration environment.
Project archive / AI workspace concept
CollabAI made context
the product.
A collaborative AI workspace concept built around persistent memory, retrieval, and structured project context so lightweight models could reason with the right information at the right time.
Workspace graph
Shared context layer
Built
Dec 2025
Focus
Context AI
Repos
Frontend + backend
Stack
Next.js / Express
System loop
1Create whiteboard context
2Connect chat nodes and frames
3Sync presence through sockets
4Persist shared workspace state
Context✦Collaborate✦Intelligence✦Memory
What it was
A workspace for AI that remembered the work.
The Product Surface
The experience was designed around shared workspaces where people, documents, prompts, and model outputs could compound into a reusable knowledge layer instead of disappearing after every chat.
The System
The December 2025 build included a real Next.js frontend and an Express backend for auth, whiteboards, chat nodes, realtime presence, persistence, and collaborative state recovery.
Product capabilities
The core concept behind CollabAI: persistent context, shared memory, and AI collaboration that follows the work.
Context is the Real Intelligence
The product thesis was that useful AI depends less on isolated prompts and more on durable context.
Smaller Model Leverage
Lightweight models can perform above their weight when memory, retrieval, and task structure are designed into the product.
Adaptive Workspaces
Shared environments where people, documents, and AI outputs become reusable project knowledge.
Context-Driven Search & Memory
Retrieval and memory systems designed to help humans and models find the right context faster.
Context is the Real Intelligence
Useful AI depends less on isolated prompts and more on the right information arriving at the right time.
Collaborative AI Workspaces
Shared spaces where teams, documents, and model outputs keep compounding into project memory.
Smaller Model Leverage
Smaller models become more useful when the product supplies structure, memory, retrieval, and task-specific context instead of asking them to infer everything from scratch.
Adaptive Model Environment
Spaces where lightweight models can collaborate, route work, and adapt
Multi-Model Collaboration
Different models working together around the same shared context
Context-Driven Search & Memory
Retrieval that helps people and models reconnect with the right project knowledge
Structured Thinking Spaces
Documents, canvases, and workspaces designed for collaborative reasoning
Context Evolution
Project context grows richer as humans and AI keep working in the same system
Frontend + backend
Real product screenshots, not mockups.
The frontend and backend were run locally with seeded demo data so the archive can show the actual CollabAI product surfaces instead of illustrative placeholders.
Frontend screenshot
Workspace dashboard
The real Next.js dashboard showing whiteboards, workspace search, quick creation, recents, and authenticated user context.
Collab-AI-Frontend
Frontend screenshot
Collaborative canvas
The real whiteboard surface with persisted nodes, frames, text boxes, links, side panel metadata, canvas controls, and live connection status.
Collab-AI-FrontendReference diagrams
The build had enough system depth to document.
These diagrams summarize how the December 2025 frontend and backend were meant to work together: authenticated workspaces, realtime room state, persistent canvas objects, and AI chat context living inside the same product surface.
System map
Frontend, API, realtime, and storage boundaries
A compact view of how the public product build was split across the Next.js client, Express API, realtime Socket.IO layer, and persistence services.
Next.js app
Dashboard, whiteboard routes, protected workspace UI, canvas tools, and chat surfaces.
Express API
Auth callbacks, whiteboard endpoints, chat routes, permissions, rate limits, and state reads.
Socket.IO
Room membership, cursor presence, element movement, reconnection, and live canvas events.
MongoDB
Users, whiteboards, chats, nodes, frames, text boxes, messages, and connections.
Redis
Presence cache, room coordination, cursor state, and fast collaboration metadata.
Security
OAuth, refresh tokens, CORS, Helmet headers, authorization checks, and throttling.
Realtime loop
How collaboration state stayed smooth
The product was designed around low-latency interaction first, with server persistence and conflict checks backing the collaborative canvas.
01
Canvas action
A collaborator moves a node, edits a frame, creates a chat block, or reconnects to a shared whiteboard.
02
Local optimism
The frontend keeps the canvas responsive while batching movement, selection, and edit state.
03
Socket room
Socket.IO broadcasts the delta to the whiteboard room with presence and cursor metadata.
04
Version check
The backend resolves stale writes, persists the current state, and restores full state on reconnect.
05
Shared state
Every active client receives the same room update without needing a hard refresh.
Object model
The workspace graph behind the UI
The canvas was not just visual decoration. It mapped product objects that could be stored, restored, connected, and used as context for AI collaboration.
Whiteboard
Persistent shared workspace
The board owned the canvas state, collaborator access, chat nodes, visual groups, connection graph, and the recoverable state needed after reconnects.
Chat nodes
Prompt surfaces attached to work areas, model context, and conversation history.
Frames
Named visual sections for grouping product thinking, documents, and research chunks.
Connections
Edges between nodes, frames, messages, and supporting canvas objects.
Permissions
Owner, editor, and viewer roles layered over shared rooms and protected routes.
Backend repo
Realtime API and collaboration layer
The backend is represented as architecture evidence rather than a fake UI screenshot: Express routes, MongoDB persistence, Redis presence, Socket.IO rooms, auth, security, and reconnection logic.
Collab-AI-BackendGoogle OAuth + JWT refresh
MongoDB models for users, whiteboards, chats, nodes, frames, text boxes, and messages
Socket.IO rooms with Redis-backed presence and cursor sync
Realtime reconnection, full-state restore, and throttled movement broadcasts
Helmet headers, CORS, rate limiting, permissions, and conflict resolution
Build notes
Built as a real full-stack product, then archived.
This repository now sits on top of the actual CollabAI frontend and backend work. It gives reviewers a fast read on the product architecture, shipped surfaces, and collaboration mechanics without requiring them to run the authenticated app locally.
What this version demonstrates
Next.js frontend with dashboard views, whiteboard cards, chat routes, canvas tooling, and auth-protected workspace flows
Interactive canvas model with chat nodes, connections, frames, text boxes, creator badges, share dialogs, and side-by-side chat panels
Express and TypeScript backend with Google OAuth, JWT refresh, MongoDB models, rate limiting, Helmet security headers, and API routes
Socket.IO collaboration layer with Redis-backed presence, cursor sync, throttled element movement, reconnection, state sync, and conflict resolution
Timeline
From prototype to handoff
Concept
Context-first AI collaboration
Defined the product thesis around making AI assistance more useful through persistent project context rather than isolated prompt sessions.
Prototype
Full-stack workspace build
Built the product frontend and backend around whiteboards, contextual chat nodes, realtime collaboration, authentication, and persistent project state.
Archive
Portfolio-ready case study
The old public landing page has been reframed as a project archive that links the frontend, backend, and original public repo without implying an active launch funnel.
Project archive - built Dec 2025 - frontend + backend included