UI design with Figma
Designing interfaces in Figma as components and prototypes gives sign-off and development one shared basis.
Background
Figma is the standard tool for UI design. Everyone involved works in the same file in the browser and sees the latest version at any time.
Prototypes before development
Clickable prototypes show how an application feels before any code is written. Flows can be tested with users, and weak points surface while changes are still cheap. Shared by link, they let people without Figma access give feedback too.
Working with components
Components with variants: buttons, forms and cards in all their states.
Auto layout: elements adapt to content and screen width.
Variables: colours, spacing and typography as design tokens, including dark mode.
Libraries: shared components across several projects or brands.
Handover to development
In Dev Mode, developers take measurements, tokens and assets straight from the file. Our designers and developers work in the same team, so the Figma components match those in code. The Figma files remain the basis for later extensions.