Nimbus 808 Design Editor Overview
The Nimbus808 design editor is a rather extensive and powerful editor for building digital signage content. But with that power comes a bit of complexity, so in this guide we’ll break down each part of the Nimbus808 design editor and go through the functionality of each part.
Canvas
The center of the editor window, this main section is a preview of the design you’re creating. You can pan vertically with the scroll wheel, and you can pan horizontally by scrolling while holding shift. This can alternatively be done by holding control while clicking and dragging the canvas. You can also zoom in and out by holding control and scrolling your mouse.
The rulers on each side of the canvas will show the position of the currently selected widget in your chosen units (either pixels or screen percentage).
Toolbar
The top bar of the editor contains settings that affect your design globally in various different ways.
Starting on the right side of the bar, there are various zooming and panning options available.
There are buttons to pan the canvas, or to reset the canvas back to center.
Then there’s various zoom functions. You can zoom in and out, set the zoom to 100% of the canvas, or zoom out to fit the canvas.
Next are some controls that apply to the currently selected widget.
These arrows will allow you to undo the last action, or re-do your last undo
These buttons will allow you to delete, copy, or paste the currently selected widget in the canvas.
Next there’s the Animation and settings pane.
In the center you have the “Preview all animations” button. when you press this it toggles all of the animations in your design.
The “Animate” button will open the animation pane focused on the widget you currently have selected. If you’d like more info on widget animations, check out our Animation Tool guide.
Then we have the “Editor settings” button. This will open up the “Editor settings” pane. If you’d like more information, check out our Guide on Project and Editor Settings.
Finally, we have some global settings that affect how the design is deployed or formatted.
Firstly, we have the “Assign to Displays” button, which will bring up a list of your registered displays. From here you can select which display(s) you’ll want to publish the current design to.
Whenever you make changes to your published design, the “publish changes” button will light up. Your design changes won’t be pushed to your display until you press this button to publish those changes.
In between those two buttons is the “settings” button, which will open up the design settings menu. For a more comprehensive guide of these settings, visit the Project and Editor Settings Guide
Widgets
The left sidebar is dedicated to all of the widgets you can add to your designs. To add a widget you’d drag and drop it from the sidebar into the canvas.
Text Widgets
Here you can add static text, rich text, a scrolling ticker, or a live date-time widget. For more information on these widgets, visit the Text Widgets Guide
Media Widgets
Just underneath the “Text” tab is the “Media” tab. From here you can add various media widgets.
You can add anything from regular images, a QR code, a weather widget, a slideshow of images, full video, or even various website or social media embeds.
For more information on specific widgets, check out our guide on media widgets
Shape Widgets
Next we have basic geometric shape widgets. You can add basic squares, circles, triangles, stars, or polygons, and have them either be fully colored, or outlines.
For more information, check out our guide on shape widgets.
Interactive Widgets
Finally, we have interactive widgets, like buttons and charts.
For more information, check out our guide on interactive widgets
Properties
The left-hand sidebar of the design editor is dedicated to all of the properties of the currently selected widget, as well as the z-axis layering of all your widgets.
These properties will vary based on each individual widget, but there are some properties that are similar across all widgets.
Selected Widget Properties
When you select a widget, the properties section will be populated with that particular widget’s properties. Each widget type will have different properties, but there are some properties that are shared between all widgets.
- Widget Name: A property that allows you to “name” your widget.
- Transform: This defines the positioning and sizing of the widget. There are also some presets to align the widget to the top, bottom, left, right, or center of the design
- Appearance: Allows you to set the opacity and rotation of the widget in the design.
- Animate: Opens the Animation tool and allows you to animate various properties of the widget. For more information, check out our Animation Tool Guide.
- Style: Allows you to add and set a background or border to the widget.
Layers Diagram
Underneath the properties sidebar is a diagram that shows the “z-axis stacking” of each widget. Which means that anything above another widget in this layer diagram, will also appear above that widget in the canvas. You’re able to drag and drop widgets between layers to customize the stacking of your widgets.
At the bottom are also buttons to group and un-group multiple widgets. This will allow you to move and edit multiple widgets at once.
For more information, check out these related guides:
