13. Once you've had a conversation with someone
on the social web, what design decisions turn
users on or off?
14.
15.
16. How do you integrate best practices of people-
driven social web strategy into web page and social
media collateral design?
17.
18.
19. How do you make data-driven decisions
about your design, to guide iteration?
20.
21.
22.
23. Three Big Things
1. Ingredients: Without transparency, fire or a desired outcome, no social web strategy can
succeed.
2. Intelligent Design: No social web strategy can succeed if collateral and destination-
property web site design principles don’t embody the principles of the strategy.
3. Check In: Make regular pit-stops (monthly meetings) to make data-driven decisions about
your design, as your social web strategy will fail without this kind of intelligence.
24. Digging Deeper
Our first strategy eBook, “There Is No Secret Sauce”
www.adammetz.com • adam@adammetz.com
Available for consulting
Read my blog, MetzMash, to get up to speed, and other recommended
reading is for sale in my bookstore and on my blogroll
Total transparency is key. The people that your brand is talking to on the social web have to know who you are, and what you stand for and your identity. They don’t want to talk with a person from Marriott’s communications team. They want to talk to Mary Anderson from Marriott.
If you’re engaging with people on the social web, they’re called talkers. You’ve got to give the talkers something to talk about. That means that you have to assemble a list of (1) where the talkers are, (2) who the talkers are, and then you’ve got to give them something to talk about.
If there is not a hierarchy of desired outcomes linked to each strategic objective, then you will not even make small advances. If you think that a “sale” is the only desired outcome, then you’re missing the other five or six. What value are you offering these people in return for the smaller outcomes?
Note the clearly defined areas of customer interatcion: Special sales, Free Shipping, Join The Club, Spotlight, Featured Products.
Nothing stands apart from anything else. All a big collection of information with no visual hierarchy. Amazon succeeds despite their design choices thanks to mindshare and targetted shopping. Shoppers usually have an idea of what they want when they go there.
Above the Fold: Clearly defined Free Shipping offer, call to action “Join the club”, featured deals slideshow, and spotlight, featuring ways the user can interact with the website and the community. Each stands apart from the other elements, and create a clear visual path for all types of users, and encourages user interaction and browsing.
1 • The spotlight box highlights activities that the site user can take part in. 2 • This object, well positioned on the page, calls attention to various specials the store is having. 3 • These features are well called out and made obvious to all users of the website.
Typically, you’re going to be talking with someone three or four times on the social web before they go to your destination site, and it may be 6-7 conversations before they actually contemplate buying your product or form any kind of emotional attachment to it.
http://mirodesign.net/ - Extended flash introduction with long movie, poorly displayed skip intro link, automatically generated audio and delay before startup.
http://billsmithgroup.com and http://asundaydriver.com both sites take control of and resize/position your browser window. Interferes with the overall computing experience of the site user.
37 Signals on Highrise marketting site. Problem, Features list was too wordy, took up too much space, and was resulting in many people skipping past the feature set. The goal was to redesign the feature set to contain the same amount of information, but take up less vertical space and keep the same icon size for visual relevancy.
Can see the final result here, much more inviting, and the removal of the gray background allows it to sit as secondary information to the main sales pitch, rather than a separate call out, giving them the ability to call out the sign up pitch more strongly.
Revisiting elements should be a regular process throughout a build, with your copywriting, design and marketting teams always working together in tandem to get to the heart of each pages goal.
A/B testing. Apple.com - Rotate various content in and out of key featured objects to determine which products are drawing more interest from customers. Can also use same techniques to test various copywriting decisions.
Crazyegg.com - Click tracking. : Allows you to track the major clickthrough areas of your website to determine what is drawing the most attention and what is drawing the least attention. With that data you can begin to determine what it is that are drawing customers to one area and away from others. This service offers 4 views, a click area view, a list view of most popular links...
...a heat map, which displays click areas that are hot and areas that are cold, and finally a confeti view which shows actual location of all clicks. In SEO or web analytics this is also called a click density segmentation map.
On the web: 37Signals Blog, Signal Vs. Noise, great content on user focus, usability and doing the bare essentials better than anyone else. A List Apart: A site for people who work on the web. Everything from design to usability. If your design team isn’t reading this, give them a week to start and fire them if they don’t. Book: Web Form Design, didn’t talk much about web forms, but they are integral to the creation of an interactive web, and this book tells you how to do them right.