Design Documentation

Content

General info

Here we are going to start our journey to better design/draft/elements organisation. And probably it will may transform to design documentation, guidelines.

The first step is to organise Figma styles and drafts:

  1. The structure of pages in Figma, group together, bring library items to the top. Anton Poliakov

  2. Consider moving the library to a separate file to prevent components from getting disrupted.

  3. Organise the styles:

    1. Colours (already in collections, old ones can be deleted), Anton Poliakov

    2. Typography: Anton Poliakov

      1. Mobile,

      2. Desktop,

    3. Effects, Olexandr Tikan

    4. Grids (keep the actual ones), Olexandr Tikan

    5. Order in the pages, (Together, we will divide)

      1. Horizontally, flow or states

      2. Vertically, different pages, features, etc.

      3. Maintain the uniqueness of the pages.

      4. Elements that change are taken out and shown separately in the section.

    6. Naming of layouts

      1. Project Name / Section / State / Index (optional)

      2. Project Name / Element Name / State / Index (optional)

Defaults

  1. Ширина макета 1440 px для десктопа.

  2. Сітка 10-колоночна сітка з відступами 20 px.

OOD

  1. https://docs.google.com/spreadsheets/d/1ah-EmJ2sglKNSrqS46bnuDMUbdvTVFDfkr_ngbGV1Rw/edit?gid=0#gid=0
    Components data, states, actions and roles.

Comments

Leave a Reply