Introduction

Rawson is a framework for Sketch, based on Nested Symbols. With it, you can design iOS apps, modify them and create amazing prototypes and designs in no time.

Rawson Framework offers a number of basic iOS elements like Navigation bars, Table cells and other elements from Apple Human Guidelines that allows you to easily edit the contents and piece the interface elements together — just like a LEGO set.

Basic principles

As a framework, Rawson was built for prototyping and design in Sketch. In this section you will find a few tips on how to easily begin working with this framework.

Adaptability

We have put a lot of effort to make each Symbol adaptable. Their size can be changed according to your needs. So you can use the same symbols for different screen sizes, which makes creating prototypes and app designs very easy, because all elements can be scaled without any artifacts.

The same symbol in different sizes.

Symbols

The Symbols section includes several categories:

Elements — main UI elements from Apple Human Guidelines.
Controls — they are not often used but can be found within all Symbols from Elements page.
Assets — Shared Styles, Color Scheme, Text Styles and Glyphs. Used across all Symbols.

You can add your own elements to any Symbol. All you need is to follow three easy steps: find a similar Symbol → duplicate it → replace its contents.

Steps to edit Nested Symbol.

That’s it! The new Symbol for corresponding elements will be available immediately.

Styles

Every element in framework has “Shared” style, as a symbol. To ease your navigation, all the styles are grouped together on the same page. To add a new style, follow the prompts from previous section: find → duplicate → replace.

Steps to edit Styles.

The new style for corresponding elements will be applied immediately.

Color scheme

Rawson Framework uses three types of color in its color scheme:

Global — basic color used in all symbols.
Basic — сolor gradation from black to white.
Secondary — additional colors, which may be useful in the process.

To change any color, just choose a layer within the Symbol and specify its color. Changes will apply to all the symbols containing this color.

Steps to edit Color scheme.

Fonts

Rawson Framework uses San Francisco UI Font. It is the system font in iOS and macOS. Every font layer has a Text Style. For control, fonts are found on the Assets page. To change a font or its color, select the layer, change parameters and replace the parameters of Shared Styles.

Changing the font colors. Psst… we are working on automation of this process!