Yu Centrik

In the design of social media, our task is to provide a medium and context for human interaction.  With this power, the behaviour of our interfaces can be interpreted as the behaviour of our human colleagues, friends and family.  Considering this fact, we run the risk of creating unnatural, awkward or even hurtful social situations for our users - in other words, a terrible experience.

An example.  I was recently conducting business out of town when a peer and I agreed to keep contact via text-messaging.  At the time, I hadn’t yet realized that my network provider was not stable in this part of the world.  As it turns out, everytime I tried to send a text message, my phone was sending numerous duplicates.  Not only was the service assaulting the receipient with messages, but it was also giving me errors saying that it couldn’t complete message delivery.  So there I was, trying to re-send a message which had actually already been delivered twice; my recipient ended up receiving almost 10 identical text messages.  Needless to say, she was frustrated and annoyed, but most importantly, she was attributing the technical errors to me and drawing social conclusions (when we discussed this error later, she said I had seemed overeager and tactless).

As another example, consider a recent addition to Facebook which displays those friends you haven’t interacted with lately, reminding you to send them a message.  Unfortunately, this feature has been the target of a recent wave of complaints from users who automatically recevied such requests from recently deceased friends or family.  This is a clear example of an emotionally hurtful user experience directly resulting from Facebook’s attempt to socially-integrate their interface.

Embodying an interface within human social norms also allows users to understand and interact as if it were a social being.  If you’ve ever used voice response systems which attempt to use human language to engage in a natural conversation (”at the tone, please tell me what you’re calling about”), then you’ve likely felt a little frustrated, uncomfortable or confused.  In some cases, these interfaces greatly simplify the process, yet in others they are frustrating and strange.  In such novel interfaces, we move closer to the re-emergence of a principle introduced in the field of robotics by Masahiro Mori known as the “uncanny valley”.  Mori used early philosophical work on the ‘uncanny’ to demonstrate that overly realistic robots can result in a negative reaction from human observers.  The implication here is that while modest social embodiment of our interfaces can improve the user experience, we should be careful in more extreme applications of this principle, as we run the risk of making our users feel uneasy.

Considering the social role of your technological designs is a valuable technique.  However, designing for a more intimate realm of human experience also introduces new risks.  Our penetration into the emotional lives of our users has also opened possibilities for increasingly detrimental consequences of design errors.  Any designer should take heed of the lessons learned within these examples and consider the added risks when working on socially embodied technology.

Engaging with socially-powered technology for the past decade, I’ve noticed the slow, natural formation of ‘digital etiquette’.  In the same way that researchers have found information-seeking behaviour to be akin to animalistic ‘foraging’ behaviour, it seems that our typical social behaviour manifests itself on the web as well.  As online tools are appropriated by real users in a social context, we are starting to see the natural development of online ‘politeness’.  Some examples…

Re-Tweeting and Sharing Posts
When finding an interesting link posted by another user, it is polite to credit them when sharing it with your own network.  Twitter users accomplished this by creating and following the convention of re-tweeting (which is now being integrated formally into the system by twitter).  Along the same vein, Facebook has recently added a share feature which allows you to auto-distribute any post to your own network. However, Facebook’s system does not automatically include any information about the original poster with a user’s “re-post”.  This can result in a reaction from users; unless you mention whose post you’re sharing, you’re likely to receive a friendly “hey, you stole my post!”.

Multiplayer Gaming Conventions
Since their inception, multi-player games have been steeped in their own customs, language and culture.  Upon the release and adoption of a new game, its player community naturally tends to form rules and customs surrounding the freedoms and limitations of the game.  Starcraft, a classic strategy game from Blizzard, became extremely popular due to its balanced and engaging gameplay.  After an online community of players developed, a weakness of the game was revealed: advanced players could bypass an involved war by rapidly training a few troops to kill off beginners before they even get a chance to start playing.  The process was named rushing and an abundance of players started hosting games with “no rush” in the title, resulting in civil games based solely on players’ trust that fellow players would show politeness.

Selective Photo Tagging
Photo tagging is a useful feature on Facebook.  Users are able to tag the people in a photograph, automatically notifying them and attaching the photograph to their profile.  This creates a delicate situation, as anyone has the power to add pictures to your profile.  At first, users would tag every picture added to the network.  As users become more and more aware of this phenomenon, they have started tagging only the best pictures.  This creates an environment where all photos are accessible, but only the best are attached to a users’ profile.  Selective tagging is a clear display of respect and politeness for fellow users of the service.

–

There are many more examples of online politeness.  As social technology becomes more central, the trend is not likely to slow down.  What does this mean for designers?  We should take note of this trend and improve the user experience of any socially-driven system by considering and accomodating digital etiquette in our designs.

Let’s quickly review why, and under what conditions, these questions are used. Secret questions (security questions) are most often used when a user has forgotten his account password. This device ensures that the person renewing the password is in fact the person he says he is. Of course no system is infallible, but this one considerably reduces the risks.

Here’s the general idea: whenever you create a new account - especially with services where you have to provide sensitive personal information (the bank, email, etc…) - you will be asked to choose one or several security questions to which only you will know the answer. These questions must be as secure as a password without being “encrypted”. Therein lies the rub!

Fig. 1 - Example of a security question used by Paypal

At any point in the future, any user wishing to update his password will be required to provide the correct response to the security questions he selected. And of course, to “simplify” things, the different services to which he subscribes won’t necessarily offer the same set of questions!

1- Which questions just don’t work?

There are two main problems with security questions: Either the question is too easy, and someone from the user’s entourage can find the answer and play a dirty trick… or the question is too general and it’s hard to remember the answer.

The question should therefore provide enough hints for the user to remember, yet still be general enough. Finding a happy medium is the greatest challenge in developing these questions.

Example of non-secure specific questions:

• In what city were you born?
• What is your favourite movie?
• What brand was your first vehicle?
• What’s your favourite colour?

The answer to these questions can be found with a minimum of research. For example, it’s easy to find a list of the top 100 movies of all time, and there are only about one hundred names for colours (even including things like cream…).

Example of broad questions that are hard to recall:

• What’s your favourite video game?
• Who is your favourite historical character?
• Who is your favourite actor, musician or artist?

Why is it that, in the case of the latter questions, recall is difficult despite the questions being very specific? Let’s reflect for a moment on how memory works; particularly the phenomena of remembering and forgetting.

Benton J. Underwood (1957) and others have demonstrated the existence of a phenomenon that can cause interference with memory and lead to forgetting. In our daily lives, two sources of interference combine to cause us to forget names, dates, forms, etc…

On the one hand, the theory of Retroactive Interference suggests that what we forget of what we’re now retaining increases as a function of similarity to future learning. On the other hand, Proactive Interference suggests that the first memory interferes with the second. For example, words previously remembered may be included in the recall of new information.

But all is not lost ; ) Tulving and Psotka (1971) have demonstrated that interference is eliminated if recovery hints are provided. This is good news for our ability to remember. There are also several types of hints: associative (tools - hammer), phonetic (rhyme), or even visual. However, using hints is still a weak recall method when compared to recognition.

Example of recall versus recognition in a list of 6 words:

• What six words did you learn yesterday?
• In this list of 30 words, what six words did you learn yesterday?

Many experiments have demonstrated that the second case generated much better results (Bahrick et Wittlinger, 1975). In our case of the security question asking “what’s your favourite video game?“, the answer can evolve over time. When the time comes for the user to change his password, his favourite video game is likely to have changed; he’s probably played many more games and amassed a great deal of information on the subject. Ten years later, the same person will almost certainly have forgotten the game.
In this case, forgetting is very hard to undo. The game was neither a sustainable event, nor a significant moment, and any change in context alters the user’s perception of the hints, which affect his ability to recall.

2- How do I create a good question?

It is therefore crucial that any hints refer to something significant and, if possible, to something that won’t change over time. An important moment in the person’s life would be a good example. The question should apply to the great majority, relate to a significant experience and be hard to predict.

Naturally, by proposing a number of questions, the user can choose the one that is best suited to the situation and the least ambiguous. You should also realize that it’s not easy to create a good list of questions. Finally, we think that letting the user create his own question (like google mail does) is a risky proposition.

Example of questions we would recommend:

• What is your first love’s first name?
• What is your favourite grade school teacher’s family name?
• What is your maternal great-grandmother’s first name?
• What is the name of the city where your parents met?
• When you were a child, what did you want to be when you grew up?

It is also worth noting that experiments on recovery of information stored in long-term memory have shown that images are more effective than words. What other tools could we use to help the user recall a specific context (a photo of the environment in which the response was provided, a short clip of the music that was playing, etc…), in order to improve recall abilities and allow for “weaker” questions?

Have you ever had to create security questions? What are your thoughts on the subject?

Updated :

Here’s an interesting fact that confirms the importance of a good security question and the awareness that users must have of the subject. Today, the media announced that Sarah Palin’s Yahoo email address was hacked. It would seem that the hacker found the response to the security question and got into the Republic candidate’s email inbox.

For more information, see this TIME ARTICLE.

As a usability consulting firm, we perform a lot of usability tests on websites. One of the methods we use involves remote testing. Remote testing allows us to experience the user’s environment first hand. It is a powerful tool to fully understand how the users experience the website on their own computers with their own browser configurations.

The analysis of browser configuration was not the initial objective of our usability studies, as the tests were designed to test specific websites with participants located in Canada, China, Egypt, Japan, Israel and United States. However, the remote test studies revealed that users have configurations that have a direct impact on the “safe zone” of their browsers, thus compromising the visible portion of the web page.

What is a “safe zone”?

The safe zone for a web page is the part of a page that is visible in the browser when the page is first loaded. It is also known as the “above-the-fold” or “before the scroll”. The safe zone can be directly affected by two main factors:

• Screen resolution
• Browser chrome (title bar, status bar, scroll bars, toolbars, tabs)

What we found about user configurations …

A series of remote tests allowed us to collect screen captures from 51 participants. These remote tests were conducted on different types of websites: tourism website, sport clothing retailer website and a web-based human resources management application. The studies were conducted in July 2007, December 2007, February 2008 and June 2008.

Resolution Results:

In our studies, users are typically asked to have a minimum resolution of 1024 x 768, so we cannot confidently say how many users still have resolutions below 1024 x 768. However, during recruiting we do sometimes come across users still working with 800×600. Based on screenshots from a sample of 51 users:

• 60% of users had a 1024×768 resolution
• 25% of users opt for a 1280 resolution (1280×1024, 1280×800, 1280×768)
• 20% of users had a widescreen resolution
• 8 different resolutions were identified

While 1024 x768 remains the popular choice, we note that screen resolutions are increasing and varying.

Number of Toolbars Results:

For the purpose of our analysis, toolbars include: the menu bar, address bar, navigation bar, specialized toolbars (Google bar, Yahoo bar, etc.) and tabs (for tab navigation). Our remote test studies revealed interesting results regarding the number of toolbars.

Typically, a minimum of 2 toolbars is guaranteed. The users in our study all used Firefox or Internet Explorer. These browsers will typically have at least 2 toolbars by default, namely the Menu bar (File, Edit, View, etc) and the Address bar. In the case of IE 7, some users will actually have a third level by default since the initial page of the browser is tabbed.

Most users have 4 toolbars. On average users had 3 to 4 toolbars, but most users have 4 toolbars.

However, one user had up to 7 toolbars.

The toolbars vary across users, but the most common of toolbars are:

• menu bar
• navigation bar
• address bar
• combined navigation / address bar
• Google bar
• tabs

Status bar is present. 49 out of 51 users displayed their status bar.

Low resolution does not mean less toolbars. While we may think users with more toolbars will have higher resolutions, that was not the case, the users with 6 and 7 toolbars both had a resolution of 1024×768.

Then, how big is the average safe zone?

Based on our results, the safe zone in the browser (visible portion of the website) can vary in height from 494 pixels to 912 pixels and in width from 997 to 1138 pixels depending on resolution and number of toolbars.

What does it mean for website design?

The safe zone is key in the success of a site. Despite the great design of a website, brilliant navigation, innovative concepts, if a user cannot see important elements like the navigation bar because they were placed below the visible portion on their screen, the entire user experience will suffer.

One must consider that the actual safe zone is not the full resolution, because users see web pages through their browsers. Designers should continue to optimize their design for 1024×768, but the design should be sufficiently flexible to accommodate 800×600 and the increasing resolutions, and the presence of toolbars:

Design with the safe zone in mind. Primary and crucial content should be available within the safe zone (first-fold of the page). The main navigation elements should not be hidden.

Set safe zone width to 960 pixels. The width should not go above 1003 pixels.  However, it does not mean one has to always design at the edge of the page. A width of 960 is a good round number divisible by 10 and 12 which can be very practical for visual designers.

Set safe zone height to 540 pixels. The height is affected by the number of toolbars. Considering a resolution of 1024 x 768 and the numbers of toolbars as 4, the height should remain at least below 570 pixels. However, 540 pixels are divisible by 10 and 12 which is convenient and right under the minimum height found in our analysis of screenshots.

Be flexible. In the end the site should be flexible, so that users with any resolution or any number of toolbars will be able to navigate and not be lost.

Loading image

Click anywhere to cancel

Loading image

Click anywhere to cancel

Loading image

Click anywhere to cancel