Design is Marketing

• Tweet

• Tweet

Everywhere you turn, people are talking about design. It’s been hailed as the core ingredient to the success of everything from ad campaigns, to products, to entire companies. In this post we’ll look at how to design for the success of your website or Web app.  From Jack Dorsey calling every employee at Square a designer, or Airbnb fixing an inefficient market through design, it’s clear that design makes a difference.

We can thank Steve Jobs (among many others) for this design-focused renaissance. He trained consumers to expect things that not only look great, but are designed to “make sense,” and create experiences that are, in his words, “magical”. Great design makes products more useful, allowing the user to be more effective, leading to greater satisfaction and, frankly, happiness.

This market expectation means that design is no longer optional; it is required for success. Take a look at Airbnb and compare it to VRBO. In today’s design-minded culture your product can be easily disrupted or ignored without thoughtful design.

When it comes to designing for the Web, there are core actions you want users to take. You may want them to sign up, download something, buy something, subscribe or share with their friends. Each can be optimized through design that meets the user’s needs. Here’s how:

1. Get More Clicks

If you’re trying to convert visitors to customers, you’re exceptionally interested in maximizing the clicks on primary calls to action that turn that visitor into a subscriber, fan, or purchaser. More clicks in the right spot means more potential customers.

Here are techniques that have proven to generate greater clickthrough rates (CTRs) on all kinds of sites.

• Lead with your benefits – ScoreBig does a great job with this on their sign-up page. Their headline is “Members save up to 60% on sports, concert, and theater tickets.” It’s clear and compelling.
• Clear call to action – Make your call to action clear, prominent and enticing. Use tempting buttons with visual styles, such as arrows, that signify forward movement, compelling users to keep going.
• Visual hierarchy – What is the information priority on the page? What do you want people to see and absorb? Use typography, font sizes and emphasis and visual cues like in line iconography to draw the user through the page.
• Remember AIDA – Awareness, interest, decision, action. Conquer the first three and you get the click, the action. Create awareness and interest, then provide information to allow for a decision.

An Example – Retargeter

We worked with ReTargeter to redesign the banners they use to drive customer acquisition. Their original ads had clickthrough rates on par with display advertising benchmarks, but they weren’t satisfied. The goal was to use enhanced design and messaging to really move the needle. Below are the before and after for the banners. You can see there was intentional emphasis on messaging, clear call to action, and smart design that stood out and communicated the benefits of ReTargeter to the viewer.

The result? The new banners performed nearly five times better than the original ads, significantly lowering their customer acquisition cost.

2. Get More Sign Ups

If you’re launching a new web application or a service, you likely don’t have a huge marketing budget. Therefore, the performance of your friend referral program is critical. It’s imperative that companies design viral loops to leverage new customer referrals from their existing customer base.

Here are some techniques to drive the viral loop:

• Optimize landing pages – Ask only for information that is absolutely necessary. The fewer form fields, the higher the conversion to sign ups.
• Use Facebook Connect – Not only does it making signing up that much easier, it allows you to employ some sophisticated referral techniques, as well as provide social credibility that drives sign ups. RockMelt used Facebook to show users which Facebook friends were waiting for an invite, driving invitations and user sign ups.
• Create Exclusivity – The more scarce the invite the more valuable it becomes. Create exclusivity through messaging and design, and keep invites to a level that makes them worth something, while still giving your loop room to grow. Google+ used limited invites to drive excitement and value, creating a frenzy of people clamoring to get in.
• Reward Existing Users – Can you reward your existing users for facilitating the viral loop? Dropbox gives customers extra storage, Groupon gives users Groupon Bucks for each friend who buys, and Appsumo rewards members who help promote their deals.

An Example – Hello Bar

We designed a viral loop to launch Hello Bar, our notification bar plugin for websites and Web apps. The entire user experience, from the first invite, to the activation email, to the refer-a-friend loop was designed to drive referred users. Thoughtful design and optimization can make your referral program go like wildfire, or fizzle out before it even gets started.

The Hello Bar launch site was invite only, creating a sense of exclusivity. This created anticipation and value for the invite. Once Hello Bar users were invited in, they had a limited number of invites to send to friends. This keeps perceived value high and ensures that invites are sent to people who will likely enjoy the service. This creates a stronger feedback loop than just letting people blast their entire address book. Once those people were in, design kept the viral loop going, by providing the new user with limited invites and encouraging the referral behavior through the messaging and user experience.

3. Get More Likes and Follows

Social proof is an important part of building customer trust and confidence. Not only do Likes and follows build first-time visitor confidence, they also help extend your reach to the social web and help energize word-of-mouth. Like everything else, you can design your use of social badges like the Facebook Like button and the Twitter Tweet This button to maximize your conversion and exposure on the web.

There are a handful of best practice techniques to consider when implementing social sharing on your site.

• Add popular sharing buttons to your site – More than 700 million people are on Facebook, what other sites do your customers use regularly?
• Pick buttons that work for your site – Ensure that they don’t take away from the key purpose of the page. ModCloth has Facebook Like buttons on product pages, but they are custom-designed so they don’t distract the user from the clear call to action to buy.
• Less is more – You don’t need every button for every service on your site. Pick the ones that a) drive the most traffic, b) are relevant to your audience, and c) that you yourself are active on and can support. Two is a good rule of thumb.
• Design the share – Too often people add Facebook Like or Tweet This buttons and don’t customize the message being shared. Make sure every element is crafted to drive new visitors back to your site.
• Integrate shares where users are most likely to leverage them – What are the points in your user flows where you can maximize this social activity?
• Fix a spot in the design – Buttons shouldn’t just be randomly affixed to the site. They should live in a consistent location.
• Communicate the benefits – Why should someone Like or follow you? What’s in it for them?
• Add social destinations to your contact page – Have a Facebook Page, Twitter account or Foursquare Page? Put them on your contact page so people can find you easily on the social web.

An Example – ModCloth

ModCloth does a great job of integrating Facebook Like buttons right into the product pages. Their benefit here is three-fold:

1. They act as social bookmarks, publishing the user’s like of the product to their Facebook wall.
2. They drive new visitors directly to the product page.
3. They act as social proof, an item with a lot of Likes is popular and increases conversion by validating the user’s purchase.

An Example – Tiny Prints

Tiny Prints integrates the Facebook Like Box on to the order confirmation page. It’s a smart choice. Moments after you’ve just completed a successful purchase you’re asked to Like Tiny Prints on Facebook. Your successful shopping experience combined with overwhelming social proof makes you more likely to click “Like”.

This is a viral loop in it’s own right and has two main benefits to Tiny Prints:

1. They easily acquire new fans on Facebook that allow them to stay top of mind and market to customers.
2. They get more viral spread across Facebook as the Like shows up in the friends’ feeds of the user who just liked Tiny Prints.

4. Get More Sales

Designing for sales means two things: clarity and reduced friction. Use design to make it easy for people to understand what you’re selling and the benefits of what you’re selling, and then get out of their way. Let’s come back to Airbnb and how they’ve used design to make their product the market front-runner over the much older VRBO.

Lets look at the techniques they used to get more sales with design:

• Let users experience the product – As much as possible let users experience what they’re buying before they buy it. Use a content slider to house a product tour. It let’s people see and interact with the product and its features without bouncing between pages in order to learn more.
• Lead with the benefits, not the features – Customers don’t buy features, they buy benefits… it doesn’t matter what the product does, they need to know why they should care. Start with the benefits and drive the sales process through those key benefits.

An Example – Airbnb

• Prominent and simple search – Compare Airbnb’s homepage to VRBO’s homepage. One is clean, easy to understand with one core call to action. The other is cluttered, confusing with multiple calls to action with little perceptible hierarchy.
• Minimizing clicks – You can get to booking a place on Airbnb in two or three clicks. On VRBO it can take five. Reduce friction. Drive more sales.

An Example: Zappos

Zappos does a great job with designing for sales by providing loads of customer confidence. They’ve has also spent a lot of time designing the VIP experience, even so far as creating a whole new instance of the site, vip zappos.com to make VIP shoppers feel even more special.

• Create customer confidence – Zappos’ legendary customer service, free shipping, no-hassle returns and highly publicized corporate values give customers tons of confidence in buying.
• Make customers feel special – By providing VIPs with a special site it makes them feel like they’re part of an exclusive club, driving loyalty, repeat purchases and increasing their likelihood to refer other customers.

An Example: Crazy Egg

By using the techniques above Crazy Egg was able to increase its conversions 21.6%. Crazy Egg used a custom SlideDeck to create a product tour that explained the benefits of their service to website owners, while explaining it in a clear and concise manner.

5. Get More Leads

Converting a website visitor into a new subscriber, member or account holder is one of the most important conversions there is. In fact, a whole field of analytics, conversion rate optimization (CRO), is solely focused on improving sign up conversions through improved landing page design. Let’s look at a few examples of the sign up process, and how design makes a difference in maximizing conversion.

• Tell a story – Show how your product or service solves your customer’s problem, to the point where the only logical step is for them to sign up.
• Use clear hierarchy – Walk users through from beginning to end and make it easy for them to grasp the main benefits and identify the calls to action.
• Be concise – Don’t clutter up your pages with lots of extraneous information. Be ruthless about what makes it into your story.
• Choose compelling imagery – Your story isn’t communicated through words alone. Make sure your images are communicating just as well as your text.
• Limit the amount of information required – Keep the information you ask from a potential customer to the absolute minimum that you need.
• Provide limited time discounts – Can you provide a discount or other incentives to make signing up worth it on the first visit?

An Example – Monsoon Company

Monsoon Company’s service required a high amount of contact and exchange; therefore, they needed a method of driving sign ups in order to start an initial conversation. Right off the bat, they have a clear message paired with straight-to-the-point imagery. Following that, they have brief supporting copy to tell a little more about what they do. Their main desired point of contact, a phone number, is then listed right below, with a prominent lead form (for users less inclined to contacting by phone).

Putting it All Together

Being conscientious about design and user experience can create exceptional returns for your business. Be thoughtful, test your assumptions and designs, measure which ones perform better and then constantly iterate to improve all aspects of your website, product and service.  When an experience is well-designed it is the only thing your user sees. The design just works and is at the heart of the product.

By being design-oriented in your thinking you’ll achieve a greater level of success not only in sales, but in customer satisfaction. And by driving toward even better results for you and your customer you’ll create an experience that really does make a difference.

About the author: Chuck Longanecker is the CEO and co-founder of digital-telepathy, a user-experience design company passionate about creating products, like SlideDeck, Hello Bar and Impress, that make the Web more intuitive and compelling.