© Made by Adam Bellanger
← ProjectsPersonal

My first portfolio, started in my first year of BTS SIO: an interactive Three.js 3D scene in the background.

Stack

Languages
  • PHP
  • JavaScript
  • CSS3
Front-end
  • Three.js

Context

The first version of my portfolio, built and extended throughout my first year of BTS SIO, before the current redesign.

Role

Solo design and development.

Architecture

  1. index.php

    One-page structure

  2. ui.js

    Navigation, modals, splash screen

    threescene.js

    Three.js background scene

  3. Three.js

    Loaded via import map (CDN)

Challenges

Integrating a Three.js background scene without a framework or bundler (import map via CDN), with a splash screen, an animated pill navigation, project modals and glassmorphism effects.

Outcome

A complete, responsive one-page site. Above all, it taught me what I wanted to change: the current site starts from scratch, faster and easier to read.

Highlights

  • Three.js 3D scene
  • Vanilla JavaScript
  • The ancestor of this site
Next projectManchester City Universe →