Anne Pascual: Thank you all for being here. Thank you for inviting us. In the next minutes we would like to focus on the visual aspect of web design as beautiful structures. Due to this subject we will show you quite a lot of images, actually screenshots of web sites. So you will leave this place with a lot of visible things in the head.
Thinking of user interfaces as the surface form of languages , this includes visual languages as well as markup languages, we’d like to present a few different design strategies. In order to question the interrelation of visual design, technology and people using the internet.
It seems difficult to estimate the duration of a decade. We tried to capture this period and the vast amount of web sites that have been created since, through a marginal number of designers. The selection is mainly based on our personal choice and experience as designers. These positions serve as milestones in our view, although there could be several other examples and counter-examples.
Marcus Hauer: Today there is no doubt why the web became a huge new field of activity for designers. It represents a very specific domain, which revived the link between design and technical innovation in a new way. The task of the designer concentrates no longer on a physical object or a print product, his role is to create processes.
How can we describe the meaning of this activity? We will try to answer this question during our talk.
There are mainly two aspects we use to evaluate web design. First the visual design should mediate the used technology, and second the impact of the design depends on users and practical consequences.
Pascual: Even if we’re not attempting to present a history of web design, we start with examples beginning in 1996. During this time the web served as a new and unconventional platform for designers to promote their work, which was mostly related to a background in graphic design. That’s the reason why you very often found web sites adopting print-based styles and layouts. People concentrated on the design of “single” pages similar to Desktop Publishing. By using images they enlarged the presentation of purely text-based content and imported print aesthetics to the web.
Another interesting aspect came up: design firms like IO/360, Futurefarmers, and Fork presented their non-commercial work equivalent to commercial projects. This two-sided thinking – combining business and experimentation assured money and credibility.
Hauer: An excellent example for this strategy was New York based IO/360. The firm placed a strong emphasis on the visual look, while experimenting with the constraints of the technology. They were first applying embedded technologies such as Java and Flash for non-commercial projects, before selling these techniques to their clients. During this time IO/360 were influential masters of table design and established such elements as rollovers. Here is their statement: “Rollover has allowed for a kind of instant user feedback; interface now becomes an active surface, a mesh that projects a tactility, literal or figurative.” One can say that unconventional works like Iogami or Panhattan certainly attracted potential clients and consultants.
Pascual: Futurefarmers introduced 3D illustrations, graphics, as well as characters, to the web and integrated them as functional, animated audio-visual elements. Amy Franceschini founder and still active part of the firm develops besides commercial web sites so-called “stimuli”-projects like Nutrishnia. Futurefarmers produces “Happy Design” with technology and communicating that, using Shockwave and Flash. With an emphasis on narratives and play, they produce small virtual worlds and avoid a standardized design style. In an interview one of the Futurefarmers contributors Sascha Merg said: “I try to not get used to anything; like always appreciate my surroundings… Like keeping a child’s perspective.”
Hauer: Berlin was one of the promising dotcom locations. Fork started in Hamburg but soon opened a second office in Berlin, like many other web design companies (for example Pixelpark), however in contrast to the majority of start-ups Fork survived the crash and still exists today. One reason why is probably their talent to sell humor and style to big clients like Lufthansa or Bayer, for example, Fork began very early to play with background images, using icons and symbols for the navigation which had a kind of sub-cultural flavor. Their games became famous entertaining examples for many users and designers and not only clients.
Shift, a Japanese e-zine, has presented on a monthly basis the first sites of the table-based design era and interviewed some of the protagonists. We show you Shift as an example of early web design discourses, initiating a kind of web design culture and stardom.
Pascual: The second phase we’d like to frame is centered around the Internet Boom, when the demand and the money for extensive and expensive web sites increased. In retrospect it seems that the content was not as relevant as the way it was presented. Designers satisfied clients with ideas of multi-media advertising, combing sound, video, and fancy animations. It was the time when designers tried to tap the full potential of the current technologies, while they forgot the basic principles of the World Wide Web. Macromedia’s Flash, which for the first time was available on a high percentage of client computers, was maybe the biggest factor for this development.
Hauer: One person who pushed the boundaries was, and is still to a certain degree, Joshua Davis, who started working with the previously mentioned IO/360 and worked later at KIOKEN as the Senior Design Technologist. His work incorporated web design as technical innovation, simply because he programmed multiple effects and events, simulating gravitation or elasticity. Finally Davis became the first superstar of web design or more precisely of the Flash community because he published his source code on his Praystation site openly and was easy to be copied by many others.
This web site for a department store, is one of the keystones in regards to using Flash in the context of web design. It was mainly developed by Davis at KIOKEN and in parallel he published his daily efforts while developing this web site on his private “web log” including the source code.
The Barneys web site was a small interface in it self. With dragable windows and dynamic horizontal scrolling it was a paradigm shift, which used all the capabilities of Flash 4. Later Davis published all his Flash sources on a CD-Rom.
Pascual: Hi-res! are Alexandra Jugovic and Florian Schmitt, who moved from Frankfurt to London in 1999. In an article by Vee Verdi at Ideasfactory he wrote: “Flash doesn’t get more flashy than Hi-Res’s film web sites”. This is definitely true. The movie web site for Requiem for a Dream oscillates between pop-ups, fake gambling sites and a net.art attitude, which was and still is quite uncommon for this genre. The user strays around purposeless without knowing where to go and where to click. This claustrophobic interplay is surely the intention of Hi-res!, they prepared paths and fragments for discovery by the visitor.
Other film web sites by Hi-res! function in the same non-linear and free form manner. Their design is less about information, and more about clicking, seeing, and experiencing.
Hauer: Craig Kroeger is the designer behind miniml.com. While nearly every web designer was dealing with Flash, Kroeger had a problem using this software. He sought design solutions that created a different message from the rest instead of detracting from the others. Sick of aliased text, Kroeger began to design pixel-fonts. Inspired by bitmap fonts he wanted to meet the demand for small fonts for the limited space and window sizes. This approach is significant because it has acknowledged the constraints of the screen display to the extreme.
Pascual: K10K was one of the most influential portals for the web design community. Providing daily news within their practice, designers showcased their skills, learnt about trends, and promoted their heroes. The focus of the board is not obviously technologically influenced, but the site itself is a good example for the pixel-style era in combination with dynamic content, which leads us on to the next stage.
Hauer: At first designers were preoccupied with enhancing aesthetics on the web. But after a time of big deals, big technology and lavish moving images, web design became not only a craft but a profession. Now you could concentrate on problem solving. Finally technology and design had to converge as well as useful layouts and meaningful content. Visual experiments were replaced by productions of more advanced site structures. In order to explore the potential of the internet designers considered using HTML based and text-oriented solutions with comprehensive navigation systems. Concerning the accessibility of the content, the developer enlarged the use of web sites by offering content management systems and creating back-ends that allowed people to edit data quite simply.
Pascual: San Francisco based design firm Method raised the whole issue of information design. Their clear and scalable design solutions pointed at the necessity for hierarchies and organization. They were preventing the risk of information overload by letting customers always control their experience. It was certainly very helpful that Method followed a holistic design approach working out the brand experience in different media types. Method Lab, an experimental showcase for navigational structures, gave the team integrity in the ever-changing web design scene.
Hauer: This newspaper’s online edition was big news in web design. John Weir proved that one single person could bring some fresh air into the business, rethinking the essential problems of reading on the screen. He was asked to improve the readability and navigation in order to provide an easy to use editorial interface. Weir did a lot more than this. Tired of the typical news site, he convinced the International Herald Tribune project coordinators to introduce more advanced features such as flexible column layouts, clippings, and a menu bar that follows the scroll of the page. Afterwards he published the code of these features, to be accessed by a curios web design audience.
WeWorkForThem was a very influential design-partnership during the post-Method era. While earning money mainly with illustration and typographic oriented Flash content, they rebuilt their own Flash-based web portfolio seeking for more functional design. This bloated front-end was reduced in favor of a more structured and easily accessible interface for another project. With YouWorkForThem, they established a very successful online shop, which sold everything cool in graphic and product design, for example books, fonts and posters. Both concepts had a huge impact on the Flash-using community. This was the first time when usability wasn’t any longer connected with a guy named Jakob Nielsen, but with smart people like themselves.
After the Dotcom Crash designers welcomed the emergence of a complete new field, which is the topic of our last paragraph.
Pascual: Now we’d like to walk you through our last few examples of today’s web sites pointing to some future directions for web applications. In general one can observe that visual design isn’t any longer a decorative surface hiding its technical infrastructure. Instead designers concentrate more and more on the choreography of structured accessibility.
By applying the W3C standards the advanced technical possibilities result in new kinds of visual interfaces. This happens as well because new browsers are more design friendly. It is the designer who defines a set of rules, flexible and modular site structures, in order to differentiate the content. But one can also see, that it is the user who covers the process of external sense making.
Hauer: At this point standards arose as powerful guides for functional design solutions. New discussion forums monitored the pros and cons of separating content from design.
The magazine Alistapart closed the gap between standard preachers and the people who actually built things. As you saw before K10K had promoted classic web design in terms of table design and static templates. They changed their strategy and designed the Adobe Studio web site without the use of tables. Instead they implemented it with a pure CSS/HTML combination. Another example for the growing emergence of standards based site development is the now Google owned Blogger homepage. Over a short time frame the likes of Adaptive Path and Stopdesign convinced the biggest blogging portal to invest in accessible content and functionality.
Pascual: Web based infoware applications underline the power and the potential of markup languages. Services like RSS feeds, Delicious and Apple’s brand new Dashboard exist mainly because of server side scripting that help to generate and organize personal data. With this growing popularity we see the need for more adequate visual interfaces that help to understand data rather than presenting it.
Hauer: Connected with standardized markup comes the extensive use of RSS feeds. RSS means Really Simple Syndication and is a way to extract the pure data of web-based content. This technique makes it extremely easy for the user to subscribe to such streams. While this establishes a more passive use of the web, it also encourages a more personalized kind of access by viewing multiple feeds with any possible client.
Delicious is a social book-marking tool to collect links not only with your own browser but also to share your collection with others. The user can also trace the rapid dispersion of single links and by categorizing web sites with own keywords or tags it filters content and contexts. The design of Delicious is very simple: links are shown to you in reverse chronological order; with those you’ve added most recently at the top. This purely functional interface could certainly be extended by several more enhanced representations.
In a few months Apple will release Dashboard, a software that provides access to mini-applications called widgets. With it you can get instant access to information and application controls you use most frequently. The fact that Dashboard is based on the same technology used to create web pages, HTML, Java script and CSS, anticipates future directions of hybrid web and desktop applications.
Hauer: Looking at these examples it is obvious that technical developments entail new concepts and methods. We’d like to finally answer our question from the beginning. Creating processes never ends by programming templates, applying standards or measuring user efficiency. Web sites, web pages and links represent successions of occasions, of experience, and it is the designer who has to foresee such sequences of operations or events, possibly taking up time, space, expertise or other resources. In a sense structures are meaningful and beautiful when they continuously enlarge the grid of possibilities for both the designer and the user.
Thank You!