UIE Virtual Seminar Presentation (How does this work?)

JQuery for UX Designers

Richard Rutter

Co-founder and Production Director, Clearleft

Length: 90 minutes

What You’ll Learn

• Employ Simple Show and Hide Techniques
• Toggle Wireframe Annotations
• Fake Simple Ajax Interactions
• Get Started with JQuery UI Widgets

Employ Simple Show and Hide Techniques

The essence of JQuery is to find something and do something to it. This technique easily shows different page states so your team and test participants can “do things” to your design.

• See, step-by-step, how to put this simple, yet useful example of JQuery in action
• Use modules and plug-ins to make your design to do simple things, without worrying about the performance of production code

Toggle Wireframe Annotations

Add notes to your interactive design.

• Turn your comments on or off depending on who’s viewing your design
• Add lists, comments, or direction for developers and others who need to work with your design

Fake Simple Ajax Interactions

Without creating production level code, get your design to quickly and easily do its thing—click something and change occurs—for your developer or client.

• Replicate what happens when you click something like a “favorite button”
• Fill in all the steps of an Ajax interaction such as a slight delay or adding different page states on a single page

Get Started with JQuery UI Widgets

Rich will introduce a library with options and widgets that you can easily put in place. In many cases you’ll see how to simulate what the full interaction could be.

• Explore modal dialogues, an intrusive piece of interaction and a good example of something you want to test: Do I really need a modal, or is a link better?
• Get more examples: Prototyping calendars, lightboxes, and more.

Rich will show you the power of combining discreet interactions together with a complex interaction.

Regardless of your Javascript experience, this seminar will be a great way to start using JQuery and take your interactive skills to the next level. JQuery gives us a clean, interactive feel, and can be the difference between a slick design and something annoying or disruptive. It brings rich interactivity to your HTML and CSS3.

Rich will incorporate complex interaction examples along with providing excellent sources of documentation and tutorials for your toolbox. The seminar will keep theory to the bare minimum and focus on getting you started with practical take-aways you can use straight away.

The real power in what you’ll learn is getting very close to a final look and feel of your intended design with just a bit of effort and without having to build the whole application. Get over the initial hurdle of the JQuery learning curve and gain momentum in your design process.

Why Richard Rutter?

Well, beside being really smart, he's got that cool English accent. Ok. Ok... Richard is an information architect living in Brighton, England. He specializes in user-centered design with particular emphasis on accessibility and web standards. Richard is an accomplished technical editor and has contributed to numerous books including Beginning CSS Web Development and HTML Utopia.

Richard is also a specialist in web accessibility and co-wrote Web Accessibility: Web Standards and Regulatory Compliance. Richard also co-wrote Blog Design Solutions in which he explains how to design your own weblog application. Richard's writings features regularly in magazines such as .Net.

Before setting up Clearleft, Richard worked as the project lead on Multimap's hugely successful public site. He was responsible for rebuilding Multimap.com to web standards, a cost saving move which made the site more accessible and faster.

Richard massages his ego at Clagnut where he writes on about web design, mountain biking and typography.

Visit Richard's web site or follow him on Twitter.

I Want the RECORDING $149

You get Lifetime Access to this seminar for your entire organization!

---