When should you use Frames versus Groups in Figma?

WHAT THIS TESTS: The interviewer wants to know if you understand Figma's layout primitives at a structural level, not just surface-level UI familiarity. Senior product designers and design engineers are expected to choose the right primitive for responsive behavior, component architecture, and developer handoff. This question separates people who draw interfaces from people who build scalable systems.

A GOOD ANSWER COVERS: Four distinctions in order. First, Frames are layout containers with independent boundaries; Groups are transform wrappers that calculate a bounding box around children. Second, Frames support constraints and auto layout, which means child elements can pin to edges or stretch relative to the parent frame, while Groups ignore constraints entirely and only transform as a unit. Third, Frames can clip content, hiding anything that overflows their boundary, whereas Groups never clip children. Fourth, Frames can be nested as top-level artboards or components, while Groups are best for temporary bundling of static elements like icon sets or illustration layers before finalizing a frame structure.

COMMON WRONG ANSWERS: Saying Groups support constraints or responsive resizing. Claiming that Frames and Groups are interchangeable and that the choice is purely stylistic. Stating that Groups clip content. Another red flag is arguing that Groups are deprecated; they are not, but they serve a narrower purpose for bulk transforms and organization.

LIKELY FOLLOW-UPS: How does auto layout interact with nested Frames? When would you convert a Group to a Frame? How do constraints affect component variants? What happens to clipping when a Frame is rotated or has corner radius applied? The interviewer may also ask how your choice impacts CSS translation during developer handoff.

ONE CONCRETE EXAMPLE: Imagine a card component with an image, title, and button. The card itself must be a Frame because it needs auto layout for vertical spacing and corner radius that clips the image. The image inside sits in its own Frame with constraints set to left and right so it stretches with the card width. The title text uses constraints to pin left and right with a fixed top margin. If you grouped the title and button together as a Group to move them as a unit during exploration, that is fine, but you must convert that Group to a Frame before adding auto layout or constraints, because a Group would break responsive behavior when the parent card resizes.