A small and fun project for a time-themed hackathon at R&R WFM. Using React and ThreeJS to create a cool visualization of the current time. Got constantly sidetracked by cool and complex stuff involving GLSL shaders which I wasted most my time on, but also learned a lot. Probably will use them (and ThreeJS) again elsewhere.
If I didn't mess things up, it should be hosted on github pages here :)
I've also created a wallpaper on Wallpaper Engine (on Steam) so you can set the main scene, with the flying sakura petals, as your desktop background. Not quite sure why you would want that, but as I wanted to try and make something for Wallpaper Engine anyways...you can! It's a very basic version of the web app, without any configuration options whatsoever. (👉ﾟヮﾟ)👉 link
This is a Next.js project bootstrapped with create-next-app.
First, run the development server:
npm run devOpen http://localhost:3000 with your browser to see the result.
This project uses next/font to automatically optimize and load Inter, a custom Google Font.
I was inspired by one of Paul's CodePen projects and based some of the GLSL shader code on his amazing petal implementation :)
Background images were either taken from Unsplash.com and/or generated/edited/upscaled with A.I. (StableDiffusion)
The song playing on the background is 'Sakura' by 'ANtarcticbreeze' and can be found here.
- Let the user toggle the background music from the UI.
- Get the sakura petal as a wallpaper in Wallpaper Engine.