Going backwards with Flash
It's been a while since I have posted about anything. Truth be told its been a while since I've had 3 free minutes. I have been working on a fairly large project that has been rough in some respects but really great in others. The requirements for this project were pretty ambitious however allowed me to really get more involved with the much heavier side of Flash I haven't had much opportunity with (e.g. Remoting, Class based development, heavy server interaction etc..). During this project though (I'll post more information once its out of QA and gets launched) the issue of the back button was a big concern.
After a bit of digging however we were able to work through a solution that worked out pretty well. However it got me wondering why Macromedia didn't put a tad more effort into this feature/problem with recent Flash releases. I know they came out with the anchor option a while back, which is great if you have a very linear movie that isn't built in one frame. The anchor link "solution" just not a very practical feature. The oddest part however is that some of the "Industry Giants" have posted very good solutions that work (for most). Seems like it wouldn't be too hard to use Mike Chambers solution as a publishing template and native class inside Flash (especially considering he wrote this in July of 2002). I know this has been written about, blogged about, bitched about on countless websites, forums and client meetings but as long as the issue is outstanding I'm sure this will continue.
I also should say that I was always taught that if the user has to use the back button there's a problem with the UI...so fix the UI as opposed to hacking a solution to get the back button to do what you want. However I've been behind the glass in enough usability sessions to know that there's absolutely no way to predict what a user is going to do when given the keys to take your project for a ride. In any event I thought I'd pass along some resources and inspirational sites that I came across during my research, maybe it will save someone else some time down the road...until theres and actual fix and not just a work around.
Back Button Articles/tutorials:
Mike Chambers - Pet Store Example
Robert Penner Example
Justin Smith - Deep Stateful Linking and Back Button Integration
Chris Hendershot -Â Enabling a back button within flash
Kevin Newman - History Keeper
Mike Stenhouse - Fixing the Back Button and Enabling Bookmarking for AJAX Apps
A few sites with nice Back button / Deep Linking integration:
The Orange Project
Enlighten
Redbull Racing
Red Bull Track Attack
***** UPDATE 11/08/06 *****
Here are some links to a few more real solutions for the back button / deep linking question...
ex animo StateManager - http://exanimo.com/as2/statemanager
"Unlike all of the other solutions, the ex animo StateManager is the first method to be fully compatible with Safari. More importantly, though, it comes in a nice OO wrapper and is exceedingly easy to use. Since the class uses JSInterface (which at this point requires ExternalInterface), you'll need to publish to at least Flash 8. However, this should change as work progresses on JSInterface.
It's been tested successfully in IE5.5, IE6, FF 1.5.06, and Safari 2.0.4 but will degrade gracefully (i.e. behave like a normal flash page) in unsupported browsers.
Why should you use StateManager as a solution to your Flash back-button and deep-linking needs??
1. This is the first method that doesn't break in Safari when you navigate to a new page.
2. Unlike SWFAddress, is clean and Object Oriented (less ActionScript code required).
3. Thanks to JSInterface, you can import external JavaScript files directly from Flash.
4. While it integrates seamlessly with Geoff Stearn's SWFObject , it doesn't require that you use it. In fact, unlike SWFAddress, it degrades gracefully if JavaScript is turned off."
Asual SWFaddress - http://www.asual.com/swfaddress/
"SWFAddress is a small script that sits on top of SWFObject and provides deep linking for Flash websites and applications. In other words it enables the Back, Forward and Refresh buttons of the browser and creates unique URLs with page titles that can be sent over email or IM."
UrlKit - http://joeberkovitz.com/blog/urlkitÂ
"URLKit is an open-source Flex library for browser URL control via deep linking which I [ Joe Berkovitz ] have developed in collaboration with Todd Rein of Adobe...
... Enter UrlKit, which adds URL-mapping or "bookmarking" capabilities to Flex-based RIAs. While numerous others have provided solutions to this problem, what's different in UrlKit is that it leverages your existing application logic and provides a way to declaratively code the different URL states."
View my LinkedIn profile
Become a fan on Facebook
April 8th, 2006 at 10:22 am
One of the problems with “making the Back button work right” is that different people think this leads to different solutions. The browser’s Back button is used as a navigational device, to trace a path through the Web of documents.
Within a single document some people think the browser’s Back button should function as Undo, while others think it should bring them back to the prior document. This happens with interactions in both plugins and JavaScript — some think that nav button should switch to Undo, some don’t.
What makes it harder is that single-page applications vary too… some may have simple calculations, while others have significant changes of screen display in response to user action. I’d wager that the expectations of some people vary with the application too.
In all the conversation, people say “fix the Back button” without saying what they think the result of such fixing would be.
If you’ve got a multi-screen app, then you can set each “page” to catch a browser-to-plugin JavaScript message triggered by the browser’s Back button. I’d be tempted to put the app’s “navigation” into the app itself, though, to remove all the ambiguity about what does what where.
The browser’s UI is built for navigating a Web of hyperlinked documents. I think this “back vs undo” issue shows that it won’t be a universal shell for all human computing activity.
April 8th, 2006 at 10:32 am
[...] Other articles: – Going backwards with Flash (Via cruciallimit blog) [...]
April 8th, 2006 at 11:13 am
I couldn’t agree with you more JD, the back button issue definitely seems to mean something different to everyone. Having said that Macromedia did make an attempt at letting the developer/designer of the app decided what is and is not a history event when they exposed the anchor functionality. The point I was trying to make when I said “fix the back button” was more along the lines of making the anchor solution a bit more usable for sites that are much more object oriented and non-linear. Sites that exist on one frame of the timeline and have much of the functionality and page states wrapped up in classes don’t benefit from the anchor solution. Articles upon articles surrounding Coding best practices, OOP design, Flash for eCommerce, etc.. all suggest that code be more modular and less timeline based. These are the sites that also usually cater to the masses and have more users of all experience levels visiting the product, using the back button, loosing any input they may have given the app and have to start over when they hit that back button expecting to see the last noticable page state.
The back button should not be a crutch, or used as an undo…I agree…however there should be a consistent way to allow users to go back and forth (if they so choose) using the back and forward buttons while they learn the UI. I’m also not trying to put any blame on Macromedia/Adobe’s shoulders because this problem exists, only that this would be a feature that could be used to make Flash apps, RIA’s, and eCommerce sites more “usable” in the eyes of not-so-advanced users, business owners and customers. This is a feature request/enhancement if anything
Thanks again for the feedback!
April 12th, 2006 at 2:18 am
Check also http://www.yourpsp.com, very good implementation.
So far it’s the easier I found.
Pim
April 12th, 2006 at 6:56 am
@Maegerman Philippe – that links takes me to a page that links me to a hybrid page, I don’t see the flash/backbutton integration. Where is it?
Thanks for the feedback!
December 26th, 2006 at 11:44 am
The site is in flash, when I navigate from a section to another, I can use the back and forward button from the browser