Since our book focuses on rich interactions, I want to spend some time on Adobe Flex/AIR.
These tips are based on the best Flex resources I have found, and how you can use them to craft a great user experience. This is part 2 of 6:
- Play With It: 10 Explorers & Galleries
- Learn From the Best: 10 Great Flex Apps
- Learn From the Rest: 10 Great RIAs
- Stock Your Toolbox: The Essential Controls
- Review Best Practices for Designing a RIA
- Avoid Common Mistakes: 10 Anti-Patterns
Learn from the Best: 10 Great Flex Apps
Take a look at some of the best Flex applications on the market. How did I decide these are the best? I reviewed numerous applications, basing the evaluations on Jakob Nielsen’s 10 Principles for User Interface Design:
Feedback — Metaphor — Navigation — Consistency — Prevention — Recognition — Efficiency — Design — Recovery — Help
I realize these guidelines are a bit old (from 1990!)- but all applications should meet these guidelines at a minimum. The applications listed below also embody our 6 Principles for Rich Interaction:
Make it Direct — Keep it Lightweight — Stay on the Page — Provide an Invitation — Use Transitions — React Immediately
01. Picnik
Free version available
02. Balsamiq
Trial version available
03. Sprout Builder
Demo version available.
04. Campaign Monitor by eyeblaster
Commercial application- no demo available. Awarded Top 10 User Interfaces of 2008 by Jakob Nielsen. Report available for purchase.
05. ConceptShare
Free account available.
06. Weight Watchers eTools
Commercial application- no demo available.
07. Small Worlds
Free account available
08. Buzzword
Free account available
09. Whitestone Cheese
Publicly available at www.whitestonecheese.co.nz
10. Kuler
Publicly available at kuler.adobe.com
11. SumoPaint
Free account available
Close Contenders
These apps were really close, but missed a couple of key principles, or are still maturing.
Klok
Free personal download available
Nice time tracking product in AIR- nailed the metaphor, but haven’t Made it Direct enough (yet). I instinctively want to click in my calendar to start logging my time against a certain project. Instead I have to navigate to Project View, then into Time Entries. And spinners for entering start and stop times are inefficient.
I must say I love the Weekly Time Sheet though, and the fact I can drag it to my desktop! I think this product will mature very nicely.
Tour Tracker
Up for a limited time at Amgen Tour of California.
Looks amazing. The metaphor is perfect- big map showing the course and stages- but lost points on some basic principles. Specifically Feedback- I click and click to “watch a rider” on the home page, nothing happens, so I keep clicking. And Design- a black background might demo well, but white and blue tex, all caps, sure is hard on the eyes.
Google Finance Dashboard
Publicly available at BrightPoint Consulting
This is a really nice dashboard showing what can be done with Flex & Degrafa. I can’t wait to see how they finish it out. Also check out Tom Gonzale’s blog for more amazing data visualizations with Flex and Degrafa.
htmlText Editor 2008
Publicly available at www.theflexguy.com
This is a neat little one screen application that absolutely Stays in the Page and Makes it Direct. However, the Filter Tags feature is non-standard in more than one way: “If you remove tags and see that they really were needed, you can just uncheck the box and press Filter tags again.” I know the space is limited but Undo and Redo buttons would make more sense.
Agile Agenda
Free trial download available
Project management tool in AIR. Missed the Keep it Direct, and Stay in the Page principles. Too many dialogs where simple inline editing would have sufficed. Need better icons, or text with the icons. Usability aside, the product’s functionality seems to be quite robust and well worth the price.
Comment with your favorite Flex applications
I realize I have only skimmed the surface here, please comment with a link to the best Flex UIs you know of.
Theresa Neil 