Khan Academy Replica - Pixel Plus Hackathon
This project is a pixel-perfect replica of Khan Academy's home page, created for the Pixel Plus hackathon using Windsurf deployment technology. The goal was to recreate the Khan Academy website with high fidelity while adding a custom feature to enhance the learning experience.
- Pixel-perfect reproduction of Khan Academy's home page
- Identical visual elements including fonts, spacing, colors, and layout
- Responsive design matching the original site
- Mock data implementation to simulate the look and feel of the original site
Floating Quiz Chatbot: A unique feature added to the replica that helps evaluate a user's proficiency in any given subject. The chatbot:
- Provides interactive quizzes based on the subject area
- Evaluates user knowledge through adaptive questioning
- Offers personalized feedback and recommendations for improvement
- Floats on the page for easy access while browsing content
- Single HTML implementation containing all necessary code
- Client-side only (no backend requirements)
- CSS styling to match Khan Academy's design system
- JavaScript for interactive elements and the custom quiz chatbot
This project is built using Windsurf and deployed using github pages.
This replica serves as a demonstration of frontend development skills, with a focus on attention to detail in visual reproduction while adding value through the custom quiz chatbot functionality.
- All code must be contained in a single HTML file
- No backend services required
- Must match the original site as closely as possible in terms of visual elements