Imitation: Sincerest Form of Flattery or Bad Move? (Adopting Web 2.0 Patterns)


Published on

Presented at the Internet User Experience (IUE) Conference in Ann Arbor, Michigan, 27 July 2010.

Published in: Design
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Offices in Chicago, New York, Boston, and Denver. And we’re hiring. Founded in 2000.
  • This is the “shock and awe” slide where we show you all our impressive clients.
  • Business goals are represented by people. They have their own ideas of what makes a good site from the sites they use on a daily basis.
  • Sometimes these ideas fit the project, and sometimes they don’t.
  • So my goal for this talk is to give you some examples and lessons learned when we’ve tried to approach these kids of ideas.
  • This example is from a large financial institution. In an effort to be “cutting edge,” the client wanted to use a “coverflow” style navigation rather than the usual tree navigation or list of files. This wireframe represents several levels of folders or directories – different from the typical tree structure.
  • Then this wireframe show how once you get down to the document level, you can flip through them to quickly pick out the right one. Anyone starting to notice a potential problem?
  • Here’s the actual visual comp, where it should be even more obvious. All of these documents look exactly the same – except for the title! This defeats the whole purpose of this browsing method.
  • Contrast it to this, where the model works very well. [Go to site,]
  • This actually turns out to be a pretty popular idea. This example is from a large insurance company. In this case, they wanted to use a cover-flow structure to browse some of the applications that are available to their clients. They all look the same too, which we pointed out. But no problem…
  • Our designers just made up visuals to go with each one. They look nice, but don’t have any meaning to the users.
  • Here’s an example where this approach make a little more sense. For each of the past two holiday seasons, we did a lot of work for Sears – Part of which is their Heroes at Home program, which supports the families of active duty military.
  • Part of that is the “Wish Registry,” where military families can register to receive holiday gifts from the general public. We wanted to develop a way that users could quickly browse through the families’ stories. This is an early wireframe that shows the concept of these “cards” featuring each person.
  • In this comp, which shows an evolution of the interface, you can see how a lot of information can be condensed visually into the card. This was actually driven by research. We found out that when users were deciding which family to donate to, They cared about the size of the family, the branch of the military, and how many wishes had been fulfilled so far.
  • Social media is everywhere. Here’s one of my favorite examples.
  • The parking garage has more followers than I do.
  • Obviously there are thousands of social networks out there, and everyone uses them in their own way. There’s also a lot of crossover among them.
  • Facebook tends to get the most attention with the clients we talk to.
  • Folks like a lot of things about Facebook that they want to incorporate into their applications. There are many examples of failures in this area, but I wanted to talk a little about an interesting project we worked on.
  • For many years Roundarch has built and managed the U.S. Air Force portal. It provides all of these services; each week about 400k unique logins occur.
  • We wanted to push toward a more “2.0” approach—integrating social media.
  • At the same time, the Air Force had banned social media for a few reasons. So we went about what could be described as a replacement Facebook, tailored to the Air Force.
  • Search aided by user-defined tags
  • You can see many of the familiar concepts to Facebook here.
  • And you can see how it fits into the “Personal Space” that each Airman has on the portal.
  • In true military fashion…. Isn’t that what we really all want—knowledge dominance and information superiority?
  • So there’s one wrinkle to tell you about. And this actually potentially changed the way the portal is perceived. We talked about parts of the Portal being kind of a Facebook replacement – But now we don’t need to replace it. It’s too early to tell exactly what will happen, but it really make the work related stuff more important.
  • Just a quick example from the same large insurance company we were talking about before. This shows a fairly simple, but useful social media tool within the corporation. It starts with a search.
  • … and ends with a profile. Again you can see a lot of the same constructs from Facebook, but some of them are very specific to the organization. The “Expertise” area shows employees who have been tagged as experts in a field. The “Reporting Structure” area gives some key organizational info.
  • This was the very loose outline of the original idea. Since Sears ultimately wants to sell things, the angle was that the information in the videos would be useful for finding gifts. What could go wrong?
  • The video part of it was inspired by all the great video content we see on the Web – both professional and not-so-much.
  • They had also seen some success in the previous holiday campaign with these celebrity vignettes about Christmas, but the budget wasn’t there this year.
  • And there were a number of other social media constructs thrown into the social media soup. Recommendations are particularly tricky.
  • Amazon really perfected this idea…but they screw it up sometimes too.
  • And Facebook picked up on it. Just because you CAN do it, doesn’t mean you SHOULD.
  • So we took all those challenges head on and designed a solution. We used a Google maps interface to place all the videos. We decided that there would be three questions that people could answer. We put in some filters for browsing the videos. We added a contest to encourage people to submit.
  • This is what the search interface looked like. This is the Wizard of Oz moment where black and white turns to color.
  • Then we attacked the browsing. You can see some constructs from YouTube.
  • And then finally the actual video. We have rating and commenting. Recommendations for similar videos. And the holy grail, gift ideas.
  • The way we decided to handle the gift ideas was to manually pull out any categories of gifts that were mentioned in the video, and match them up behind the scenes with actual merchandise. You can see that terms like “Bicycles” and “Games” also made it up into the recommended videos. So we felt like we kind of had it licked.
  • Let’s take a look at the site for a moment. Everything worked, it looked good. But there was one major problem. [Go to demo site – not available publicly]
  • Only 13 videos!
  • Not only did having only a few videos make it uninteresting, it also didn’t give us enough data to make the filters, tages, gift recommendations etc. work.
  • Imitation: Sincerest Form of Flattery or Bad Move? (Adopting Web 2.0 Patterns)

    1. Imitation: Sincerest Form of Flattery or Bad Move? Adopting Web 2.0 Patterns John Yesko Director, User Experience
    2. About Roundarch <ul><li>Roundarch is a specialized consultancy focused on designing and building websites and applications for the world’s largest organizations. </li></ul><ul><li>Key Facts </li></ul><ul><li>We serve mainly Fortune 500 and large government organizations. </li></ul><ul><li>We specialize in balancing user centered design with enterprise class-technology. </li></ul><ul><li>We are a recognized leader in developing rich internet applications (RIAs). </li></ul>200+ employees in 4 offices (and looking for more)
    3. Selected Clients Financial Services Government Consumer Manufacturing Healthcare/ Transportation Media & Communications
    4. The Setup
    5. Why Are We Here? <ul><li>User Experience Design Process (Very High Level) </li></ul>User Needs Business Goals
    6. Helpful Suggestions People love the customer reviews on Amazon. We need customer reviews for all our products. We could have our customers tag everything – then we don't even need a navigation structure.   We need to incorporate Twitter! We need a viral game, like Subservient Chicken!
    7. This Presentation <ul><li>Examples of failures, successes, and lessons learned </li></ul><ul><li>Goal: Get to the core characteristics of these experiences, to analyze why they do or don’t fit the project at hand </li></ul>
    8. Examples
    9. Visual Browsing
    10. Visual Browsing <ul><li>Inspired By: </li></ul><ul><li>iTunes </li></ul>
    11. Visual Browsing <ul><li>Inspired By: </li></ul><ul><li>Apple Desktop </li></ul>
    12. Visual Browsing <ul><li>The big idea: Quickly navigate multiple options visually </li></ul><ul><li>Employ an RIA construct rather than “traditional” means of browsing </li></ul><ul><li>Astound and impress the audience </li></ul><ul><li>Use surface reflections liberally </li></ul>
    16. <ul><li>Inspired By: </li></ul>
    19. Visual Browsing <ul><li>Challenges </li></ul><ul><li>Only works when the target is visually distinguishable from the others </li></ul><ul><li>Sometimes traditional, familiar constructs work best </li></ul>
    23. Social Life
    24. Social Media
    25. Social Media
    26. Personal Social Media Usage <ul><li>My Big Four </li></ul>Business networking Keeping track of friends UX knowledge gathering Storing and sharing photos Stalking old girlfriends Personal Professional Personal Professional Personal Professional Personal Professional
    27. Helpful Client Tips   We want to build a community. It should be like the Facebook of risk managers.   … of physicians.   … of travel enthusiasts.   … of ship captains.
    28. Social Media in Business <ul><li>The big idea: Use social media constructs to increase engagement </li></ul><ul><li>Create a place where like-minded individuals can: </li></ul><ul><ul><li>Communicate </li></ul></ul><ul><ul><li>Share knowledge </li></ul></ul><ul><ul><li>Keep track of each other </li></ul></ul><ul><li>Increase efficiency over old school methods </li></ul><ul><ul><li>E.g., announcement and alerts </li></ul></ul><ul><li>Commerce angle: Keep them coming back, and eventually buy stuff </li></ul>
    29. Air Force Portal <ul><li>User interface to GCSS-AF and enterprise services </li></ul><ul><li>Enterprise Web content management service </li></ul><ul><li>Enterprise search </li></ul><ul><li>Shared workspaces </li></ul><ul><li>Secure instant messaging </li></ul>
    30. The Promise of a “Social” Portal <ul><li>Better content </li></ul><ul><ul><li>Accurate (self-healing) </li></ul></ul><ul><ul><li>Timely </li></ul></ul><ul><ul><li>Trusted (auditable) </li></ul></ul><ul><li>Improved discovery </li></ul><ul><ul><li>Content, applications, people </li></ul></ul><ul><li>Increased/easier customization </li></ul><ul><li>Maintain and create connections </li></ul><ul><li>Increased/easier sharing </li></ul><ul><li>Engage Gen Y – “Digital Natives” </li></ul><ul><ul><li>Tools they are accustomed to and desire </li></ul></ul><ul><ul><li>Recruitment and retention </li></ul></ul><ul><ul><li>Increased efficiency </li></ul></ul>
    31. Air Force Portal 2.0 <ul><li>Social media had been banned from the DoD </li></ul><ul><li>Confidential information </li></ul><ul><li>Time waste </li></ul><ul><li>Bandwidth waste </li></ul>
    32. Air Force 2.0 Portal
    33. Air Force 2.0 Portal Comment Share Links Update status “ Wall” Concept Post Messages Manage connections
    34. Air Force Portal 2.0 External widgets External websites RSS Feeds AFP Content AFP Widgets My Network
    35. Air Force Portal 2.0 “ Push” communications Status updates, messages and shared links from across My Network
    36. Air Force Portal <ul><li>“… Our knowledge operations managers, along with the new tools at their disposal, can significantly enhance support to the warfighter and our ability to leverage data, information, and knowledge to achieve knowledge dominance and information superiority.&quot; </li></ul><ul><li>Maj. Gen (Ret) John W. Maluda, former Director of Cyberspace Transformation and Strategy, Warfighting & Integration and CIO </li></ul>
    37. Timeline 2007 DoD Ban on Social Media 2007? 2008 2009 2010 Portal 2.0 Completed Dec. 2009 Portal 2.0 Launched May 2010 DoD Lifts Ban on Social Media April 2010
    38. Social Media in Business <ul><li>Challenges </li></ul><ul><li>Limited perceived usefulness </li></ul><ul><ul><li>What’s in it for me? </li></ul></ul><ul><li>Competition from existing social media </li></ul><ul><ul><li>Time and motivation to maintain another presence (integration helps) </li></ul></ul><ul><ul><li>Critical mass of friends / connections </li></ul></ul><ul><ul><li>Expectations set by other social media </li></ul></ul>
    41. The Web 2.0 Junk Drawer
    42. Sears Christmas Across America <ul><li>The big idea: Use the power of the crowd to source popular holiday gifts </li></ul><ul><li>Go around the country asking people about Christmas, and get their thoughts on video </li></ul><ul><li>Want it to “go viral” </li></ul><ul><li>Visitors can rate, comment on, and tag the videos </li></ul><ul><li>The content of the videos can be used to get gift ideas </li></ul>
    43. Sears Christmas Across America <ul><li>Inspired By: </li></ul><ul><li>Advertising </li></ul>Professional Productions <ul><li>Amateur Content </li></ul>
    44. Sears Christmas Across America <ul><li>Inspired By </li></ul>
    45. Sears Christmas Across America <ul><li>With a Dash Of: </li></ul><ul><li>Tagging </li></ul>Ratings and Reviews <ul><li>Recommendations </li></ul>
    46. Recommendations <ul><li>Amazon </li></ul>
    48. Christmas Across America <ul><li>Challenges </li></ul><ul><li>Little control over videos </li></ul><ul><ul><li>Length </li></ul></ul><ul><ul><li>Subject matter </li></ul></ul><ul><ul><li>Quality </li></ul></ul><ul><li>Tagging can get out of control, plus many people don’t get it </li></ul><ul><li>What’s the incentive to participate as a content author? </li></ul><ul><li>Converting amateur video into selling stuff </li></ul>
    55. Christmas Across America <ul><li>Approach: Include “2.0” elements, but… </li></ul><ul><li>Keep videos focused on a few main ideas </li></ul><ul><li>Do a lot of the work behind the scenes – instead of depending on users </li></ul><ul><ul><li>Control tagging </li></ul></ul><ul><li>Offer prizes for the “best” videos </li></ul><ul><li>Match up gift ideas with video content as best we could </li></ul><ul><ul><li>Allow for “no matches”—don’t always recommend a gift </li></ul></ul>
    58. Christmas Across America <ul><li>Why It Didn’t Work </li></ul><ul><li>Big problem: social media requires people ! </li></ul><ul><ul><li>Weren’t able to fund “roving reporter” </li></ul></ul><ul><ul><li>Good idea to off-load the work to the crowd… </li></ul></ul><ul><ul><li>...but not enough critical mass to make the data smart </li></ul></ul><ul><li>Users weren’t too interested in the videos unless it was someone they knew. </li></ul><ul><li>You can’t make a “viral” site. You can make a really good site, and maybe it will go viral. </li></ul>
    59. Wrap Up
    60. Considerations <ul><li>Rich interface elements </li></ul><ul><li>Is it better than the traditional way, or just cool and different? </li></ul><ul><li>Is the audience technically sophisticated enough to “get it”? </li></ul><ul><li>Are there technical limitations that make it inaccessible? </li></ul><ul><ul><li>E.g., plug-ins, browser restrictions, mobile usage, bandwidth, etc. </li></ul></ul>
    61. Considerations <ul><li>Social media </li></ul><ul><li>Does the critical mass of people exist? </li></ul><ul><li>Do they have the time and motivation to participate in another network? </li></ul><ul><li>Is it already being done better with existing sites? Can it integrate with them? </li></ul>
    62. Considerations <ul><li>Other “2.0” elements </li></ul><ul><li>Comments and reviews - can the brand or person withstand flamers? </li></ul><ul><li>Are there enough participants to build aggregate data? </li></ul><ul><li>Are there social, legal, or security ramifications to opening things up? </li></ul><ul><li>Does tagging make any sense? </li></ul>
    63. <ul><li>John Yesko </li></ul><ul><li> </li></ul><ul><li>[email_address] </li></ul><ul><li>Twitter: @jyesko </li></ul>Thank You Roundarch [email_address]