Skip to content

HorizonWeb is finally here... in NEXT.JS !

Notifications You must be signed in to change notification settings

Antoineview/HorizonWeb

Repository files navigation

HORIZONWEB

last-commit repo-top-language repo-language-count


🔗 Table of Contents


📍 Overview

HorizonWeb is an innovative web project designed using Next.js, Spline, and Framer Motion. It combines smooth 3D animations and intuitive scrolling mechanisms to deliver an immersive user experience across devices. Our introduction animation reflects our project's cutting-edge essence, while the timeline showcases HorizonLabs' milestones with seamless transitions.


👾 Features

  • 3D Intro Animation: Built with Spline for an immersive landing experience.
  • Smooth Scrolling: Synchronizes animations with page scroll for a fluid user experience.
  • Dynamic Timeline: Tracks HorizonLabs' history with elegant animations powered by Framer Motion.
  • Device Responsiveness: Ensures a consistent experience across all screen sizes.
  • Modular Components: Easy-to-maintain architecture with reusable React components.

📁 Project Structure

└── HorizonWeb/
    ├── .github
    │   └── workflows
    ├── README.md
    ├── eslint.config.mjs
    ├── jsconfig.json
    ├── next.config.mjs
    ├── package-lock.json
    ├── package.json
    ├── public
    └── src
        └── app

🚀 Getting Started

☑️ Prerequisites

Before getting started with HorizonWeb, ensure your runtime environment meets the following requirements:

  • Programming Language: JavaScript
  • Package Manager: Npm

⚙️ Installation

Install HorizonWeb using one of the following methods:

Build from source:

  1. Clone the HorizonWeb repository:
❯ git clone https://github.com/Antoineview/HorizonWeb
  1. Navigate to the project directory:
cd HorizonWeb
  1. Install the project dependencies:

Using npm  

❯ npm install

🤖 Usage

Run HorizonWeb using the following command: Using npm  

❯ npm start

🧪 Testing

Run the test suite using the following command: Using npm  

❯ npm test

📌 Project Roadmap

  • Task 1: Fix Smooth Scrolling
  • Task 2: Add a download button for the game.
  • Task 3: Change the game image to reflect our game.

Contributor Graph


About

HorizonWeb is finally here... in NEXT.JS !

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published