AI Analytics Platform Frontend

AI-powered data tools often have technically capable backends but poor user experiences — intimidating interfaces, no visual feedback, and zero accessibility for non-technical users. Without an intuitive, polished frontend, even powerful AI tools go unused. The challenge was to build a frontend that makes interacting with AI data analytics feel natural and approachable for business users of all technical levels.

Designed and built the frontend across these pages for the organization's AI analytics platform: 1. Landing Page — Dark-themed, animated marketing page with glassmorphism solution cards, staggered fade-in animations, and mobile-responsive layout using Tailwind CSS. 2. AI Chat Interface — A full-featured chat UI supporting two AI models (the tool and the tool). Features include character-by-character AI typing animation, dynamic sortable tables with CSV export, model switching with background transitions, thumbs up/down feedback, reCAPTCHA integration, and a suggestion chip system. 3. Personas Page — A drag-and-drop memo builder with role-based tabs (Analysts, Directors, CXOs) and a custom "the tool" allowing users to assemble personalized insight packages. Design was ideated in Figma and built using HTML, CSS, JavaScript, Tailwind CSS, and Bootstrap. ChatGPT was used to accelerate animation development and design problem-solving.