The golden boys and girls of the Museum web site community have put together a new blog to share inside information on what it takes to present a collection online. MuseMatic is a co-ordinated effort between the Museum Computer Network and the American Association of Museum’s Media and Technology Committee. While the design of the blog won’t impress the standardista community, the informaton within should.
Museums and other non-profits have an amazing collection of misfits, psychopaths, and egotistical maniacs. But once you get beyond the marketing departments, you’ll find people who love what they do and have an earnest desire to share their collections, art, history, and culture with anyone and everyone. Museums have been leading the drive towards accessibility, online interactions, user generated content, and doing so with the tiniest of budgets.
So step behind the scenes. Go past the paintings, the skeletons, and the gift shops. Share the lessons learned by some of the largest (Getty) and smallest museums around the world.
When Flickr first began, I was intrigued by the hype and set up an account. After loading a few images, I frankly lost interest. I didn’t like the idea of putting a lot of time and energy uploading my work to someone else’s server. I wanted to work with a photo gallery that could be used by future clients, i.e. museums, who would never put their work on a communal site.
So, my Flickr account sort of sat there, ignored and dusty. Like the souvenir bottle from a short-lived summer vacation.
Now I’m working for Yahoo!, who purchased Flickr earlier in the year. As an employee, I get the super-dooper pro version of Flickr gratis. I wouldn’t dust off the Phoenix references just yet. I pretty much killed the old account. Nope, I’ve got the brand, spankin’ new Yahoo! employee turbo-charged Flickr fiesta foto gallery (lordy that sounds stupid). I’ve already uploaded about 450 images and look out for more.
I am a frustrated web site designer.
In 1996, Creating Killer Web Sites introduced the world to web sites built with artistic merit. While the coding is outdated, this book continues to have a strong impact on my Internet designs.
I don’t want to create pages that are strictly functional. I want to create designs that reflect my personality. I want to create pages that are more than a one-liner statement. I want to create web site designs that are functional AND artistic.
However, I have not been able to translate what I see and want into a web design.
Other art mediums require gestural movements. Line qualities change as pressure is applied to the pencil. Surfaces age and crack and the artist can affect the texture’s sheen, and luminosity. Colors flow organically and rarely do you see a sharp delineation.
But not on the web.
How can a web designer bring texture, history, and gesture into a web design?
There have been some advances in representing texture. Apple has made the brushed aluminum texture de-rigueur for the non-PC crowd. Shiny, luminescent buttons have been around for years. Emboss, glow, drop shadow, and inner shadow are all tools of the trade to give our web sites dimension.
But as successful as these effects may be, they lack the tactile quality of heavy woolen fabric, an ancient wooden crucifix scarred by years of candle smoke and burrowing insects, the sheen of a bronze sculpture touched by scores of people over the centuries, or the crusted surface of an ancient Buddha after generations of offerings.
Cameron Moll’s series “the Wicked Weathered Look” showed web designers how to give their graphic a weathered look.
While the wicked worn technique utilizes source material that is authentic in its wear, the process is still too exact. You cannot fake randomness. Walt Cotten taught me this difficult lesson when I was his student at SDSU. He would encourage us to close our eyes when we attacked a stone, negative, or assemblage. How can we, as web design artists, allow our designs to age naturally?
Drop shadows have also become an indispensable part of web design. The web is inherently a flat medium. Just as a drawing or photograph uses perspective and tonal values to create the illusion of three dimensions, the web designer uses shadows and glows.
In the natural world, there is normally a key light source and multiple fill and accent lights. The savvy designer will remember to use a global light source in Photoshop to avoid graphics that imply multiple key light sources. While this helps, it is rare to see the designer that incorporates the concepts of fill light and the effect of dimensional surfaces.
The tactile surface of a Rodin sculpture, with the impressions of his strong hands will not create the same shadows as the machine-smooth surface of a Brancusi Bird in Flight.
Architects and furniture designers use recessed lines to create shadow lines that separate the various planes of a building or table. An incised line below the tabletop can give it the illusion of floating on legs. Inset windows not only protect the interior from sun but may also give the building a sense of security and solitude within.
The Bauhaus rebelled against the elitist, decorative approach to architecture and design in the early 1900’s. Against the backdrop of Victorian, Pre-Raphaelite, and Art Nouveau, the Bauhaus ethics of pure classical lines and lack of ornamentation seemed revolutionary. The Craftsman movement in England and especially the United States also celebrated the simple lines and graceful proportions of handmade objects.
Were these movements a rejection of decoration or decoration for the sake of decoration? Certainly the textiles of both movements incorporated patterns and lines with a nod towards the textures of natural materials.
Andy Clarke recently wrote about creating a set of elements for his latest web site design before actually creating the layout. This allowed him to set the tone of the design before building. Each element was used with care. Often times, the bones of a site are built and decorations are added as jewelry. In today’s bling-obsessed world, this has often resulted in riotous pages that dismay the visitor.
While visiting the Louvre recently, I noticed the decorative elements of ancient paintings and objects. The Greek and Roman frescoes and mosaics use decorative elements to differentiate the various elements. The handwork of a tile setter on the mosaic floor of a bath keeps the design intriguing while not distracting from the central figures. The decorative embellishments in an illuminated manuscript illustrate the page’s contents while offering rest to the weary eye.
So, what are the answers?
I don’t have the answers, hence the first sentence of this essay.
I do, however, have some suggestions and those that are better web designers may have some more practical answers to increasing the visual power of web designs.
There is no substitute for natural texture. Use photographs of aged copper, the limestone walls of Paris, California beach sand at sunset, the whitewater of a river in Canada, or mineral deposits of a hot water pool in Iceland. Why try to recreate these elements in Fireworks when the real world is just outside.
For years, people have created rubbings of tombs and reliefs as souvenirs. Use this on your web site. Go outside with a piece of paper and pencil, find an interesting texture and capture it by placing the paper against the object and rubbing the backside with the pencil. Scan the paper and you have an authentic texture to work with.
Wire frames are used to co-ordinate the layout of a page. Why not use a wire frame to describe the three dimensions of a layout if you plan on using shadows. This would encourage the use of shadow lines, elements that catch a highlight and the scope of the shadow they cast on the surface below.
Objects do not have strong outlines. Light wraps around subjects and shadows blend into the lighter sections of an object. Study Carravaggio’s use of chiaroscuro or Leonardo Da Vinci’s sfumato techniques. Think about using backgrounds that dissolve rather than have outlines.
Study the light coming out of a sconce. There is a distinct play of light between the darker surface and the light reflecting on the wall.
Consider the purpose of your decorations. Are they meant to embellish or are they the star of your design. Use found decorations instead of creating them in your favorite imaging software. Appropriate the borders of photographs, prints, mosaics, tombstones, and more.
Usability and Accessibility
I want to create pages that are not accessible. I want to create pages that have texture so thick that the text is obscured in a blur of dried chemicals. I want to explore surfaces that have been etched by years of exposure to wind, rain, and the hands of passersby.
I want these in a web site but know that it would mean creating a web site that cannot be read and this violates my interest in accessibility. A site that offers content, should offer that content to everyone, regardless of ability. I can’t justify the dark, obscured site with low contrast for the visually adept and a bare, unstyled version for those with low eyesight.
Alternate style sheets could give visitors the option of choosing which design works the best for them. For instance Gerhard Richter has two distinct painting styles. His photo realistic, muted paintings of blurry photographs stand in stark contrast to his colorful abstract smears.
As I sit here writing this essay, the sun is dropping lower in the sky. The light is skimming across the Haussmann-era building next door to this coffee shop in Paris. The dentitions under the roof, the faux-columns framing a window with rococo flourishes are capturing bits of light and casting shadows within their crevices. The sun’s position in the sky has brought the surface to life.
I can’t wait to do the same to a web site.