Pageclip: a server for your HTML forms(pageclip.co)

almost 3 years ago from Ben Ogle

  • Ben OgleBen Ogle, almost 3 years ago

    Thanks! It's all CSS keyframe animation, and it's broken up into 3 parts: The site on the left, the pipe, and the site on the right. The three parts are separate, and just look seamless because they match up on timing. You can actually see that when the pink dot hits the pipe, it doesnt always match up with the pipe's pink dot!

    It was a good amount of work actually. It made me realize CSS animations arent very good for animating scenes as each element must be animated separately, and must have a keyframe setup for the entire scene animation duration. e.g. if you just want to have an element move for 1 second, then wait for 3, that has to be encoded into the keyframes.

    0 points
    • Alvaro Ruiz, almost 3 years ago

      Did you use any special software to do that? or coded directly using a code editor? Any source to learn to do that kind of animations? I am more into the graphics that's why I would love to learn to do that! Thanks

      0 points