Crumbline navigation has been around for a long time. The first instance I can recall was when Hansel and Gretel used a Crumbline of pebbles to navigate their way out of the forest. It was only when they used bread crumbs instead of pebbles did they become lost.
Crumblines are a great way for uses to navigate through the UI especially if the UI contains wizards and or drill downs. It provides instant feedback to the user in relation to the depth and direction of their navigational choices.
Uses can then step back to the exact position they want by selecting the specific crumb at any given time.
This is an example I created in Flex 3 to illustrate the Crumbline Navigation in it’s most simplistic form.
This component takes in a collection of Crumb Objects.
The Crumbline then dispatches “crumbEvents” when a crumb item is selected, letting the view dictate how it handles the navigational change.
eg.
In this example I used a simple viewstack and bound this to the Crumbline using it’s selectedIndex property.
A demo of this can be seen here
Special thanks to the Brothers Grimm for the Crumbline model.