Skip to content

adityaphasu/apple-3js

Repository files navigation

Apple 3js Website

This is a landing page clone of the Apple website using Three.js. The website consists of a 3D model of the Apple iPhone which can be rotated. The Carousel along with 3D model and videos are animated using GreenSock Animation Platform (GSAP).

Features

  • 📲 3D Model Interaction: Three.js renders a detailed 3D model of the Apple iPhone, allowing users to rotate and view it from different angles.

  • 🎞️ Dynamic Animations: Smooth, engaging animations for the 3D model, video content, and UI elements powered by GSAP.

  • 📐 Responsive Design: Responsive layout ensures the website looks great on all devices, from mobile phones to desktops.

  • 📜 Scroll Interactions: GSAP-powered scroll-triggered animations for an interactive storytelling experience.

  • 🎥 Video Carousel: Showcases additional iPhone content through an engaging video carousel.

  • 🖱️ Interactive UI Components: Custom navbar, feature sections, and footer designed for ease of navigation and enhanced user experience.

Technologies Used

React Three.js TypeScript GSAP Tailwind CSS Vite Prettier

Installation

  1. Clone the repository.
  2. Install the dependencies
npm install
  1. Run the development server
npm run dev
  1. Open http://localhost:5173 to view the page in the browser.

About

Apple - A clone website made using Three.js and GSAP

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published