I was doing some spelunking while writing a design analysis thread for
@lickability and discovered this nugget: this is what the Apple Music background motion looks like without the blur shader applied:
I was doing some spelunking while writing a design analysis thread for 10 comments
@samhenrigold can you please post the original effect for posterity (and for the people that don’t use Apple Music)? @samhenrigold oooohhhh, nice. I was lowkey wondering how they extracted the colours from the cover, this … explains things 😄 |
the visualizer is one of those mesh/fluid gradients that designers have been swooning over for a couple years now.
the way they’ve constructed theirs is by layering copies of the artwork and “twisting” each copy. all done in a Metal shader.
the actual twist effect works like this: it distorts coords within some radius around an offset by applying a rotation whose angle increases with distance to the offset. the rotation angle is modulated by a squared ratio of the distance to the radius.