The traditional way of calling attention to a certain web page elements has been "in-your-face" method of placing it in a popup or putting them in a sticky navigation elements like sticky headers, footers or sidebars. As the number of such elements increase, the app is at danger of starting to resemble a control panel from a jumbo jet cockpit. There should be a better way of managing a user attention and React Reveal can do just that.

Instead of trying to squeeze everything that requires attention into one screen, you can draw user attention to important bits as they scroll past. React Reveal provides a dead simple way to add cool reveal-on-scroll animations to your React app. In addition, it has a first class support for collapsing elements thereby abolishing the need for the universally hated popups.

The other problem many single page applications are facing is actually their speed. As you add and remove elements from the page transitions are often rough and jerky. React Reveal rich suite of effects could really smoothen these transitions to make for a modern and polished user experience.

React Reveal is MIT licensed, supports server side rendering, has excellent cross browser support, won't mess your SEO, compatible with react transition group and has a tiny footprint in the application js bundle ( doesn't require any CSS files either ). In order to start using it have a look at the documentation.

Kitty Trial

The following is a test of React Reveal by a cute picture of a cat. Scroll down and enjoy!

Fade Effect

cute cat
cute cat
cute cat
cute cat

Zoom Effect

cute cat
cute cat
cute cat
cute cat
cute cat

Roll Effect

cute cat
cute cat
cute cat
cute cat

LightSpeed Effect

cute cat
cute cat

Flip Effect

cute cat
cute cat
cute cat

Rotate Effect

cute cat
cute cat
cute cat
cute cat
cute cat

Bounce Effect

cute cat
cute cat
cute cat
cute cat
cute cat