As true Slytherins we of course have to steal, and steal we did!
ngrok We used third party ngrok to expose our local endpoint our local development server to the Internet!
SASS + REACT = <3 Clever clogs utilize existing frameworks for simplifying styling: Sass – CSS with superpowers in combination with React makes a perfect match.
Link Mobility It’s good to know that your message has been delivered. Therefore you get a confirmation when your message has been delivered to the Howler!
Stairway to HELL
In our solution we combine these three Cloud APIs to make our solution floooow through the cloud!
In our solution, users will be gathering ingredients using object detection in a Canvas App. The AI model used for this has been trained on objects around the conference venue, and so we wanted to enhance the connection between the app and the real world. Already having access to the users geo location through the geolocation web API inside the Canvas App and any PCF components, we decided to these data to place the active users on a 3D representation of the venue, expressing our power user love by merging 3D graphics with the OOB Canvas App elements.
We were able to find a simple volume model of the buildings on the map service Kommunekart 3D, but these data seem to be provided by Norkart, which is not freely available.
Like the thieving bastards we are, we decided to scrape the 3D model off of the site, by fetching all the resources that looked like binary 3D data. We found the data was in B3DM format and we found the buildings in one of these. We used Blender to clean up the model, by removing surrounding buildings and exporting it to glTF 3D file format, for use in a WebGL 3D context.
The representation of the 3D model, we decided to do with Three.js, which let us create an HTML canvas element inside the PCF component and using its WebGL context to render out the model in 3D. The canvas is continuously rendered using requestAnimationFrame under the hood, making it efficient in a browser context. The glTF model was loaded using a data URI, as a workaround for the web resource file format restrictions.
The coordinates from the user’s mobile device comes in as geographical coordinates, with longitude, latitude and altitude. The next step was to map these values relative to a known coordinate in the building, which we chose to be the main entrance. By using the main entrance geographical coordinates, we could then convert that to cartesian coordinates, with X, Y and Z, do the same to the realtime coordinates from the user, and subtract the origin, to get the offset in meters. The conversion from geographic to geocentric coordinates were done like so:
// eslint-disable-next-line @typescript-eslint/consistent-type-definitions
export type CartesianCoordinates = { x: number; y: number; z: number };
// eslint-disable-next-line @typescript-eslint/consistent-type-definitions
export type GeographicCoordinates = { lat: number; lon: number; alt: number };
// Conversion factor from degrees to radians
const DEG_TO_RAD = Math.PI / 180;
// Constants for WGS84 Ellipsoid
const WGS84_A = 6378137.0; // Semi-major axis in meters
const WGS84_E2 = 0.00669437999014; // Square of eccentricity
// Function to convert geographic coordinates (lat, lon, alt) to ECEF (x, y, z)
export function geographicToECEF(coords: GeographicCoordinates): { x: number; y: number; z: number } {
// Convert degrees to radians
const latRad = coords.lat * DEG_TO_RAD;
const lonRad = coords.lon * DEG_TO_RAD;
// Calculate the radius of curvature in the prime vertical
const N = WGS84_A / Math.sqrt(1 - WGS84_E2 * Math.sin(latRad) * Math.sin(latRad));
// ECEF coordinates
const x = (N + coords.alt) * Math.cos(latRad) * Math.cos(lonRad);
const y = (N + coords.alt) * Math.cos(latRad) * Math.sin(lonRad);
const z = (N * (1 - WGS84_E2) + coords.alt) * Math.sin(latRad);
return { x, y, z };
}
This gave us fairly good precision, but not without the expected inaccuracy caused by being indoors.
In our solution the current position is then represented by an icon moving around the 3D model based on the current GPS data from the device.
To connect this representation to realtime data from all the currently active users, we decided to set up an Azure SignalR Service, with an accompanying Azure Storage and Azure Function App for the backend, bringing it all to the cloud, almost like a stairway to heaven. With this setup, we could use the @microsoft/azure package inside the PCF component, receiving connection, disconnection and location update message broadcast from all other users, showing where they are right now.
Azure Cognitive Services to implement speech-to-text:
SharePoint API to invite the users to the portal and work on the SharePoint lists
Relevance Search API to implement search of the upcoming events on the portal to help the students complete the onboarding by including socialization activities in the new school.
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.
🪜 The Stairway to Heaven Badge – Ascending with Microsoft Cloud APIs 🌥️✨
We embarked on a cloud-powered journey, skillfully combining three powerful Microsoft Cloud APIs: Dataverse, Azure Storage REST API, and Azure Face API. Together, they’ve elevated our Dark Ledger solution to new heights of innovation and functionality. Here’s how we made magic happen. 🧙♂️
1. Dataverse – The Ledger’s Core 📜🔗
At the heart of our dark operations lies Dataverse, the keeper of all knowledge and the driver of our workflows. With the Dataverse Web API, we’ve created an enchanted process that triggers the OneFlow API to handle contracts for each Order of Doom. Here’s how:
Trigger the Spell: When a new Order of Doom is created, a Power Automate flow springs into action, retrieving the requester’s details and the order specifics.
Summon OneFlow: Using these details, the flow invokes the OneFlow API to craft a contract that’s sent for e-signature.
Centralized Power: All this data is stored and tracked in Dataverse, making it the foundation of our interactive map and contract records.
2. Azure Face API – Identity Verification 🧠🖼️
What’s a sinister operation without proof of completion? That’s where the Azure Face API steps in, acting as our Polyjuice Potion for digital identity verification. When a target is “handled,” here’s what happens:
Photo Submission: The person responsible uploads an image of the deed.
Identity Match: The Face API, integrated with Power Automate, analyzes the photo and compares it to the target’s profile in Dataverse.
Deed Confirmed: If the identity matches, the flow sends a final confirmation email and updates the record in Dataverse.
3. Azure Storage REST API – Mapping the Shadows 🗺️✨
The Azure Storage REST API brings a new layer of sorcery to our solution by enabling real-time tracking for the interactive map. This API, used within Power Automate, is our secret weapon for dynamic data handling:
Store Location Information: Each Order of Doom includes precise location details for both the requester and the target.
Real-Time Updates: Using the Azure Storage REST API, these locations are posted and retrieved, enabling our Google Maps-powered map to display updated positions in real-time.
Seamless Integration: The flow ensures that every movement is logged with precision, offering a spellbinding experience for users.
With this magical blend of AI and automation, we ensure efficiency, accuracy, and a bit of wizardly flair. 💀
Our OwlExpress solution needs to get the list of possible future wizards from a different set of data sources. We are merging these data into a PowerBI report so that the segmentation can be easily done using the slicers in a more intuitive way.
This Report is integrated into an MDA using a PCF control that House Elves Limited created that can save the segment chosen by the user using the Export Segment command.
This will trigger a Power Automate flow that will create the applications for all future students of the chosen segment.
To integrate the PowerBI report the following API’s are being consumed:
also, Power Automate is part of the same process (which might help the creators reach Heaven)
The PCF component has been developed using Test Driven Development and Storybook which allows you to fail fast and often and reach success faster.
The component is a react/virtual component, which simplifies a lot the separation of concerns into different components.
The code has been structured using the best practices for PCF components. We are using a Solution Project to simplify the build of the Solution that contains the component.
To standardize the build and deployment process and to ensure that the PCF Version is always kept in sync with the containing Solution version a couple of PowerShell scripts have been written. This helps also with the Azure DevOps pipelines because these can be simplified to execute the exact scripts that the developer executes on their machine.
Greetings, fellow wizards, witches, and tech enchanters! As proud members of House Slytherin, we at Team PowerPotters are no strangers to thinking big, acting boldly, and weaving a little magic into everything we do. This time, we’re thrilled to present our solution—a perfect blend of resourcefulness, ambition, and innovation—that makes a strong case for not one, not two, but three badges: Hogwarts Enchantment, Dataminer, and Stairway to Heaven.
Here’s how we’ve brought our cunning vision to life, blending the wizarding world with business processes and cutting-edge technology.
🪄 Hogwarts Enchantment: Magic in Every Workflow
They say Slytherins know how to blend strategy with creativity, and our solution proves it. By integrating external Harry Potter APIs, enriched with AI magic, we’ve transformed ordinary data workflows into something straight out of the wizarding world:
Magical Data Sources: Using three Harry Potter APIs, we dynamically fetch spell-related data.
AI-Powered Enrichment: OpenAI serves as the magical mind, enriching spell data with unique descriptions, insightful classifications, and relevant connections.
For example, a spell fetched from the API is expanded with product details and seamlessly integrated into Finance and Operations (FO).
Invisible Charms at Play: A clever “dirty hack” with Dataverse acts like an invisible charm to detect duplicates, ensuring a seamless user experience and efficiency.
✨ Why This Deserves the Badge: By blending AI, external APIs, and intuitive workflows, we’ve brought the enchantment of Hogwarts to life within business processes. It’s not just automation—it’s pure magic.
🐍 Stairway to Heaven: Ambition Meets Integration
As true Slytherins, we always aim for the top. With this solution, we’ve ascended the metaphorical stairway to technical greatness by integrating three major Microsoft services into one seamless, end-to-end workflow:
Dataverse: Acting as a logical trap, it checks for duplicates using error-driven logic, saving time and resources.
Finance and Operations (FO): The heart of our solution, FO handles enriched product creation, BOMs (Bill of Materials), and inventory management.
OpenAI: Enhances data with contextual business insights, transforming raw API information into actionable intelligence.
✨ Seamless Integration in Action:
Data flows from the Harry Potter APIs to Dataverse, where duplicate checks occur.
OpenAI adds contextual magic before FO processes the enriched records, ensuring they deliver maximum business value.
✨ Why This Deserves the Badge: The solution builds a stairway that bridges data, AI, and business processes. It’s efficient, scalable, and a testament to the power of intelligent integration.
🧙♂️ Dataminer: Uncovering Magical Insights
Our solution didn’t just extract data—it transformed it into gold worthy of a Slytherin treasure vault:
Using Harry Potter APIs, we mined spell-related data and applied AI to add context, relevance, and business-ready value.
We didn’t stop at fetching data. We turned it into actionable insights that integrate seamlessly into business systems, eliminating manual work and reducing errors.
✨ Why This Deserves the Badge: This isn’t mere data extraction—it’s intelligent, enriched, and purposeful mining that creates real value.
🪄 Why We Deserve All Three Badges
Our solution is a shining example of Slytherin ingenuity, ambition, and teamwork. It seamlessly meets the criteria for:
Hogwarts Enchantment: By combining APIs, AI, and intuitive workflows, we’ve made business processes feel truly magical.
Stairway to Heaven: Through integration of Dataverse, FO, and OpenAI, we’ve built a harmonious system that transforms data into value.
Dataminer: We didn’t just gather data; we mined and enriched it with AI to deliver insights that matter.
🔮 A Slytherin’s Call to Action
House Slytherin has always been about turning ambition into achievement, and this solution is no exception. With our resourceful approach to combining APIs, AI, and business logic, we’ve created a system that not only solves problems but does so with a touch of magic.
We humbly present our work for consideration for the Hogwarts Enchantment, Stairway to Heaven, and Dataminer badges. Ambition, strategy, and ingenuity—it’s the Slytherin way.
Enabling seamless communication between the backend and frontend is a must for delivering smooth user experiences. For our solution, we leveraged three powerful Azure cloud APIs to facilitate a direct line of communication between our backend and frontend, optimizing the process of running and analyzing conversations with a bot service.
In our case, we needed to ensure that the backend and frontend could communicate efficiently with a bot service, run conversations using an AI model, and analyze the interactions to improve the user experience—all while keeping things fast and responsive.
To achieve this, we turned to Azure and integrated three critical APIs:
Direct Line API (Bot Service): For communication between the backend and the bot.
Azure OpenAI API: To power the AI-driven conversations.
Azure Language Service API: For analyzing the conversation and extracting valuable insights.
PromptFlow, our innovative AI chatbot integrated into Microsoft Teams, not only streamlines race strategy and collaboration but also stands as a testament to advanced cloud technology integration. Targeting three distinguished badges – “Plug N’ Play,” “Crawler,” and “Stairway To Heaven,” PromptFlow embodies the pinnacle of AI-driven solutions in Microsoft’s ecosystem.
Plug N’ Play: Enhancing Microsoft Teams with AI
PromptFlow elevates Microsoft Teams by offering automated, data-driven insights for racing strategy development. By utilizing over 5,000 race statistics, it enables users to query lap times, kart performance, and player stats in natural language, demonstrating a perfect blend of AI and user experience.
Crawler: Transforming Race Strategy with AI Search
The “Crawler” badge highlights PromptFlow’s innovative use of AI search to navigate extensive race data, revolutionizing the way racing teams strategize. This feature addresses the critical need for quick and accurate decision-making, offering a significant competitive edge in the racing industry.
Stairway To Heaven: A Symphony of Microsoft Cloud APIs
Achieving the “Stairway To Heaven” badge, PromptFlow masterfully combines multiple Microsoft cloud APIs:
AI Search: Powers the core functionality, enabling efficient data retrieval.
Sentiment Analysis: Enhances user interaction by adapting responses based on detected sentiment.
Azure OpenAI Instance: The backbone providing computational power and advanced LLM capabilities.
This integration not only meets the badge’s criteria but also sets a new standard for AI solutions in cloud environments.
Technical Integration and Future Prospects
Each API plays a crucial role in making PromptFlow a robust, intelligent system. This multifaceted integration exemplifies our commitment to leveraging cloud technology for creating advanced AI solutions, paving the way for future innovations.
The solution/demo:
Conclusion
PromptFlow is more than just a chatbot; it’s a groundbreaking tool that revolutionizes race strategy development and team collaboration. It showcases our expertise in blending AI with cloud technologies, earning us the “Plug N’ Play,” “Crawler,” and “Stairway To Heaven” badges. As we continue to innovate, we look forward to exploring new horizons in AI and cloud computing.
Note: This combined draft succinctly captures the essence of PromptFlow’s achievements in earning the three badges. It emphasizes the chatbot’s functionalities, technical prowess, and future potential in the realm of AI and cloud computing.
When we get a new contact in our CRM, basically a new player in our game club, we want to welcome them by first generating an AI produced welcome text and send it in an email from Outlook. Then we will also add them to our Azure Entra
