Moving Background

MBM Three JS
Website

In a recent project, I combined Astro with Three.js to create a website featuring a 3D model with a unique twist: the model rotates vertically, offering an engaging, interactive experience. This functionality allows users to explore the model from various angles, providing a comprehensive view that enriches the user's understanding and appreciation of the model's design.

A key feature of the website is a dynamic light source that tracks the cursor's movement. This innovative touch not only enhances the visual appeal of the model by casting realistic shadows and highlights but also creates an interactive experience that responds to the user's actions. By moving the cursor, users can control the lighting, adding depth and dimension to their exploration of the 3D model.

This project was an opportunity to delve deeper into the capabilities of Astro and Three.js, pushing the boundaries of web development and 3D visualization. While challenging, it was a rewarding experience that honed my skills in both areas. Looking back, there are always aspects that could be improved with the benefit of hindsight. However, this project remains a significant achievement in my development journey, showcasing my technical skills and creative approach to web design.

Some other images

Photograph of skutevikstorget in BergenPhotograph of skutevikstorget in BergenPhotograph of skutevikstorget in BergenPhotograph of skutevikstorget in Bergen
The 2023 YMT MAG website

Next project

YMT website