Joel Veitch Plays With Computers And Stuff

The use of flash / shockwave content on the web has become very widespread recently, and has led to a certain amount of controversy over its value. There are various usability issues in the use of flash, as outlined in Jakob Nielsen’s report: http://useit.com/alertbox/20001029.html

Nielsen raises several valid points, but I feel that his assertion that flash is 99% bad is misguided, assuming that the web consists entirely of corporate sites, and that flash content is generally gratuitous animation in the form of intros or information delivery systems which could be better made in html.

Certainly, the use of flash intros seems gratuitous and to be a barrier to usability when designing a corporate site. My personal opinion is that these will suffer the same fate as the once-ubiquitous splash page once the novelty has worn off. The general worth of flash intros is parodied effectively at http://skipintro.com/

Also, it cannot be denied that there are many bad uses of flash content- the spectacular failure of http://boo.com/ (though followed by a re-launch) is a cautionary tale regarding the expense of maintenance of flash over html, and also faces the interface usability issues which are highlighted in Nielsen’s report. (It should of course be noted that there were other factors in the demise of boo.com- notably the enormous marketing spend which left them no money to weather an unprofitable period).

So, it seems fair to say that in the context of a commercial site flash content is often detracting from the site’s worth rather than adding value. In this respect Nielsen certainly has many good points to make.

However, the web does not consist entirely of these kinds of sites, and flash content is not only used in bad ways. So, what is appropriate use of media-rich content? The main answer to this question has to be that appropriate use is when the tools improve the quality of the product. It really comes down to what you are trying to deliver, and who you are trying to deliver it to.

There are certain things that flash and shockwave can do very well, and which simply cannot be achieved using a standard html approach. The obvious areas which benefit from the use of these tools are: design / art, music, animations (as in cartoons) and games. There are sites which make very good use of these tools to deliver appropriate content.

Design

http://www.skilla.com/ is a good example of form over function. In usability terms as defined by Nielsen the site is a disaster, yet taken within the context of what it is trying to deliver it is extremely effective. The site provides an extremely involving experience, precisely because the user has to work quite hard to discover the content. What it is trying to deliver is itself- there is no need to provide information on the relative merits of two DVD players to a potential buyer, so there is no need to sacrifice the form for the sake of function. What it is trying to deliver is beautiful design in an interactive format- and could easily be defined as interactive art. However, there is also a commercial purpose behind the site- this is a portfolio of work. In this sense it may have been more commercially sensible to provide a very clear layout with the portfolio easily accessible to potential clients. However, that would give a very different impression of the capabilities of the designer and perhaps more importantly the mindset behind it. This is definitely a work of art with a secondary purpose as a portfolio rather than the other way round. The designer has set out to create something beautiful and interactive, and has achieved exactly that.

Interestingly, http://www.gmunk.com/ which provided another example of a similar approach from a design studio, has just changed its format in exactly the way discussed above, replacing a very large and intricately designed splash page with a very simple menu. This is much easier to navigate than the previous design, and obviously makes a lot more sense as a means of delivering a portfolio of work, although it is a far less involving experience. Strangely, the previous loading page quoted a message from a user in extremely large letters "no more 186k splash pages ok guys" while loading a page over 300k. The response was that "it’s all about not compromising what you’re trying to do" - a sentiment with which I can empathise. This does make the apparent turnaround somewhat surprising, though it is I suppose completely understandable. It is without a doubt a lot easier to access the work, and the format is of course immeasurably easier to update. This difficulty in updating content is of course very relevant with anything that has to include new content on a regular basis- flash work will always tend to be left alone once completed.

The work that gmunk shows on this site is a very good example of how to make interactive art with flash and director, and makes extensive use of quicktime. There are several pieces which make extensive and effective use of non-intuitive interfaces to provide an absorbing experience for the user- certainly an example of how to use the tools to best effect. The design of the work here is extremely impressive, but by using flash and shockwave effectively he manages to make the art the design, and the design the interface. His work is certainly very far removed from Jakob Nielsen’s classification of what is "good" but is also certainly infinitely more pleasing to use. Again, the issue is what is being delivered and to who. In the context of gmunk’s work, the tools are used to best effect and are certainly in no way unnecessary or time-wasting. There is no intention to sell a pair of jeans, or update you on financial information, and as such the work is justifiable in its own terms. I would consider this to be one of the most effective, impressive and appropriately executed examples of what is possible in terms of design, interaction and art using web-deliverable media. My only small criticism of the menu would be that there is no obvious reason for it to have been executed in flash in its current form, and the fact that the visited links feature of html is therefore not available makes it slightly difficult to tell which pieces you have already viewed. Perhaps when he decided to go for a more easily navigable initial menu, he should have bitten the bullet and made it simply in html.

Another very good example of what is achievable using flash is http://www.hipnotika.com/ - this is a very different kind of experience from the previous two examples, but in many ways is just as impressive.

The site is unashamedly aimed at a high-bandwidth audience. I would hate to try to use the site over a 56k modem, but the intention is there to supply media-rich content to an audience who are capable of viewing it and appreciating the product. The site is essentially delivering a travelogue and photographs from a journey around Africa, and it does this in a visually very appealing way. The interface is easy to use, and it functions extremely effectively. The commercial drive behind this site justifies the fact that many users will find it difficult to download the large files. In the contact section there is an explanation of who is behind the project and what they do. This is a product by a company called insomnia, who are aiming to provide media-intensive products to a high-bandwidth audience, and therefore the site reflects what they intend to do commercially. The content is provided by a freelance travel writer and photographer. It is easy to see how this kind of delivery makes sense for him- this site has attracted a lot of attention, far more so than would have been the case if his work was on yet another html site lost in the ocean of similar products. The site has obviously taken a lot of time and resources to put together, yet makes good commercial sense for all parties in terms of attracting attention to their work and capabilities. To sacrifice the ability for a proportion of users to view the work rather than provide a product that everyone can use but no-one has heard of makes sense. It also means that by defining clearly the fact that they specialise in media-intensive solutions, they can provide a product which is as good as they want it to be, rather than as good as is justifiable in terms of 56k download speed.

Another approach to delivering photographic images using flash in an effective way can be seen at http://www.johnmarksorum.com/ - this site delivers the work of a photographer in an interesting and engaging way. There are a few usability issues with this site however, so it is maybe not as good an example as previous ones of best use. On the positive side- the images which we are presented with are quite dynamic, and the intention is to provide a sense of movement (obviously with appropriate audio content) in order to make the shots seem far more lively and impressive than they could be in a flat html page. In this, the designers have succeeded in my opinion in creating an environment that suits the nature of the content. Again, this is a showcase of a photographer’s work rather than an attempt to sell products or provide specific information quickly, and with this in mind the use of animations is wholly appropriate to the mood of the content and by no means gratuitous. I would consider this to be a good example of improving the impact of the content by using appropriate technology. The main drawback in usability terms is the fact that the back button on the browser takes you completely out of the environment and back to the initial page. This is an unfortunate issue with flash- navigation around objects is not as intuitive as with html. This could perhaps have been addressed by using more pages with smaller flash objects in them.

An example of a good interface used in a beautifully put together design in a more corporate manner is http://www.2advanced.com/ - this is the work of motion graphic designer Eric Jordan, and is intended as the site for his business. As such, he has created a very good flash interface around his work, which is easily navigated and intuitive. I would personally have thought that the intro was superfluous, but as he seems to do quite a lot of commercial work making these it is understandable to have one. The files are not so excessively large as in some of the other examples I am using, and this also is appropriate- the "arty" content displayed on gmunk and skilla is not so appropriate in this far more commercial site. The obvious thought that has gone into making the site easily navigable and usable pays dividends in terms of usability. Again, this is a question of appropriate use- Jordan makes motion graphics, and so to make a site to display his skills and attract business which did not use the tools to best effect would be somewhat inappropriate. As it stands, the site is a very good advert for his ability to put together a well thought-out and usable flash interface around his graphic design.

One of the most visually impressive things to be made in flash is http://www.derbauer.de/ (go to the flash 5 site, and avoid their featured site of the month) - functionality aside it is a very good example of 3d animation deliverable on the web. Its makers describe it as "a vision of the future" and in this context as a visually impressive piece it is very successful. That it will be slow to download for many users is obviously irrelevant to the makers- they set out to create something which by its nature would involve large files. The project would not have been achievable if bandwidth was the primary concern. It is also not affecting the popularity of the site- the counter at the moment shows 11 million hits, which would imply that there are a very large number of people who find it usable.

The ease (or otherwise) of navigation within the site does not live up to Nielsen’s ideals. Without a doubt, ease of navigation has been sacrificed for stylistic reasons. This is not in a constructive way as with gmunk or skilla, but rather an artefact of the emphasis on delivering a futuristic 3d environment. To this extent it has to be seen as a weakness, though to be honest it is not a particularly major flaw as the content is less of an attraction to the user than the sheer impact of the environment. If we accept that the primary purpose of the site is this- to deliver a vision of the future, or as a showcase for what can be achieved on the web in terms of interactive 3d animations, then it is undoubtedly a successful site. Certainly there are few things which are quite so dramatic in terms of the atmosphere that can be created for the user in a web-deliverable format.

A somewhat different take on flash design is available at http://swampthing.zap.to/ - he describes his work as "terror design" and says that Albert Einstein was not responsible for the creation of the atomic bomb, and Macromedia is not responsible for the contents of the site. This is not supposed to be a pleasant experience for the user - he says on the screen "do not bookmark this page - plz" and asserts us to "destroy your site." I find it quite an appealing design- certainly it is an interesting take on how to design for the web in flash.

So- there are many different ways of approaching design in flash, it is a very flexible tool and can achieve impressive results.

Music

It is quite difficult to effectively link audio and visual elements effectively in html- the best way to integrate audio elements is via flash / shockwave. There are a few sites which take advantage of the capabilities of the technology to create a powerful environment for the user focussing on music, but incorporating effective visual elements.

Interestingly, one of the most effective music sites using flash actually delivers the majority of its audio content using realplayer downloads. http://www.xencuts.com/ is the Ninjatune site for their Xen project. The site provides us with an easily understandable interface with a large quantity of available information presented in an easily navigable format. It is also a much more atmospheric experience than could be achieved with html, and this seems wholly appropriate for a site for a record label such as ninja tune. The target audience will be likely to be reasonably sophisticated technologically, but will certainly appreciate the little design touches and audio elements that have been incorporated into the site. This has been achieved without making the navigation in any way cryptic.

The audio samples are extensive, and in the form of realplayer downloads. Flash is obviously a good tool for integrating audio media into a site, and has been used to do this with small samples throughout the site. However, the realplayer downloads make sense for the user as they provide good flexibility and control in playback.

A music site which uses the audio integration capabilities to a greater extent is http://www.bcrecordings.com/ - this site is in general more angled towards an immersive and atmospheric environment for the user, and uses a longish intro sequence combined with a very dark design to add weight to the style of the music. This is, I would say, appropriate in that the audience for this resource will be very much interested in nightclub culture, and the visual elements of the site are reminiscent of the atmosphere of dark technology and lighting effects found in clubs playing this kind of music. The effect is to generate an overall environment for the user, which is considerably more atmospheric than a simple html interface can provide.

The interface itself could be more intuitive, and it could be more easy to find the full listings of available tracks. This could be seen as a failing, although it is a price paid in the name of the design. I would be surprised if many users were put off by the need to explore the site a bit- the selection of tracks available means that to hear the music available you will have to spend some several minutes there anyway, and the opportunity to find out what is available through the somewhat cryptic interface is a good way to keep occupied while listening to the music. The visual effects are also very nicely put together and add to the general tone of the site, so I would be inclined to say that while it could be put together in a more user-friendly way in terms of usability, the general presentation of their music to best effect is achieved successfully. The streaming audio is fast and reliable, and this is of course the main point of the site- to make people aware of their music while providing them with added information should they want it. I would say, then, that this still counts as appropriate use of the technology, despite the usability issues involved with the design.

Cartoons / Games

The other main area that flash / shockwave is particularly suited to is of course cartoon-style animation (flash) and games (shockwave).

Cartoons / comedy that make effective use of flash (as well as video) can be seen at http://hahabonk.com/

Hahabonk have opted for a full flash interface around their animations and videos - this looks nicer than an html interface, but is not as user-friendly as the interface at http://www.shockwave.com - this site has a wider variety of flash and shockwave content, less specifically oriented to comedy, and uses an html interface to reach the product.

Here we find another form vs function question, and again appropriate use seems to be the key point. Both sites offer flash content as their prime product. However, the use of an html interface by shockwave.com seems to be a much more usable way to deliver this content than the flash interface of hahabonk. The ease of navigation to reach the various movies is far greater through html, with all the issues discussed above coming into play.

So- Hahabonk is a good place to see good comedy flash content, but shockwave.com seems to provide a better example of appropriate delivery of this kind of content. Also, of course, shockwave.com offer a large number of games for the user. It is possible to produce much better web-deliverable games using this technology than in any other way, and there seems to be no doubt that such use is appropriate. There are many other sites offering animation and games made in shockwave and flash which are well-executed- as there is no viable alternative for this kind of content it is difficult to see how it could be in any way "bad" as Nielsen would put it. The delivery of these pieces is of course open to the same usability issues as any other type of site, but the content itself would not be possible to provide without using these tools.

So, flash and shockwave do not have to form the interface of a site to provide useful content, they can be the content in their own right and are very successful when used in this capacity. In the same way as html is not always the best tool to create an interface for a specific project, it is true that flash is not always the best tool to create an interface to deliver flash or shockwave content. It is, again, a question of what is being delivered and who it is being delivered to.

An unusual, and surprisingly entertaining use of shockwave can be seen at http://www.mobilesdisco.com/ - a virtual disco chatroom in Finland where users select the appearance of their avatar and chat in real time- only people close to you can hear what you are saying, and it must be said that the implementation of the concept has been extremely effectively achieved. This is another example of an entertaining and appropriate use of shockwave to provide a product that could not be provided using any other tools. The interface is of course completely non-standard, but yet is perfectly intuitive- you walk up to people and talk to them- it is difficult to imagine an interface that could be more intuitive than that regardless of web protocols and standards. This is another good example of where Jakob Nielsen’s argument is flawed.

So, we have seen that there are many good and appropriate ways to use these versatile tools- certainly more than the 1% of use that Nielsen would have us believe. However, there is definitely a need to consider what is appropriate and adds value, and what is gratuitous and distracting use of inappropriate techniques. This is really a question of following simple and common-sense guidelines.

A good list of usability tips can be found on the were-here flash forum at http://were-here.com/forum/Articles/Topten/index.html

Basically, they come down to:

1. Remember User Goals

2. Remember Site Goals

3. Avoid Unnecessary Intros

4. Provide Logical Navigation and Interactivity

5. Design for Consistency

6. Don't Overuse Animation

7. Use Sound Sparingly

8. Target Low-Bandwidth Users

9. Design for Accessibility

10. Test for Usability

Further tips on this subject are available from macromedia at http://www.macromedia.com/software/flash/productinfo/usability/

There are of course many other things to be taken into consideration with regard to how use of these tools may evolve. The most obvious question is one of increasing user access to broadband connections. Once this is widespread enough to justify the investment, we will undoubtedly see a revolution in the way the net is used- complex animations and design are by no means the only things that will eventually become deliverable:

Marek Grabowski - Creative Director of The Hub consultancy says:

“5 million TV channels within 5 years. Affordable Home PCs are now shipped with sophisticated video editing software. Throw in the cost of a digital video camera and for a couple of grand we can all go head-to-head with Time Warner, producing and airing our own movies or programmes, whether we have a talent for it or not. With a little help from broadband delivery, within 5 years 'TV ' channels will number in their millions rather than the hundreds available today. “

This is probably some way off in the future though. In the medium term we can expect an increase in the number of people who will be able to use media-intensive content without unbearable delays through ADSL or cable modems. This should see an increase in the amount of such content that is being delivered, with flash and shockwave presumably at the forefront. Shockwave content, particularly, stands to benefit from increased bandwidth due to the generally larger files associated with the format than with flash. There is a certain amount of disagreement about how soon exactly it will be justifiable to have large-scale broadband-oriented content delivered on the web- server delays account for a large proportion of time wasted while surfing, and obviously gratuitous use of intros negates any improvement in connection speed in terms of getting access to content. Assuming that these issues are improved as time goes on, though, it does not seem unjustifiable to expect a large degree of content to be available in a media-intensive format in 5 years time. Quite whether this kind of content will ever be relevant for information delivery systems such as search engines, news bulletins, financial information etc is another issue, but that does not mean that there will not be a market for it. Obviously, the cost of this kind of content will always be relatively high, and so we cannot expect a majority of the web to take this kind of format at any point in the near future as long as there are small operators and individuals putting large quantities of information up.

In terms of use today, as I hope I have shown, interface usability issues etc do not necessarily mean that flash is always bad. If it is used in an appropriate way it is an extremely powerful and versatile tool (as is shockwave). There are many areas of web design that can benefit from their use, and it is certainly not 99% bad. The abuses of the tools that are common on the web are to be considered bad design, rather than evidence of a bad tool. In various areas, flash and shockwave enable flexible delivery of content that simply could not be delivered using any other tools- certainly not html. Appropriate and intriguing interfaces can be designed, and particularly as content in its own right delivered through an html interface it is unparalleled. Audio integration, art, design, games and cartoon animations are all areas which benefit hugely from sensible use, and the fact that interfaces are non-standard by no means automatically renders them bad, as long as they are appropriate to the content.

A wonderful example of just how far misuse of flash can be taken is available at the site of the president of the UAE, His Highness Sheikh Zayed Bin Sultan Al Nahyan at http://www.sheikhzayed.com/ - long download time, interminable and pointless intro sequence and remarkably unfriendly interface combine to show exactly how bad flash can be. There is not even a "skip intro" option, so the hapless user is condemned to sit through the intro sequence with no hope of escape, and having finally reached the site the navigation systems are so horribly difficult to use that it is practically impossible to find any helpful information.

Hopefully as the audience, clients and designers mature, we will see this bad usage falling by the wayside and appropriate use of powerful multimedia tools increasing the quality, originality and interactivity of large portions of the web.

Joel Veitch