Tools Section
Left Hand Side Panel Of Blup

Tools Section

This section consists of all the tools are required to build actual UI, SO let's go over each tool one by one to understand them

Selector Cursor

This button will help you to convert your normal cursor into a selector cursor which as the name suggests will help you to select things or widgets o the mobile screen or pages. using these tools is quite easy.
There is also a shortcut available in blup to directly convert any cursor back to the selector cursor by simply pressing the “V” key.

Rectangle Toggle

This toggle is one of the most widely used toggle which is used for creating rectangular shapes on the mobile canvas or pages.
Also if you hover above the button you can see little a GIF showing all the functionality that can be achieved by using a rectangle toggle.
As soon as you click on the button and move your cursor to designer areas, you can see that your cursor changes into a cross cursor which helps you draw rectangular shapes on the screen. This functionality is quite similar to other designers tools that are available in the market. Some common properties can be directly applied to rectangle present on the page or mobile screen like increasing the width and height or changing the corner radius, but if you need some more properties to play with you can see the rectangle and go to the properties panel.
Blup has tight integration with windows OS you any image gifs videos that are present in your file explorer can be directly dragged and dropped into a rectangle.

Text Toggle

this toggle button helps you create a text/input box.
Text – text is used to show information to the user
Input box - Input box are also called text fields and are used to receive information or data from users like email id and passwords for login into your apps.
And Similar to rectangle toggle if you hover above the text toggle also you can see and little gifs playing at the bottom of blup which shows you all the features that are present in the text Toggle.
As soon as you click on the text toggle and move your cursor to the designer you can see that your cursor has been changed into the text cursor which means that you can click on anywhere in the pages or mobile canvas you can start typing the information this is also same as typing used by other designers.
If you want to increase the size of the text you have to first convert your cursor from text or I to selector cursor which can be done by either pressing the “V” key or select the selector cursor from the tools option and then select the text on which you wanted to increase the size and then stretch the bottom of the cell you can see the size increasing in realtime.
If you wanted to add several other properties to the text you can go to the properties panel on the right-hand side.
If you wanted to convert this text to input text [where] users can put the data you can go to properties search for a check box called is a text field, as soon as you check this checked box your text is converted into an input box where users can now input data or information.

BlupSheet Button

Blup sheet is a database built from ground zero to work perfectly blup, it is built on the top of Amazon web services so all the data that is stored in the blupsheet is highly available and highly secured.
Blup sheet is similar to the traditional database that er based on SQL ie based on the table [rows and columns] and similar to these traditional Db In blupsheet also data is stored in the form of rows and columns.
As soon as you click on the blupsheet button it will open up a panel from the bottom blup where you can define the manually or you can see the blupsheet node to dynamically store data into the database.

Widget library

Widget library helps you with all the widgets that cant be built using just rectangle and text for example radio button or checkbox or progress indicator or progress wheel
To use any widget that is available in the widget library just choose the widget that you wanted to use and just drag and drop it onto to page or mobile screen where you wanted to put it, and similar to another widget to see the properties you can check out the properties panel in the left-hand side.
Widget Libray is divide into three major parts

Pre-built widget

This widget that is available in his panel is built by the blup team to support the ease of building the UI.
Inside this widget library section, you can find all most all the standards like radio box, checkbox and other widgets are core parts to build apps for mobile.

Global Widget

This is one of the best features of blup [community feature] if you have built something useful that you can be used by other community members, so you can put that particular widget into the global widget library from here it can be seen by anyone who is using the blup.
To pot widget inside the global widget, it needs to follow some standard rules or pass some criteria like whatever you build should be easy to use and something that is solving some kind of problem or adding value to any user who is using it.
These global widgets are available blup wide which means that these can be used in multiple projects and all the widgets present inside the global widget library are available to all the blup users.
And similar to another widget present in the library To use any widget just drag and drop the widget on mobile canvas or pages.

Local widgets

This section of widget library consists of all the widget that is created by you, these types of the widget are very helpful when your project is quite big and there are multiple components involved in the build that project, so Suppose you have a widget that you have to build on Home page which is again required on some other page, so instead of creating that widget again and again what you can do is that save this widget into the local widget library and use this widget at any page by just drag and drop.
A widget that is present in the local widget library is only available at the project widget. This means that this section is different for different projects.

Blup Lightning Button

This button helps you to open up the blup lightning panel where you can add logic to your UI.
To read more about blup lighting visit its documentation.

Layers and Pages

Simple Overview of Layer and Pages Section


Blup follows a layering system which means that each widget that you created with the help of blup are created in form of a layer and these layers are stacked one over another to form a widget. Each page or mobile canvas has its own set of layers that can be seen in this section. Whatever page you have currently selected in the designer you have been shown the layer of that page.
If you wanted to see the layer of Other Page you can just click on that page name in designer or you can use the pages tab inside thin section juts select the page and then go to layer again you will find all the layer related tp that page. Layers are useful when you are creating something on top of one another widget in the designer. In some cases, you wanted to place the top widget at the bottom and the bottom widget at the top this type of functionality can be easily achieved by layers. If you wanted to change the order of layer just select the layer and just drag and drop to a position where you wanted to keep it. For example, if you wanted to keep a widget associated with the layer at top of all widgets then just drop the layer on top.


The pages section gives you useful information about all the pages that you are having in your project, you can also create new pages or mobile screens from here also and it also helps you to select the layer of that particular page.

Help - Blup Community

We have a community’s exclusively for the blup so if you wanted some help or wanted to interact with other community members or wanted to know what people are building with the help of blup you can click on this button it will take you to the community website of blup.

Feature Request/ Ideas for something unique

If you wanted to request a feature or you have something like an idea or something other functionality you can go to the community and click on request feature where you can add the request for the feature you want us to add in blup.

Music to go with.

Lofi music