Skip to content

A figma version of the GOVUK Design System based flow diagram developed by the GOVDesign community. Updated periodically inline with major GOVUK Design System changes

License

Notifications You must be signed in to change notification settings

paulmsmith/govuk-designsystem-flow-diagram-figma

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

18 Commits
 
 
 
 
 
 

Repository files navigation

GOV.UK Design System Flow Diagrams for Figma.

A resource to help teams show the interaction design of services.

How to get your copy of the Figma file

You create a copy of this Figma file by either:

What is it?

Screenshot of the Figma file

For a detailed introduction to this resource you can read my blog post: GOV.UK Design System Flow Diagrams for Figma.


How to use

  1. Once you have created a copy of the Figma file, rename it and create a new 'page' within Figma.

  2. Draw a frame for your flow diagram (You can resize later if you need more space).

  3. Open the 'resources' menu (SHIFT + I)

    2023-01-17 at 11 44 31

  4. Choose 'Flow components'

  5. Then choose a component to add to your frame. Clicking it will add it.

    2023-01-17 at 11 43 02

  6. Finally you can change the content of the component by finding the component property inspector panel (typically on the right side of your Figma window).

    2023-01-05 at 21 19 26

Changing the 'Page type' will show or hide properties you can change.

Repeat this process for other components and use the arrow component to connect them.


This is a community resource - The GOV.UK Design System team are not responsible for this resource and they cannot support you with using it.

If you have questions or need support you can add an issue to this repository and I will respond as soon as I can.


About

A figma version of the GOVUK Design System based flow diagram developed by the GOVDesign community. Updated periodically inline with major GOVUK Design System changes

Resources

License

Stars

Watchers

Forks