The Mobile Design feature is used to optimize an app so that it's suitable for viewing on a mobile device.
|
We strongly recommend that before designing the mobile app you should complete the desktop app design including layout, behaviors, workflow and access rules. |
A mobile app consists of pages that contain one or more sections. A section is a grouping of app objects that can be positioned, and moved, as a single entity. App objects may also be re-positioned within a section.
You can optimize the Mobile Design for viewing on a phone in portrait mode (One Column), phone in landscape mode (Two Columns), or a tablet (Two Columns).
Mobile app design should be simple and concise due to screen limitations. Try to limit the number of pages, sections and objects to optimize mobile usability.
Click the mobile icon 
to open the mobile designer. The first time you open the mobile designer, or when you open the designer after a new object has been added, the Mobile App Wizard will be triggered.
In the mobile app wizard you can:
Create and Name Sections
The first step in the Mobile App Wizard is to create and name sections.
In the next step you will be able to add your app objects into sections and those sections can be positioned or re-positioned on your mobile app.
Sections help organize objects and information into relevant groups for ease of design and ease of use on a phone or tablet.
|
Create & Name Sections (2 min) |
The first step in the Mobile App Wizard is to create and name sections for each page of your app. Watch this tutorial to learn how this is done. |
Add Object to Sections
Now you have your sections created the next step is to add your objects into those sections.
You will be able to position and re-position sections in your mobile app.
You will also be able to move objects around in the section.
|
Add Objects to Sections (2 min) |
Having created and named your sections, the next step in the Mobile App Wizard process is to add objects from your app into those sections. Watch this tutorial to see how this is done. |
Select One or Two Column Layout
A two column layout is ideal for a phone in landscape mode or a tablet. A phone in portrait mode will always display the default one column layout defined in the previous step.
|
Select One or Two Column Format (1 min) |
For each app page you may choose whether to use a single or two column display. Watch this tutorial to discover more. |
Preview the Mobile App Design
Review the mobile layout to check if you are missing any app objects. Preview how the app looks on a phone or tablet in portrait and landscape mode.
|
Preview the Mobile App Design (1 min) |
In the final step of the Mobile Design Wizard you may preview your mobile app choosing the device type, orientation and combination of Workflow Stage and User Role for your preview. |
For more information on Mobile Design see: Mobile Design
Next: Publishing Your App
Return to: App Design - Getting Started, QuickStart Tutorials
