Items Tag › Design Treats

As a photographer and UX designer, I pay particular attention to the effectiveness of photography when I’m testing with users. Regardless of the context, users rarely fail to comment on or be influenced by photography when shopping online.This article pulls together principles from psychology, marketing, UX design and photographic theory. It provides a set of principles to follow when commissioning and editing photography and when planning and designing profitable e-commerce user experiences.Show Off Product BenefitsThe best way to sell products is to let them sell themselves. Consider the Gorilla Pod shown below. The photo demonstrates brilliantly the benefits of the product. The copy is supplementary; the image does the heavy lifting. Let photography do the selling for you as much as possible.Don’t Give Reasons Not to BuyOne client sold flowers online, and many customers were buying flowers for hospitalized relatives. Many of the arrangements were displayed in glass vases in the photos on the website but were not actually delivered in vases. Not knowing this, many users felt that they couldn’t buy from that website, because hospitals in the UK (where the business was located) do not allow vases onto the wards.Create an Immersive ExperiencePhotographs have the potential to elicit an emotional response. They can also communicate information quickly; they are easier to “read” than text. Photographs give depth and context to a story, thereby creating a more immersive experience than text can do alone. Photos can be used to inspire, enrage, inform, provoke or entertain.Make ‘em LaughPhotos have the capacity to entertain as much as to inform. If it suits your brand, why not inject a bit of humor? If your website asks users to perform chores (such as doing admin tasks or paying bills), a dash of humor can ease the burden—and your customers might love it.Educate and Inform“Tell me and I’ll forget, but show me and I’ll remember.” Learning can be difficult, but supporting theory with visual stimuli can help us grasp complex concepts and confirm our understanding. Images are easy to remember; how often have you met a new person and found later that you could recall their face but not their name?Tell a StoryFrom an early age we are told stories, and we spend our lives telling stories to friends and families. We know that pictures are effective storytelling tools. Even in the news media, multimedia slideshows are produced to give life to news stories.Highlight InnovationPeople have certain expectations of how things should look and function. If you have a product that differs from the norm, expect a large portion of interest to come from word of mouth; friends will show it to friends, who will show it to their friends, and so on.Show People How to Do SomethingI’m usually the first one to toss out the instructions and work it out for myself. How hard could it be?! The example below illustrates how useful imagery can be when conveying a complex procedure.Don’t Mislead UsersPeople often jump to conclusions when shown certain types of images. We showed pictures of shirts during some recent testing, and people assumed they would come with cufflinks and ties, but these were added by the stylist to make the shirt look appealing.Evoke an Emotional ResponsePhotography is often used to communicate hard-hitting messages (about the environment or human suffering, for example) because it evokes strong emotions. Charity campaigns, for example, know that by photography can get them the type of reaction they want.Plug AccessoriesShowing the product’s accessories helps users imagine how they could enhance their experience of a product. Photos of accessories stimulate desire and offer suggestions about where to direct that desire (i.e. what to purchase next).Show Features and VersatilityShowing a product in use communicates what it’s for and how to use it, and it helps users imagine how it will fit into their lives. It can result in a feeling of need; it will solve problems the users didn’t realize they had!Understand NeedsI remember doing some testing for a major automotive client. The fellow was a keen kite surfer, so his primary interest was the size of the car’s trunk. He is the perfect example of a customer who has primary considerations, or “deal-breakers”, on which they are not willing to compromise. Photography can help your website communicate that needs are being met; sometimes, the more photos, the better.Match the Imagery to the BrandBrands are created and reinforced by photography. A mental disconnect occurs when photos don’t accord with the user’s preconceptions about the brand. It feels wrong and makes the user question what the brand is all about.Sell a LifestyleWhether it’s rural life, the good life or city living, everyone strives to live what they believe to be their perfect lifestyle, and we buy things that match that lifestyle. So, when products are displayed in the context of a lifestyle, we assign value to the product based on our desires. For a wonderful example from a TV campaign, check out the John Lewis “Never Knowingly Undersold” TV ad.Demonstrate Exciting FeaturesPhotography is instant communication, so make it about the best features of your product. I hate getting wet when I cycle, but a coat takes up loads of space in my bag; imagine how compelling the Montane image (below) was for me. I bought a Montane jacket.Make It BeautifulThe camera generally lies. That is, beyond setting and context, there are all manner of camera tricks to help you make the subject look beautiful and desirable. Consider the iPad as a photo frame, and see how the picture is enhanced.Avoid Clichéd Stock ShotsWe commonly get feedback from users about their universal loathing of stock photography. A recent project for a university client showed how users preferred “real” photos to stock images, despite their less polished look. Users wanted a realistic vision of what actually went on at that university.Create DesireThe Web is about self-service. It’s also an ideal way to escape reality. Travel websites know how important it is for potential customers to see resorts and rooms before purchase and travel. They know that the customer needs to envision themselves in that hot relaxing place when they book tickets from their cold home in January.Be Stylistically ConsistentJohn Lewis, the UK department store, takes a painstaking approach to product photography, often taking up to 30 minutes to style individual items within a vast product range. The company defines and adheres to a particular photographic style. The results are stunning because the style is applied consistently.Convey the IntangiblesBentley’s sales often result from brand values such as quality, craftsmanship, heritage and tradition. Often, the qualities related to a product are hard to put into words. Photography can help convey those qualities clearly.Show Some PersonalityPhotography can convey the essence of a product or service, but it can surprise and delight, too. I was looking for something recently on the Ikea website and came across the page below. It reinforces the fact that Ikea doesn’t take itself too seriously, which is a nice touch, and easy to do.Be Subtle SometimesI recently conducted some research for Wiltshire Farm Foods. The response to this photo was amazing: users got the impression that food would be delivered to their elderly relatives whatever the weather. This was of critical importance to them because of the harsh winter. It’s amazing how powerful subtlety can be.Look ProfessionalThe rules of portraiture dictate that a simple uncluttered background will focus interest on the subject. This rule is applied well on product gallery pages, where product images are cut out and presented against a white background.eBay unavoidably suffers from inconsistency, and the page below illustrates how much easier seeing products against a simple background is. Research into websites such as eBay and Etsy shows how important product photography is to buyers. Would you bid on a TV that you couldn’t see a picture of?Threadless breaks the rules, but with good reason. The varied backgrounds feels relaxed and shows off the product in a natural setting. The crop on the subject is tight enough that you get an impression of the environment that doesn’t distract you from the subject.Be ConsistentConsistency draws attention to the important things (in the example below, shirts for sale). The eye is drawn to inconsistency, so make sure any inconsistency in your composition is deliberate.A studio is the perfect controlled environment; you can ensure that lighting remains exactly the same between shots. The lighting style reinforces the brand’s image. Examples include hard edgy light in photographs for a youth clothing brand, and soft ethereal light in photographs for an environmental lifestyle brand.Use Unusual Vantage PointsYou can make an otherwise everyday object seem more interesting by shooting it from an angle that differs from the normal human line of sight. Sound advice: get high or get low. Do whatever you can to give a unique perspective.Shoot From the Best AnglesYou will often hear people claim that they prefer to be photographed from a certain side or from their “best angle.” Products also have flattering and unflattering angles. Peruse some automotive websites and brochures; see how many cars are shot from a three-quarter angle. This angle suggests power and scale. The shots are clearly designed to appeal to a masculine audience.Show Objects in Their Natural EnvironmentThe environment in which you place the subject helps the viewer understand the product’s purpose and suitability. A shot of a grizzly in its natural habitat seems much more fitting and “real” than a shot of that grizzly bear in, say, a parking lot. Product shots in an appropriate environment suggest both where and how the product can be used.Convey a Sense of ScaleBuying something online can be problematic. Predicting its suitability is difficult without seeing or touching it. (Will it fit? Will it match? Will it look right?) Including an object with a known size in the photograph presents the viewer with an immediate visual reference.Image Size Is ImportantIncreasingly fast Internet connections allow clients to work with large images. On real estate websites, for examples, images can’t be big enough; users want to fully explore their potential new homes. That said, if you will be offering a “larger view” of a photo, make sure it really is significantly larger. (My experience with testing has shown me that users are annoyed by “larger” images that are only marginally different.)Show the Product in UsePeople want to be sure they are buying what they want or need. Show the product in use to help the user see that it suits their needs. Following the advice “show, don’t tell” removes the need for additional explanatory text. Few people will read it anyway, because a picture is worth a thousand words.Show How It WorksConsider the pineapple slicer (below). You’d pick it up in a kitchen shop and think, “What the heck is this?” Now try explaining how it works on a website without a photo. A nightmare. Again, show, don’t tell.Make Choosing EasyA recent client had over 90 variations of an everyday product available for sale. The variations were meant to offer flexibility, but they bamboozled customers. The example from Ben Sherman (below) is another case of too much or poorly explained variety. How does “mod” style differ from “union” style, for example? I have no idea. The photography should make it clear but doesn’t.Enhance the ExperienceI don’t know why Bing decided to put images behind its search screen, but I like to imagine that they thought, “Heck, why not?” We like things that are emotional or visceral. Good experiences with products and services feed on our tastes and bring return business. So, if Bing helps you find what you’re looking for and is also visually appealing, you’ll use it again and again.Show DetailsHere is a true example of why showing details works. I recently bought a bike. A deal-maker for me was the ability to secure a rack to a fixed part of the bike; I wasn’t going to buy a bike without this. The Evans website provided large zoomable photos that allowed me to check for this detail. I bought my bike from Evans.Show Me What It Looks LikeI’ve mentioned this already in a roundabout way, but showing the product piques interest and brings business.Encourage InteractionA recent test I was involved in asked users to try out the websites of different real estate agents. One user completely reversed their initial opinion of one of the agents when they saw the number of detailed photographs available; they expressed delight and interest. Encouraging interaction by providing functions such as zoom and rotate leads to a satisfying user experience.Show Me I’m in the Right PlaceAn important aspect of way-finding in digital environments is showing people where they are. Google accomplished this in a literal sense with Street View on Google Maps; this was an innovative use of photography. When we meet with clients in unfamiliar locations, for example, we can see what the place looks like beforehand. We feel prepared and less anxious about being late.ConclusionPhotographs play a crucial role in informing, influencing, educating and reassuring customers throughout the buying process. Review your website’s photography and question its role. What is the job of a particular photo at that particular stage of the process? Is it effective? When might customers drop out, and how could photos prevent that from happening?The task of image selection often falls to the designer. User experience professionals should actively influence the process of selecting photos for the buying process. The days of having a placeholder for images in our wireframes and prototypes are over. We should be annotating our work to influence decisions that art directors make when selecting images. Consider these principles to ensure that the images you choose not only “look right” but also work well.Website owners should recall the principles mentioned in this article when commissioning new photos and researching stock. Focus on the purpose of the images, and you will turn photos from window dressing into key conversion tools.How have you used photography to maximize conversion? We’d love to hear success stories and anecdotes from user testing.[Offtopic: by the way, did you know that Smashing Magazine has one of the most influential and popular Twitter accounts? Join our discussions and get updates about useful tools and resources — follow us on Twitter!]Further ResourcesIf you liked this article, you’ll love these.Cracking UX Resources52 weeks of UX Weekly doses of UX goodness.Johnny Holland A rather good UX magazine.UX magazine Another good UX magazine.cxpartners blog The latest thinking on optimizing e-commerce websites and broader UX topics.Inspirational Photography WebsitesThe Big Picture Stunning images from the Boston Globe.JPG Great photos form amateurs who contribute to this online mag.Pictory The best photo stories of readers.National Geographic The original and the best.Magnum Inspirational images from the world’s best photographers.Strobist The definitive online resource for off-camera Flash.Scott Kelby Brilliant books and tutorials.Chromasia One of the best photo blogs around.Chase Jarvis Commercial photographer extraordinaire.(al)© James Chudley for Smashing Magazine, 2010. | Permalink | Post a comment | Add to del.icio.us | Digg this | Stumble on StumbleUpon! | Tweet it! | Submit to Reddit | Forum Smashing Magazine Post tags: conversion, photography

Sometimes small changes can have huge effects. Concerning conversion rates, which is the proportion of website visitors who submit their contact information or make a purchase, better Web design leads directly to greater revenue. Most online store designers who want to optimize their conversion rates only concentrate on the “inner” part of the shopping process, the sales funnel. They focus on product pages, the shopping cart and check-out-process. This is good, but not necessarily sufficient. It is equally important that advertisements convert – just as the simple fact that users find the URL and that both (ads and URLs) perfectly fit the image conveyed by the landing page. Sound practices make for the most successful conversions. There are thousands of tips and tricks for increasing conversion rates. There are various marketing techniques that aim at simplyfing the purchasing and the checkout processes. This article is the first part of our new 3-part-series “Optimizing Conversion Rates” that covers most important strategies and techniques that will help you boost your conversion rate. The second part will be published next week, and the last part will be published the week after that. The first article deals with “proper” advertising, building up trust and credibility and the handling of shipping costs. Create Suitable Ads Let’s look at traffic coming from an online advertising campaign. This is traffic you can directly influence by changing content, display frequency and display location. Relevance The key to good ad performance is relevance. And the most important key to relevance is “negative selection.” Look at the platform your ad is running on; Google, for instance. Are there users on that platform who would want nothing to do with your product? Are there keywords people would use in a search that might mislead to your website? Use negative selection to filter visitors whom your products are not targeted to. This mechanism will work as a magnet for more relevant visitors. A good example is local content. If you have a car repair garage located in Birmingham, England, you should include this location, because users from London would be less likely to become customers. What’s more: If irrelevant users click on your ad, they will cost you PPC fees and lower your score in Google’s ranking. Connection between a search term and an ad A second and very important criterion is to establish a strong connection between a search term and your ad. A search term can tell you a lot about a user’s search context. And your ad has to address that context by delivering the right answers. To start simply, divide your audience into at least two segments:

Novices who know very little about your product, your company or even the industry. You will have to explain your product to these users. Experts who search for the exact differences between your and your competitors’ products.

Now analyze the keywords you have chosen. Divide them in two groups, and develop two or more variants of your ads that respond to the needs of each of these audiences. The same applies to display advertising. The more generic the host page (whether a portal, home page or navigational page), the more basic the information your users will need. This applies as much to the content of your ad as to its graphical elements. Google Search Results suggest that Creed is the “worst band in the world”. If there was a possibility to influence Google index, the band “Creed” would probably have done it. And the ad alone mustn’t only demonstrate relevance to your visitor. Your landing page must meet users’ expectations as well. Both your landing page and ad should work as an informational unit. A not-so-savvy-novice who is looking for a solid MP3-player may be interested in the battery life and price, while an expert may want to know full technical details such as the technology used, available ports, advanced features or maybe the coolness of the design. To sum up, relevance is probably the most important criterion for successful conversion. This separates good communication from inefficient communication. Even the location or size of your company can be relevant if users fear that their order may not be delivered on time, intact or at all. Simple page elements like a photo of your company’s building or storage depot can do a lot for credibility. Build Up Trust And Credibility You may already know this, but there is something deeper than just relevancy. Sales can be lost if a potential customer decides to ignore certain sellers or certain kinds of sellers. This even holds true for retailers selling on eBay or by posting ads on Google. Some people mistrust eBay sellers in general. In a study by the Foresee Institute, researchers found out that only 49% of Internet users in the US are willing to use native online payment methods like PayPal and Google Checkout. Consider the payment method, for instance. Most eBay sellers use prepayment, which is very convenient for the seller, but may scare away the potential customer. In a study by the Foresee Institute, researchers found out that only 49% of Internet users in the US are willing to use native online payment methods like PayPal and Google Checkout (see the section “How Satisfaction Influences Loyalty and Purchase Intent” in the Apparel & Accessories Report (pdf)). This distrust of transmitting sensitive payment data and integrated security systems in general is a good lesson in what it takes to build trust. Money-back guarantee Money-back guarantees can make a purchase easier, even when mistrust or uncertainty have a significant impact on the customer’s deicision-making. Offering your customers such a guarantee, you build up the feeling of trust and comfort, making it easier for users to actually purchase a product. In Europe money-back guarantees are required by law, so many European companies use it as a sound marketing argument in their campaigns. Sitepoint promises a no-risk money-back guarantee for its books. That’s fair, honest and sounds trustworthy. It may also be a good idea to add the “money-back guarantee” into the shopping cart by default, so they are packaged in warm feelings, making it a central focus of users. These considerations may help you to build up a trustworthy environment for your customers, but they alone will not necessarily be able to make a difference. In fact, trust and credibility have a subtler, more emotional dimension. A professional design is necessary to differentiate your business from that of amateurs and students who sell out of their grandma’s living room. How about showing photos of your team members? Tell your customers your story, create a relationship with them, show them your “human touch” by talking with them honestly. Provide your customers with e-mail addresses of the team, phone numbers, and, of course, e-mails – that’s another sign of confidence. And, of course, if you have excellent user recommendations on eBay, LinkedIn or any other price comparison websites, you can display those, too. And you should! Don’t Push The Customer Away With Shipping Costs This is almost the same point as the one about money-back guarantees, but a bit more nuanced. Too many sellers have abused their customers trust by hiding shipping costs to generate extra revenue. This has now become obvious to most users. It’s not just about the added costs; it’s about fooling customers. The aforementioned Foresee study analyzed 10,500 shopping transactions in 30 online stores. By far the most important feature that significantly improved the conversion rate was the simple fact that a seller didn’t charge any shipping costs; it was the decisive factor for 34% of all users. There are two reasons for this. First, when shipping charges aren’t added later, users will know the final price of their order early in the shopping process, maybe even when they see the online ad. For you as a seller it means that you remove the barrier between user’s decision to buy a product for a given price and his confusion about the “final” price during the checkout procedure. Secondly, the price is more “transparent” and users can easier decide if they are interested or not; besides, they can also easier compare a product with other products. The customer not only compares online stores but also compares online stores to the “real” ones. Purchasing from a real store can sometimes be faster than doing it online, and no shipping costs can certainly compensate for that. Sometimes, particularly if the seller is shipping worldwide, delivery costs can not be avoided. In these situations make sure that the available shipping options are clear, transparent and easy to understand. The customer came to you to purchase a product, not to spend minutes on decrypting the complex costs matrix. Consider the following two examples (screenshots below). The more complicated a shipping costs table is, the more likely a user is to cancel the checkout process and look for alternatives. Even a tiny doubt or confusion can completely change customers’ decision, so you better do a good job of making it easier for them to finish the checkout process. This isn’t helpful for customers: a complex overview of shipping terms and costs on Badgepoint. A simple overview of shipping costs on Selectspecs.com. However, if free shipping is a viable option in your business, you may want to try it out, since it may significantly boost your conversion rate. Of course, free shipping is not really “free shipping,” at least not for the retailer. But there are some strategies that can be adopted: a minimum order price or value, for example. But do not block the user from ordering if this minimum is not reached. Add a shipping cost and call it a “Small-order fee.” Inform the user clearly how much more they will need to purchase to qualify for free shipping. Another idea: how about offering users free shipping on their first transaction? You could look at it as an investment to gather their registration data. Or specify a certain time frame in which customers can redeem the free shipping offer and state it on the ad. The technique is similar to issuing coupons for in-store shopping, and it puts more pressure on the customer – but in a positive, money-saving way. You simply have to calculate how much more overall revenue you can generate by dropping shipping costs. Try it ou – you won’t be disappointedt!

What topics would you like to read about more on Smashing Magazine?(answers)

Stay Tuned This article is the first part of our new 3-part-series “Optimizing Conversion Rates”. The second part will be published next week, and the last part will be published the week after that.

Optimizing Conversion Rates: Less Effort, More Customers The Conversion Is All About Usability Use Conversions To Generate More Conversions

Hence, you may want to subscribe to our RSS-feed and follow us on Twitter . Any ideas or suggestions? Comment on this article!

Post tags: conversion, customers, e-commerce

Design Treats

How To Use Photos To Sell More Online

Optimizing Conversion Rates: Less Effort, More Customers

Popular Tags

Search