A blog of a Dynamics consultant, which focuses on providing information, tips, tricks on the Microsoft Dynamics stack of products

Search

Home » Dynamics CRM » Get started with designing Dynamics 365 business apps by using App designer

Get started with designing Dynamics 365 business apps by using App designer

Text Widget

This is a text widget. The Text Widget allows you to add text or HTML to your sidebar. You can use a text widget to display text, links, images, HTML, or a combination of these. Edit them in the Widget section of the Customizer.

Search

Businesses today demand apps which are streamlined and focused on making their employees agile and productive.

There is a huge uptake in the demand for such apps but at the same time the app creation experience is challenged with the need for faster development and a high degree of technical skill. IT departments are overwhelmed and struggle to support these requests from business units.

Aimed at simplifying and democratizing the app development process, with the current release of Dynamics 365, we are introducing the Application Designer

App designer provides a visually rich and intuitive canvas for creating apps without writing a single line of code. The designer cuts across all persona boundaries and enables everyone to design and publish an app in minutes.

Integrated within the app designer is the brand-new WYSIWYG Site Map designer.

Putting things into action, business apps in Dynamics 365, namely Customer Service, Sales, Field Service and Project Service automation have been designed using the constructs and capabilities of App and Site Map designer.

Creating business apps

It all starts from the My Apps page.

Use the Create App action to start providing meaningful information (properties) about your app, that users can easily associate with. To make this easy, all you need is the app name and the auto-defaults will take over. These defaults are shown upfront and you can choose to make edits/add details as necessary.

Promote your brand by adding icon for the app tile.

While you are at it, here are a couple of key properties to get you familiar with:

Name – This is the name of your app

Unique Name – The unique name defaults to app name and prefixed with the publisher prefix.

App URL Suffix – The suffix value defaults to the app name. You’ll see a preview of how the complete URL looks.

Once you have all the details, click Done to get started with the app designing experience.

Designing apps using a visually rich and context driven canvas

The main stay of the app designing experience is the canvas. Onto the canvas as components are added, you will visually see the app composition taking shape.

With a few clicks and NO CODE, modify the composition, to meet the evolving needs of your business.

Let’s look at some of the key principles of the app designing experience.

Universe of app components

The designing experience is supported using UX constructs, namely the following:

Sitemap

Dashboards

BPFs

Entities

Forms

Views

Charts

Site Map configuration:

We have simplified the app designing experience such that all you need is to configure a Site Map for your app, using the WYSIWYG Site Map designer. This is a mandatory component, for the app to be successfully published for runtime access.

There are indications on the canvas and notification bar, in case the Site Map configuration is incomplete.

We will talk more about the Site Map designing experience and its capabilities in a forthcoming post.

Adding components to your app:

The UX constructs are visually represented as Artifacts and Entity Assets tiles as part of the Components tab. Click on any of them to reveal a full list of their type.

For example, on accessing the Entities tile the UI flips to show existing entities listed by their Display and Unique name. To get to the entity of choice use the type ahead search and/or simply scroll and select the one you are looking for.

The Add command option is another great way to get to the list of existing components and add to your app.

The designer retrieves all entities which are supported in solutions and are available as part of the Default solution of the backing Dynamics 365 CRM Org.

Should you need to create new components, for example a new dashboard, then simply select the Dashboard tile and click on Create New option to launch the dashboard designer.

Tip: Using the ‘Add all Assets’ option, you can at one-go add all forms, views and charts for that entity as well.

Working with app components added to the canvas.

Let’s continue with the example of entities… Once an entity is selected it is added as a row under the Entity View swim lane of the canvas. Asset tiles for that entity, i.e. form, view and charts are also now available.

Observe by default the tiles call out ‘All‘. This means that all forms, views and charts for that entity will be available to users in runtime (provided they have the required permissions). This is another example of simplifying and enabling rapid app designing.

Should you have a need to select a specific set of entity assets then click on the relevant tile and pick the required assets from the components tab. On selecting 1 or more assets the tile shows the count of referenced assets (instead of All) and the flyout reveals the list of references.

Dashboard and BPFs also follow the same pattern.

Tips:

We made sure that should you need more canvas space as you design large-complex apps, it is available as each swim lane can be collapsed and expanded, keeping you focused.

Form or view defaults are based on the defaults defined in the default solution of the organization. Should you need to have an app specific default, then only reference that form or view in the app.

Site Map designer provides an option to configure an app specific default dashboard.

Removing of referenced components is as straight forward as adding them. Select the relevant tile on the canvas and uncheck a referenced component.

To remove an entity and all its forms, view and charts in a single action, select the entity name tile on the canvas and click on the remove command action.

Launching individual component designers

We spoke of how the Create New option is available for all app components and is a contextual way to create net new components as you design the app.

At the same time, you can also modify the definition of referenced components thru their designers. For example, to modify the definition of a referenced business process flow, click on the Open the Process Flow designer option to launch the new and reimagined process flow designer.

Our roadmap for future releases, looks to reimagine some of the legacy designers and have an inline experience to the app designer.

Validating your app to highlight errors and warnings

We wanted to make sure you have no surprises when you are ready to publish the app to your users and this where the Validate command action is useful.

Results of the validation are branched into two categories:

Type error – Needs to be addressed before the app changes can be published.

Error and warning icons are contextually displayed against the app components tile present on the canvas. So, that you also have details on what to do next, the notification bar supports errors and warnings with a descriptive message as well.

Let’s now look at the most common types of errors and warnings one may experience, during app validation.

Error

Warning

Site Map is not configured

App does not reference at least one entity

An entity must have at least one form or view in the app.

We also see the need for you to be aware of dependencies created when components are added to the app. The validate action provides a warning category of highlight next to the canvas component tile creating these dependencies. At the same time the required tab provides a detailed listing, which is easy to correlate back to the canvas highlights.

Reviewing the dependencies and addressing them has been made easy, let’s understand how it works.

In this example, Customer Service Manager dashboard and the Case entity form are calling out several dependent components they need. These dependencies are neatly stacked and in a hierarchical and easy to understand format in the Required tab.

Canvas highlights

Required tab

If you choose to not add 1 or more dependencies, you can simply hide them by clicking on Hide Dependencies. This doesn’t permanently ignore the dependencies from your app composition, but only hides them in the app designer until you click Validate or Get latest dependencies again.

Anytime a dependency is added to the app, it will be listed on the canvas under the appropriate component tile and the count of dependencies will change.

It’s fair to ask, what is the purpose of adding dependencies (which are warnings), when app runtime is not going to be impacted? The dependency addition experience ensures that should you choose to transport your app as a solution, for the app UX constructs your app universe is complete and ready to be imported in the target org.

Publishing your app and launching it for prime time

Now all that remains is to click the Publish command and have your app ready for your app users.

Once you’ve published the app, go to the Published Apps tab on the My apps page. This will list the published app with the App tile, Name and description you’ve provided during the Create App step.

Publish action is only enabled when there are unpublished changes relevant to the app designer.

To view the runtime of the app, click anywhere on the tile.

Apps are role based and as an administrator, you can give access to desired roles for your app.

Tip: App properties were defined during the create app step. However, if you wish to change the app properties later, you can do this in the app designer from within the properties tab. Except Unique Name and App URL suffix, all other properties can be updated. Once done, save and then publish your app.

In conclusion

App Designer and Site Map designer will dramatically accelerate how business apps are built, reducing time to stand up apps from days to minutes and empowering a new category of app creators.