top of page
Interactive Media
Web Development
Over the course of my study, I was taught to implement interactions into websites using JavaScript, picking up on HTML & CSS on the way, providing me insight on how to properly structure & create immersive sites for people to tour.
Interactive Product Website (Koeniggsegg Gemera)
For an assignment, I was tasked to work together with students from the Experience & product Design specialization to create a website based around a chosen product.
We selected the Koenigsegg Gemera, a high-performance supercar, as our product of choice.
Being the first time I've coded in JavaScript, I had gained tons of experience implementing and building on the interactions of the website.
My major contributions were :
-
A 3D configurator using WebGL
- This feature also saves the colours configured through HTML's localStorage function.
-
The image comparison slider
-
The usage of the GSAP plugin for in-site & on scroll animations
-
Tweaking to the website's CSS to create gradients between <divs>
TikTok filters
Another module I had in school required us to make interactive features on filters using TikTok effect house.
I wanted to challenge myself yet keep it interesting so I decided to use the app's in built hand pose tracking filter to create a cowboy shootout game.
One thing i struggled with while developing the filter was that due to the limitations of the app, it was more challenging to implement the rules of a game compared to if i was working on a game engine.
Some key concepts that I learnt to make this project work was:
-
Lerping
- To move the bottles from 1 point to the next because the rigidbody component was quite hard to customise.
-
Object Pooling
- Had to use this because too many objects in the scene would cause crashing and lag.
bottom of page