AI-driven interview

bySriharish. S

AI Interview Platform Website UI Prompt Design and build a modern, premium, AI-powered Interview Platform with a clean, futuristic, and professional appearance. The website should feel similar in quality to Stripe, Linear, Vercel, Notion, and OpenAI, with smooth animations and an excellent user experience. Theme Modern AI & SaaS style Minimal and clean interface Premium glassmorphism effects Rounded corners (16–20px) Soft shadows Subtle gradients Plenty of whitespace Fully responsive (Mobile, Tablet, Desktop) Fast loading Accessible UI Color Palette Primary: #4F46E5 (Indigo) Secondary: #7C3AED (Purple) Accent: #06B6D4 (Cyan) Success: #22C55E Danger: #EF4444 Warning: #F59E0B Background (Light): #F8FAFC Background (Dark): #0F172A Cards: White (Light) #1E293B (Dark) Text: #111827 (Light) #F8FAFC (Dark) Typography Font: Inter Heading Weight: 700–800 Body: 400–500 Buttons: Semi Bold Landing Page Sections Hero Section Include: Large headline: "Hire Smarter with AI-Powered Interviews" Subtitle: Automate resume screening, conduct AI interviews, evaluate candidates instantly, and streamline hiring with intelligent automation. Buttons: Get Started Book Demo Right Side: AI dashboard illustration or 3D-style graphic Floating analytics cards Resume score widget AI interview score widget Features Section Display feature cards with icons. Features: AI Resume Analysis AI Interview Generator Voice-to-Text Answers Webcam Recording AI Score Generation Performance Analytics Automated Email Results HR Dashboard Secure Authentication Cards should have: Hover lift effect Gradient icon background Smooth shadow animation How It Works Create a horizontal timeline: Register Upload Resume AI Resume Analysis Start AI Interview AI Evaluation HR Review Automatic Email Result Use connecting lines and animated icons. Dashboard Preview Show mock dashboard cards: Total Candidates Interviews Resume Score AI Score Analytics Chart Pass Rate Use glassmorphism cards. Statistics Section Animated counters: 20K+ Interviews 500+ Companies 98% Accuracy 50K+ Candidates Count-up animation on scroll. Testimonials Three premium testimonial cards. Hover animation: Slight scale Shadow increase Pricing Three pricing cards: Starter Professional Enterprise Highlight Professional plan. Footer Include: Company Features Contact Privacy Policy Terms Social Icons Candidate Dashboard Sidebar Navigation: Dashboard Resume AI Interview Results Analytics Profile Settings Logout Dashboard Cards: Resume Score AI Interview Score Completed Interviews Pending Interviews Charts: Performance Trend Skill Breakdown Recent Activity Table HR Dashboard Cards: Total Candidates Interviews Today Passed Failed Pending Review Candidate Table: Name Resume Score AI Score Status Actions Charts: Monthly Hiring Candidate Distribution Success Rate AI Interview Page Split layout: Left: AI-generated question Timer Progress bar Right: Webcam preview Microphone indicator Voice waveform animation Bottom: Previous Next Submit Resume Analysis Page Display: Overall Resume Score Progress bars: Skills Experience Education Projects Certifications AI Suggestions Card Strengths Weaknesses Missing Skills Result Page Large circular score indicator Overall AI Score Cards: Technical Communication Resume Confidence Decision Badge: Passed Failed Download Report button Animations Use subtle and smooth animations only. Hero: Fade-in Slide-up Floating dashboard cards Buttons: Scale to 1.05 on hover Soft glow effect Cards: Lift on hover Shadow transition Border glow Icons: Rotate slightly on hover Sections: Fade in on scroll Slide up on appearance Charts: Animate when visible Counters: Count up on scroll Sidebar: Smooth expand/collapse Page transitions: Fade + slide Loading: Skeleton loaders Animated spinner Notifications: Toast slide-in from top-right Avoid excessive animations that distract users. UI Components Navbar Hero Buttons Cards Modals Forms Tables Charts Sidebar Top Navigation Search Bar Profile Dropdown Toast Notifications Progress Bars Circular Progress Timeline Accordions Tabs Pagination File Upload Webcam Component AI Chat Bubble Analytics Widgets Technical Requirements Framework: Next.js (App Router) TypeScript Styling: Tailwind CSS shadcn/ui Animations: Framer Motion Icons: Lucide React Charts: Recharts Forms: React Hook Form + Zod Theme: Light/Dark mode toggle Design Principles: Reusable components Clean architecture Responsive layout Accessible (WCAG) Optimized performance Modern SaaS aesthetic Consistent spacing and typography Smooth micro-interactions Professional enterprise-quality UI suitable for an AI recruitment platform.