jump to navigation

E-Commerce Website Analysis-Madeline Moy

Genre for in-depth aesthetic analysis: E-commerce

Websites reviewed: Eye-Fi, ModCloth, Wire and Twine, Nordstrom

Individual analyses:

What are the similarities/differences in visual design in these four websites?

Each site prominently displays the company logo in the upper left corner of the home page, and big color photos of products available to buy. A shopping bag or shopping cart is at the top of the page. These visual cues tell the user that they are on an e-commerce site, and they should want to buy something.

The sites’ visual design reflects the personality of each brand and its products. Eye-Fi’s site feels modern and technology oriented. ModCloth strives to put a modern twist on vintage clothing. Wire and Twine has a clever site design which mirrors its witty t-shirts. Nordstrom has a clean and elegant look that users will also find in their brick and mortar stores.

Because web shoppers can’t touch and feel items, visual appeal is vital, and all of the sites make a strong use of photography. They all use big, bold, high-quality photos to peddle their wares. Even the Eye-Fi site, which sells memory cards, takes big beauty shots of its product.

Another common design theme is the use of white or negative space. It doesn’t feel like there is too much text or too many graphics on any of the sites’ pages. The background color for three of the four sites is white. Wire and Twine has a very light blue background, as well as white.

The home pages for Nordstrom and Eye-Fi both have an element of motion on their home pages. Eye-Fi has scrolling testimonials from customers and media outlets, and Nordstrom has a slide show of featured items.

Each site uses color for different effects. The dominant colors for the Eye-Fi site are orange, green and white. Eye-Fi memory cards are orange, and it’s clear that the company wants users to associate orange with Eye-Fi.

The most important use of color for ModCloth is that it signals where you are in the site. Whatever is dark blue in the horizontal navigation bar is where you are.

Nordstrom also usually color to remind users where they are in the site. However, it’s much more subdued than ModCloth. The overall color palette for the Nordstrom is fairly neutral. It appears that it uses color to signal children and teens, as well as sales.

Wire and Twine features the vibrant colors of its t-shirts to create visual interest.

All of the sites use sans serif fonts.

How effective is the visual design?

Eye-Fi

With quirky icons on the home page, splashy color photos, and an orange, green and white color scheme, the Eye-Fi site feels modern and energetic, which befits a company that sells innovative photo memory cards. It’s easy to get around, and my eye knows where to go because of ample white space.

The generic graphics on landing pages that don’t relate to content are distracting. For example, the products landing page has artwork of man and woman walking on a beach and the how it works landing page features a man and woman jumping in the air with a ferris wheel in the background.

Visual design grade: A-

ModCloth

The modern elements of the website design clash with the vintage aesthetic of the clothes that are sold on this site. The look of the site doesn’t have to be totally vintage, but there’s no cohesion. You don’t know you’re on the same site when you click from page to page.

For example, the walking tour section employs illustrations that evoke classic botanical drawings while the dominant graphic on the “Be the buyer: landing page is something that looks like a series of clip art dress icons that are hot pink and blue.

The blog header also has a very modern feel to it and uses photography that is very different from the other photos on the site.

The pages of the site often use colors and typography that compete for attention. It appears that at least five different fonts are being used on the home page. The font uses in the “New Sunglasses” graphic is almost unreadable and the “Say hola to these picks!” graphic right next to it uses a completely different (and dated) font. The colors in the two graphics are not complementary and also clash with the colors in the photos above them.

When I look at the clothing pages, I like what I see. It’s simple and clean, and it’s all about the clothes. The rest of the site is a mess.

Visual design grade: C+

Wire and Twine

The design for Wire and Twine is simple and consistent. Its home page showcases the different t-shirt designs that are for sale, and you always know you’re on the Wire and Twine site no matter what t-shirt you’re viewing. The 3-D elements of the masking tape and shopping cart sticky note are visually interesting without being showy—just like the t-shirts that are for sale!

Visual design grade: A

Nordstrom

The design for the Nordstrom site reflects the company’s brand. It’s tasteful, restrained and elegant. It’s also a little boring. I would expect the site of a fashion retailer to have a little more visual flair. From the photos to the color palette, it’s all a little too neutral.

Nordstrom’s print catalogs have a lot more fun with typography and color, and the photography showcases the items so that you really want them.

Visual design grade: B

Advertisements

Comments»

No comments yet — be the first.

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: