SXSW 2015: Green Screen UX: Designing For Context

Justin Smith
Sr UX Architect
Cartoon Network

Presentation Description

Creating a scene on a green screen takes several things into account such as who the actors are, where they’re placed, and what they are doing. All of this creates the context for the scene. The same principles can be applied to designing UX. We’ll look at three specific types of context I call Person, Place, and Problem and draw the parallels between green screen cinema and UX design. Examples of good and bad implementations of these types of context will be examined and we’ll explore what these stories mean to UX. Attendees will walk away knowing how to look at their designs like a green screen and design for great context in their UX.

Presentation Notes

When users don’t have the full context, they cannot find what they need.

  • Person: The user
  • Problem: What are we trying to solve
  • Place: Where do we place the user when they’re trying to perform the task

Stories are about relationships between the people. But what we want to know is how we build relationships between our users and the product. If a user doesn’t come to your product and find a shared interest, they’re not going to come back. Once you figure that out and you speak to their interest, you use that to foster deeper connections.

1. Person

What’s the common ground?

  • Foster deeper connections
    • Netflix suggests things the more you watch
    • Pandora serves up things similar to what you like
  • What if we took that approach and used it places that currently don’t?

What about when the conversation is one way?

  • Often personalization requires login or cookies to know what they’re doing.
  • Sometimes the user needs to listen to the business.
  • When you go to youtube without being logged in, they show you the most popular videos.
  • Kids go to Cartoon Network’s homepage for games, so they show them front and center.
  • When you go to dropbox, it’s clean and simple and all it has up top is a login/sign-up button.

2. Problem

  • When users are coming to your product, they already know what they’re trying to solve. They expect you to have their resolution.
  • You can use label and copy to guide users. A lot of time you’ll see “laxy copy” like: see more, click here, discover, more info. What does that mean?
  • Give our users more context and build trust by providing meaningful labels.

Mistakes in copy

  • You’re trying to be too clever.
  • You’re trying to be too brief. There’s no reason to click into the content.
  • Involve your copy writer.

#1 Priority in UX: Clarity

3. Place

  • The question becomes: Where is the user in my product when they’re trying to accomplish a task?
  • If you look at the Cartoon Network website there are three sections: Video, Game, Community.
  • How do you organize the page to get the user the full picture they need?

What about when you get it wrong?

  • Demanding an email address before seeing the content. For instance, Groupon does this.
Posted in SXSW 2015.

Leave a Reply

Your email address will not be published. Required fields are marked *