Previewing an application

Preview an application that you develop to verify that different types of devices, such as a desktop browser or a phone, correctly display your application, or to test a custom mashup code in your application.

When you preview the application, you can turn on the design mode to modify the user interface.
Note: Device preview is not a substitute for application tests on an actual device.
  1. In App Studio, select a portal that you want to preview by clicking the portal list next to the application name.
  2. Check the preview size by hovering over the monitor, tablet, and mobile phone icons.
    Result: Different masks display to indicate the preview size for every device.
  3. Click a device icon to display the application preview for that device.
  4. For tablets and mobile phones, switch between landscape and portrait modes by clicking a device icon again.
  5. Optional: Modify the user interface by configuring sections, work areas, regions, and so on:
    1. On the toolbar, turn on the design mode by clicking the Toggle design mode icon.
    2. When you reach a page that requires updates, click the Pencil icon in the highlighted section, area, or region.
    3. In the right panel, update the configuration of the element that you selected.
What to do next:  Preview how a specific device displays your application by selecting the device from the configurable list of devices. If a device is not on the list, edit the list of devices in Dev Studio. For more information, see Adding, editing, and deleting a preview device.