How to Use the Shoutem App Builder

The following steps detail how to create a simple app using Shoutem, a user-friendly no-code app building platform.

1. Get Started

Visit the Shoutem website and locate the “Create Your App” button in the top right corner of the Shoutem website. Click on it to access the app builder.

2. Pick a Method of Creation

On the following screen, choose to use Shoutem Builder to build your app yourself, or Shoutem Pro to have your app built by Shoutem’s professional app development team. 

If you opt to have your app created for you with Shoutem Pro, you’ll schedule a free consultation to determine your app needs and create a specific plan. If you choose to build your app yourself, you’ll move on to the next step in the app creation process.

3. Select an App Template

Next, choose an app template from a range of preloaded options. These templates include screens and content that suit various app types, such as news apps, travel and tourism apps, and so many more. If you prefer to start from scratch, you can opt for a blank app template, found at the bottom of the page.

4. Choose App Style and Navigation

Once you’ve selected and confirmed your template, you’ll be prompted to pick a predefined style and navigation type for your app. Remember, you can customize these styles later from within the builder.

After confirming your choices, click on the “Create Your App” button. Your app will be generated, and you’ll be taken to the app builder interface.

5. Personalize and Rename Your App

Inside the builder, you’ll find preloaded screens and content based on your template selection. These may include sections like news, photos, videos, and more.

To begin personalizing your app, start by changing its name. Click on the current app name at the top and rename it to your desired title. Make sure to click outside the field to save the changes.

6. Preview Your App

You can preview your app at any time by utilizing the built-in preview tool on the right side of the interface. Click the play button to see a live preview of your app with its current content and navigation.

7. Update and Add New App Content

To update templated content:

Click to the section you’d like to edit within your app navigation, then click on the content you’d like to edit. Adjust content fields such as names, descriptions, links, images, and more. Be sure to click ‘Save’ when done making changes.

To update section titles in navigation:

Click on the navigation section, then click on the “…” button next to the section name, and input the new section name. Don’t forget to click ‘Save’ when done making changes.

To add new content sections:

Click on the “+” sign next to “Screens” in your navigation window, then browse and select the variety of prebuilt content sections. Edit and add content in these sections as previously described.

To see changes using the preview tool:

After making the change, you can reload the preview by turning the power button off, then pressing the play icon on the phone again. When it reloads, your app changes will be displayed.

Congratulations! You’ve successfully created and previewed your first app using Shoutem.

Building Out Your Shoutem App

This tutorial on using the Shoutem App Builder is the first in a larger series on Getting Started with Shoutem. Learn more about customizing your Shoutem app with the following in-depth tutorials from series: 

Let’s build your dream app in just 30 minutes! Book your free demo call and witness the magic happen.
30 minutes!
Need an app but short on time?