I’m Alexandra, a senior at Boston University studying graphic design. Thank you for taking time to visit my portfolio website; please explore.
I’m Alexandra, a senior at Boston University studying graphic design. Thank you for taking time to visit my portfolio website; please explore.
3D PIANO WEBSITE
February 2025 | Website
Redirect to the website by clicking on the images!
As part of my thesis work at Boston University, I have several weeks of experimentation to learn new software and discover methods to represent my thesis project. Each week, we are required to complete a new project.
Despite learning Blender in the Fall of 2024, I wanted to learn Spline 3D due to its user-friendly web capabilities and interactivity.
My process started with a gummy bear spline tutorial before diving into my project. This project required a significant amount of trial and error, as many of my initial ideas proved to be beyond the capabilities of JavaScript and Spline alone. After four distinct and unsuccessful attempts at creating a website, I decided to adopt a simpler approach.
The playable piano website included the modeling of the keys in Spline, the incorporation of user interaction animations, the recording and exportation of my own digital piano keys using GarageBand, and the addition of rudimentary coding to enhance the user experience.
The white piano keys on desktop can be played using the middle row of keys (A-;) and the black keys use the row right above that one- (W, E, T, Y, U, O, P). Mouse clicks also enable the piano.
On mobile, the user can simply tap the piano.
Process images: