Creating your First Experience

Welcome to Fastr Frontend! This article covers the basics of creating your very first page and experience in Fastr Frontend. If you haven't gotten logged in yet, please refer to the following article: Getting logged in

Once you are logged in, you can follow these steps to get started:

Add a new Page

As a first step, select the "Add New Page" button. This sets up your first page, and also creates your very first content slot. For more information about how pages and content slots work, you can review the Fastr Frontend overview article

The next step is clicking the "New Experience" button to open the Frontend Visual Designer:

Creating a Board

The Frontend Visual Designer is the area where you build and design all of your content. There are many other articles in this community that cover the specifics of the designer, but for this article we will just build and preview a basic example. For extended detail, please review the following overview article: Frontend Visual Designer: Overview

The first step is adding a board, which is highlighted in the following screenshot. Once you click on the "Board" widget, drag the cursor on the canvas to create a white square. Please note - in order to preview and publish any experience, you must have a board on your canvas.

This board is the container for your final experience, so you'll want to make sure the aspect ratio is set up correctly. In the following example, you can see that this board has a vertical shape, which would work well for a mobile experience. Keep the shape of your board in mind as you design your experiences!

Add a Text Widget

When you design content, the typical flow starts with selecting a widget on the left-hand side. For this example, click on the Text widget, which is highlighted in the screenshot below.


Just like the board widget, click an area on the canvas to place the text widget. Once you have placed the widget, you can type to add text. The "Design Tab" can then be used to style it. This tab is on the right-hand side of the canvas, as shown in the following screenshot. For the text widget, the Design Tab displays options for changing the font, font size, and other elements.

Preview Your Experience

Feel free to experiment with the other widget types besides text. You'll notice that as you use different widgets, the Design tab shows different options. For full information on the widget types available, review the following article: Widget Types

Once you've finished trying the different widget types, click this option in the top right corner to preview your experience:



Congratulations — you've just created your first experience in Fastr Frontend. To keep learning, review the article covering How to publish an Experience

Have any questions? Email support@getfastr.com