A Caixa de Pandora _ EAM 4TM: maio 2007

Encontrei este artigo de discussão no site do Edward Tufte, enquanto pesquisava para a investigação do relatório de estágio.
Cortei algumas partes... mesmo assim está uma coisa imensa! :x

Flash, Usability, and Information Design

Hello, I was at your one day course in Houston on Jan.31, I just wanted to tell you that it was terrific! I was amused by your comments here and there about flash 5. I am a designer/developer/and content creator here at rigsby design in houston. I have been building websites for several years now, and I would love to hear more about your ideas of usability, and usability standards on the web. On top of that, dum de dum dum, could you expand on your distaste of flash. Flash has definitely worked its way into the web and is from my view here to stay. What are your suggestions, ideas, ridicules about flash and its presence on the web... thank you much for your time!

-- Travis Rimel (email), February 1, 2002

Response to Usability

You might be interested in Flash: 99% Bad, an article by Jakob Nielsen. In my humble opinion Flash is more like 100% bad. There is no excuse for confusing your users when so many alternatives are available to present the same information.

-- Andrew Ferrier (email), February 2, 2002

Response to Usability

100% bad?, confusing users with so many options? please elaborate.... I have read the 99% bad article, and frankly I disagree with it, When used properly flash can be an extremrly powerful tool. If you are referring to the fact that flash is still a "plug-in" and that going through the hassle to download a plugin is a site-killer, then look on the horizon, flash is being incorporated into and under microsofts master plan... from a structure stand point flash has gotten extremely powerful, with the intergration of hasty XML support and other new additions to the actionscript language it is beginning to open itself up to new possibilities

-- Travis Rimel (email), February 4, 2002

Response to Usability

From the point of view of information design, the relevance of a technology derives from how it assists thinking about evidence. So if you're interested in cardiology, you had better show sound and animation--the content demands it. There are surely a good many intellectual problems that can be assisted by motion and sound.

Of course there are many appalling and gratuitous uses of Flash. The design tricks and dancing images don't add to the content resolution, indeed they detract from the substance.

Some of the artistic uses of Flash are impressive. As I mentioned in another answer, my favorite cutting-edge group of art animations is the large set at http://www.once-upon-a-forest.com/ or http://www.praystation.com/ by Joshua Davis,whose art is elegant, smart, visually rich. (I have only viewed about 50 art sites and so there are surely other good ones that I've missed.)

And to see a worldwide collection of art with a lot of Flash 5 animations, go to http://www.xl5design.com/ (by the way, that is "ex-el-five" and not "ex-fifteen" in the URL) and then click on "0.4 linkage" for 42 different art/sound/animation links. It might be useful to look at this art in terms of seeking methods relevant to information displays.

In viewing this artwork, it sure helps to have a fast connection, even though several sites here have cute meters indicating download-time remaining. These sites often employ rather subtle navigation methods, some so subtle as to be nearly indetectable to the user. But this is all part of the art and therefore need not induce heavy breathing among the user-interface police. Enjoy the sites for what they are, experimental art usually involving sound and animation.

Among the goals of good information design, maximizing local usability is not the highest--although you want to do the best you can to reduce adminstrative clutter and inconvenience. More important is the quality, relevance, and integrity of the content; making high-resolution comparisons; showing process, mechanism, dynamics, causality, explanation; and capturing in our displays some of the multivariate complexity of the world we seek to understand. If achieving these higher-level goals takes us to inconvenient display techologies, so be it.

-- Edward Tufte, February 4, 2002

One contributor wrote: "... the main reason I referred to the original article about Flash being 99% bad was due to the point it makes about usability consistency --- Flash makes it far too easy in most cases to break the consistency of the user interface in the user's browser."

As designers, we should keep in mind that no tool on its own has the unique property of enabling good or bad design. For example, the simplicity of writing HTML makes it even *easier* to break the consistency of the user interface than does Flash; you can break UI conventions with Notepad.

Unfortunately, there's no tool (that I'm aware of) that encourages the following of UI standards in web design, full stop. It only happens when clients and designers together prioritize standards and usability. (You can do your part for web standards at http://archive.webstandards.org/ ). There's no reason to call 100% bad (or even 99%) bad a design tool which is well-suited to low-bandwidth, non-static information design. It's tricky to _design_ low-bandwidth, non-static information design, of course. Flash makes it very easy to incorporate dynamic data into designs, and allows you far more control over the visual presentation of that live data than most other technologies. Andrew H Otwell February 20,2002

-- Andrew H Otwell (email), February 19, 2002

there is also another use of flash - security of images from unauthorized usage. for artists, photographers and galleries, putting images in a flash gallery puts another layer of security between users appropriating images for their own usage. this important, in that javascript code to disable right click options on a PC do not work on drag and drop image downloads on a MAC. yes, users can still do a screen capture, but the capture will be much lower resolution, preventing really accurate printing or usage on the web.

the purposeful use of multimedia is important, and cannot be dismissed out of hand, especially in experimental stages. i agree that usability is the most important aspect of a website, but the growing pains of new technologies should be accounted for. and agreed, bad design is bad design in any application. what is missed in the use of flash is understanding that this technology, well applied, enables interaction and entertainment in ways that are unique. in that uniqueness, the value of flash can be explored and expanded.

i think it is a very valuable tool, but just that, a tool. flash for flash's sake, in the form of loading screens, is merely a commercial you are being forced to watch, whether for the site or how "cool" flash can be. i think designers need to remember the goal of a site and fit technologies into that goal, not vice versa.

thanks, Melissa Ulto multo.com

-- Melissa Ulto (email), February 19, 2002

Real Examples, Not Designchat

Reasoning about information design almost always needs examples. So let us escape the designchat about Flash (and for that matter LiveMotion and After Effects) and actually see excellent, typical, and bad examples.

Can our contributors and others now post, say, 5 URL's of Flash examples that are helpful in understanding the uses (good and bad) of the technology, particularly for information design? Show us what you mean. How about links to Flash training, so we can see what kinds of things are used as model examples for students? What Flash work has won what sort of prizes? Any good applioations in scientific visualization?

Let's get a good annotated inventory together here.

For starters, see the artistic links posted in this thread earlier.

-- Edward Tufte, February 20, 2002

More on Examples

And how about parodies of Flash work? The might be overproduced, content-free, self-conscious--with very expensive design fees.

Anything equivalent to Lincoln's Gettysburg address in PowerPoint http://www.norvig.com ? Indeed, what could Flash do for President Lincoln at Gettysburg?

An excellent parody along these lines is the Viz-O-Matic, the video parody of supercomputer animations by Wayne Lytle used in my one-day course.

So some parodies would be nice along with some really excellent examples.

-- Edward Tufte, February 20, 2002

The best uses of Flash I have seen come in the form of interactive timelines:

http://www.pbs.org/wgbh/masterpiece/archive/programs/davidcopperfield/timeline.html

http://iisd1.iisd.ca/timeline/

http://www.vintagetrends.com/timeline/flash.html

Another good use in an educational piece from MOMA:

http://www.moma.org/whatisaprint/print.html

And here is the best use of Flash I have ever seen, taking brilliant advantage of the zooming feature:

http://www.yenz.com/menue/garden/intro.html

I would also like to offer this counterpoint to Jakob Nielsen's "Flash 99% Bad." It is called "Flash 99% Good. First Aid Manual for Usable Flash Sites," developed and written by Kevin Airgid:

http://www.flash99good.com/

[link updated January 2005]

-- Dave Parker (email), February 21, 2002

Flash certainly has appealing features, but I think it is over used by far.

There is a cost associated with serving web pages, a cost that is normally ignored. A web page with lots of graphics (and/or Flash) can easily consume resources an order of magnitude or more greater than a simple text page. Bandwidth and computing power are not free, although you wouldn't learn that from people who sell development tools. Furthermore, the viewer's time is extremely valuble.

Enough vague generalities! Here are some examples:

www.craigslist.org

It has an extremely good interface, a distinctive style, and excellent functionality, and yet the site design does not have a single image of any type! The site gets 60 million hits a month (total, not unique), and yet the site design is so economical that Craig still runs it out of his house. It is rare that a page takes more than one half second to load. If the site had been done with graphics, I am sure it would have gone the way of Quokka Sports. Instead, it is a fixture to San Francisco residents and one of the most popular Bay Area web sites. Craig understands that it's the content that's important, not the graphic design.

www.hotornot.com

Another site run out of a house. Most of the images are not run from their servers, they are hosted on the user's personal web site. A very clever, easy to use design that puts the content front and center, with an emphasis on fun and easy to use.

I also note that neither of the above sites require registration to use basic features. From the first time you type the address 'til you are looking at useful content can be just a few seconds.

-- David Person (email), March 5, 2002

Bandwidth is becoming less and less of an issue as the Internet progresses, and computing power (by this I assume you mean servers' capacity for storing and downloading graphics) is less a problem than servers' ability to handle large amounts of traffic.

The debate over whether to use images at all is moot in this forum; the very nature of information design is that it uses images to convey information that mere words may not be able to.

We have already seen examples of where Flash succeeds in presenting information (and I, for one, would like to see more), and I believe the question of whether Flash is a good medium--or, at times, even the best medium--has clearly been answered.

-- Dave Parker (email), March 7, 2002

Great news:

The article "Flash: 99% bad" was recently updated. The author, Jakob Nielsen, has entered into a "strategic partnership" with Macromedia to improve Flash usability. Also, the new version (Flash MX) solves many of the technical usability problems the plagued previous versions.

You can see the original article at http://www.useit.com/alertbox/20001029.html. The new info is in an addendum at the bottom.

-- David Person (email), June 5, 2002

Sorry I got into the discussion so late. Two responses:

1) Re Flash being problematic because of inconsistent UI design: Flash MX now has a set of "components" that operate consistenly with user's expectations of HTML objects.

2) Re Tufte's request for good or bad examples of the use of Flash: have a look at NYSE MarkeTrac (http://www.nyse.com/) for some of the worst and best that Flash can offer.

The bad, as I see it:

- you have to click several links to get there (enter NYSE marketrac, select broadband or not, skip intro | full intro | light intro, etc.) Information Architects should know not to require so many clicks before a user gets to an app on the web. A few years ago, Slate magazine (http://www.slate.com) showed you a splash page, but also set a cookie that expired on the same day so a user returning on that day would be taken straight to content. Maybe NYSE could do something similar. Note that none of the preceding criticisms are specific to Flash though;

- high bandwidth, although I suppose most users are corporate and have fat pipes at work. This is also not a criticism of Flash per se -- I have seen many bloated HTML pages;

- the activity map/NYSE trading floor feature: I can't for the life of me figure out what information I'm supposed to get from it, other than it looking a bit nifty. It's truly baffling, and this is a criticism of Flash: it tempts the designer to create confusing eye candy.

The good, as I see it:

- the 3d chart. It's beautiful to look at; it packs Change, Price, and Volume into a very small yet easy to understand space, and it richly rewards user activity. Scroll your mouse over a stock and see what I mean. This last feature is specific to Flash; I don't think you could easily accomplish it with HTML (I suppose you could use layers and DHTML for something similar, but not across browsers, and it would be a nightmare to script and maintain).

Another example worth looking at is the Broadmoor Hotel Reservation system (http://www.broadmoor.com). In the lower right-hand corner, click on "Make a room reservation" (yet another example of the designer burying a useful feature with a small or misplaced link). You should be taken to a new page called "Broadmoor Online reservations with OneScreen." The page is not visually compelling: the colors are drab and some of the text is murky, but make a sample reservation anyway.

You should immediately notice that the information isn't submitted to the server, and the page does not have to refresh, until the entire reservation/payment process is complete. Flash sends both the data AND the interface to the client, thereby removing the need for roundtrips to the server and page refreshes. That's a real benefit of Flash that's hard to achieve with HTML. An HTML form would refresh when you clicked on a date (send date to server via form, check with database whether date is available, send yes or no response, if no click on another date for another refresh, etc.). Microsoft tried to get developers to buy in to "data-binding" a few years ago but it was specific to Internet Explorer, and this was before IE completely dominated the market, so it didn't succeed.

Okay, those are two examples where Flash accomplishes something that's hard or impossible to achieve with HTML. Others?

Regards,

Marc Garrett since1968.com

-- Marc Garrett (email), August 14, 2002

News graphics: mapped pictures with animation

Thank you Nathan Steiner, this is an excellent link!

Several of the examples at awarded entries (http://www.unav.es/malofiej/entries/indice.sel.html) are superb, combining photographs, diagrams, and animation to tell a news story. Series 9 is by far the best for animation.

In series #9, the news events are disasters--train/car wrecks, collapsing bridges, terror attacks--and the animated graphical descriptions have a clinical, diagnostic, forensic, eerie quality. Here the animation graphics have a point because the content itself is animated; things move, go crash and boom. In natural still-lands (such as showing euro currency conversion rates), the animations are usually pointless.

Note particularly the use of mapped pictures, which combine the explanatory power of the diagram with the particular local reality of the photograph. Mapped pictures are extremely effective for explaining something; there is a long chapter on mapped pictures in my forthcoming (2003?) book Beautiful Evidence.

-- Edwrd Tufte, August 30, 2002

I have seen few sites to rival the Thebian Mapping Project for the use of Flash. The information architecture, the interactivity, and most importantly the learning tools. The user can, for example, measure the length and width of any tomb in the project. The design allows me to guide my own discovery process. Well done!
Simply launch the "Atlas of the Valley of the Kings" and you'll see what I mean. There are many more wonderful surprises to be had at this site.

-- Randy Smith (email), September 1, 2002

I would like just like to add a link that I have not see in any of the threads- http://www.mapbureau.com/mapgallery/index.html Flash is a great for not only static cartographic web based design but it also provides a means to bring the temporal component of spatial data into context (look at the Salmon map), something which is very near impossible to do with commercial GIS software products.

-- travis hamrick (email), February 4, 2003

See the POSCO Automotive Steel Application Center http://www.poscoauto.co.kr/docs/eng/index.jsp and go to technical show

These illustrations in step-by-step movieland might not outperform a slightly larger (than the computer screen) still-land diagram but the step-by-step method is a nice way to stack information in time on the computer screen. The built-in statistical graphics are excellent. Really good illustrations repay study; these do not. A second look provoked impatience but not much additional understanding.

This was recommended in an interesting weblog, simian design, which has many helpful links: http://www.simiandesign.com/blog-fu/

-- Edward Tufte, March 8, 2003

Flash is unacceptable to me because it is frequently used to create permanently running animations. Often these can't be turned off at all, but at best can only be turned off via right clicking and then finding the right option. Then repeat for each image.

With running animations I find it hard to read the text.

They need to provide a way to stop all flash animations, similar to animated gifs which can be stopped by pressing ESC on most browsers.

-- Tim Josling (email), September 19, 2003

Perhaps Flash *is* 99% bad. But here's a site that might be in the exceptional 1%.

The animation shows transformations between three versions of the London Underground map, and how the transformations in the stylized maps distort geographical relationships.

The presentation could be improved in several ways that will be obvious to this forum's readership, but nevertheless it does provide an illuartation of a case in which Flash can be used to add information.

I was referred to the Underground animation from another lovely site, The Map Room.

-- Alexey Merz (email), September 28, 2003

Actually, I'd put that flash presentation squarely in the other 99%. The intro sequence would have been better as a small paragraph of text instead of the Power Point-esque progression. The instructions misspelled "underground." And although it was easy to compare the 1933 map with the 2003 map, it was difficult to compare 1933 with the "Real Underground" map, since the animorph from one to the other had to stop at the 2003 map on the way.

Much better would be several images on one or two pages, with resolutions high enough for printing, and a simple textual narrative. The flash adds little value here.

-- Scott Zetlan (email), September 29, 2003

The improvements you mention were among the improvements I had in mind. But the animated transformation itself is potentially useful. Ideally we'd like to see all three maps *and* the transformations at the same time, and the transformations could be done with or without the station names and streets overlaid.

I should have been more emphatic that the example shows the *potential* of flash. I do think it's in the top 1%; this is sad. I also think that the best-exploited feature of Flash is its ability to be funny.

As a much better example of how these technologies might be used, see the MIT Open Courseware presentation of Calculus With Applicaitons.

In this case Java is used, not Flash, so it cannot be included amont the top 1% of Flash sites, but the use of interactive/animated content is comparable. See, for example, this illustration of the basic trig functions or this explanation of how to calculate electrical fields.

-- Alex Merz, September 29, 2003

I don't want to make this an advert, but I think it does contribute to the thread.

The company I work for has already created a commercial application that uses Flash, to more easily provide a distributed architecture.

The application aims to provide better display and input of medical data, by medical staff, hospitals (over systems already in use in many of them). It uses Flash to provide an interactive interface via the web browser. There are no intro movies to negotiate.

The following article gives some of the rational behind using Flash:

http://www.internetweek.com/webDev/showArticle.jhtml?articleID=14800074

The application's website does not really give any useful screen shots, but for completeness the URL is:

http://www.blueiris.com

-- Adam, October 1, 2003

The "Secret Life of the Brain" animations are entertaining and worth a look. I'd put this site in the top 1% of flash design. It is distinguished from "bad flash" in several important ways. First of all, the animations are under control of the person viewing them. Some simple controls allow for intuitive manipulations depending on the demonstration. Secondly, the technology isn't gratuitous here; it's necessary to allow a human to control the action. Third, the exposition is reserved for textual narrative which, although it appears as part of the page, isn't delivered piecemeal through animation. Lastly, there's no attempt to show high-resolution statistical displays, which would be inappropriate given the low data-density of the medium.

Thinking about Flash reminds me of what Professor Walter Korte, in a 1995 cinema class at the University of Virginia, had to say regarding the transition to color movies. He noted that filmmakers explored how to use color with films that grossly overused color; vampire movies were a popular way to showcase the color red, for example. The techniques for working with cinematic color had not been invented yet. Similarly, the invention of Flash has led to a lot of truly horrifying animations that are probably best remembered as early experiments in how to use the technology successfully.

-- Scott Zetlan (email), November 9, 2003

For everybody who don't like flash there is an alternative: svg (scalable vector graphics). Information and examples can be found e.g. http://www.mozilla.org/projects/svg/ SVG also has the advantage that it is a W3C-recommendation and pure xml.

A very large community with more than 4.000 svg-developers is existing in yahoo.

Ineke van der Maat

-- Ineke van der Maat (email), December 12, 2003

For years, ever since I attended your course in Boston in 1997, I've been using Flash and applying your information concepts. Since that time, your concepts have remained unchanged (and rightly so), but Flash has gone through a transformation that emphasizes the very points you make. In Flash MX, the UI components introduced -- or at least encouraged -- developers to a clearer and far richer form of information in user interfaces. A small example lies in the changing labels in buttons as their task changes. More recently, Flash MX 2004, introduced a Focus Manager, that brings the eye to the point of current navigational focus.

Jakob Nielsen, who is right 50% of the time ,(based on a Nielsen-sized sample of 5 or 6) had a major impact on the direction of Flash. Since the time of his complaint, Flash has taken to heart his comments. Because Flash has more possibilities than HTML and now that it has become more ECMA compliant than HTML, it may hold the key for applying information concepts in ways beyond the flatland of paper and non-dynamic land of HTML.

Like bad book/page design/information (and Nielsen's complaint could have probably been appropriate there--99% bad designs)bad Web design is the fault of the designer, not the tool. However, Flash offers the flexibility to take information design to places that HTML may not go.

Bill Sanders

-- Bill Sanders (email), December 15, 2003

Here's my first stab at interactive information graphics in Flash. I think something similar might be achieved using Java, but I feel more comfortable in actionscript, and I think the resulting product runs and looks better. As you can see, at this point it's more of a concept, and needs much work, but I think it may illustrate some of the potential that Flash has.

-- Nick Zlonis (email), March 2, 2005

I have been trying to find a place to post this question on the ask E.T. forum for awhile, but can't find the appropriate place, so I am just sending it here.

The question is: Why does it seem that no one has really taken an earnest crack at re-envisioning the standard (and universally hated) top-down branching-tree "site map" generated daily by Visio using information architects across the professional web development world. The diagrams I speak of should be familiar to anyone who has worked in interactive design; consisting of boxes emblazoned with page titles or content labels, often color coded to content category, and connected via lines to illustrate the top and sub-sections of a site. I will include a few typical examples as links here:

http:// www.rachelmmurray.com/images/cybergrrlsitemap.gif
http:// www.packt.com/images/site_map_visio.gif
http://business.fullerton.edu/isds/cmargolin/csuf454web/sitemap.jpg
http://www.dannil.com/ visio/SMPRIMA.gif

These are unfortunately all too common.

We have been discussing the failures of these diagrams for some time here, and they are myriad, including the fact that they encourage thinking of hypertext information as a linear and progressive action, as opposed to its true nature, which is non-linear and not always progressive. Also, the more complex the site, the more impenetrable the site map.

We have been working with Dan Brown's ambitious diagram, linked above, as a starting point for re-engineering the design of site maps for our projects, to more accurately reflect the "experience" of a web site (or a particular click path), incorporating time, duration of page visit, page content length, and interactions between related content (contextual relationships) as variables, in addition to the simple linkage of page A to page B. I will be happy to share the results of these efforts as we achieve them.

I am surprised that it is not specifically addressed on this forum, as it seems a topic ripe for analysis by Mr. Tufte and his esteemed contributors. May I be so bold as to request this be promoted to "new thread" status? - P. J. Moorhead, Philadelphia

p.s. Had the pleasure of taking your seminar in New York a couple of weeks ago. It was my second time, and I found it more valuable than the first. Thanks E.T.!

-- Patrick Moorhead (email), October 11, 2005

A Caixa de Pandora _ EAM 4TM

sábado, 19 de maio de 2007

User-centered Information Design Workbook

"Flash, Usability, and Information Design"

Design para ecrãs pequenos

sábado, 12 de maio de 2007

Projecto final _ desenvolvimento 2

quarta-feira, 9 de maio de 2007

Apresentação intercalar e Semana da Queima

Acerca de mim

Blogs_EAM

Useful links

Arquivo do blogue