Potion Approval Made Magical: A Canvas App for the Ages

Greetings, wizards, witches, and tech sorcerers! ✨

At Team PowerPotters, we’ve crafted a solution that combines ambition, design, and versatility to streamline potion approval processes in Hogwarts’ potions lab. Our Canvas app not only ensures Professor Snape retains his tight grip on potion-making but also demonstrates innovation worthy of the Chameleon, Glossy Pixels, and Plug N’Play badges.

Here’s how our magical app comes to life!


🪄 The Process: From Student to Snape

Our app powers the potion production workflow, starting from the moment a student initiates the brewing process to Snape’s final approval. Here’s the step-by-step magic:

  1. Potion Initiation:
    • When a student triggers the cauldron with a voice command like “Start potion,” a Power Automate flow kicks into action, creating a production order in Dynamics 365 Finance and Operations (FO).
  2. Flow Logic:
    • The production ID and related data are returned to the flow and enhanced with compose actions to ensure clarity.
    • The production BOM (Bill of Materials) is retrieved from FO and transformed into an easy-to-read format, beautifully rendered in the app.
  3. Snape’s Oversight:
    • An SMS alert is sent to Snape, notifying him of the brewing attempt with details of the potion and ingredients.
    • The app dynamically updates with the potion’s name, required ingredients, and a scroll-like design for approval or rejection.
  4. Elf-Friendly Data Publishing:
    • Post-approval or rejection, the elf’s are messaged on Teams and their SharePoint list is updated. Since house-elves have limited access to advanced systems, this ensures they have clear and simple instructions for ingredient management on a low-cost client.

🧙‍♂️ Badge Highlights: Chameleon, Glossy Pixels, Plug N’Play

1. Chameleon Badge: Responsive Design Across Screens

Our Canvas app adapts seamlessly to screens of all sizes, from mobile phones to desktop displays, ensuring Snape can approve potions whether he’s in the dungeons or pacing the Great Hall.

  • Screenshots:
    • Small-screen mobile view for Snape on the go.
    • Larger desktop display for potion reviews during classroom lectures.
  • The app’s responsive design ensures usability and consistency, providing an intuitive experience no matter the device.

2. Glossy Pixels Badge: A Visual Feast

The app’s aesthetic brings the wizarding world to life, making potion approvals as enchanting as the potions themselves:

  • Dynamic Imagery: A scroll-like interface hosts the potion’s details, while a vivid, animated potion bottle in the center represents the brewing request.
  • Harry Potter Themed Design: The lab background and parchment scrolls immerse users in the magic of Hogwarts, creating a cohesive visual theme.
  • Interactive Buttons: “Approve” and “Reject” buttons are styled like enchanted seals, completing the magical look and feel.

The app’s glossy finish transforms a standard approval system into an immersive, Harry Potter-themed experience that stands out among competitors.


3. Plug N’Play Badge: Seamless Workflows

Our app is built to integrate effortlessly into existing systems, demonstrating the true power of automation and low-code platforms:

  • Data Flow: The Power Automate flow connects FO, SMS notifications, Teams, SharePoint, and the app itself to ensure a smooth, automated workflow.
  • Elf Accessibility: The Teams messageing and SharePoint list ensures house-elves can view instructions without requiring access to complex systems.
  • Scalability: The app’s modular design allows new potions or additional workflows to be added with minimal effort, ensuring future readiness.

🐍 Why We Deserve These Badges

  • Chameleon Badge: The app’s responsiveness ensures a consistent, intuitive experience across devices, making it accessible for any user, anywhere.
  • Glossy Pixels Badge: The polished design, immersive visuals, and Harry Potter-themed aesthetics elevate the app beyond functional utility into an enchanting experience.
  • Plug N’Play Badge: With seamless integrations and a modular design, the app showcases the potential of low-code platforms for powering end-to-end workflows.

🔮 Potion-Perfect Innovation

From dynamic visuals to responsive functionality, our Canvas app brings a touch of magic to the hackathon. We humbly submit our case for the Chameleon, Glossy Pixels, and Plug N’Play badges and invite you to explore our journey as we continue to innovate at ACDC 2025: acdc.blog/category/cepheo25.

#ACDC2025 #ChameleonBadge #GlossyPixelsBadge #PlugNPlayBadge #PowerPotters #PotionApprovalMagic

Giving businesses a (Power) platform

Since many of the business owners of Diagon Alley spend most of the days on their feet in the store, they require a working solution that is easy to use and accessible wherever they might be. Because of this, we have decided to give them different possible solution within the Power Platform. Power Page for customer interaction, Power Automate to help reducing time demanding tasks and a data driven Power App that fit perfectly on a small Teams application on a store-owners cellphone.

Automating the office work

The daily-to-day operations of any business is to make sure there always is enough of their products, and making sure they always are stocked. To help the owners keep the supplies under control, we developed an Power Automate flow that would help them generate an Supplier Agreement contract in SharePoint.

The initial thought was to create a content type on a document library that would inherit metadata properties from the SharePoint columns and automatically fill inn the SharePoint property fields and thereby create a valid contract.

Unfortunately, this require that we edit the template locally, but we are working on computers with a safety policy that doesn’t allow us to connect to this fields when they are in another tenant. Still, we found a solution by downloading an empty document from the library, populate the fields quick parts connected to the document properties and re-upload this to the library. This allowed us to generate the agreement anyway, by using a Power Automate flow that populated the documents quick part fields.

Magic meets modern technology!

With delicious pizza fueling our spirits, we’re proudly claiming three badges! In this blog post, we’ll dive in with the same courage and determination Harry displayed in the Triwizard Tournament.

💣 Feature bombing

From the very beginning, our goal has been to unite multiple platforms into one seamless, feature-packed experience with a Weasleys’ twist. On our homepage alone, users can:

  • Get sorted into a house.
  • Chat with friends.
  • Check the calendar for Hogwarts classes and social events.
  • Get help from Hermione Bot for academics or planning.
  • Team up with Prank Bot to mastermind mischief.

These features don’t just exist – they’re alive and interactive, ensuring the experience is magical, dynamic, and fun. We’ve officially mastered the art of feature bombing (without overwhelming) and are ready to claim this badge!

🦎 Chameleon

Our app is built with adaptability at its core, ensuring a magical experience no matter what device you’re using. Whether it’s the compact elegance of an iPhone 13 or the expansive screen of an iPad, our interface scales perfectly without compromising usability or design.

Below, you can watch a short video showcasing the app’s responsiveness in action. Magical, right?

And last but certainly not least, the…

🥳 Remarkable team spirit

Of course, we have to share with the world how incredible this weekend has been!

Go check it out, and don’t forget to give Iselin a like! —> https://www.linkedin.com/feed/update/urn:li:ugcPost:7288637216099127297/
We have also been posting on Snapchat, Instagram and the Bouvet internal Slack channel! #sharingiscaring 😉

Now, we’re off for a swim! 🏊‍♀️✨

Low Code Potions are the best

Like a shapeshifter, Low Code apps need to adapt to any device. This app can do so with container and adding or removing flexible height when needed. Now with these potions we can look good on any device.

#Chameleon

Now we will create a Flow which only input is the user´s Full Name and it will return a score for each user based on a filtered table for the user. This score will classify each user as a “Ron”, a “Hagrid” or a “Snape” depending on their working hours.

A Ron is usually someone that doesn´t do much in their team and could try to participate more every now and then.

#GoWithTheFlow

Have you heard or maybe experienced Existential Crisis?

Our Faruk the Fabricator is living it now. Since yesterday, he was challenging himself on how to display the results in the best possible way… but he never questioned his Loooove to Fabric. And he also knows that the Fabric is the Marauder’s Map of data—you always know where everything is, even if it’s trying to hide.

Here are the results of our data in Power BI report. We can see different metrics for student data.

We can also put KPI and compare ourselves with the so called Sorting Hat.

It is our first year since Wayfinder Academy was created and we introduced our Logiquill portal and we already show same performance, wait a few more years and we will leave him in the dust, as it already wasn’t dusty enough.

Here are our components inside Fabric

Our dax code in Power BI:

Here is why we also claim Chameleon badge, in addition to Dash it Out:

Solution is responsive. Adapts to all devices and screen sizes.

Chameleon

Creating responsive design for our applications.

We are using containers in Power Apps custom pages to achieve a responsive layout and manage screen size to alter the application width and height. In Power Apps, we use the function Parent. to get the dynamic value of the screen width and height. The content is the centered and adjusting according to the values of the Parent.

In full screen mode, the app (Custom page) is fully scaled to the browser screen size. Tbe blurred square is centered in the middle shown with as the rectangle has a 5% size margin to align it.

When the screen is adjusted to a smaller size, the rectangle and content is rightfully changed according to the screen size,

Glossy Pixels + Mario badge + Chameleon

Before the hackathon we used some hours doing research, which included doing use research. Sofie on our team had experienced that renovating a bathroom includes a lot of back and forth between plumber, carpenter, project manager and several other people. It took more time then it needed to, to finish the bathroom due to bad communication, jo flere kokker, jo mere søl/Too many cooks spoil the broth.

We talked to two amazing plumbers, first asking a random question:

They, and their colleagues wanted:
– A pipe planner for when they renovate a bathroom
– Supply list with which pipes and other equipment
– Pipe (hehe)line for all the workers including in building a bathroom

Sofie wanted:
– Certificate of completion automatically …

We hade several calls with them before and during the hackathon, they gave us invaluable information and insight, and they have evaluated our solution each day.

This is our user journey

And of course, here is the user journey translated to Super Mario (please zoome in)
user journey mario

Late last night, after a couple of beers we finally found the perfect name for our plumber solution! Say hello to Tubi! We made a logo we are happy with, short and sweet!

Using Microsoft UI components, with a dash of Super Mario sprinkles on top, the UI is done.

Since this blog isn’t the best medium to showcase the design, please check it out at Behance

Use on every device

The Power App is repsonsive and can be used on all kinds off devices and screen resolutions.

We have use controls like the Containers that will adjust the content to the sizes on different parts of the screen.

We do recommend using the phones and pads in landscape mode to avoid white areas on the sides.

Here are some pictures of the app on different devices