We’re excited to announce Version 2.7 of the Digital Design System has been released!
Get access to the latest patterns via the Design System Figma UI Kit, or access the compiled design system assets (HTML, CSS, JavaScript) in the HTML Starter Kit.
If you’re new to Figma, we’ve also gathered some useful guides and video tutorials to help get you set up. You can also join and register for updates via our Figma Library community category for updates to stay up-to-date with all the latest patterns releases.
The most exciting update is the move from Sketch to Figma, but we’ve also incorporated a few style and spacing updates for consistency. A full log of changes is available in the Figma document and on Github, but we’ve dived deeper into the 4 core updates below.
- Migration to Figma
As a browser-based application, Figma is available on both Mac and PC and doesn’t require upgrades to the latest version. The simplicity of the tool helps you design and prototype faster, and act as a communication tool between designers, developers and content designers to work closer for better collaboration. Figma lets you share files and collaborate in real-time with your team and stakeholders so you can design, co-edit, get feedback in context and provide code snippets all from the one file.
2. Increased line heights
Content heavy sites such as ours need to serve content in an easy to digest and engaging way. By increasing the line heights of headings and paragraphs we are looking to reduce the cognitive load, give text breathing space and improve readability.
3. Increased grid margins and gutters
We’ve been fortunate to have some expert feedback on the Design System in practice, which has helped identify where small adjustments can make a big difference. By increasing the grid margins and gutters we’re improving the readability of content and creating a clearer visually structured interface. This update increases the space between elements making it easier for users to scan and quickly absorb content.
4. Aligned pattern spacing and icons to an 8px grid
Through aligning our pattern spacing and icons to an 8px grid we bring it in line with the grid margins and gutters to deliver consistent scalable UI elements and a clear visual hierarchy. It will also ensure new patterns are designed and developed to a consistent user experience.
New to Figma?
Find out more about how Figma can support your team and sign up for free Starter Account.