Implementing Page Structure

Question 1

What role does page structure play in the design of a user interface?

Answer 1

It help users find the page elements they need efficiently.

Question 2

What elements on a page can be used to support page structure, answering the user’s question of “where am I?”.

Answer 2

Titles, tabs and navigation bars

Question 3

Place the most _______ element of the graphical user interface in the largest subsection, and put the supporting tools in less prominent panels.

Answer 3

important

Question 4

By putting the most important information or frequently used panel center stage, you draw the users’ ______ towards it

Answer 4

attention

Question 5

Center Stage

Answer 5

A common user interface design pattern: putting the most important information or frequently used panel center stage. It helps the user to focus their attention and not get distracted by elements that keep them from their main task.

Question 6

What visual parameters do you have to play with in order to focus the user’s attention to the center stage panel?

Answer 6

Color and Size

Question 7

What would make it problematic for a website to use center stage design?

Answer 7

If your website has multiple user groups with different needs

Question 8

With practice, the user learns where items in a user interface are and how to get to them in the shortest possible time. What characteristic enables users to switch from piece to piece promptly and seamlessly, even when the tools needed for a task are in different panels?

Answer 8

The user’s spatial memory

Question 9

In which of the following cases would it be most appropriate to implement the Movable Pieces design pattern?

Answer 9

Incorporating text from MS Word into a poster layout

Question 10

How does titled sections help the user?

Answer 10

It allows the user to skim a page’s contents and identify interesting or useful information.

Question 11

Titled sections provide strong _____ ____ to direct attention to relevant information.

Answer 11

visual cues

Question 12

A title must give off a clear cues that a user will reach his or her _____ when pursuing that particular path.

Answer 12

goal

Question 13

How do titled sections draw the users’ attention to relevant sections of a page?

Answer 13

By providing strong visual cues, using font type and size

Question 14

What is a responsive enabling design pattern?

Answer 14

Enabling only those parts of the user interface that are relevant to the current step in the task process
• which can help reduce the time it takes to complete the overall task.

Question 15

How does responsive enabling prevent user errors when they are filling out a complex form?

Answer 15

It facilitates only the current step relevant to the user’s task

Question 16

What is the advantage of responsive enabling over progressive disclosure?

Answer 16

It facilitates expert users by allowing them to anticipate their next actions

Question 17

What can be the potential problem with movable pieces?

Answer 17

The only potential problem is if the user changes the layout and doesn’t know how to switch to the original or default arrangement.

Question 18

How can you implement movable pieces?

Answer 18

1. Provide the users with small indicators
2. Provide a maximize square in the top right- or left hand corner so the user can quickly view a panel in full screen mode
3. Allow the user to revert back to the previous arrangement
4. Allow the users to set certain parameters(resize)
5. Implement a handle on the panel so the user can grap one and place it somewhere else on the screen.
6. A revert to default action button

Question 19

What is the goal of implementing movable pieces?

Answer 19

Allowing the user to focus on customizing a comfortable arrangement. Users can interact with sites and screens in a way that keeps them happy.

Question 20

How can you implement Titled Sections?

Answer 20

1. Divide the contents into chunks
2. Assign short titles
3. Choose the superficial aspects of design
4. Place the titles in close proximity to the corresponding contents
5. Consider using borders to divide contents

Question 21

Why should you choose a center stage design pattern?

Answer 21

The user interface arrangement should offer the users strong visual cues as to what is important and which elements are related to their primary aim.

Question 22

What elements on a page can be used to support page structure, answering the user’s question of ‘Where am I?’

a. Banners, slideshows and media players
b. Images, tables and texts
c. Titles, tabs and navigation bars

Answer 22

c. Titles, tabs, and navigation bars

Question 23

What is a visual framework?

Answer 23

The visual framework is all about creating visual consistency throughout the user experience.

Question 24

What visual parameters do you have to play with in order to focus the user’s attention to the center stage panel?

a. Color and Size
b. Typography and contrast
c. White space and lines

Answer 24

a. Color and Size

Question 25

What would make it problematic for a website to use center-stage design?

a. If your website has one specific user group
b. If your website has a lot of different options
c. If your website has multiple user groups with different needs

Answer 25

c. If your website has multiple user groups with different needs

Question 26

What is center stage design?

Answer 26

A design pattern where the most important information, panel, window, or toolset appears prominently at the center of the user interface.

Question 27

Why choose a movable piece design pattern?

Answer 27

The ability to customize displays can help users improve their productivity. Over time, users become more and more adept at arranging information and graphical user interface elements to support their needs better.

Question 28

What is the benefit of movable pieces?

Answer 28

It allows users to prioritize their own tasks and actions;

Question 29

With practice, the user learns where items in a user interface are and how to get to them in the shortest possible time. What characteristic enables users to switch from piece to piece promptly and seamlessly, even when the tools needed for a task are in different panels?

a. The user’s long-term memory
b. The user’s procedural memory
c. The user’s spatial memory

Answer 29

c. The user’s spatial memory

Question 30

Why Choose a Titled Section Design Pattern?

Answer 30

When the user scans the user interface, the titled sections provide strong visual cues to direct attention to relevant information. These save users from having to read through the contents themselves. At a glance, you know what each section is about. If you already know one or more of the points being made, you can zero in on what you do want to read, as opposed to taking the grand tour, which would take much more time.

Question 31

How do titled sections draw the users’ attention to relevant sections of a page?

a. By addressing users’ main interests, using catchy phrases
b. By hiding irrelevant content, using blurring and pixelating
c. By providing strong visual cues, using font type and size

Answer 31

c. By providing strong visual cues, using font type and size

Question 32

What is responsive enabling?

Answer 32

The gradual process of enabling users to interact with certain user interface elements as and when they need them

Question 33

How does responsive enabling prevent user errors when they are filling out a complex form?

a. It facilitates only the current step relevant to the user’s task
b. It shows the system’s response to selections and entries
c. It shows users the default selections and standard form entries

Answer 33

a. It facilitates only the current step relevant to the user’s task

Question 34

What is the advantage of responsive enabling over progressive disclosure?

a. It facilitates regular users by allowing them to anticipate their next actions
b. It allows users to tackle a larger task by presenting it in sub-components
c. It supports novice users by guiding them through a step-by-step process.

Answer 34

a. It facilitates regular users by allowing them to anticipate their next actions

Question 35

What is progressive disclosure?

Answer 35

Progressive disclosure defers advanced or rarely used features to a secondary screen, making applications easier to learn and less error-prone.