The document discusses the five planes of user experience in designing a website: 1. The surface plane is the visible web pages made up of images, text, and interactive elements like buttons. 2. The skeleton plane is the placement of these surface elements for optimal arrangement and usability. 3. The structure plane defines how users navigate between pages and site sections. 4. The scope plane outlines the site's features and functions. 5. The strategy plane determines scope based on both business and user objectives like sales, browsing, and a good customer experience.

1. UNDERSTANDING
INTERFACES
MoMA DESIGN Online STORE

2. THE FIVE PLANES
OF USER EXPERIENCE
User-centered design for the web

3. SURFACE
PLANE
On the surface you see a series of web pages, made up of images and
text. Some of these images are things you can click on, performing some
sort of function such as taking you to a shopping cart. Some of these
images are just illustrations, such as a photograph of a book cover or the
logo of the site itself.

9. images
Photographs of the products
Logo Icons

10. colors
Main: Blue and Black
Negative Space: White and Gray
New Products: Green
Sales: Red
Best Sellers: Purple
MoMA Exclusive: Orange

11. SKELETON
PLANE
Beneath that surface is the skeleton of the site: the placement of
buttons, tabs, photos, and blocks of text. The skeleton is designed to
optimize the arrangement of these elements for maximum effect and
efficiency—so that you remember the logo and can find that shopping
cart button when you need it.

13. User & Search
Upper Right

14. Menu
Upper Left

15. Categories
Up & Left

16. Products
Middle

17. STRUCTURE
PLANE
The structure is a more abstract skeleton of the site. The skeleton might
define the placement of the elements on the page; the structure would
define how users got to that page and where they could go when they
were finished there. The skeleton might define the arrangement of
navigational items allowing the users to browse categories; the structure
would define what those categories actually were.

18. STRUCTURE PLANE

19. STRUCTURE PLANE

21. STRUCTURE PLANE

22. SCOPE
PLANE
The structure defines the way in which the various features and
functions of the site fit together. Just what those features and functions
are constitutes the scope of the site. Some sites that sell books
offer a feature that enables users to save previously used addresses
so they can be used again. The question of whether that feature—or
any feature—is included on a site is a question of scope.

23. SCOPE PLANE
• Products • Order Status/History
• Categories • Newsletter
• Login/Account • FAQ
• Join • Customer Service
• Cart/Checkout • Moma.org
• Search • Facebook
• Registry
• Favorites
• What’s popular
• Customer Reviews
• Related Items
• You/Other people may also like(d)
• Stores Info
• Museum Info

24. STRATEGY
PLANE
The scope is fundamentally determined by the strategy of the site.
This strategy incorporates not only what the people running the site
want to get out of it but what the users want to get out of the site as
well. In the case of our bookstore example, some of the strategic
objectives are pretty obvious: Users want to buy books, and we want
to sell them. Other objectives might not be so easy to articulate.

25. STRATEGY PLANE
MoMa Design Store Strategic Objectives:
• Generate sales of design store items
• Increase sales by suggesting items that users may like, based on their
browsing history
• Display appealing photography of items for sale
• Provide a user friendly experience, to encourage customers to return
User Objectives:
• Purchase uniquely designed objects for oneself for as a gift
• Easily browse items to make the perfect selection
• Receive as much detailed information about the objects as possible
• Sort items based on different criteria (i.e. price)
• Hassle free returns and/or a satisfaction guarantee

26. BE HERE NOW
ITP 2012 Calheiros - bru.calheiros@nyu.edu
Presented by: Bruna