Exercise - Create UI for a new canvas app

  • 10 minutes

In this unit, you'll generate a new canvas app that you will customize with various pieces of the UI covered in the previous units. This should give you a good idea of the capabilities of UI design in Power Apps.

Note

Power Apps requires either an Office 365 license or a free trial. Learn more about your licensing options. Microsoft products include Microsoft Power Apps and Power Automate.

Creating a new blank app header

  1. Log into Power Apps.

  2. On the Home screen select Canvas app from blank.

    Screenshot of the Canvas app from blank feature.

  3. Name your app New UI App and click Create.

    Screenshot of the new app named New UI App with Create button.

  4. In the new app, select the Insert tab and the Shapes dropdown. Scroll close to the bottom of the dropdown options and choose Rectangle.

  5. Move and resize the rectangle to cover the top of your app screen.

    Screenshot of the rectangle at the top of the app screen.

  6. Next, select the Media dropdown at the top and choose Image.

  7. Move the image to the top right corner of your app screen.

  8. Change the Image property to:

    User().Image

    Screenshot of the user image property at the top right corner.

  9. Insert a Label and change the Text property to:

    User().FullName

  10. Move the label next to the image and resize as needed.

    Screenshot of the first name and last name label property.

  11. Insert a Button and move it to the middle of the screen.

  12. Select the Home tab in the top left, and click the Theme dropdown. Choose Forest.

    Screenshot of the Theme dropdown with Forest selected.

Notice how the entire app's color scheme changes according to the new theme; including the button, label, and font colors. This is how easily you can make your Power Apps look and feel unique and fun, but also enhance the usability and appearance.