Design Studio
Last updated
Last updated
The Design Studio is where you can create, and edit designs.
It is made up of a number of components:
Top Menu where you can set the design name, save the design, load another, or download it.
The Toolbar where you can undo, redo, and apply various modifications to the elements you have added to your page.
The section list on the left hand side. Clicking on each section will open the corresponding section drawer.
The workspace, which is where you have a page, and can work on your design.
The toolbar will dynamically change behavior depending on the type of element that you have selected. We aren't going to enumerate all of them, but wanted to share a few examples.
When editing text, this will let you set color, font, justification, styling, line spacing, and effects.
When selecting multiple elements at once, it will allow you to group them into one element making future manipulation easier.
You can lock objects so that they can't be edited, this makes it easier to work with complex designs.
Photos can have effects added to them, cropped, or made to fit the page.
The Design Studio has seven sections and we document them below.
The Background section allows you to search for, and drag in backgrounds from Unsplash, or set the background color using a color picker. Please note that transparent backgrounds are supported when downloading designs in PNG or JPG. Please note that when adding backgrounds from Unsplash, the design file will store a URL to the original image, not the image itself. This means if Unsplash removes the image, your design may be broken. We're working to find an alternative solution to this.
The Text section offers some premade font and layout combinations to help you get started. From there, you can customize things further using the options in the Toolbar. If you have your own fonts, you can also upload those to be part of the design.
The Elements section has lines and shapes which you can drag into your design. We also have the ability to search for new elements, but are currently not able to add them to the page due to a behavior we're trying to get Atlassian to fix at https://community.developer.atlassian.com/t/using-a-data-uri-in-forge/78063/3. If you want this to work, we encourage you to contact Atlassian Support and ask them to make this change.
The Upload section will allow you to upload your own images which you can add to your design.
The Photos section will let you pull images from Unsplash. All images can be used for free. Please note that when adding photos from this section, the design file will store a URL to the original image, not the image itself. This means if Unsplash removes the image, your design may be broken. We're working to find an alternative solution to this.
The Layers section will allow you to re-order the elements on your page. You can also change the order of elements by clicking on the Position button in the Toolbar, or on the small tab that appears next to a selected element.
The resize section will allow you to change the size of a page to match common resolutions which users may want to use, or to enter your own. When resizing, we recommend you leave magic resize enabled as it will help align everything on the page to best suit the next resolution and aspect ratio.
You can set transparency on objects so that they're ... transparent