June 11th, 2010
Duration: 20m | 10 MB
Recorded: April, 2010
Brian Christiansen, UIE Podcast Producer
[ Subscribe to our podcast via ←This link will launch the iTunes application.]
[ Subscribe with other podcast applications.]
Web applications can get wild. You know the kind; something that’s on your corporate intranet with an obscure purpose, hundreds of screens and some kind of navigation kudzu growing in every direction. Hagan Rivers is one of our favorite wranglers of such apps. When these types of applications have reached the critical point, companies turn to her to help regain the upper hand.
So what do you do with navigation that is out of control? Hagan brings her pruning shears. That’s one of her three crazy ideas about conquering out-of-control navigation: design without navigation!
Hagan is always a crowd favorite at our conferences, and we wanted to share with you a sample of her presentation, Escaping Navigation Hell, from the 2010 UIE Web App Masters Tour. Listen in and follow along with the downloadable slide deck, or check out some highlights below.
[ Download the complete set of this section’s slides and follow along. (2.4 MB PDF) ]
Crazy Idea #1: Design Without Navigation
- Design screens in the application without the navigation system.
- Hagan builds and tests the screens without the navigation.
- She concentrates her energy on the tasks that are performed within that function of the application.
Crazy Idea #2: Navigation in an Application
- Treat navigation as its own application, with its own requirements and goals.
- If your application is going to be complex, so likely too will your navigation.
- Design it as a functioning whole and test it that way.
Crazy Idea #3: Design Navigation Last
- Design navigation systems last, separating them from the rest of the application design.
- It’s easier to design the nav last because you’ll have a better picture of what your users will need to navigate.
- When starting redesign projects, Hagan maps out the existing site she’ll be overhauling.
- Get a “big picture” of all that the application does.
- To identify components of the application, she has a fixed set of descriptive tags she uses to label each node on the map.
Example of tags for a page in the WordPress admin area.
- Here’s a video of Hagan building an Application Map
See all the slides for this section in the downloadable PDF.
In the talk, Hagan references this excellent UIE Virtual Seminar she did for us on web application navigation, which you can still access.
If you enjoyed this taste of Hagan’s talk, why not join us in Seattle for the final stop on the UIE Web App Masters Tour? See Escaping Navigation Hell, and all the other fantastic talks for yourself!Tweet