red-portfolio

As a visitor, I want every UI element to consistently reflect the Dynamic Glassmorphism Dashboard design language so that the portfolio feels intentional and visually unified. This task involves auditing all components for color compliance, applying the Deep Midnight Blue to Steel Blue gradient palette, enforcing Vivid Crimson Red accent usage, standardizing glass-effect card surfaces, and validating typography scale across all reusable components.

As a visitor, I want to land on a visually striking home page with a 3D animated avatar, particle background, and clear navigation entry points so that I am immediately captivated and can intuitively explore the portfolio. This task implements the Home (v2) JSX design including the hero section with Monin's name and title ('SDE-2 at fxis.ai'), 3D avatar animation, particle canvas, floating glassmorphism navbar, call-to-action buttons, and smooth scroll transitions. Entry point for all user flows (Portfolio Owner, Employers, Collaborators).

As a visitor, I want to read a compelling personal biography with glassmorphism cards and micro-interactions so that I can quickly understand who Monin Modi is, his background, and his values. This task implements the About (v2) JSX design including the bio section, glass-effect profile card, personal timeline, and hover micro-interactions. Navigated to from Home in both the Portfolio Owner and Employer flows.

As a collaborator or employer, I want to view Monin's technical skills organized with animated progress indicators and categorized glassmorphism cards so that I can quickly assess his expertise and technical depth. This task implements the Skills (v2) JSX design including animated skill bars, technology category cards, proficiency indicators, card hover effects, and icon integrations. Navigated to from Home in the Collaborator and Employer flows, leads to Contact and Experience respectively.

As an employer, I want to browse Monin's professional experience in an interactive timeline with glassmorphism cards so that I can evaluate his career progression and role at fxis.ai as SDE-2. This task implements the Experience (v2) JSX design including the vertical timeline, company cards for fxis.ai and 8080.ai, role descriptions, date range indicators, card hover animations, and achievement highlights. Navigated to from About (Portfolio Owner flow) and from Skills (Employer flow).

As a visitor, I want to explore Monin's portfolio projects in an interactive card grid with demo links and technology tags so that I can evaluate the quality and breadth of his work including 8080.ai. This task implements the Projects (v2) JSX design including the project card grid, technology tag chips, demo and source code links, glassmorphism card hover effects, filtering controls, and project detail previews. Navigated to from Experience (Portfolio Owner), Home (Collaborators), and Experience (Employers).

As a visitor, I want to reach out to Monin through a sleek contact form with glassmorphism styling and social media links (email, LinkedIn, GitHub) so that I can easily initiate collaboration or employment inquiry. This task implements the Contact (v2) JSX design including the contact form, input field micro-interactions, social media icon links, glassmorphism card layout, form validation feedback, and submission handling. Final destination in all three user flows.

As a visitor, I want smooth, delightful animations and micro-interactions throughout the portfolio so that browsing feels engaging and modern without sacrificing performance. This task covers refining particle animation timing, 3D avatar cursor-response interactions, page transition animations, scroll-triggered reveal effects, button and card hover states, and ensuring consistent animation easing curves across all six pages.

As a visitor on any device, I want the portfolio to render correctly on mobile, tablet, and desktop screens with accessible keyboard navigation and screen reader support so that no user is excluded. This task covers responsive breakpoints for all six pages, touch interaction support, ARIA label audits, WCAG 2.1 color contrast compliance, focus indicator visibility, and glassmorphism fallbacks for lower-end devices.

As a recruiter or collaborator searching online, I want to discover Monin Modi's portfolio through search engines with accurate titles, descriptions, and structured data so that his professional presence is maximally visible. This task covers adding Open Graph tags, Twitter card metadata, JSON-LD structured schema for a person and portfolio, canonical URLs, sitemap generation, and semantic HTML audits across all six pages.

As a visitor, I want the portfolio to load within 3 seconds and run smoothly even on slower connections so that I can browse without frustration. This task covers lazy loading images and components, code splitting per route, particle animation performance profiling, glassmorphism backdrop-filter optimization, bundle size audits, Lighthouse score improvements targeting 90+, and asset compression configuration.