Friday, July 18, 2008

jQuery is amazing.

If you have any interest in Web Design or User Interface design for web applications (or UX Design, or Interaction Design... did I leave one out?), it would probably be a good idea to take a good long look at some of the JavaScript libraries that are currently available. Put simply, they are pre-written libraries that you reference inside your HTML file, and then communicate with using short, easy to read lines of code. Easier to read than JavaScript anyway. They have the benefit of being tested cross-browser, and do pretty much all the heavy lifting for you.

jQuery is the first one I have looked at, which has the benefit of being open source and seems to have a growing group of enthusiasts online. If you already know how CSS works, it's a snap to get some amazing effects that were previously left to either Flash, or a really good JavaScript programmer. What sold me was not simply the ability to animate a DIV, but that the developers had already added easing to the animations. The tutorials on the jQuery site are a good place to start, but they focus on every aspect of the library such as XML and AJAX. If you interested in UI and layout, I found these tutorials to be the most helpful so far:

How jQuery works is the first one, and helps quite a bit with understanding the syntax with simple examples.

Getting Started with jQuery has a short section called "Animate Me" that was very helpful explaining .toggle

Live Examples of jQuery is a simple page of examples that might come in handy for page layout.

Detached Designs has a great page on animations.

Web Designer Wall not only has a good page of examples of jQuery, but looks to be a killer blog about design in general.

Another library I've seen name checked around the web is MooTools but I will have to report back on that one at a later date.

0 comments: