Helping ordinary people create extraordinary websites!
| |
Helping ordinary people create extraordinary websites! |
A Designer's Guide to Prototyping AjaxBy Kevin Hale2007-11-23 
There are No Heroes in Prototyping
Because it’s usually the designer’s responsibility to build the structures that are handed off to programmers, we’ve taken into account that you’re probably no code master. We actually don’t need any fancy pants in there anyway. Because of this, our motto for JavaScript usage in a prototype is “Don’t try to be a hero.” Of course, feel completely free to familiarize your self with concepts like innerhtml, node creation, animation and even Ajax, but you’re not going to want to put any of that in a rapid prototype. Here’s why: This early in the game, we want as much separation as possible between our structure, presentation and behavior layers. If you start using any of those advanced concepts mentioned above, you’re going to find a good amount of markup and CSS stuck inside your JavaScript. You’re going to want to let your programmer decide the best way to approach those decisions, because they’ll know best how they want to pull information from their data source and assemble it on the page. Plus, you want to keep them happy for reasons I’ll explain later. The reason you want to design for only boolean states and save animations for the very last thing you do is because JavaScript animation is 1) almost always frivolous, 2) basically still in its infancy and 3) just too cool. You’ll waste too much time playing and tweaking it to your own amusement. Trust me, we know. Once your database and dynamic data is all hooked up, working and stable, then you can allow yourself the luxury of adding the eye candy in a way that helps you determine which animations slow down your application and which animations enhance the user experience. Now, no one ever really listens to me on this (hence our demo with the integrated animations), but it is for the best. You’re going to want to keep code complexity very basic, because you need things to be as flexible as possible later on. That said, the JavaScript concepts and functions we’ll go over in this series are the absolute minimum needed to turn a wireframe into a basic prototype. Tutorial Pages: » Introduction » There are No Heroes in Prototyping » Relationship Skills » XHTML Skills » CSS Skills
|
 |