Tuesday, June 9, 2015

Write Better User Interfaces by Asking “Who Else is in the Room?”

There exists a debate within the User Experience community about whether a user interface should say 'Your account' or 'My account' to refer to the user's account. Should the call to action be 'Create your account' or Create my account?

Pinterest and Trello are both social web apps that use "boards", yet see how they differ!

  • [caption id="attachment_107367" align="alignleft" width="134"]Pinterest: Your Board button Pinterest: Your Board button[/caption]
  • [caption id="attachment_107369" align="alignleft" width="272"]Trello: My Boards button Trello: My Boards button[/caption]

When it comes time to delete your account, however, they both switch terms:

[caption id="attachment_107365" align="aligncenter" width="556"]Pinterest: Deactivate my account Pinterest: Deactivate my account[/caption] [caption id="attachment_107368" align="aligncenter" width="324"]Trello: Permanently delete your entire account forever? Trello: Permanently delete your entire account forever?[/caption]

Interestingly, they agree on prompts:

  • [caption id="attachment_107366" align="aligncenter" width="437"]Pinterest: What's your board about? Pinterest: What's your board about?[/caption]
  • [caption id="attachment_107370" align="aligncenter" width="301"]Trello: What are you planning? Trello: What are you planning?[/caption]

So how are you to decide? One trick is to consider who is in the room and who is talking.

There's No One in the Room Except the User

If there's no one else in the room, skip the qualifier entirely. There's no ambiguity. That is, if your user has no reason to acknowledge your brand or anyone else, imagine they're in an empty room. If there's a wrapped present on the table in this empty room, they know it's for them without needing a gift tag and their name on it.

When you avoid the qualifier, you gain the benefit of front-loading interface copy with distinguishing words instead of "your" or "my". For example, "Privacy settings" stands out from "Account" better than "My privacy settings" from "My account". This makes your user interface easier to scan. It also reduces the time it takes a user to understand what they're seeing and take their next action (perhaps, buying your product).

Two's Company — the website and the user

Only use "your" or "my" when you need to differentiate between the user and the website speaking:

  • When the website is talking, use "Your".
  • When the user is talking, use "My".

In the first instance, the website may "speak" to:

  • Orient the user through page headings and labels
  • Provide content
  • Tell the user about their content
  • Tell the user there's been an error and how that affects them
  • Provide help and instructions
  • Offer documentation

(This is often expressed through some kind of label — a page label, form label, button label — so for simplicity we'll refer to this type of dialog as a label.)

In the second instance, the user "speaks" when they perform actions. That is, the user lets the website know what they want by:

  • Pressing buttons
  • Clicking menu items
  • Entering data
  • Selecting filters
  • Otherwise making some choice and commanding the website

(For simplicity, we'll focus on buttons.)

As such, "My" is appropriate in actions.

Using "Your" or "My" when there are multiple voices removes the ambiguity about who is talking and who they are addressing, however, you still don't need to use both at all times. Assume one person is always talking, then add the qualifying "your" or "my" for exceptions when you need to differentiate between the website and user.

If the default is that the user is talking, you need to specify when the website is interjecting:

  • Website: "Would you like free gift wrapping with your purchase?" (label)
  • User: "Add gift wrapping" (button) — not "wrap my gift"
  • Website: "Your Clients:" (label)
  • User: "Contact Clients" (button) — not "Contact My Clients"

If the default is that the website is talking, you need to specify when the user speaks up:

  • Website: "Gift wrapping:" (label) — not "Wrap your gift:"
  • User: "Wrap my gift" (button)
  • Website: "Clients:" (label) — not "Your Clients:"
  • User: "Contact My Clients" (button)

Whether you emphasize the website's voice or the user's voice may depend on your product or service. A chatty, engaging brand will use "your" extensively. Alternatively, in personal, individual environments, a brand may wish to hide their presence. For example, consider these buttons:

Continue reading %Write Better User Interfaces by Asking “Who Else is in the Room?”%


by Diana MacDonald via SitePoint

No comments:

Post a Comment