# Graphical design

The edit mode includes a graphical interface for the design of screens (graphical design). It complements the commands in the command line. A screen structure has to be set in the command line editor prior to entering the graphical editor and stimuli have to be inserted on each screen. After having inserted the screens structure, the graphical editor can be opened by clicking on the 'Graphical layout' tab above the command edit window.&#x20;

<figure><img src="https://2143517831-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MVVb3lkOLjHktj-ZU3x%2Fuploads%2FJMlWSMaYoElpWe8ea2Tq%2F2.png?alt=media&#x26;token=3f006d81-8eb0-41bd-803b-edab67247990" alt=""><figcaption><p>A screenshot of the graphical design tab</p></figcaption></figure>

The graphical editor uses a graphical interface of the GrapeJs library. The workflow for working with the graphical editor is composed of individual consecutive steps overviwed in the followng paragraphs.&#x20;
