Reference Guide

App Builder

This is where you build your apps. The interface is relatively straight-forward, and is divided into five main areas:

Nutshell’s builder environment with each area marked and labelled

Title Bar

The Title Bar is always present while you’re building an app and provides (from left to right):

• Back Button
  Returns you to the management area when you’re finished working on your app.
• App Name
  Reminds you which app you’re working on.
• Save Button
  Saves any changes you’ve made.
• Preview Button
  Allows you to quickly test your app in an emulator, without having to leave the Builder.
• Publish Button
  Allows you to publish your app; either to yourself (for testing on a device) or to your end-user community.

Tab Bar

The Tab Bar provides quick access to the various parts of a working app. Don’t worry if these don’t mean much to you right now – each item is covered in more detail within the Nutshell Reference Guide.

The Tab Bar includes (from top to bottom):

• Workflow
  Where you build the structure, navigation and user-interface of your app using drag n’ drop components.
• Data
  Where you define the data-sources available to your app, such as database tablesMore information on Data can be found here (for permanent data storage), variablesMore information on Variables can be found here (for temporary data storage) and connectors that allow your app to integrate with other tools outside of Nutshell.
• Users
  Where you define who can download and use your app in the real world.
• History
  Where you can see a complete back-catalogue of every version of an app you’ve ever published, including the ability to roll back to an earlier version if you really mess things up!
• Image Library
  Where you can upload and store reusable images, such as your company logo.
• Settings
  Where you can define a few basic settings to help ease your build process.

Canvas

The Canvas is accessible while you’re in the Workflow tab. This is where you will build your app defining your app’s structure and navigation. If you’ve ever worked with a BPMNMore information on BPMN can be found here business process diagram, Nutshell’s workflow should be a familiar concept.

Nutshell apps are built by dragging components onto the Canvas from the Tool Bar, and linking them together into a daisy-chain of screens and actions that your end-user will navigate.

Tool Bar

The Tool Bar is visible while you’re building apps in the Workflow tab. It gives you quick access to the collection of components that make up a Nutshell app – for example screens, buttons and form fields.

These components can be dragged and dropped onto the Canvas to create your app. Don’t worry if these don’t mean a great deal to you right now, as each component is covered in more detail within the Nutshell Reference Guide.

Use the Tool Bar drop-down to quickly switch between component categories

The Toolbar has a drop-down menu on the left-hand side, which allows you to switch quickly between the different component categories, including (from top to bottom):

• Essentials
  The basic building blocks of any Nutshell app, dragged directly onto the Canvas.
• Visuals
  Various components for displaying content and data on-screen – such as text, images and maps.
• Forms
  A comprehensive range of form controls for data-capture, including the ability to take photographs using the device’s camera and capture electronic signatures.
• Data
  Components that allow you to save and manipulate data within your app, without having to find or build a separate “back end”More information on Back End can be found here.
• Connectors
  A suite of customizable components that allow a Nutshell app to be integrated seamlessly with the rest of your company’s IT eco-system.
• Device
  Components enabling your Nutshell app to interact with the end-user’s smartphone or tablet – such as scanning barcodes or making phone calls.
• Advanced
  Tools that allow uber-geeks to solve ridiculously complicated problems that would drive ordinary mortals to despair.

Which categories you see will depend on your Nutshell subscription.

Properties Panel

Whenever you select anything in Nutshell, the Properties Panel will display handy contextual information and settings that let you control how that component behaves.

What you see depends on what you’ve selected, but broadly speaking, the Properties Panel gives you:

• A brief explanation of what you’ve selected.
• Links to further help documentation and/or tutorials.
• A full set of configuration options for whatever you’ve selected.

The Properties panel is divided into sections that can be expanded/collapsed by clicking on them. This helps keep things simple and organised.

Text Field properties, divided into sections for Basic Settings, Validation & Styling

Don’t forget to save your changes before de-selecting the component.