/css-animation-46-2

CSS's animation exercise

Primary LanguageCSS

CSS ANIMATION

header



Exercise

Welcome, follow this link for the exercise, or below you can find a few unrelated suggestions.

https://github.com/gael-src/css-animation-46-2/blob/main/exercise/README-exercise.md





Structure

css-animation-46-2
│
│─── index.html
│─── style.css
│─── reset.css
│─── main.js
│─── reset.css
│─── README.md
│
└─── exercise
     │
     │─── README-exercise.md
     └─── + pictures




Inspiration and Tips


CodePen examples
Some nice animations.
https://codepen.io/tomad8/pen/VwaPOXR
https://codepen.io/jl1218/pen/oNzKvEx
https://codepen.io/tealab/pen/qBZaPmG


Web Design inspiration
Website Awards - Best Web Design Trends.
https://www.awwwards.com/


A simple animated website I like
https://www.spacex.com/


Disney 12 principles of animation
From the book: "Disney Animation: The Illusion of Life", Frank Thomas and Ollie Johnston, 1981.
https://the12principles.tumblr.com/
https://www.youtube.com/watch?v=uDqjIdI4bF4&ab_channel=AlanBeckerTutorials


Learning resources bookmark page
I started a bookmark page with learning resources, it's not totally up to date but maybe you can find something useful.
https://bkz-src.com/browse/PAnr1Tg1lnXX8vY2k0cMC4k2o2i2





Unrelated Stuff to watch


Conference from Chaos Computer Club
https://www.youtube.com/watch?v=dTQAO7M5Gp8&ab_channel=media.ccc.de

The Internet's Own Boy: The Story of Aaron Swartz
https://www.youtube.com/watch?v=3Q6Fzbgs_Lg&t=320s&ab_channel=Documentaries

The Art of Code - Dylan Beattie
https://www.youtube.com/watch?v=6avJHaC3C2U&ab_channel=NDCConferences

AlphaGo - Deepmind
https://www.youtube.com/watch?v=WXuK6gekU1Y&ab_channel=DeepMind


Funny Mathematical stuff to research

  • Conway's Game of life
  • Cellular automata rule 30
  • Mandelbrot set
  • Feigenbaum constants.