Standard Life File Structure

An overview of how Figma's components are set up for Standard Life


This document outlines how Figma's libraries have been set up for the designers working on the Standard Life Brand.

The diagram below outlines how the foundational files are the smaller parts that are then shared by the platform specific component libraries.

In the case of Standard Life's web platform there are two smaller child libraries. The Public Site and Dash libraries build on the web components specific to their applications needs.

Figma Library Structure

Figma Library Structure

Single v Multiple Component files

The Web Components are separated into their own Figma files to make them more manageable by a wider team. By separating the files it is easier to branch and ideate on a components file independently.

As the native libraries are a customisation of the Ionic Framework and the Child libraries are tied to the web components, they are less likely to change. Therefor it is more managable to keep these in a single file, with a component per page.

Web Component Figma Files

Web Component Figma Files

Each web component is separated into it's own Figma file