🌍 All Study Guides📊 Dashboard📰 Blog💡 About
Google UX Design Professional Certificate • STUDY MODE

PRACTICE QUIZ

QUESTION 1 OF 16

What are common elements in a mockup? Select all that apply. Explanation : Color is a common element in a mockup that helps designers better understand the design’s layout. Other common elements included in a mockup are typography and iconography.

A
Outline
B
ColorCorrect Answer
C
IconographyCorrect Answer
D
TypographyCorrect Answer
Explanation:

Iconography is a common element in a mockup that helps designers map out the user flow. Other common elements included in a mockup are typography and color. Explanation: Typography is a common element in a mockup that helps designers visualize the user’s journey. Other common elements included in a mockup are color and iconography.

QUESTION 2 OF 16

Which of the following is an advantage of a high-fidelity mockup?

A
High-fidelity mockups allow designers to make multiple iterations without affecting the design’s functionality.Correct Answer
B
High-fidelity mockups can offer designers a basic outline of a product or screen.
C
High-fidelity mockups help designers test the product’s functionality.
D
High-fidelity mockups help designers map out a product during the early stages of design development.
Explanation:

Since high-fidelity mockups are not interactive, designers can make multiple iterations of a design visually without affecting its functionality.

QUESTION 3 OF 16

What design characteristics make a mockup different from a wireframe?

A
A mockup includes minimal details and color.
B
A mockup is an outline or sketch of a product.
C
A mockup is a static, high-fidelity design that closely matches the final product.Correct Answer
D
A mockup is clickable or highly interactive.
Explanation:

Mockups are high-fidelity designs that are used as representations of a final product. They also feature more visual and UI elements than wireframes. TEST YOUR KNOWLEDGE ON WORKING WITH DESIGN SYSTEMS

QUESTION 4 OF 16

Which of the following is a basic component of a design system? Select all that apply.

A
Editorial styles
B
Visual stylesCorrect Answer
C
UI componentsCorrect Answer
D
GuidelinesCorrect Answer
Explanation:

Defining the styles for core visual design elements helps companies express their brand more consistently. This may include elements, like typography, color palettes, and iconography. Other basic components of a design system include guidelines and UI components. Explanation: Components such as buttons, dialogues, and gestures are interface elements. These features are consistent across a brand or product. Other basic components of a design system include guidelines and visual styles. Explanation: Guidelines specify certain components or styles should be used within a product. These help designers stay consistent across all of their work. Other basic components of a design system include visual styles and UI components.

QUESTION 5 OF 16

A design team is creating mockups for a website, and wants these mockups to incorporate solutions for multiple pages. A teammate proposes the creation of a design system to ensure consistency. Which of the following is another benefit of a design system?

A
Design systems help designers create scalable designs and increase efficiency.Correct Answer
B
Design systems house single-use elements.
C
Design systems allow designers to develop standards as they move through the process.
D
Design systems help separate the product from the brand identity.
Explanation:

Design systems help designers create scalable designs and increase efficiency, which can save designers time and money. TEST YOUR KNOWLEDGE ON CREATING A HOMEPAGE IN ADOBE XD

QUESTION 6 OF 16

Fill in the blank: When creating a mockup in Adobe XD, you can add images easily by creating a ___ first, then dropping the image inside of it.

A
line
B
text box
C
shapeCorrect Answer
D
drawing
Explanation:

When creating a mockup in Adobe XD, you can create shapes using the polygon, rectangle, and eclipse tools, and then add images inside of the shapes.

QUESTION 7 OF 16

When creating a mockup in Adobe XD, where can you find the alignment tool?

A
Assets panel
B
Components tab
C
Property inspectorCorrect Answer
D
Artboard
Explanation:

The property inspector provides a number of options for the object you select on an artboard, including alignment, font, color, spacing, and more.

QUESTION 8 OF 16

What is the assets panel in Adobe XD?

A
A collection of the elements and preferences created in a design.Correct Answer
B
A feature used to move or resize an element from a stack, and automatically move the rest of the elements, to preserve the defined spacing between elements.
C
A static high-fidelity design used as a representation of a final product.
D
An order of typefaces and fonts used to create divisions to aid users in where to focus and find information.
Explanation:

Similar to a sticker sheet, the assets panel in Adobe XD is a collection of elements and preferences that can be reused throughout the design. TEST YOUR KNOWLEDGE ON WEB ACCESSIBILITY

QUESTION 9 OF 16

Imagine a designer is creating a responsive high-fidelity webpage that should be accessible to people with disabilities. They place markers next to interactive UI elements on the page. What method is the designer using?

A
Labels
B
AnnotationsCorrect Answer
C
Hierarchical headings
D
Traversal order
Explanation:

Annotations are markers placed next to interactive UI elements on the page, like the call-to-action buttons.

QUESTION 10 OF 16

Imagine a designer is creating a responsive high-fidelity webpage that should be accessible to people with disabilities. They apply a method to scale the size of the text based on its importance on the page. What method is the designer using?

A
Labels
B
Hierarchical headingsCorrect Answer
C
Annotations
D
Traversal order
Explanation:

Headings are a great example of how hierarchy can help users navigate a webpage by selecting from the screen reader menu options more easily. Different sized headings can be annotated to indicate the hierarchy. Then, these can support the engineer’s implementation of headings in HTML.

QUESTION 11 OF 16

Imagine a designer is creating a responsive high-fidelity webpage that should be accessible to people with disabilities. They apply a method to add descriptive language to the interactive UI elements on the site. What method is the designer using?

A
LabelsCorrect Answer
B
Annotations
C
Hierarchical headings
D
Traversal order
Explanation:

Labels add descriptive language to the interactive UI elements on the page. When annotating labels for interactive elements, designers note where similar controls should be grouped to provide more efficiency and context to the screen reader. TEST YOUR KNOWLEDGE ON USABILITY STUDIES

QUESTION 12 OF 16

What are the main goals when conducting usability studies for high-fidelity prototypes? Select all that apply.

A
Define the design problem
B
Determine the design solution
C
Understand how users will interact with the final productCorrect Answer
D
Identify areas to iterate on the prototype and improve the designCorrect Answer
Explanation:

When testing a high-fidelity prototype, there are two main goals. One goal is to understand how users will interact with the final product. The other goal is to figure out ways to improve the design. Explanation: When testing a high-fidelity prototype, there are two main goals. One goal is identifying areas to iterate and improve the design. The other goal is to understand how users will interact with the final product.

QUESTION 13 OF 16

A designer wants to test a high-fidelity design and conduct a usability study. Which of the following is an example metric that can be used to measure the design’s success?

A
Start time
B
Color saturation
C
User error rateCorrect Answer
Explanation:

KPIs, such as user error rate, measure the progress toward the goal established for the design.

QUESTION 14 OF 16

What step comes after you lay out your mockups in Adobe XD?

A
Connect the screensCorrect Answer
B
Adjust the animation
C
Add interaction details
D
Switch to Prototype mode
Explanation:

Once the artboards are in order, you connect the screens according to the user journey you want to be the focus.

QUESTION 15 OF 16

In Adobe XD, you can decide the type of interaction you want for the transition between two elements. What is the term for these interactions?

A
TriggersCorrect Answer
B
Actions
C
Components
D
Buttons
Explanation:

Triggers define what type of interaction will cause the prototype to advance. The most common action is tap, or when a user taps on the first element.

QUESTION 16 OF 16

Fill in the blank: Annotations are markers placed on a page to set the _____, or navigation flow, for users on an app or site.

A
traversal orderCorrect Answer
B
accessibility standards
C
hierarchical headings
D
labels
Explanation:

Traversal order is the navigational flow for a user on an app or website.

Ready to test your recall?

What are common elements in a mockup? Select all that apply. Explanation : Color is a common element in a mockup that helps designers better understand the design’s layout. Other common elements included in a mockup are typography and iconography.

💡Select all 3 correct answers before submitting (0 of 3 selected).
A
Outline
B
Color
C
Iconography
D
Typography

How confident are you in this answer?