Article Idea:
Quick and Easy Flash Prototypes: Bring Your Wireframes to Life
suggested by Alexa Andrzejewski on 2007/05/31
Tackling the classic “how to communicate rich interactions” problem as an interaction designer for Lextant, I developed a technique for translating static wireframes into interactive experiences using Flash. These prototypes proved to be a quick and cost-effective way to bring wireframes to life, requiring only basic Flash/ActionScript knowledge and standard static wireframes.
Through these Flash prototypes, we were able to evaluate experiences more accurately (we could tell immediately when something that looked good on paper wouldn’t feel right in real life), conduct more meaningful usability tests, and deliver something that clients could enthusiastically use to rally support for concepts. These prototypes quickly became an invaluable part of the design, testing and buy-in process for many of our projects, and clients loved them.
Having learned a lot through trial and error in creating these prototypes, I’d like to share the process we used with the IA community through a step-by-step Deliverables/How To article in the spirit of the Special Deliverables series by Dan Brown. In this tutorial, I would like to discuss…
-The preparation and optimization of wireframes for importing into Flash
-How to set up the Flash document and create basic click-throughs
-Action scripts/tricks for creating specific types of interactions (such as drag and drop and/or expanding/collapsing panels)
-Tips for handling versioning and working collaboratively.
The tricky part about writing this tutorial is that all of the actual prototypes I’ve worked on are proprietary to the clients. So I wonder if writing this “How To” might involve creating a fake application prototype from scratch or something? If anyone has any advice on how to write a good, generic tutorial, let me know.
Thanks! I look forward to becoming a more active part of the Boxes and Arrows community.
Want to see this idea turned into a story?
15 people said yes. | 0 people said no.
Austin Govella
496 Reputation points
Posted 2007/06/03 @ 09:24AM with
Alexa,
Perhaps you could choose a common application-type that lots of people are familiar with using or building? CMS systems with varying kinds of functionality would seema good bet.
Kate Walser
32 Reputation points
Posted 2007/06/04 @ 22:07PM with
Alexa,
Sounds like a cool idea. I run into the same problem with proprietary apps. How about taking a small pre-existing task or application that many of us are familiar with – e.g., Google / Yahoo Beta mail, YouTube, etc. as your case study? Might save some time instead of having to actually design out a whole application as most of us will probably be more interested in prepping wireframes and moving into Flash.
Alexa Andrzejewski
31 Reputation points
Posted 2007/06/05 @ 13:05PM with
Yeah, those are great tips! I think what Kate suggested would be a great direction.