As your application takes shape in the Designer, you can use the Diagram view for a visual representation of your application's structure.

The Diagram view, shown only for application and flow artifacts, displays an application's root pages, flows, and pages within flows. It's a handy tool that lets you view default pages, navigation flows, even audit status at a glance. You can also use this view to update your application in context; for example, you can change the default root page or the default flow and see how your updates change your application's structure.

When you open an application artifact, the Diagram view displays the application's root page as well as a hierarchical view of the artifact's flows and sub-flows. When you open a flow artifact, the Diagram view displays the pages contained in the flow as well as their navigational relationships. A Properties pane displays by default, showing additional information about the selected artifact. There's also a Components palette that you can use to add pages (and actions for a flow artifact).

Here's an example of what you might see when you open the Diagram tab at the application level:

Description of the illustration diagram.png

You can expand or collapse a flow to show or hide its pages (and optionally, sub-flows). Click a page to view its navigational relationships in the diagram as well as in the Properties pane. For example, clicking the customer-start page shows navigation icons ( ) on the accounts and contacts page tiles, indicating that you can navigate from customer-start to those pages and back. When navigation is one way, meaning you can go from one page to another but not navigate back, you'll only see the icon, as shown on the side-banner-start page. You'll see similar navigation details in the Properties pane under Navigates to and Navigated From when the page is selected. Notice how flows or pages that don't have any relationship with the selected page fade into the background.

It's possible to make changes to your application from the Properties pane. You can change page titles and descriptions as well as update the app's default root page, the default flow, and the default page in a flow. You can even open, duplicate, and delete selected items. Alternatively, you can double-click an artifact (a root page, a flow, or a page) to open up the artifact's editor and make changes as required.

The Diagram view also flags pages with audit issues ( or ). These issues also show at the flow level, a useful indicator when the flow is collapsed that audit issues exist in the flow's pages.