3 User experience improving JavaScript libraries you should know about



The following JavaScript libraries are relatively new and already proving to be very useful! They provide some really awesome functionality that looks cool, enhances user experience or makes your development life easier. Without further ado, I present to you these awesome JavaScript libraries:

Drop.js

dropjs
Drop.js is built on Tether. It has been made especially to create various kinds of dropdowns and tooltips. There isn’t much else to be said about it other than that you should definitely be using it!

What makes this JavaScript library great: Drop.js takes care of creating various dropdowns and tooltips for you. It comes packed with a few nice animations. I especially love the list flyout animation. This library feels fast and smooth and I consider it to be a small and handy lifesaver! These fascinating animations are great for enhancing user experience, also.

Get Drop.js on Github

Shepherd

shepherd
Shepherd guides your users through your website. It is also built on Tether and it dims the rest of your app while providing a tooltip-like popup that points at an element on your website, giving some extra explanation about the element or feature while giving the user an “exit” and a “next” button to go to the next step.



What makes this JavaScript library great: Have a look at the demo and you will immediately see why this is so great. You could prepare a small tutorial on using your app for any first-time users. This greatly enhances the experience of your first-time users and makes sure they will come back to your app instead of leaving in confusion!

Get Shepherd on GitHub

countUp.js

countUp.js
countUp.js is a dependency-free, lightweight JavaScript “class” that can be used to quickly create animations that display numerical data in a more interesting way. This is pretty much all it does yet this simple single-purpose JavaScript class provides some awesome user experience.

What makes this JavaScript library great: I love this library (or class, rather) because it enhances the user experience a lot by doing one simple thing: animating a number. I like using this for things like a score counter. It is very configurable. You can adjust the starting number, end number, decimals and duration of the animation. And of course, regardless of the name, it does also count down.
It comes with a start, stop, resume and reset function, as well as a callback for when the animation has finished.

Get countUp.js on GitHub

Share the knowledge!
Share on Facebook118Tweet about this on Twitter180Share on Google+15Share on StumbleUpon165Share on Reddit21Share on LinkedIn2Share on TumblrBuffer this pageDigg this

Comments

You may also like...

x
Stay updated