How to use Backpack and its Figma folders.
These are styles native to Figma. Typography, Colours, Effects (layer styles). As Figma improves these options, we will too.
This file is home to anything built in Figma, and anything which exists in code in old Backpack Site. These are alphabetically ordered.
These are components ready for designers to use which don't have a code counterpart. Beta components will eventually move to the main Backpack components library.
When a component is deprecated, it goes to the Graveyard. We add a 👻 symbol to the component name and suggest an alternative component in its description. This is reviewed bi-annually until components are permanently deleted.
We have lots of icons, so these live in their own library. 16px and 24px versions are available.
These are a collection of Android and IOS keyboards, nav bars and status bars; basically anything that is native to these platforms.
In the annotation file there are a handy collection of accessibility markup tools, dimensions indicators, labels, notes, pointers, and anything else you might need to put information on your work in a nicely organised way.
🌛 Night mode colours
This is a dedicated library for designing with Night Mode Colours.
⚡️ Agreed Patterns
A collection of 🎒 Bpk Components and/or 🎒 Bpk Tokens arranged together into a design.
If a pattern is made agnostic of all verticals, it could easily become a 🎒 Bpk Component. See our Card List or Snippet as good examples.
👴🏻 Legacy Patterns
Anything that pre-dates Agreed Patterns lives here. You can find all the old Inventory Cards or Search Controls in this library.
For those that don’t know, SAM stands for Skyscanner Ads Manager. This dedicated library is for designing with SAM Components. These aren’t in Backpack.
This is a constantly evolving workspace. It gives our team greater visibility of the initiatives which are currently being worked on. If work exists elsewhere, it makes sense to move it here.
We expect workshop files to be large, and they may contain many sub-pages.
This also acts as a ‘work-in-progress’ space for preparing components before they go into Bpk Beta. We leave all pages and discussions in these files for future reference.
Anything we publish into Bpk Beta or Bpk Components files will still have a workshop file. This is then moved into the archive.