Skip to content

r-vianna/css-js-animations-demo

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

CSS JS Animation Demo

A demo application designed to compare user experience during a stress test of animations using both CSS and JavaScript

Installation

  • Clone repo to local directory
  • Run npm install

Usage in Browser

  • Run npm start
  • Navigate to http://localhost:8080
  • Start Animation buttons on the bottom of the screen will randomly be assigned an animation type on load
  • Run both animations to see if there is a user noticable difference between the animations
  • Open console to view what button controls each animation

The Animation

  • The animation is a rain scene over the hills (sorry I did the best I could with my artistic ability)
  • There are 1000 raindrops each to be animated down the screen
  • The animation will run on an infinite loop
  • On load each Start Animation button will be randomly assigned an animation to start
  • When complete you can use the console to see what button was controlling each animation