3 ms·
It’s a bit rough around the edges, but I implemented my own for the web in JS: https://yklcs.com/coverflow https://yklcs.com/coverflow Mine’s a bit different
by yklcs 3y ago
It’s a bit rough around the edges, but I implemented my own for the web in JS:
https://yklcs.com/coverflow https://yklcs.com/coverflow
Mine’s a bit different from the actual one as I had to reverse engineer the animation. It’s more complex to implement than I imagined, it’s hard to get the motions to feel “right”. I used a logistic function where the inflection point is at the middle of the screen to calculate the amount of translation/rotation.
I’d love to see a breakdown of the actual animations used.
- ttepasse 3y agoThat's a very nice implementation, not even janky on my old Mac. Great. I recently found out that the web is in the process of getting Scroll-Driven-Animations, which enabled a CSS-only CoverFlow, among other things. Here is an example: https://scroll-driven-animations.style/demos/cover-flow/css/ https://scroll-driven-animations.style/demos/cover-flow/css/
- hnbear 3y agoSeeing Mezzanine then flipping through I thought somehow it’s reading my actual music library on my phone and was both impressed and worried at once. Good job.
- qingcharles 3y agoHah! I was like, "This guy has all the best albums of all time..."