eagle-ai

byYashasvi paheriya

Act as a senior AI engineer, MLOps engineer, and 3D UI/UX designer. You are building a COMPLETE AI system called "VisionX". ⚠️ IMPORTANT CONTEXT: This project uses RF-DETR 2 from Roboflow for object detection. You MUST understand this pipeline: - Input image / webcam frame - Sent to Roboflow Inference API (or local inference server) - Model (RF-DETR 2) processes image - Returns predictions (bounding boxes, class labels, confidence) - Results are rendered visually on UI Your job is to build BOTH: 1. Frontend (Streamlit UI with 3D feel) 2. Proper integration with this AI pipeline -------------------------------------------------- 🔐 ENV VARIABLES (USE THESE) -------------------------------------------------- ROBOFLOW_API_KEY INFERENCE_MODE = "api" or "local" LOCAL_INFERENCE_URL = http://localhost:9001 HOSTED_INFERENCE_URL = https://serverless.roboflow.com -------------------------------------------------- 🧠 MODEL WORKFLOW (MUST IMPLEMENT) -------------------------------------------------- - Use inference-sdk (InferenceHTTPClient) - Dynamically choose endpoint: if INFERENCE_MODE == "local": use LOCAL_INFERENCE_URL else: use HOSTED_INFERENCE_URL - Send image to model: client.infer(image, model_id="rfdetr-medium") - Parse response: Extract: - bounding boxes - class names - confidence - Render using supervision: - BoxAnnotator - LabelAnnotator -------------------------------------------------- 🎨 UI DESIGN (PREMIUM) -------------------------------------------------- - Dark theme (#0f172a) - Glassmorphism (blur cards) - Neon glow accents (cyan/purple) - Smooth animations - Floating UI feel - Rounded corners -------------------------------------------------- 🌐 3D BACKGROUND (MANDATORY) -------------------------------------------------- Embed Spline or Three.js scene using: st.components.v1.html() -------------------------------------------------- 📐 UI STRUCTURE -------------------------------------------------- 1. HERO SECTION - VisionX 🚀 - AI-Powered Object Detection - Description: "VisionX is powered by RF-DETR 2 from Roboflow, delivering high-accuracy object detection using transformer-based architecture." - Add: "Built using Roboflow RF-DETR for state-of-the-art accuracy and real-time performance." -------------------------------------------------- 2. ABOUT SECTION - Explain system pipeline clearly: Input → Model → Detection → Output - Feature Cards: - Real-Time Detection - Transformer-Based Accuracy - Scalable AI Deployment -------------------------------------------------- 3. UPLOAD + DETECTION SECTION - Drag & Drop upload - Process image using model - Show: LEFT → Original image RIGHT → Annotated detection -------------------------------------------------- 4. LIVE DETECTION - Button: Start Webcam - Show placeholder or instructions -------------------------------------------------- 5. DASHBOARD - Show: - FPS (static or simulated if needed) - Objects detected - Avg confidence -------------------------------------------------- 6. FOOTER - "Built with AI • VisionX • Powered by Roboflow RF-DETR" -------------------------------------------------- ⚙️ SIDEBAR CONTROLS -------------------------------------------------- - Confidence slider - Model selector (nano → xlarge) - Toggle detection ON/OFF -------------------------------------------------- ✨ UI ENHANCEMENTS -------------------------------------------------- - Gradient animated text - Glow buttons - Hover scale effects - Blur glass cards -------------------------------------------------- 🧱 CODE STRUCTURE -------------------------------------------------- Functions: - render_hero() - render_about() - render_upload() - run_inference() - render_dashboard() - render_footer() -------------------------------------------------- 📦 OUTPUT FORMAT -------------------------------------------------- - Full working Streamlit code - Clean, modular, production-ready - No missing parts -------------------------------------------------- 🎯 GOAL -------------------------------------------------- Build a real AI product UI that understands the full ML pipeline — not just a frontend mock.

No preview

Comments (0)

No comments yet. Be the first!

Architecture

No Services Diagrams Yet

Architecture diagrams will be automatically generated when the Project Manager creates tasks for your project.

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

Landing: View Hero
Login: Sign In
Dashboard: Monitor Stats
Settings: Configure API Keys
Settings: Select Inference Mode
Settings: Manage Model Config

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

Landing: View Hero
Login: Sign In
Dashboard: Monitor Stats
Settings: Configure API Keys
Settings: Select Inference Mode
Settings: Manage Model Config