All bites
The whole library, newest first. Filter by what you are here for, or pick a topic if you already know.
8668 bites
Page 111
What is the accessibility problem with color-only status and two fixes?
This tests WCAG 1.4.1 Use of Color: red-green status is invisible to many colorblind users. A strong answer names two non-color cues like icons or text labels. A red flag is claiming high contrast alone fixes the problem without a secondary visual indicator.
How do you migrate a breaking change in a mature design system?
This tests organizational change management at scale, not just code changes. A strong answer covers SemVer major versioning, beta testing with key consumers, phased deprecation timelines, and automated file audits.
How do you handle versioning and breaking changes in a shared library?
This tests bridging design and engineering workflows. A strong answer covers semantic versioning, a protected main file with branching, a visible changelog, and release alignment with code.
Steps to publish color and text styles to a Figma shared library
Open Publish in the right panel, select color and text styles, add a version note, publish; teammates enable the library.
How would you prototype fixed header, footer, and scrollable content?
Make content taller than frame, enable Clip content and vertical overflow, then fix header and footer.
Build a reusable checkbox with unchecked, checked, and hover states
Tests Figma interactive components. Answer: create a component set with unchecked, checked, and hover variants; wire them with Change to actions using On click and While hovering triggers.
Explain Figma Smart Animate's core principle and layer matching requirements
Tests Figma's layer-matching logic for prototyping. Great answers cover: name-based matching between frames, compatible layer types, and interpolated properties like position and size.
Make a Figma button navigate from Frame A to Frame B
Tests hands-on Figma prototype workflow. Good answer: enter Prototype mode, select the Login button, drag the interaction noodle to Frame B, set trigger to On Click and action to Navigate To.
Super button versus composition: discuss trade-offs and scalability
Tests combinatorial explosion and API trade-offs in design systems. Contrast the super button's exponential growth with composition's explicit APIs and linear scalability, noting governance needs. Red flag: absolutism or ignoring type safety and tree-shaking.
What is the most efficient way to update a brand color globally?
This tests Figma variables versus styles for design system maintenance. Store the brand color as a variable, apply it across components, and edit the value once for global propagation. Red flag: manual updates or using a color style for a single raw value.
Create a button component with default, hover, and disabled variants
This tests Figma component variants and prototyping. A good answer: create a component set with a State property, build default, hover, and disabled variants, wire Change to with While hovering. Red flag: separate components instead of one variant set.
Build a responsive feature grid with nested Auto Layout and component properties
This tests nested Auto Layout fluency for responsive grids. Strong answer: vertical section frame with wrapping horizontal row, cards with 280 px min widths, and component properties to swap content. Red flag: duplicating static artboards per breakpoint.
Structure a responsive nav bar using variants and Auto Layout
One component set with desktop/mobile variants; horizontal Auto Layout with wrap for links, then hamburger and vertical overlay.
How would you configure a wrapping filter tag container and its properties?
This tests horizontal wrap vs grid and tuning container and child resizing. Set the container to horizontal auto layout with wrap, adjust spacing and padding, and set tags to hug contents. Red flag: confusing wrap with grid or suggesting manual breaks.
When would you use absolute position in an Auto Layout frame?
Absolute position lets badges float without pushing siblings; standard flow stacks sequentially and prevents overlap.
How do Hug, Fill, and Fixed resizing behaviors interact?
This tests constraint-based size propagation. Define Hug as shrink-wrapping, Fill as stretching to the parent, and Fixed as explicit; note a Hug parent expands for Fixed or Hug children, but Fill needs a defined parent size.
Difference between 'Space between' and fixed spacing in Auto Layout
Tests your grasp of distribution logic versus fixed gaps. Fixed spacing sets a constant pixel gap; Space between splits free space to push items to edges. Use fixed spacing for lists, Space between for wide toolbars. Red flag: calling them interchangeable.
How would you use Auto Layout for a button with optional icon?
This tests Figma Auto Layout for responsive components. Answer: apply horizontal auto layout, set fixed padding and spacing, set text to hug contents, and set the frame to hug so it resizes when text changes. Red flag: using fixed widths or manual resizing.
How would you structure Figma colors for light and dark themes?
Fluency with token layers and Figma's mode-aware raw values. Use aliased color variables for semantics, switch themes via variable modes, and apply variables to styles not relying on styles for modes. Suggesting styles handle theming instead of variables.
How do you pin a Close icon to a modal's top-right corner?
This tests Figma constraint knowledge for responsive resizing. A strong answer sets horizontal to Right and vertical to Top so the icon pins to the corner as the modal resizes.