Ask
any savvy Web designer today about how to
effectively use graphic images on an
e-commerce site, and the short answer is: Use
as few as possible. While the early years of
the Web featured enough spinning, animated
logos to make a surfer seasick, now users
just won't tolerate the load time such
elements exact. Often, if a site takes even
10 seconds to present its offering to
shoppers, they'll just click on. Gratuitous,
decorative, complex images are thankfully
getting stripped off site after site.
For some sites, however, images are crucial
to the selling mission. Take athletic shoes,
for example, where styling has as much or more
value to shoppers as specifications about fit
or function. Or consider electronic products,
such as cameras whose slick or colorful or
classy chassis alone can inspire a purchase.
Yet the visual display dilemma is quite
thorny: You can serve up a large, detailed
photo of one product and force shoppers to
actively seek out the rest of your offerings.
Or you can feature row after row of tiny
photographs where, unfortunately, they'll
look virtually identical. Both options can
also involve long download times.
At least cameras and shoes tend to be heavily
advertised in other media, however. Imagine
if you sold a product that would cause a buyer
to want to visually examine every possibility,
even though the person might very well arrive
at the site not knowing precisely what he or
she is looking for. That's the dilemma faced
by this month's Web makeover candidate, the
seven-year-old, Boston-based International
Poster Gallery. This company's brick-and-mortar gallery on Newbury Street in Boston
has a huge inventory of roughly 10,000
posters. Its two-year-old click operation,
InternationalPoster.com, is a subset of that
inventory -- original vintage posters,
searchable by subject, country, style, poster
artist, size, title or keyword. "Our site was
a 'Yahoo! Pick of the Day' selection in 1999,
and is generally considered the best in its
category," owner Jim Lapides wrote to us.
"Many of my customers rave about its logic
and ease of navigation. We have tons of
content -- 3,000 in-stock vintage posters
online and background about the entire world
of vintage advertising posters. But to me, I
think our site, particularly the homepage,
can be a lot better."
OVERWHELMING. Lapides feels his customers represent two
groups that are difficult to serve with the
same design: "Old users want to get around
fast to what's new and to search. For new
users the whole thing is a bit overwhelming.
Many don't see the power of the search engine
and leave before trying it out." The
challenge of being equally appealing and
useful to both return and brand-new customers
is a very common lament among Web-site
developers today. That's one reason why
International Poster represents a good
makeover challenge. Another is that working
with this site's design involves addressing
the difficult challenges of effectively
displaying images when it's critical to give
shoppers a good look at products.
Let's start with George Johnson,
vice-president and creative director of Novo,
a San Francisco-based Internet professional
services company. Johnson has worked in a
design capacity for some of the world's most
widely known brands, including Nabisco,
General Motors, and Fisher-Price. George and
his team previously helped us with the Axcis
makeover. Notes Johnson: "As the online
standard becomes increasingly dynamic,
personalized, transactional, and
task-oriented, dedicating a great deal of
time, effort, and bandwidth to the treatment
of images is rare. And that's what makes the
redesign of International Posters so
interesting. This online business is all
about images and how users interact with
them. How images are organized is critical to
not just how the site is regarded but how
effectively it can drive purchase."
SPLASH? Indeed, images are so important that Lapides
wondered if the site needed a "splash" or
opening screen before going to the homepage,
which might help convey the beauty of some of
the posters themselves, uncluttered by
navigation and other content elements. Again,
here's a place where Web design is evolving
quickly: "As far as splash screens, they are
passé," says Josh Feldman, creative
director of frogdesign, the Silicon Valley
industrial-design firm that has moved into
Web design in recent years. "No one uses them
anymore, and for good reason -- there
shouldn't be anything in the way of people
getting to the content."
However, the homepage is so crucial to
introducing users to this site, our panelists
gave it special attention. Feldman's instinct
is to subtract, however, not to add.
"International Posters had two main problems:
messy navigation and too much content on the
homepage," he believes. Feldman's team went
to town with the kind of dramatic, rich
visual presentation for which frog is
known.
Notice several key elements in the new
design: First, the lengthy text material on
the homepage is gone. Study after study
proves users hate to scroll in general, and
they especially hate to scroll material that
is not just an extension of text they're
reading. "We then stripped out all of the
unnecessary content, so as to not confuse
users and present them with too many
competing elements," Feldman explains. By
default that sends new arrivals to the
high-tech-looking search interface
immediately, and is the obvious starting
point for return users.
The second dramatic element frog added,
however, goes to the heart of the image
display dilemma. Rather than just feature one
big poster, or two or three smaller images of
posters daily, for example -- limiting buyers'
exposure to emotional, impulse-driven
exploration of possible buying options --
Feldman's team created a "thumbnail gallery"
with which users can interact via a scrolling
motion and review whatever sort of
collections the company would like to feature
on a given day -- sale items, for example,
best-sellers, the works of a specific artist,
or Olympic-themed prints during the Olympics.
Without wandering off from the powerful
search-engine abilities, they can nonetheless
take a look at visually interesting images
they also might want to explore.
"The thumbnail gallery would most likely be
done using DHTML. It's a
technology that's standard in all 4.0-plus
browsers, and doesn't involve that
much extra loading, so the page weight would
still remain manageable. The
tiny (4% or so) amount of people who use
older browsers would get a static
image there instead," says Feldman. "Although
the site is about posters, which at times
will involve large images on the site, I
don't think the homepage we've designed will
be that slow to load. Probably no slower than
Amazon."
WATCHING RIVALS. Feldman continues: "The existing site's
aesthetic design wasn't awful, but it didn't
portray them as an important, trustworthy
company that sold top-quality posters.
Our new design has a streamlined, sophisticated
European look that meshes perfectly with
International Posters' high-end Swiss and
Italian poster inventory." Lapides has a few
reservations about the colors Feldman used in
his design but says his analysis of how the
site needs to change "feels right. I'm so
pleased with this approach -- it's clearly what
I need to do." He likes the Thumbnail Gallery
notion because of the additional control it
gives viewers to scroll through the
collection and stop and pursue posters that
catch their eyes. However, he rather practically
points out that the labor required to change
the offering frequently could be fairly
significant and so may require some form of
automation before he can implement it.
Adds Johnson: "What frog has done in its
proposed redesign is reduce clutter on the
page and given this search functionality
visual prominence. Frog also introduces a
marquee area to display thumbnails of posters
International Posters wants to feature and,
presumably, thumbnails in a found set
matching the users' search query. This is a
very interesting way to allow users to engage
or interact with images."
One thing design experts say that e-businesses
don't do enough of is monitor the design and
features that their competitors or sites in
similar kinds of businesses are implementing.
Even more dramatically than brick-and-mortar
competitors, online rivals must realize
that competing sites can be visited
within seconds of each other, or even opened
simultaneously in different browser windows
by shoppers determined to comparison-shop.
Any obvious and palpable design advantage one
site displays over another should be
immediately considered and implemented by the
competition. Although particular logos and
looks may be copyrighted or trademarked,
search technology, organizational schemes, and
other design elements are typically not
proprietary and therefore are fair game.
Johnson: "Another online venture that relies
upon images to sell images is the online art
gallery, Next Monet. And many of the features
on this site, I think, are best-of-breed. For
instance, Nextmonet.com has a custom search
feature that allows users to place multiple
criteria queries by minimum and maximum
width, height, and price. Users are shown
available search keywords and are allowed to
choose whichever and how many they want. Great
care has been taken to not just make Next
Monet's custom search feature robust but it
has been designed to almost always yield
results. Rarely will a custom search query
result in a null set. It has been designed so
that users' queries can be targeted and
refined, but they cannot exclude what they
might be interested in seeing."
"Next Monet also allows users to navigate its
product offering through traditional silos
(subject, medium, region, staff favorites,
etc.) for those who may not know exactly what
they want to see," Johnson continues. "It
facilitates a more exploratory type of
engagement with the site. Next Monet also
enables users to navigate its product
offering by artist. Once users select an
artist's portfolio, images in the available
inventory serve as a remote control to
navigate product pages. And those product
pages, using nothing more than frames, allow
users to find out as much as possible about
the work in a very interactive way. Users can
enlarge or print the image. They can save a
copy of it in "My Collection" and see how
many other users have saved that piece in "My
Collection" and are presumably thinking of
buying it. Users can even vote on how much
they like or dislike the work. And as a
result of a clever implementation of frames,
users can get overviews, descriptions,
information about the artist, even helpful
editorial content about buying and collecting
art all on the same page and without losing
sight of the piece of art."
Johnson adds: "These are the types of
features, the type of information and
experience design, that I think would go a
long way to complement Frog's very effective
visual redesign and improve the relationship
internationalposters.com is able to develop
with its users."
Editor's note: As always, we alert our
readers that the reviews and makeover
suggestions presented in these projects aim to address
common problems seen across the Web. We focus
on specific challenges and offer only
illustrative examples of how to approach
solutions, not working site changes. Were a
company to retain these experts for a true
site makeover, the designers would spend
considerably more time evaluating and often
reorganizing the site's entire information
architecture to make it look and work better
today -- and to be scalable for the future. If
you feel your site's design is keeping your
enterprise from living up to its potential,
drop us a line at webdesign@businessweek.com
and we'll take a look and consider you for a
future makeover.
Our panelists: George Johnson's
background includes comprehensive
interactive, Web, and editorial design as
well as creative direction. Prior to Novo
Interactive, Mr. Johnson was creative
director at Automatic.
Josh Feldman is Creative Director of frogdesign's San Francisco office.
He was co-founder of Prophet Communications, the web development company
that merged with frog in 1997. A graduate of the Rhode Island School of
Design, he was a 1994 winner of Interval Research's New Voices-New Visions
award, and named one the top designers on the Web by C-NET. Josh's extensive
experience with business to business, e-commerce and publishing web
applications makes him a key member of the frog Digital Media group.
Copyright 2000, by The
McGraw-Hill Companies Inc. All rights reserved.
George Johnson's
background includes comprehensive
interactive, Web, and editorial design as
well as creative direction. Prior to Novo
Interactive, Mr. Johnson was creative
director at Automatic.
Josh Feldman is Creative Director of frogdesign's San Francisco office.
He was co-founder of Prophet Communications, the web development company
that merged with frog in 1997. A graduate of the Rhode Island School of
Design, he was a 1994 winner of Interval Research's New Voices-New Visions
award, and named one the top designers on the Web by C-NET. Josh's extensive
experience with business to business, e-commerce and publishing web
applications makes him a key member of the frog Digital Media group.