Introduction

This article describes the basic layout of the Zapp Studio tool. This is where layouts are created for apps

Launch

To launch Zapp Studio click on any of the following in Zapp Build Ops

• Any apps existing layout name in Zapp Build Ops
  • 
• The App Builder button
  •  
    • This will first launch a drop down of existing layouts. Select a layout name to edit or Add Layout to create a new layout
  • 

App Builder Screen layout

1. View select

Select one of the tabs to view

• Screens: Screens are crested and edited in this view
• Cells Styles: Power cells are added and customised in this view
• Navigation: Menus are created in this view

2. Add screen / component / cell / navigation

In this panel you can add a screen, a component, a power cell or a navigation type depending which tab is selected in 1 above.

3. Preview Panel

Shows an outline view of the components within a selected screen

4. Configuration panel

This panel is where each screen, component, cell or navigation type is edited. The fields presented in this panel will change according to the selected item in section 2 above.

5. Shortcuts

Shortcuts to views of layouts and feeds

6. Menu items

• My Apps: Select to return to all app families that you have permission to view
• Admin: Select from the drop down list
  • SDKs: An overview of all platform SDKs created 
  • Plugins: links to the plugin management screen
  • Audit: a log of all activity within app families that you have permission to view
• Support
  • A link to Zendesk and developer documentation
• System
  • Background jobs: A dashboard of the platform status
  • Trails: a log of all activity within app families that you have permission to view
• The layout editor
• 
  • Duplicate a layout: Create a duplicate layout and give a new name for quick generation of new layouts
  • Preview on Device: Get a QR code to view the app on a device (mobile apps only)
  • Layout Settings: 
  • 
  • Edit the layout name
  • Target: non editable for an existing layout
  • Cell Style Framework: non editable for an existing layout
  • Home: Change the screen that will identify as the Home Screen when an app launches