Wednesday, December 1, 2021

Series Recap: Building an AI-enabled closet organization app with Power Apps and AI Builder

Organize your closet with AI.png


This blog post is part 4 of a 4-part series. To catch up on previous posts, check out the links below:


In the first three parts of this series, we got comfortable working with Power Apps, created an object detection AI model using AI Builder and no code, and used that model to build our own closer organizer phone and web app. This week, we’ll wrap up all our learnings, and brainstorm how we can continue learning by adding new features to our app. Let’s get started!


Part 4: Wrap Up and Adding New Features


How did we leverage Power Apps and AI Builder in this project?

Power Apps served two main purposes in this project – we accessed AI Builder through the Power Apps maker portal, and we also built out our actual application using the low code app publisher.


In the first part of the series, we learned about Canvas apps, which we then used in part 3 to create our app. We created our Power App by going through a few different stages. First, we designed our app by figuring out what features we wanted to include. We defined success criteria and identified how many different screens we would need to create to fulfill the criteria. We used the Tree view in Power Apps to create and organize all our screens.




Next, we started building out each screen. We were able to use the built-in features in Power Apps to create aesthetically pleasing screens using different colors and styles using the Properties pane for each screen. Some of the key properties and functions we learned how to use while making this app include:

  • Navigate: we used this function to jump between screens, for example when selecting a button
  • OnSelect: we used this property to identify what should happen when we selected a given component
  • Patch: we used this function to add items to our table in the Dataverse
  • TagName, ObjectCount, and OriginalImage: we used these properties of the Object Detection component when adding information to our table in the Dataverse, and displaying the number of items we have in our closet
  • Visible: we used this property to make things invisible
  • Set: we used this function to set global variables
  • Filter: we used this function to only show the correct items for each category of objects in our closet
  • CountRows: we used this function to display the correct count for each category of items

We also used the built-in Microsoft Dataverse to store and manage our data for each item that we added to our closet collection.


To create our AI model using AI Builder in part 2, we used the wizard-based interface inside of the Power Apps portal to create an Object Detection model. We built our own Object Detection AI model for this project by uploading our own images, tagging and labeling them, and then training the model. We decided what objects we wanted our model to be able to detect (in my case – tops, pants, and dresses), added them to the domain of the model, and then uploaded and tagged at least 15 images for each object. After our model was trained, we were able to use our object detection component in Power Apps.





What other functionality can I add to my Power App?

There are so many other ways you can choose to customize your Power App! Once you’ve built out your core feature set, try experimenting with other ideas to enhance your user experience. Here are some other features you may want to add:

  • Ability to batch upload images
  • A random OR AI-enabled way to match items from different categories to create outfits
  • Ability to “heart” favorites and show them on a separate page
  • Sort based on how often you wear certain items
  • Shuffle feature that reminds you of items you may not have worn in a while
  • So many more!


Where can I learn more about Power Apps and AI Builder?

Microsoft Learn is a fantastic, free resource for learning more about Power Apps and AI Builder. Under the Power Platform product, you’ll find modules covering everything from Sustainable Software Engineering to Identifying the language of text with AI Builder.


To find out about new features and other exciting projects, you can also check out the Product updates blog.


Thank you so much for joining me for this four-part series on building an AI-enabled closet organization app with Power Apps and AI Builder. I hope you learned something new!

Posted at