Skip main navigation

New offer! Get 30% off your first 2 months of Unlimited Monthly. Start your subscription for just £29.99 £19.99. New subscribers only. T&Cs apply

Find out more

Customising the User Experience

Microsoft Dynamics 365 and the Power Platform
16.6
Now that we have our application built, we’re accessing some data. Let’s talk a little bit about some of the ways that you refine the user experience or how the user interacts with the application. And we’ll just touch on a few of the things that you might commonly do. The first is thinking about the overall look and feel of your application. And certainly, you can control this custom by putting shapes on there, doing the colours exactly the way you want. But themes offer a quick way to provide that consistent look and feel across the application. They replicate across the controls that you use. And you can see that there’s some standard set of themes, everything from blue, light, coral.
52.4
You can see if it matches some of your company’s colours. There’s also the Office themes if you want to be a little bit more in sync with some of the traditional Office applications. And you can see on the right how, as you apply the different themes, how those take effect not only on the colouring of the fonts but the background colours as well as the accents on the headers of the application. So themes are a good way to give a look and feel consistently across the application.
77.2
We’ve already discussed how galleries are a quick way to work with a list of data and present that to a user in a flexible way with the item templates controlling what you see on there. You can start with blank. Or you can pick one of the pre-built tile styles– title, title and subtitle, whichever one’s closest to the layout that you need– and kind of go ahead and get started with building that out. You’ll notice you can also control some of the things on whether you show the scrollbar, what the navigation step is as you’re moving through things, transitions, so a little bit of flexibility around some of the properties as well.
109.4
So take some time, and navigate through the properties on the gallery and get familiar with them. As we move on to forms, so you can configure the fields that are shown on the form. This is true for both the Display forms as well as the Edit forms. As you check the fields on the list, they’ll bubble up to the top. You can use Drag-and-Drop to reorder them in the order that you want them to show on the form.
130.5
You’ll notice, especially on the edit forms– you’ll see this in the practise that we do in the course– there may be fields that you select but don’t want visible, things that are like the Relationship ID for the parent record of the new record that you’re creating. What you’ll do is you’ll select those fields. You’ll go into the Advanced Properties. And you’ll end up making them so that they’re not visible. And those will be there. But they won’t be visible to the user. But it allows the data to be posted when you do the Submit Form.
157.4
As you click on one of the fields, you notice that you get a whole bunch of selectors that you can choose from based on the type. When you reference a data set, in this case, the accounts– and I picked some of the fields like City, Primary Contact– you’ll notice that those have different icons on here that show the type that it’s– like, number of employees. There’s 123 to indicate it’s a numeric. And if I were to click on that 123 just like I did when the abc, we would see the different formats that are available. And you’ll see that for Account Name, it chose the default of Edit text.
185.7
But if appropriate, I could have it be View phone, View email, Edit multiline, so different formats that can be made available. And it wouldn’t surprise me to see some additional ones come in for what’s there as Power Apps continues to mature. Now if we take this a step further, and we drill down into a particular field, we have some more settings that we’re able to work with on there, where actually what we get when we click the field is we get a data card. That data card will have a control inside of it. Most of the times, for common scenarios, you don’t have to do anything with that particular control.
216.3
But there are times where you may want to do some advanced settings on it. And you’ll notice that when you click on the data card that it’s locked. You’ll see the Unlock to change the properties. And this is basically letting you know that this has not been customised. So if we go ahead and unlock it, it’s a one-way– can’t relock it. So you can remove the field and reselected again. That will get it back in the locked state, the default state. But this would allow you to change some of the properties on it that you might want to customise. Maybe you want to have a different display name than the one that came from the metadata of the system.
248.2
Now, a good example of that is if you’re working with a lookup field. Now, in this particular example, I built this by creating it from data. And it built it for me. This is a custom card. If we actually look at it, we’ll see that what they did is they built the custom card with a combo box on it. And if I look at some of the properties on that combo box, we’ll notice that it’s pulling in the display fields, the search fields to use. And it’s using the Choices function to prepare the list of available things.
273.1
Using the information from the relationship for the Primary Contact ID, it’s going to infer that I should be able to pick from Contacts and be able to make those selected on there. If I wanted to change that– have it get the source from another list of data– I would unlock this and go ahead and set that up. I might want to also do that if I wanted to limit the amount of items that were being selected or available. I could do a philtre on that in addition to the Choices– works with that. And one of the nice things about Choices– it’s a little different than just doing a philtre direct.
301.5
Choices allows you to reference an entity that is not necessarily a selected table on your list of data sources on there. It can pull those in using the relationship information. Another area where canvas apps can be really powerful is leveraging the Media controls. This is everything from displaying an image to using the Camera or the other device elements to be able to capture things. Things like the Barcode or the Camera allow you to take input from external sources. Maybe I’m on-site doing an inspection of a particular customer’s way that they’re showing our product. I might want to take pictures and have those attached to items in CDS.
336.1
This gives a quick way to acquire those using the device asset– same thing with Video, Audio. And basically, Audio gives you the ability to playback. Microphone gives you the ability to record. And then the Add picture just gives you, like you see on the right, the ability to upload a picture. So maybe I’m uploading the logo for the company or some other asset that I want to store in association with that. Well, in the practises, we’ve really only touched on the surface of some of the controls. I wanted to highlight that there are some other controls besides Button, Combo box, and some of the ones that we use in the practises.
365.5
Things like the Slider and the star Ratings that give a little bit more dynamic user experience might be a little bit more appropriate for touch in some scenarios, giving a little bit more rich experience that you can pull things on. If you want to highlight some Power BI content, the Power BI tile is a great way to bring that content in. One thing to be aware of is it is pointing to a particular workspace and tile at that particular point in time. So if you’re moving an application from dev test to production, it doesn’t necessarily move that along with the data. It’s pointing to that one fixed asset. So it’s something to keep in mind.
396.4
But controls offer a powerful way to basically enhance the user experience, giving them a little bit more interactivity, especially with some of the controls like Slider making it a little easier– if you’re on a touch device– to work with. Another thing you can do as an app maker– somebody that’s trying to make the app a little bit more intuitive for the user– is do some things that are based on the contents of the data. And what I’m showing here is an example of a gallery. And you might have noticed this– we’ve played with a gallery– that as you have all the items in the list, none of them are selected.
423.7
But what if I wanted to put a checkbox on there and let you select multiple, but I wanted to visually indicate what was selected from that list of accounts that was presented to the user? What I might want to do is I might want to put the checkbox on there. But what if I could use the Template Fill? So what I’m doing is using the Template Fill to set a colour based on whether it is selected. So I’m using that control. And I’m saying, if the checkbox1 value is true, then return light blue. Otherwise, return white. That causes my selected items to basically be highlighted.
452.7
Look for opportunities like that where you can give some visual cues to the user and leverage the interact [INAUDIBLE] when the values change so that it can change the colours or the sizing or the boldness, all little subtle things that you do to make your app come alive a little bit more for the user and pop a little bit more on the user experience.

In the last step, we uncovered Signals. In this step, we learn about Customising the User Experience.

Now that we have our application built, and we’re accessing some data, let’s talk a little bit about some of the ways that you refine the user experience or how the user interacts with the application. We’ll just touch on a few of the things that you might commonly do.

Join the discussion

After watching the video on customising your apps, What do you think is the purpose of themes for the user experience, and how does it impact your design?

Use the discussion area below to let us know your thoughts. Try to respond to at least one other post and once you’re happy with your contribution, click the Mark as complete button to check the Step off, then you can move to the next step which is Embedded Apps.

This article is from the free online

Dynamics 365: Using Power Platform Applications

Created by
FutureLearn - Learning For Life

Reach your personal and professional goals

Unlock access to hundreds of expert online courses and degrees from top universities and educators to gain accredited qualifications and professional CV-building certificates.

Join over 18 million learners to launch, switch or build upon your career, all at your own pace, across a wide range of topic areas.

Start Learning now