4 ms·
How did you manage to do the animations so nicely? What is the tech stack?
by SpyCoder77 6mo ago
How did you manage to do the animations so nicely? What is the tech stack?
- paulhebert 6mo agoThe animations are all CSS animations. The tiles and grid are SVGs. No libraries or anything there. All vanilla, written by hand. I’d like to write up some blog posts about this. Are there specific animations you’re interested in? The overall tech stack is Vue and Nuxt. I just added user accounts and auth using Supabase.
- SpyCoder77 6mo agoThe tile connection border animation is really cool, is it something special with clip path or something?
- paulhebert 6mo agoThe main trick there is animating the stroke on a copy of the tile: https://css-tricks.com/svg-line-animation-works/ https://css-tricks.com/svg-line-animation-works/ I also animate the size and color of the stroke and scale and translate the entire tile
- SpyCoder77 6mo agoI would also love to read about your puzzle creation process :)