caroline-plus

🎬 What Inspired Me

As a product-minded tech student, I wanted a portfolio that didn’t just list projects but told a story. I’ve always loved Netflix's immersive feel, so I designed my site to feel like a streaming platform—with hover effects, interactive carousels, embedded case studies, and even a chatbot with sound effects.

This project was built during the PortXFolio Hackathon to push my skills in design and technical development. I wanted every section to feel intentional—like a product you’d want to explore.

🛠️ How I Built It

• Framework: React + Vite
• Styling: Tailwind CSS
• Deployment: Vercel
• Extras:
  • Slide-based hero section with sound transitions 🎵
  • AI chatbot with bloop sound, typing animation, and FAQ logic 💬
  • Real-time resume download + pitch deck embeds 📄
  • Responsive design for mobile, tablet, and desktop 💻📱
  • Accessibility tags and alt text for screen-readers ✅

🧠 What I Learned

• How to create a fully responsive experience using Tailwind utility classes
• How to use useRef and audio playback inside React
• How to structure interactive components (flip cards, modals, iframes)
• How to handle merge conflicts and Git-based deployment workflows
• The power of storytelling in product-focused design

🚧 Challenges I Faced

• Styling and scaling animations across different screen sizes
• Making the chatbot accessible yet visually dynamic
• Embedding PDFs that worked across mobile browsers
• Syncing code changes with GitHub + Vercel deploys
• Maintaining a clean layout while including lots of interactive content -Pushing code to GitHub, had to make and delete several repositories before full code finally pushed

This wasn’t just about building a site — it was about telling my story through product thinking, creative UX, and a little bit of drama. 🎭✨

Built With

• react
• tailwind
• vercel
• vite