Skip to main content
Version: 2.8

What is DRAW?

DRAW is Olympe’s development environment and it represents the entry point to build projects.

Real-time and collaborative

Applications designed in DRAW can be tested real-time while being designed. At any time it is possible to open an App from a local or remote device to test it and see new functionalities appearing in real time without need to reinstall or reload, thanks to Olympe Runtime Agent.


At its core level, DRAW is a tool to assemble bricks that represent any functionality (e.g. mathematic operation, Visual Component, data model) used to build applications and services. DRAW is therefore a visual programming IDE, and it provides the same functionalities as a traditional IDE such as VS Code or WebStorm:

  • Creating and editing bricks
  • Refactoring
  • Search
  • Find the usage of bricks
  • Documentation
  • Build
  • ...


DRAW generates data, not code. Project, apps, screens, functions defined in DRAW are stored as data, introducing the Software-as-Data notion. The Olympe Virtual Machine interprets these data and transforms them into a running application. It is possible to extend DRAW capabilities using Olympe CODE, a JavaScript framework.

Editors and sub-editors

DRAW’s interface is organized into editors and sub-editors, each has specific capabilities and different Marketplace items.

Editors are a way to edit objects created in DRAW. Each type of object has only one editor. The same editor can be used to edit different types of objects.

Sub-editors are sub-parts of the editors. All editors always have at least one sub-editor. They provide a way to specific parts of an object or the whole object if there's just one sub-editor.


ActionSpecific function executed when an event occurs.
Advanced modeAllows to hide some UI functionalities and experimental bricks.
BrickFunctionality (e.g. mathematic operation, UI component, data model) used in DRAW to build applications, services or other bricks.
CODEJavaScript framework to create bricks with code to be used in DRAW.
Coded brickBrick created with CODE in Javascript used in DRAW.
ConstructorGenerated action to create an instance of a Business Model, define its attributes and persists it in Olympe database.
ControlFlowType to represent a pulse which triggers the execution of an Action.
Data ModelRepresents business objects and their relations into an application. Composed of Business models.
Static Data FolderSet of static Data Type instances with their relations and properties.
DRAWVisual editor tool used to build applications.
EditorInterface to edit objects.
EnumsTechnical object type with a set of possible pre-defined values attached to it.
FolderContainer to organize content inside a Project.
FunctionUI or Business logic made of sub-function calls.
GetterGenerated function which provides access to the attributes (properties and relations) of a Business Model.
Runtime DataAll the instances of a Data Type created within an application at runtime.
Home ScreenMain screen used in the UI App.
MarketplacePlace where bricks are available in DRAW.
Material UIOpen-source Library that features React components.
Media LibraryAssets collections (fonts, images).
OVMOlympe Virtual Machine developed by Olympe which interprets software-as-data in real-time and transforms it into running programs.
ProjectContainer with apps, data models, interfaces, folders, business data.
Remote ActionActions running on the backend and they are used explicitly within Actions.
Safe modeReload the UI Editor to recover broken projects without rendering any broken data.
Software-as-DataData generated by DRAW stored as database objects, not code.
ServiceA function that runs inside a headless application.
Service AppApplication which only runs logic.
SetterGenerated action to set the attributes of a Business Model.
Sub-editorSub-part of an Editor.
UI ApplicationApplication which has a user interface.
UI ScreenScreen or Sub-Screen of an application that can be added to a ScreenFlow.
Visual ComponentContent added to a Screen.