Skip to content

AyushMann29/EatNFun

Repository files navigation

EatNFun

Welcome to EatNFun, the ultimate destination for board game enthusiasts who love boba tea and small bites! Our website offers a vibrant space for gamers to indulge in fun activities while enjoying delicious refreshments.


🎯 Project Overview

EatNFun is designed to showcase our café's offerings, host board games, and provide an engaging user experience for all.


🔧 Developer Requests

  1. UI/UX Design: A visually appealing and user-friendly interface.
  2. Cafeteria Menu: Showcase our tasty offerings.
  3. Games & Fun: Incorporate board games and interactive features.
  4. Aesthetics: Ensure the site reflects a cool, relaxed vibe.

🚀 Project Goals

  • User-Friendly Design: Craft a seamless and approachable UI/UX.
  • Events Calendar: Display upcoming events and activities.
  • Interactive 3D Menu: Use Three.js or A-Frame for a unique, immersive menu experience.
  • Mobile Responsiveness: Ensure smooth usability across all devices.
  • Brand Identity: Effectively communicate the essence of the EatNFun brand.

🛠 Technologies Used

  • Frontend: HTML, CSS, JavaScript
  • Animations: GSAP (GreenSock Animation Platform)
  • 3D Graphics: Three.js
  • Version Control: Git, GitHub

🎮 Features Implemented

  • Responsive Navigation Bar: Dropdown menus with smooth GSAP animations.
  • Dynamic Home Page: A captivating landing page showcasing our main offerings.
  • Events Calendar: JavaScript-integrated calendar to keep users updated on upcoming events.
  • Cafeteria Menu: Stylish menu layout with CSS grid and engaging animations.
  • Interactive 3D Menu: Explore menu items in a virtual environment using Three.js.
  • Contact Page: Contact information for key personnel, complete with form functionality.

⚙️ Challenges Faced

  • Integrating complex animations while ensuring smooth transitions.
  • Optimizing Three.js performance across various devices.
  • Ensuring cross-browser compatibility and responsiveness.

🌟 Future Enhancements

  • Real-time updates for the events calendar.
  • Improved accessibility and SEO optimization.
  • Expanded 3D menu with even more interactive elements.

💻 Running the Project

  1. Clone the project repository:
    git clone https://github.com/your-repository/eatnfun.git
  2. Navigate to the project folder and open index.html in your browser.

Conclusion

The EatNFun project is a collaborative effort to deliver an engaging and functional website for our board game café. By leveraging modern web technologies, we've crafted a unique experience that brings the EatNFun vibe online!