Figma
- •
What it is
- •
a collaborative interface design tool, used to build a design system, lay out screens, and prototype interactive flows
- •
- •
Design system building blocks
- •
colors and components are typically defined first, as reusable building blocks, before any actual page/screen is laid out
- •
- •
Auto Layout
- •
Figma's responsive layout mechanism — conceptually equivalent to CSS Flexbox, automatically arranging and resizing elements within a container based on defined rules (direction, spacing, alignment)
- •
- •
Prototyping / flow
- •
interactions are defined on top of the static design to simulate a working app: an action can pop up an overlay, switch to a different page, or switch to a different overlay
- •
- •
Related