UI design article

[Marielle Lange]

Mark,

Thanks for the link. I had posted something relevant to this on the  
forums a while ago:

<http://forums.runrev.com/phpBB2/viewtopic.php?t=422>

To avoid the discomfort of having to switch to the forums, I paste  
the transcription below.

Best,
Marielle


> Flow in Application Design

> This is a technique that is presented as useful for designing web  
> 2.0 applications.
>
> Well, the fuss about web 2.0 is that it allows you to design highly  
> responsive web applications, with some elements within a page that  
> can be refreshed independently from the other elements within the  
> page.
>
> The thing is that these features have always characterized the type  
> of applications you can produce with desktop development  
> environments like Revolution, RealBasic, etc.
>
> So, any technique that is presented as improving the quality of web  
> 2.0 application has the potential to improve the design and quality  
> of revolution applications.
>
> Flow Diagramming is one of them.
>
> What is it? This is about encouraging you to think in terms of  
> flow: How the information changes, how responsive it is, how  
> feedback is given to the user about the changes that are taking place
>
> A good resource on this is:
>
> Flow In Web Design (short explanation with links to other resources)
> <http://www.websiteoptimization.com/speed/2/>

> Flow in Web Design (pdf, 37 pages)
> <http://www.websiteoptimization.com/speed/2/2opt.pdf>

> The difficulty then is about finding ways to represent how the  
> information within the application changes as a consequence of user  
> actions or script running.
>
> For this purpose, the visual vocabulary proposed by Jesse Garrett  
> (yep, the guy who published the paper that made Ajax popular)
>
> A visual vocabulary for describing information architecture and  
> interaction design, <http://www.jjg.net/ia/visvocab/>, along with a  
> Quick Reference <http://www.jjg.net/ia/visvocab/files/ 
> garrett_ia_quickref.pdf>
>
> With practical examples of how this vocabulary can be used to  
> represent the internal flow within an application:
>
> Slate <http://www.boxesandarrows.com/files/banda/ 
> slate_calculated_refinement_or_simple_inertia/jjg_slate.pdf>
>
> Yahoo email (for some unknown reason doesn't render well in my  
> browser when I doubled checked the link)
> <http://www.boxesandarrows.com/files/banda/jjg_ymail_poster.pdf>
>