The preview screen is the main workspace for building your app in Unifinity Wizard. Check how your app will look, move between “Field Settings,” “Screen Settings,” and other settings as often as needed, then generate your app when you are ready.
1. Preview Screen Layout
The preview screen is divided into three main areas.
| Area | Contents |
|---|---|
| Left (Sidebar) | Settings menu with access to “App Settings,” “Screen Settings,” and “Field Settings” |
| Center (Preview) | A preview of your app displayed in a simulated smartphone screen |
| Right (App Overview and Other Tools) | The app’s screen structure (App Overview), orientation controls, zoom controls, and image/data export options |
2. Using the Preview
Use the central preview and the panel on the right to explore how your app will look.
Switching Screens (App Overview)
“App Overview” in the upper-right corner lists the screens in your app. As you configure your app, “List,” “Details,” “Input,” and “Confirmation” screens are generated automatically based on your settings.
Click a screen to display it in the central preview.
Switching Screen Orientation
Switch between portrait and landscape orientations to check each layout. The landscape button is unavailable for screens that do not have a landscape layout.
Zooming
Use the plus (+) and minus (−) buttons to zoom in and out.
3. App Settings (Name and Icon)
Click “App Settings” in the left sidebar to open a popup where you can set the app’s name and icon.
| Item | Description |
|---|---|
| App Name | The app’s name, up to 50 characters. This name appears in UniBaaS and Player. |
| Icon Image | The app’s icon (PNG, JPG, or GIF). If no image is specified, the default icon is used. |
When you open the preview screen, a temporary name in the format “App_DateTime” is assigned automatically. We recommend changing it to a descriptive name before generating the app.
4. Navigating to Settings
Use the cards in the left sidebar to access detailed settings.
| Card | Destination | Settings |
|---|---|---|
| App Settings | Popup | App name and icon (see Section 3 above) |
| Screen Settings | Screen Settings screen | Settings for List, Details, and Input screens |
| Field Settings | Field Settings screen | Adding, editing, and reordering fields, and configuring input methods |
After making changes in a settings screen, return to the preview screen. Move back and forth to gradually refine your app. The next page, “Configuring Your App,” explains how to use each settings screen.
You can also click “Edit This Screen” at the top center of the preview screen to go directly to the settings for the screen currently displayed.
5. Saving and Resuming Your Work
Autosave
Your work is automatically saved in your browser. For details, see the section on autosave in “What Is Unifinity Wizard?”
Save and Exit
Click “Save and Exit” at the bottom of the preview screen to save your app definition to UniBaaS and return to the home screen. To resume editing, select “Click Here to Use an Existing App” on the home screen.
Saving a Local JSON File
Select “Download Settings as JSON” from the menu in the upper-right corner to save your work locally as a file. To resume, load the saved file using “Import” on the home screen. This is useful when you want to keep a local backup of your settings.
Next page: Configuring Your App (Detailed Field and Screen Settings)