Flash Web sites

Flash animation has been used in web sites for different purposes. It can accentuate page elements, tell a story in animated form, or present information as a video game. More rarely do we find a web page built entirely in Adobe Flash. Though usually visually stimulating when done well, entirely Flash websites have their own set of problems.

First and foremost, webpages that run entirely in Flash present accessibility and usability problems. They are often difficult to keep updated regularly due to the amount of time it takes to modify the Flash pages. Another problem with Flash web pages is that it’s difficult to point someone to specific content. For example, with one of the web pages I’m going to review today, there are several impressive student videos that I would like to show a friend. However, there is no way for me to link to the specific video. I cannot bookmark internal sites. I can only say to a friend “click on the main page, then click the second tab, then click student's work, then it’s the third video from the bottom.” This is contrary to the shared emphasis of Web 2.0. It makes it difficult to connect other users to the information.

There is no denying the artistic elements of Flash oriented webpages. The best example of this is the homepage of the Bellecour Schools of Art in France. The website is absolutely beautiful, with original artwork. The designer uses the screen like a canvas to showcase the art. Content is almost secondary.

The page is divided into three separate sections, each for a different one of the schools. Each school has it’s own color coding for the text and navigation bar that runs across the bottom of the screen. Although each school’s page uses the idea of a landscape as the background, each school has their own mascots as a theme. One uses a large robot character, who appears throughout. The other uses a futuristic city with cars and the third makes use of science-fiction-like spheres. The action is constantly moving in the background, taking your eye away from the main content and giving the user the impression that this moving content is clickable, although it is not. The page’s content appears over the background like a movie screen over the landscape. This limits the size of the content, but makes it part of the experience of using the site.

The overall effect of the design is to produce a web page that is more like a piece of art or a movie that the user experiences. When I clicked on the little cell phone/pda object in the left hand corner for more information, I was given a treat as the object grew in size and floated to the center of the screen. Then I was given a form to fill out for more information about the school. It is functional and interesting, but if I was a potential student, I have no way to print out relevant information, cut and paste important info, or bookmark specific pages for later.

The target audience for the Bellecour site is students looking for a school. It is in the school’s best interest to showcase the kind of things the students could be learning within its walls. At the same time, the website for the school is a piece of art, a beautiful site for the average web user to discover.

The colors used are on the warmer side – green, blue and orange in lighter tones. The typography is highly readable. And despite the fact that this web page has little in common with standard navigation schemes, I was able to click through and find my way through even before I discovered there was an English version of the site available.

I’d like to compare the above site with the official website of J.K. Rowling, author of the Harry Potter novels. Rowling’s official page is also done entirely in Adobe Flash. However, unlike Bellacour, she offers many different options for viewing, including a text only version as well as an accessibility enabled version. The version I am going to speak about is the standard Flash only page available in English. As per my original complaint, I can’t link you to it, I can just tell you to go here and click “Enter Site” under the British Flag.

When clicking, Rowling’s site expands the browser window automatically. There’s no need for “back” and “forward” buttons. All the navigating is done through the page. Meanwhile an eerie sound plays, wind whistling on the moors, a dog barking the background. On a light green background we are presented with the image of a cluttered desk, done in a rather cartoonish style. Clicking on different objects on the desk, such as the diary, an eraser or a even paper clip, is how we navigate through this page.

Navigating through Rowling’s site is more like playing a game than finding information. The experience changes depending on what item you click on. Clicking on the hairbrush, for example, will take you to a bulletin board, where you can click on other items. To get back to the main page, you need to find the hairbrush again. This fits into the Navigating through Rowling’s site is more like playing a game than finding information. TheHarry Potter theme of “portkeys” – objects transporting people magically to different locations. My favorite experience was found after clicking on the glasses. I was brought to a library, with books placed on a shelf. Each book was a link to a different external webpage, however by moving one marked with a question mark, I was able to find a key that opened a box, unlocking special content for me. I felt like I accomplished something and was drawn deeper in the world the web page’s design had created.

The typography used when large blocks of text are there to be read is a simple sans serif font. It is highly readable, which makes sense seeing the clutter of other images behind it. The site also likes to recreate the book effect. When clicking on her “Biography” the user is treated to a book where the pages can be turned by the click of a mouse. The typography underneath the photos and used as headers is reminiscent of handwriting, giving the users the sense that they are looking at the private memoirs of their favorite author. The text in the biography is still that simple sans serif font, which makes sense considering that many of Rowling’s fans are children who might need a simpler font to read. It’s important to note that the target audience is children. This explains the video game effect of the flash website. It is very successful and usable. Children and adults alike can use and enjoy Rowling’s site.

Rowling’s site differs from the Bellacour site in many ways. Her site is more entertaining, less focused on presenting beautiful artwork. Her navigation scheme is non-conventional. Although the site gives the impression of a cluttered desk, the items are carefully placed and arranged for the best effect. Both sites make effective use of Adobe Flash to create interesting, beautiful and usable websites targeted to their specific audiences.