Fun in LA

LA Conference
A few days back I had the delight of speaking at the Adaptive Path, Designing and Building with Ajax along with Jesse James Garrett and Dan Saffer down in LA.

First, thanks to all the wonderful designers and developers I had the honor of meeting. Its been a while since I spoke in a venue like this and I thoroughly enjoyed it. It seems that you also felt the conference was a wonderful success. It is my hope that the mental framework that we laid out for understanding the world of Ajax design & development will really provide an ongoing boost to your success. Don't forget to share those successes with me! Love to hear them.

Second, thanks to the AIGA for their wonderful mixer at the Westwood Brewing Company. So many creative and talented folks in LA to learn from even in the most casual setting. And, wow, the IxDA F2F at the Liquid Kitty was awesome. Thanks to Danna Hudson for getting this together.

So what did I take away from my time there?

• Subtle design. I met Ian who works in motion graphics. He taught me a little about cinematic transitions & effects in the world of commercials. One rule of thumb he mentioned was when deciding on the amount of color saturation or cinematic effect, he generally chooses what he thinks looks right, then halves it. This rule has always stood him in good stead. Hmmm. Perhaps we should apply this to flash & Ajax effects.
  
  This follows the rule of thumb I learned several years back from Kevin Mullett's book Designing Visual Interfaces in which he describes a technique for removing clutter. Get rid of all but the most essential information for any screen. Then slowly turn up the "contrast" knob, dialing in more visual treatment. Stop just when it communicates.

• Documenting rich interactions is still way too hard. Ok, I already knew this. Just re-inforced this fact. While we covered several real-world approaches to documenting Ajax applications, designers and developers still struggle way too hard in this area. Fine-grained interactions (interesting moments, microstates) must be documented in context of the page and flow. And all of these have to flow along the time dimension. Its just a hard problem.
  
  Powerpoint, Captivate, Breeze, SnagIt, Visio, Photoshop, Dreamweaver, Keynote, Illustrator, Fireworks, Word, Quicktime, SnapZPro, Director-- each has its pros and cons but nothing is really crafted for our field. My next step is to check out Microsoft Sparkle. Will it be the holy grail? Or is it just a slippery slope into Redmond? :-)
  

• Teaching with visuals and a mental framework really works. I put a lot of time into my part of the presentation (spanned 4 topics). I have been ruminating for months on interesting ways to think about Design Patterns and Ajax Operations. I wondered if I could impart what has been rattling around in my brain. It seems (based on survey feedback and talking with attendees) that it worked. I love Keynote. When you use transitions or animations they are cleaner, more elegant and when used right reinforce what you are teaching.
  
  This is true with interfaces. A good mental model and using a visual language for the purpose of communication works for user interfaces and for presentations.

• We have much to learn from each other and from other disciplines. I met people with backgrounds in graphic design, animation design, motion graphics, information architect, classical architecture, software engineering, and so on. Each come at the problems from a different angle. I have a list of books that I am going to plow into that I am looking to inform my design skills from orthogonal directions.
  
  This caused me to reflect on the wealth I have around me at Yahoo! in our User Experience Team. My manager is an awesome photographer (and designer!) I work with a PhD in Rhetoric (and professor of writing at Stanford), a lady who designed the animation tools at Pixar, a guy who designs complex strategy board games (like Settlers of Caton) in his spare time, visual designers (like Luke Wroblenski), a classically trained architect, software engineers turned designers, talented musicians, and so on. Wow! what unique perspectives live inside the heads of those around us.

Soon, a City Near You?
So, hopefully we will be in a city near you. Looks like Austin and NYC or Philadelphia might be next. Keep an eye out at adaptivepath.com.

A few notes on upcoming speaking engagements:

• Feb 6 - VeriSign Developers Summit (private), Miami, FL
• Mar 2,3 - Yahoo!'s Front End Engineering Summit
• Mar 13 - Real World Ajax - SysCon - NYC
• Mar 21 - Eclipse Con - Panel - Rich Interaction Toolkits - Santa Clara, CA
  
• Apr [TBD] - Designing & Building with Ajax - Adaptive Path - NCY or Philadelphia (tentative)
  
• May 10 - Adaptive Path - Designing & Building with Ajax - Austin (tentative)
• May 11-12 - Ajaxian Experience - San Francisco
• June 7 - Adaptive Path - Designing & Building with Ajax - Amsterdam (tentative)

If you are at an event that I am speaking, please catch up with me so that we can chat. I love to hear from folks who read my blog.

Nine Tips for Designing Rich Internet Applications

Recently I was asked to provide input into a presentation. The question was asked, if you were going to provide some quick basic guidelines for designing rich applications what would they be.

Here were the nine thoughts as they originally came to my head.

1) Make it directly interactive
Instead of page to page interactions think direct interaction. Use in context editing as much as possible. Use drag and drop only where it makes sense. Barring a selection model, put tools as close to the objects being edited as possible. Cooper states it as "Where there is output, let there be input."

2) Make it inviting
Use hover to invite users to the next level of interaction. If the interface responds well to light events (like hover) it can be used to entice the user to interact.

3) Use lightweight, in-context popups instead of page transitions where possible
Although they will eventually get over-used, lightweight popups can be your friend. Think of them as annexed areas for your page.

4) Use real-estate creatively
As mentioned popups help. But slide outs have long been allies in desktop tools, they can be an aid in the world of the web.

5) Cross page boundaries reluctantly
Think of a page switch as a context boundary that the user may or may not want to cross. Think of it as a place that many of your users will lose interest and no longer follow you.

6) Create a light footprint
Make it extremely easy to interact. Rating movies or news with just a click on a star with no-refresh is awesome. Checking hostnames without leaving the page is an excellent way to keep a user engaged. Shopping by clicks that only add to a container on the page (instead of going to a new page) are like impulse aisles in the grocery store.

7) Think of your interactions as storyboards
As the designer you are the director. Think about the event states as acts in a play and your interface elements as actors. Get them all moving towards telling your story. Putting the frames down on a storyboard is a great way to rehearse your script. Think of the interesting moments as opportunities for engagement.

8) Communicate transitions
Keeping the user informed during lightweight operations (that don't leave the page) with spinning wheels, busy or progress indicators keep the user engaged with a living page.

9) Think in objects
Instead of thinking about content and pages, think about Rich Internet Objects. The travel log in Yahoo!'s Trip Planner is a good example. Once created it can be searched for or shared. This will help you create more interactive applications and make the user's work recognizable and sharable.

These are not exhaustive. Even as I go to publish this I can think of other tips to include... but I will resist adding to the list. Perhaps you have some tips/principles that have helped you solve design challenges?

Designing and Building With Ajax

In December, Adaptive Path started a new series of conferences specifically addressing how to design and engineer rich Internet applications with Ajax. At that conference Ben & Dion (ajaxian.com) did a wonderful job of presenting the world of Ajax from the technical perspective.

I am excited to announce that I will be following in their footsteps and will be presenting along with Jesse James Garrett, Dan Saffer and Ryan Freitas at the Designing and Building with Ajax conference in LA on January 26th and in Miami on February 8th.

Based on feedback from the first conference we are revamping some of that curriculum and I am very excited about what we will be presenting.

So who should attend? Well we are desiging the material for both designers and web developers. If you are solely focused on design there will be lots of great ideas and tools presented that will enrich your work. If your bag is development, I aim to whet your whistle with some technical goodies as well as attempt to de-mystify the world of Ajax and DHMTL. And if you wear both hats-- well you will have a double-treat.

Why should you attend? Well, I think one really unique aspect of this conference is that instead of hearing 5 or 6 different speakers talking about individual topics, we are weaving a story through the day that is meant to build a mental model in your head to help you take a problem from conceptualization to design to implementation. The other unique aspect is presenting design and development in a wholistic manner. This is the context in which problems must be solved. This is also a great way to really understand the technology-- in light of our user's goals and needs.

Oh and one more thing. At the conference in LA, there will be some exciting news announced!

Would love to see you there!