The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
AI Surveillance & Activity Recognition System
Built a real-time AI-powered surveillance platform for intelligent monitoring, object detection, and security analytics. The system leverages deep learning and computer vision to detect people, vehicles, unattended objects, and suspicious activities across multiple camera streams.
Key Features
Real-time person, vehicle, and object detection
Automatic Number Plate Recognition (ANPR)
Facial recognition and identity verification
Multi-object tracking using ByteTrack
Unattended baggage and boundary breach detection
Crowd monitoring and suspicious activity recognition
Real-time alerts and monitoring dashboard
Optimized for high-performance GPU deployment
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Related posts
Figma Make isn't just a prototyping tool. I used it to ship a Claude-powered design system generator.
Most designers treat Figma Make as a quick vibe-coding sketchpad. I wanted to show it's something deeper — a full vibe-coding platform that integrates with external APIs.
The connection nobody writes about
There are three ways Claude connects to Figma today. Figma MCP — Claude reads and writes Figma files via MCP server. Figma's built-in AI — Figma calls its own models internally. And mine — a React app inside Figma Make that calls Claude API directly from the browser. Claude responds to the code, not to Figma. Figma Make is the hosting.
The new pipeline
Old approach: get brandbook and references from client → generate moodboard → align → write prompts for UI Kit. Separate steps, human in the center every time.
My approach: collapse all of that into one step. Run an AI analysis and output structured data — input for machines, not a result for humans.
We don't ask AI how the brand looks. We run an MRI on it and get structured data that machines use to build code.
What gets generated
11 files, all consistent with each other because they share one analysis. For Figma specifically:
tokens.json — W3C DTCG 3-tier format (primitive → semantic → component), imports directly into Figma Variables via Tokens Studio or Figma Make prompt
design-system.css — all tokens as CSS custom properties, ready to import
starter.tsx — paste into Figma Make, full design system renders instantly
figma-make.md — session context, paste once and the AI knows the entire design system
Add a content plan on top — generate a full design in one run with minimal token spend.
The entire tool was built and shipped inside Figma Make. No external hosting. No separate codebase.
#ConfigMakeathon #FigmaMake #DesignSystem #VibeCoding #ClaudeAPI #BuildInPublic
tNot gonna lie, I opened this out of curiosity and left with more questions than answers 😅 But that's usually a good sign. Really interesting exploration of what design workflows might look like in the AI era. And by the way, this link doesn't work figma-make.md
Title:
I built a design system generator inside Figma Make. Here's the workflow.
The problem I kept running into: every new client project meant re-explaining the brand to every AI tool from scratch. Figma Make didn't know the colors. Cursor didn't know the tokens. Claude didn't know the rules. I was the shared memory — and I kept losing things.
So I built Design System Gen. Entirely inside Figma Make. Powered by Claude API.
The workflow:
Upload brand references → Claude API analyzes them across 8 dimensions (palette, mood, typography, composition, lighting, texture, motion, UI DNA) → structured data, not vibes → generates 11 files, each formatted for a specific tool in your stack.
figma-make.md → paste once, Figma Make knows your entire design system
design-system.css → all tokens as CSS custom properties
tokens.json → W3C format, imports directly into Figma Variables
starter.tsx → React starter with tokens already bound
.cursorrules → Cursor knows your system from root
Claude.md → Claude reads it automatically every session
+ 5 more for docs, LLMs, prompts, components
Every tool gets its own context file. All consistent with each other.
The part I'm most proud of: I'm a designer. I don't write code. The entire tool — UI, API integration, file generation logic — was built and shipped inside Figma Make. No external hosting. No separate codebase.
Live at: vibecodingdsgen.figma.site
Add your Claude API key and try it with your own moodboard.
#FigmaMake #DesignSystem #VibeCoding #AI #Claude #UXUI #DesignSystems #ConfigMakeathon
As someone who constantly jumps between Figma, Claude, ChatGPT, Cursor, Lovable, and other AI tools, this problem feels very familiar 😅
The tools are getting smarter, but keeping context consistent is still surprisingly manual. Love seeing people tackle that gap.
Multi-Agent AI & RAG Knowledge System for Real Estate
The challenge: Design a complete agentic AI architecture for a real-estate marketplace — one capable of serving buyers, sellers/brokers, and document-verification workflows through specialized AI agents, grounded in real data rather than free-floating LLM responses.
What we built: A full multi-agent system design comprising a fleet of specialized agents (a buyer-facing conversational concierge, a seller/broker AI co-pilot, a document/listing verification agent, and a pricing-valuation agent), coordinated through a central model-routing and orchestration layer. The system is grounded by a Retrieval-Augmented Generation (RAG) pipeline spanning multiple structured knowledge bases (legal/regulatory corpus, market pricing data, locality/infrastructure data) plus a graph-based knowledge layer linking listings, agents, leads, and locations for relationship-aware retrieval — with human-in-the-loop approval gates on consequential actions.
The outcome: A complete, implementation-ready technical architecture covering agent orchestration, RAG pipeline design (vector + graph retrieval), model-routing strategy, and safety guardrails — the kind of specification an engineering team can build directly from.
What are you using for a harness
Trending
Claude
Claude has entered the design space. How are you using Claude Design?
Contra University
Learn from expert creatives how to earn more using next-gen AI tools.
MagicPath
The canvas is infinite, and exploration is becoming the workflow. How are you using MagicPath?
creativeaiflow
Creative AI workflows are evolving. What tools do you use, and what are their strengths and weaknesses?
freelancerlife
Freelancer life is wins, pivots, and everything in between. What’s yours right now?