ReWire: Fixing Fender's Product Page With Design Principles

Fender has a great product page showcasing their iconic guitars. Useful and informative until you scroll down. 

And you come across a big block of text.

Crammed info, hard to read, ultimately undermines  Fender's products.

The Problem

It's too much info jammed packed into one section. No one is reading this.

And it's unfortunate because there is some good info in there. 

Fixing The Product Page With Basic Design Principles

Here's what we know from the design world:

People Skim

Users skim websites.

I know we like to think our users are enamored with our products and read every word. Even if they do love your products, most (like basically almost all) users don't read your website like a book.

They skim. 

They look for indicators to skim - headlines, pull quotes, images, short paragraphs. Almost like way points to navigate them to important information.

Design for skimming. 

What's In It For Me

This is a way of saying: focus on benefits, not features. Focus on what the user gets out of it, not the features of the product. 

Yes I know we want to talk about how wonderful our products are and all the features. 

Users care about what's in it for them.

So re-frame those features in way that show's how the user will be better off with them.

Reduce. Prioritize. Organize. 

Most design can benefit from this simple approach:

Reduce the amount of info presented. Prioritize the information. Organize the information.

The idea is simple, executing it can be tricky, but the results are wonderful.

The ReWire

Doing a simple re-wireframe of the site leads us to focusing on core benefits: 

• All Day Comfort
• Premium Tones
• Look Iconic

Couple these with images and it makes it very easy to skim and take in the benefits.

 We can use the text below to describe the features that lead to the benefit.

A Before and After ReWire.

A side by side wireframe of the before and after. 

Through in some beautiful images of the already stunning guitars and you have a much better product page.

Simple Design Principles For A Better UX

It doesn't take much to improve the UX of a page. Often you can use the Reduce, Prioritize, Organize approach to simplify your design.