AI Chat Interface
A sleek chat UI integrated with OpenAI GPT-4, with streaming responses and conversation history.
Overview
A sleek chat UI integrated with OpenAI GPT-4, with streaming responses and conversation history. This project was built to solve a real-world problem, focusing on performance, accessibility, and a delightful user experience.
Key Features
- Responsive design across all screen sizes
- Dark and light mode with system preference detection
- Optimised for Core Web Vitals — 90+ Lighthouse score
- Fully accessible with WCAG AA compliance
- Deployed on Vercel with CI/CD pipeline
Tech Decisions
The stack was chosen for developer velocity and production reliability. React, OpenAI API, Vercel AI SDK, Tailwind CSS were key choices that enabled rapid iteration while maintaining code quality.
Challenges & Solutions
The biggest challenge was balancing performance with feature richness. Using static generation wherever possible, dynamic imports for heavy components, and image optimisation via next/image kept the bundle lean and load times fast.
Results
The project launched successfully and received positive feedback from users and stakeholders. Performance metrics exceeded targets and the codebase remains maintainable for ongoing feature development.