create high-fidelity designs and prototypes in figma week 3 quiz answers

Test your knowledge on design systems

1. Which of the following visual elements are included in a design system? Select all that apply.

  • Color
  • Typography
  • Wireframes
  • Iconography

2. A design team sets up a design system for an upcoming product launch. The design system includes visual styles, usage guidelines, _____, and support codes to ensure all elements in their design carry through to the final product.

  • branding
  • graphics
  • UI patterns

3. One benefit of a design system is that it creates consistency for designers and users. When designers have a specific set of elements to work from, they can increase the speed of production, decrease inconsistencies, and focus on innovative solutions that focus on the user.

  • True
  • False

Test your knowledge on features of open-source design systems

4. Which of the following examples represent the best use of the app bar title on a desktop?

 
 

 

A screenshot of the navgiation bar of an app with a hamburger menu to the left and a title "2017 Tokyo vacation photos"

 

 

A screenshot of the navgiation bar of an app with a hamburger menu to the left and a title "vacation photos" that is cut off

 

 

A screenshot of the navgiation bar of an app with a hamburger menu to the left and a title "vacation photos"

 

A screenshot of the navgiation bar of an app with a hamburger menu to the left and a title "Summer trip to Tokyo and Kyoto"

5. What pages in a public design system can new designers access for additional information and download baseline design kits for Figma and Adobe XD?

  • Develop
  • Components
  • Design
  • Resources

6. How does a robust design system support a designer's day-to-day work?

  • Design systems create consistent guidelines for colors and images that help with brand recognition.
  • Design systems are only useful to experienced designers, not to people new to the field.
  • Designs systems are scalable as an organization grows.
  • Design systems provide a strict guideline that never changes

Test your knowledge on working with design systems in Figma

7. You are creating an alternative design for an app using the Material Baseline Design Kit in Figma. You find a style for the navigation bar you’d like to add to the app. You copy the selected style from the _____ page and paste it to the new page.

  • Material Theme
  • Cover
  • Sticker Sheet
  • Getting Started

8. A designer begins a new project by reviewing the elevation section in the Material Baseline Design Kit in Figma. Which of the following design features should they apply a higher elevation to? Select all that apply.

  • Page background
  • Alerts
  • Buttons
  • Navigation

9. Including a design system in your case study showcases the creative and strategic design choices you’ve made while enriching your portfolio for future job opportunities.

  • True
  • False

Weekly challenge 3: Explore design systems

10. What is a design system?

  • Guidelines established by company management that designers and developers need to adhere to.
  • Existing wireframes that a designer can use to jumpstart a new product.
  • The code a developer uses to write a product that a UX designer has created.
  • A series of reusable elements and guidelines that allow teams to design and develop a product following predetermined standards.

11. Consider the following scenario:

Gabriel is a designer at a small company. Gabriel's team gets a request for a project with a tight deadline. Using the design system, the team delivers a product design that impresses the management team and is delivered on time.

What is the result of implementing a design system?

  • Implemented an approach for managing the client
  • Established consistency
  • Scaled the product
  • Saved time

12. Identify reasons a designer might want to use a sticker sheet during the design process. Select all that apply.

  • Help designers avoid making errors or creating inconsistencies in their designs
  • Generate scaled versions of the components that were created
  • Create a convenient, easy to print sheet to show to other designers
  • Organize components and elements in a central area for convenience, reusability, and efficiency

13. A design system can be useful to many people in the company. Which of the following groups are likely to use a design system? Select all that apply.

  • Content writers
  • Developers
  • Designers
  • Users

14. What are some elements that frequently make up a design system? Select all that apply.

  • Animation
  • Iconography
  • Wireframes
  • Typography

15. Fill in the blank: If a design team is working on multiple projects all at the same time, a design system creates _____ and helps the design team align.

  • consistency
  • user interest
  • scalabilityuser
  • conversions

16. In the Material Design system, are the icons in the Material Icon Library available for anyone to use in their designs?

  • Yes, they are open source and free to use
  • No, they are for educational purposes only
  • Maybe, it depends on the number of icons required

17. At what point of the design process is a sticker sheet useful?

  • Before any design decisions like color palette or typography are made
  • During the user research phase
  • When designers are working on mockups
  • Once final designs are completed and delivered

18. A designer needs to change all the buttons in a design to have rounded corners. What is the fastest way for them to make this update?

  • Go through the designs and update each button individually.
  • Pass the task on to the developer, since the change needs to be made on so many buttons.
  • Select all the artboards at once and adjust the corners with everything selected.
  • Update all the button instances by updating the main button on the sticker sheet.

19. Fill in the blank: A component is made up of _____ like text color and shape.

  • stickers
  • elements
  • pieces
  • UI

20. Which feature in Material Design communicates a change in a component?

  • States
  • Statuses
  • Elevations
  • Themes

21. A brand establishes a design system to quickly iterate across teams. Which section of a design system outlines the specifications for modules and templates?

  • UI patterns
  • Visual style
  • Support code
  • Guidelines

22. What are some key benefits of using a design system? Select all that apply.

  • Saves time and money by increasing efficiency
  • Identifies gaps in competitor designs
  • Incorporates user’s feedback early
  • Reinforces a company’s brand identity

23. Sticker sheets are a collection of elements and components that make up part of the design system.

  • True
  • False

24. Which of the following statements are true about a company's design system?

  • It is where all the high-fidelity prototypes are saved.
  • It should not be shared with anyone but the UX designers.
  • It is a user-facing guide that provides the brand’s mission and values.
  • It can be used by multiple teams including designers and developers.

25. Imagine a designer joins a new company and needs to review the elements, components, and modules that designers use in their digital products. Which design system component should the designer consider to learn these rules?

  • Visual styles
  • UI patterns
  • Developer codes
  • Guidelines

26. In what way should a new designer on a team use the company’s design system? Select all that apply.

  • To ensure their designs are consistent with the company’s brand
  • To use as a starting point from which they can experiment with different colors or fonts not included in the design system
  • To learn about why certain brand colors were chosen over others
  • To familiarize themselves with the brand’s color palette and easily apply them to their designs

27. Beyond offering visual elements to copy and paste, what else might an open-source design system provide? Select all that apply.

  • Links to outside resources like downloadable fonts and icons
  • A library of every color palette that passes WCAG accessibility standards
  • Guides on how to use the design elements effectively
  • A guide for typical user flows

28. Grouped items in a design tool are basically a what?

  • Mockup
  • Component
  • Sticker
  • Element

29. To let a user know that a component has been changed, which feature of Material Design should you use?

  • Navigation
  • State
  • Status
  • Elevation

30. A team is assembling reusable elements and guidelines to be used for a product that follows agreed upon standards. Is this a design system?

  • Yes, these elements help align the team and increase efficiency.
  • No, a design system is exclusively the reusable elements.
  • Maybe, it depends on how the team decides to use it.

31. What are some key benefits of using a design system? Select all that apply.

  • Allows teams to scale and update designs
  • Creates consistency for designers and users
  • Helps designers and developers work together more effectively
  • Identifies gaps in competitor designs

32. Which of the following is a collection of elements and components that make up part of the design system?

  • UI sheet
  • Sticker sheet
  • Mockup
  • Sticker collection

33. A designer shared the company’s design system with the development team. What can the developers use the design system for?

  • To find a written list of design changes that were implemented
  • To document all the code needed for the product
  • To list design errors for the design team to address
  • To find the code to create elements or components included in the design system

34. Which of the following describes an open-source design system?

  • It is a guide on how to create the best prototypes
  • It is a public design system that can be used by any team of designers to create different mobile apps and websites.
  • It is a collection of research insights to help inform designs.
  • It is a guide for users to understand the reasoning behind design choices.

35. Fill in the blank: Sticker sheets are useful in a design system because _____.

  • designers can develop elements and components from scratch
  • designers can create each instance of a component
  • designers can apply their individual style when working with other designers
  • designers can work faster and avoid rework

36. Is a component made up of elements?

  • Yes, a component will generally have multiple elements.
  • No, an element is made up of many components.
  • Maybe, a component and an element can have many different parts.

37. To add layer and depth to your interface, which feature of Material Design should you use?

  • Elevation
  • Navigation
  • Style guide
  • Cover

38. Which of the following is a series of reusable elements and guidelines that allow teams to design and develop a product following predetermined standards?

  • A design system
  • Support code
  • Visual style
  • Wireframes and prototypes

39. Consider the following scenario:

Gabriel is a designer working on a client’s design project. Gabriel is new to the team and is working with a developer who is also new to the company. When discussing the project, both Gabriel and the developer are able to reference the company’s design system.

What is the result of implementing a design system?

  • Helped designers and developers work together more effectively
  • Implemented an outline for managing the project
  • Scaled the product
  • Reinforced the engineering team’s ideas for the project

40. A design team is hiring an additional designer to help manage the increased workload. What is the best resource they can share to help them understand the brand’s visual design elements?

  • The company’s writing style guide
  • The lead designer’s portfolio
  • The company website’s About page
  • The company’s design system

41. Fill in the blank: Resources in a design system contain helpful tools like _____ to help designers build designs quickly and learn how to use elements effectively. Select all that apply.

  • downloadable icons and fonts
  • type scale generator
  • baseline design kits
  • prototype templates

42. What is a sticker sheet?

  • Components provided by large companies like Google and Shopify
  • Inspirational designs that a designer can reference while making new designs
  • A collection of elements and components that make up part of the design system
  • Anything that is downloaded and added to an existing mockup

43. Fill in the blank: If a startup’s team is growing rapidly, a design system promotes _____ and helps the design team maintain performance levels.

  • scalability
  • user conversion
  • profitability
  • company values

44. What components can be used in a sticker sheet? Select all that apply.

  • Icons
  • Colors
  • Sound clips
  • Buttons

45. Fill in the blank: To communicate the status of a component to the user, you should change the _____.

  • size
  • color
  • alignment
  • state

46. A team needs different sections of a design to remain consistent throughout the duration of the project. A good way to do this would be to create a design system.

  • True
  • False

47. Consider the following scenario:

Gabriel is a designer at a branding consultancy. Gabriel's team successfully implements a design system, and delivers a product design that impresses their clients at a rapidly-growing startup. The clients are so happy, in fact, that they immediately want to expand the product line by iterating on the design.

What is the result of implementing a design system?

  • Established consistency
  • Scaled the product
  • Saved time and money
  • Implemented an approach for managing the client

48. Fill in the blank: A _____ is a collection of elements and components that make up part of the design system.

  • wireframe
  • theme sheet
  • material design
  • sticker sheet

49. Which of the following are commonly included in a design system? Select all that apply.

  • Layouts
  • Color
  • Prototypes
  • Competitors

50. In an open-source design system like Material Design, what tools can designers use to customize the visual aspects of a design? Select all that apply.

  • Material theming
  • Color tool
  • Develop page
  • Icon library

51. When a designer makes a change to a component in a sticker sheet, what happens to each instance of that component?

  • They get deleted.
  • They revert to the original version.
  • They get updated according to the same change.
  • They remain the same.

52. Fill in the blank: To make a feature more visible to the user, you should _____ the elevation.

  • decrease
  • align bottom
  • align top
  • increase

53. Fill in the blank: If a team is working with tight deadlines, a design system increases _____ and helps the design get everything done.

  • profitability
  • efficiency
  • user conversions
  • likability

54. How does adding components to a sticker sheet help a designer save time and energy? Select all that apply.

  • A sticker sheet allows a designer to make changes on all the instances tied to the main component at once.
  • A sticker sheet provides full prototype flows including exact interactions and animations for each action.
  • A sticker sheet allows a designer to easily copy and paste the component into new designs.
  • A sticker sheet includes the different states of a component for a designer to use.

55. A designer wants to develop design components for a new project but needs to start quickly. How can an existing design system assist the designer? Select all that apply.

  • The designer can use some of the components from an existing design system and adjust elements to match the product’s branding.
  • The designer can ask developers to code components from common design systems used in similar projects.
  • The designer can start their own design system from scratch.
  • The designer can mix their own components with components gathered from a design system.

Leave a Reply