Create a Visual Application

You can create a new visual application and build it from the ground up, or start with an existing application that someone else has already worked on. Either way, you start with a visual application on the Visual Applications Home page.

The Home page is the primary console for creating and managing your applications. It serves as the entry point for your applications and is the first page you see whenever you log in to Visual Builder.
Description of homepage.png follows
Description of the illustration homepage.png

If you don't have any applications when you log in, you'll see the landing page as shown here (you might see additional options if all your apps were previously deleted or if you're an admin user):
Description of landingpage.png follows
Description of the illustration landingpage.png

To get started, you need to create a new application, import an existing one, or have someone add you as a team member to their application. You can then manage the application from the Home page.

Create a New Visual Application

Create a visual application when you want to start building an application from scratch.

  1. On the Visual Applications Home page, click New:
    Description of homepage-create-visualapps.png follows
    Description of the illustration homepage-create-visualapps.png

    Note:

    If you don't see the Visual Applications Home page, select Visual Applications in the menu on the Home page:
    Description of homepage-select-visualapps.png follows
    Description of the illustration homepage-select-visualapps.png
  2. Enter the Application Display Name (for example, MyFirstVisualApp) in the Create Application dialog. The Application Name is automatically populated based on the display name you provide. You can change this if you want, but the name must be unique in your identity domain.

    A starting version is added to the application name behind the scenes to construct the complete application ID, something like MyFirstVisualApp-1.0, which you can view later on in the Settings editor.

    The display name, name, and ID can't be changed once the application is created, so make sure you provide values you want to keep.

  3. Optionally, provide a description.
  4. If you want to use the default Empty Application template that does not create any apps, artifacts, or other resources, click Finish. Otherwise, click Change Template, select the template you want to create resources or apps that already include artifacts, then click Finish.

Your new visual application opens in the Designer, on the Welcome screen. Your new application does not contain any artifacts, but the application's file structure and some resources are created for you by default. You can use the Welcome screen to help you decide which artifacts you want to create first:
Description of visualapp-welcome-screen.png follows
Description of the illustration visualapp-welcome-screen.png

Click any tile in the Welcome screen to open the corresponding panel in the Navigator, where you can create and manage the artifacts. For example, if you click Responsive Apps, the Web Apps tab opens in the Navigator:
Description of homepage-artifact-browser.png follows
Description of the illustration homepage-artifact-browser.png

Note:

All users who want to collaborate on the app, including admins, must be added to the app as a team member. See Add Team Members.

Create a Copy of an Application

You can duplicate an existing application to create a copy that you can work with. A application copy contains all the resources and database schema of the source, but will have a different name, application ID, and URI.

To create a copy of an application:

  1. On the Visual Applications Home page, locate the version of the application that you want to copy.
  2. Open the Application Options menu, then select Duplicate:Description of homepage-duplicate.png follows
    Description of the illustration homepage-duplicate.png
  3. Enter the Application Display Name and Application Name in the Duplicate Application dialog box.

    Description of homepage-app-duplicate.png follows
    Description of the illustration homepage-app-duplicate.png

    A starting version is added to the application name behind the scenes to construct the complete application ID, something like MyNextVisualApp-1.0, which you can view later on in the Settings editor. The application ID will be exposed as part of the browser URL used to access the application.

  4. Click Duplicate.