Web Design Challenge Three: Redhead Labs
By Julia Wilkinson
EcommerceBytes challenged three professional web designers to give an online store a homepage makeover as part of the Web Design Challenge. You can read more about the Challenge and how the merchant was selected in today's introductory article.
Here's the first redesign from Redhead Labs - you'll have a chance to look at all three and vote for the design you think does the best job of meeting the merchant's design goals. And you'll pick up some tips for your own storefront along the way.
Designer Andy Carlson at Readhead Labs saw that one of Glamoursurf's best assets was the meaty content "under the hood." But while there were strengths, he saw that the overall "look and feel" of the site was doing it no favors. Redhead Labs' fix was to give the site a fun, colorful site that would draw a visitor in visually with the colors, textures and fonts of "back in the day." He also introduced a slider, "carousel"-like image that can be used in other ways, such as to present special offers. Below is Redhead Lab's detailed description of the site's overhaul presented by Russ Frazier.
Commentary and Analysis from Redhead Labs
Designer Andy Carlson's design approach to the Glamoursurf project was primarily a "visceral design" approach, a term coined by Donald Norman in his book, Emotional Design. Visceral design has been described by some as "designing for the gut," or designing to make a gut-level (emotional) connection with your visitor. It's a connection that draws them in and makes them want to stick around, to touch and feel and explore what you have to offer.
An Analysis of Glamoursurf BEFORE:
First, Glamoursurf has a great product line with excellent product photography.
- Each product is aptly described, many with references to vintage model shots or magazine covers.
- The display of celebrities and models from the past strengthens the emotional draw a visitor has to individual pieces and helps build the perceived value of the piece.
- The content "under the hood" is fantastic, with well-written articles about the history of individual swimwear pieces and designers and a visual label directory, where you can cross-reference old labels to discover the approximate decade of the piece. Glamoursurf contains much more interesting content as you dig deeper.
With that said, we saw significant room for improvement, for the following reasons:
- The overall website design is severely outdated...and not in a good "think vintage" way. The header looks like it was scanned and copied from a 1990's Orlando beach resort advertisement. The logo, in fact, gets somewhat lost among the waves. The color scheme does not excite or entice. Unfortunately, it looks rather gloomy, like a cloudy day at the beach.
- A website that is outdated does not present an image of a successful, prospering business. It may make the visitor wonder whether or not the merchant is in it for the long haul, even perhaps whether the company is still in business and processing orders. The website needs to elicit immediate trust.
- The single side navigation menu offers a mismatch of category links, information page links, marketing, and article links that causes link overload and confusion. The various types of content needs to be accessible by grouping links into their own distinct and interesting menus to entice exploration.
- The search function is not easily noticed, and there is not a way to create an account or view my cart from every page.
- Although the merchant is active in social media, with a healthy following, the icon links to the various social accounts are not available after you navigate past the home page.
A Redhead Approach to Glamoursurf
We love the opportunity to help every small business owner uncover the true value of his or her brand. It's what drives us. Glamoursurf's unique product line and the care with which it presents each product with great photos and detailed descriptions deserves a storefront that excites and educates, while gently prompting the visitor to buy.
- We wanted to generate instant feelings of yesteryear, while presenting the brand in a fun, modern, exciting way.
- We are implying the "vintage" feel by using grainy, textured backgrounds, along with muted colors, common back then. Fonts were chosen to "take you back" to an exciting, glamorous time in history.
- The logo was redone with depth and tasteful hint of "glamour"…note the star. The large use of the word "Bombshell" is entirely intentional, as it is immediately recognized as a vintage term that is still enticing for today's woman. The sultry model, wearing Rudi Gernreich's pink wool swimsuit, is appealing to both women and men. To women, she is the one encouraging you to "Celebrate Your Inner Bombshell." To the man, her eyes are inviting you to browse further, because you just may find that perfect gift for your loved one.
- The bombshell graphic is a slide image within a carousel that will advance to two-three more slides, so the merchant can present different product offers, announce sales, or direct visitors to specific categories.
- Navigation has been separated into three distinct text menus - categories on the left, info pages on the top, and less important info pages in the footer.
- Secondary big visual navigation buttons are provided directly under the carousel to offer quick access to the most popular product sections.
- Product links under "Our Staff Favorites" include a hover effect that displays the product name, price, and "View Now" button. This product carousel will auto advance and will pause on hover.
The text section below serves two purposes:
1) To provide a brief introduction to the website's offerings, and
2) To provide a useable area for SEO friendly content.
- We included the image of Marilyn Monroe to offer an instantly recognizable "bombshell" face to visitors, while also hinting at her personal endorsement of the website.
- The latest posts from the "Glamoursplash" blog are included in the lower right. The footer accomplishes a few objectives: Verification seals for the SSL and payment provider are placed in the footer to reinforce trust and confidence. Credit card logos indicate that the site is ready to accept your money. Users are encouraged to sign up for the email newsletter. Social media links are presented again to encourage more follows and likes. The vintage theme is emphasized with additional imagery.
The entire Redhead team appreciates the opportunity to participate in the EcommerceBytes Web Design Challenge. The Glamoursurf design was created by Andy Carlson, with support from Rosanne Frazier, co-founder and art director of Redhead Labs.
About the Designer
Andy Carlson is a highly experienced web graphic designer who has been with Redhead Labs since 2010. He is a strong believer in the art of showing and not telling and is a highly experienced web graphic designer. Somewhat an enigma, Andy's skillset derives from a varied background including time as a classical pianist, jeweler's apprentice, accountant and personal trainer. Redhead Labs, in Tulsa, OK, is known for visually rich websites, efficient user experience, and plainspoken marketing expertise.
How to Vote
Now it's time for you to weigh in! Here are the three designs:
Design # 1 - submitted by Ventura Web Design
Design # 2 - submitted by the Design and Usability Center at Bentley University
Design # 3 - submitted by Redhead Labs (above)
Once you've looked at all the designs, use the survey to indicate which of the homepage mockups you think best meets the Glamoursurf's goals. And look for the final "reveal" in the next issue of EcommerceBytes Update.
About the author:
Julia Wilkinson is the author of "The eBay Price Guide" (No Starch Press, 2006) and "eBay Top 100 Simplified Tips & Tricks" (Wiley, 2004-6). Her free "Yard Salers" newsletter is at available at YardSalers.net where you will also find her latest ebook, Flip It Again.
You may quote up to 50 words of any article on the condition that you attribute the article to EcommerceBytes.com and either link to the original article or to www.EcommerceBytes.com.
All other use is prohibited.