FOLIO library

Download FOLIO library

FOLIO library is a Sketch file with all the components needed to design a FOLIO app interface from scratch.

FOLIO Sketch library

Add the library

To be able to use the Library symbols, first, you need to add the library to Sketch.

image

Open preferences

Download the latest version of the FOLIO Pattern file to your desktop and go to “Sketch > Preferences “.

2

Open libraries

Open the libraries section. Select the latest version of the FOLIO Pattern library from your local drive.

3

Click “Add library”

Then you can select the Folio Pattern file from your local drive and install the library file to your library list.

Insert symbols

You can add symbols to your artboard to speed up your design process, and make sure your design adheres to the project standards.

4

Click “Insert”

The library symbols can now be found under the “Insert” section.

5

Select symbols

Open the “Symbols” tab to see the symbol groups.

6

Choose and place the symbol

Choose the symbol you want to use, and place it on your artboard.

Exchange symbols

You can easily change sibling symbols with the exchange symbols method.

16

Rights sidebar symbol dropdown menu

Select the symbol you want to change on the artboard, and click the dropdown in the right sidebar.

17

Exchange symbols

Choose a symbol among the sibling symbols related to the symbol you have selected on the artboard.

18

Fast switching

It’s easy to exchange the symbols used in your work with the symbols in the symbol library.

Overrides

Symbols content can easily be modified with the overrides method.

7

Overrides panel

When you select a Symbol instance that contains text or image layers nested within the symbol, the overrides panel will appear in the right pane bar.

8

Change the content

You are now able to edit content to match the purpose of your design vision.

9

Content updated

Once you select another item on the artboard, Sketch will update the content in the artboard for you.

Layer styles

Color of shapes can easily be modified with Layer Styles.

10

Layer style panel

Layer Styles are located on the right pane menu in the white box between the general layer and style properties in the Inspector.

11

Change style of layer

Select the layer you want to change and apply the style.

12

See the difference

Your selected shape has now been updated to match the layer style.

Text styles

Follow this 3 step procedure to change the text style of your text.

13

Text styles panel

You can access the text styles by clicking on the dropdown icon next to “No Text Style” in the right pane menu.

14

Change text style

Once you have selected the text, you can apply one of the text styles from the right pane.

15

Changing styles is easy

When you use the text style method, you are sure to comply with design standards.

Download FOLIO library

Suggest new features

FOLIO Sketch library is open to all! If you would like to suggest a feature/design asset, you can now do so via the link below.

Suggest a feature