Double dash it out!

Literaly, double dash it out. We ❤️ power apps, and want to show you our latest innovation by claiming both Dash it Out and Power User Love.

First off we have created a dashboard with banana-related statistics. We used power pages with the super fun liquid code template language to create a total overview of stats in our admin Banana Portal™ (Hopefully Donkey Kong won’t find the url):

The Banana Portal™ also includes a banana pickup route planner for the Norwegian Road Authority. Every detected banana is registered in Dataverse, added as a waypoint, and voila! An optimised route is calculated. Combining power pages (low code) and typescript:

Edit: added photos of the actual power page.

KoopaKonstruct Manager on a Hip Thieving Mission with #ProCodeNoCodeUnite

Function calling to open AI

In the spirit of collaboration and efficiency, our project seamlessly integrates several third-party solutions to enhance its capabilities. At the forefront, we employ Hololenses, a #hip and mixed reality device that brings magic into our everyday lives.

#Thieving the great knowledge of OpenAI plays a vital role in our project, helping us define the materials needed to construct a table – and potentially bigger projects in the future. By tapping into OpenAI’s advanced AI capabilities, we empower our users to receive real-time insights and instructions, making the crafting process both intuitive and engaging.

Power Automate serves as the orchestrator behind the scenes, effortlessly connecting different components of our solution. From updating FinOps with material quantities to generating purchase orders and sales orders, Power Automate ensures a seamless flow of information.

As soon as the Hololens have detected the necessary materials and quantity, it triggers a flow in Power Automate:

The flow ships the information into FinOps to automatically generate purchase and sales orders to improve efficiency and to automate critical business processes.
Further on, the sales order information travels back to the Power Automate and sends a response to OpenAI:

Using Function calling to OpenAI in combination with Power Automate we intend to claim the #Power User Love badge along with #Hipster for extensial use of hip technology and #Thieving Bastards for stealing the awesomeness of OpenAI!

Drag and drop! UPDATED!

Hey, folks! Do you like puzzles? Do you like Power Apps? Do you like drag and drop stuff? If you answered yes to any of these questions, then you will our newest game Puzzle!

What is this game?

The image puzzle is hidden inside a painting in one of our game locations. You will have to drag and drop the pieces of an image to complete the puzzle. Sounds easy, right? Well, not so fast. You probaly need to find some sort of pattern to follow. So good luck with that!

How did we make it?

We used a super awesome component that Scott Durow made. It’s called the Drag and Drop component, and it lets you create drag and drop user interfaces in Power Apps. Scott is a genius and a legend, and he shared his component on GitHub for everyone to use.

Now, you might be thinking: “Wow, that’s so cool! You must be a great developer to use Scott’s component in your game!” Well, not really. You have to download the component and install it in your environment, then add it to your app

We have a table in Dataverse containing links to the images (you have to host the images externally as of now)

Then we display the images by modifying the itemTemplate and force them to be the same size

And then on each onDrop, we check if the images have the right position.

Which gives us this cool puzzle:

How do I play it? 

Ending this post by stating that we are NOT attempting to claim Glossy Pixels with this post at this time.

Come find us! 

LowCode + ProCode

Use power fx to handle the overall function of the canvas app and send the more difficult logic to azure functions and custom api pluggin.

The azure function handles all the major quiz master logic between Azure AI and canvas app. 

The custom api plugin in dynamics written in C# handles the positioning of the user of the app relative to the work order and return if the user is close enough for a quizz to appen. 

In order to generate questions about Super Mario in for the canvas app we are using both Lowcode and Procode. The Azure Function APP consists of two functions written in C# to talk to the Azure Open AI Service through their SDK. In Power Apps there has been defined a new Custom Connector that talks with handles the requests to the Function App. There is also a plugin that has been written in C# to calculate the current position of the user so we can trigger the questions to be shown at the right location.

GetQuestion function:
The purpose of this function is to generate a new question about Super Mario. The canvas app will store these questions and if present it will be included in the next request to ensure that the same question wont be repeated.

CheckAnswer:
The canvas app uses this function together with the saved session to check if the answer is correct. This function will only return true or false.

GPT powered personal agent Clippy

We claim badges:

  • Client Side Salsa – for the react code for PCF control
  • Hipster – for using node.js for secure communication
  • Right now – for socket io for real time communication with the active users in Model driven app
  • Nasty Hacker – for incredibly awesome solution with dirty hack on the model driven side
  • Power User Love – for using socket io with Azure Function in low-code power apps

 

High Level Diagram 

Implementation 

All realtime communication is implemented via the soket.io that hosted on Azure

Project Update: Real-Time Communication and Enhanced User Interaction!

We’re excited to share the latest update on our project, featuring a significant enhancement in real-time communication capabilities. Now, administrators and backend integrations can seamlessly send messages to users who have opened specific records. This means that when there’s a change in the record status (e.g., case completion, modification), users will receive instant notifications prompting them to update their page for the latest changes. 

This feature not only streamlines communication but also serves as a handy tool for various onboarding processes. Additionally, it facilitates users in understanding what has changed post the deployment of a new release. 

Behind the scenes, we’ve implemented Clippy PCF, built upon the ClippyJs project, to empower this real-time communication. Leveraging the power of socket.io hosted on Azure, our solution ensures swift and efficient message delivery. 

Moreover, the backbone of the real-time communication lies in Azure Functions, written in Node.js. These functions diligently send out notifications to the socket.io instance hosted on Azure, creating a seamless and responsive user experience. 

Exciting times lie ahead as we continue to innovate and refine our project to meet the evolving needs of our users. Stay tuned for more updates, and thank you for being a part of our journey!


Business scenario

It supports real-time communication. So, Administrator or backend integration can send the message to the user that has opened the record. For instance: backend integration changed the status of the record (case has been completed, changed, etc..), all user that has opened record will receive the notification that they need to update the page to receive the lates changes.  


Navigating Business Adventures with KoopaKonstruct: Powering up with Power Automate

In the spirit of KoopaKonstruct, we leveraged Power Automate to streamline the order request process. When an order request is sent into FinOps, our Power Automate workflow springs into action, automatically triggering creation of both sales and purchase orders and linking to project. What makes this journey truly exciting is the dynamic linking of these orders based on material availability.

Using Execute action we send and retrieve critical information about items and order quantity with FinOps:

Konstructing the Perfect Order

Here’s how it works: If materials are not available, a sales order is crafted alongside a corresponding purchase order. The two are linked together, creating a seamless flow that ensures efficiency and accuracy.

The Power of Projects

But that’s not all! In the Mushroom Kingdom of business productivity, projects play a crucial role. Our solution goes beyond order creation – both sales and purchase orders are intelligently linked to projects. This feature provides enhanced visibility and control over every aspect of the workflow, ensuring that each adventure contributes to the success of the larger project quest.

Behind Her Majesty, the FinOps itself, we can find all the Koopa-magic (read: pro code customization):

Power-up Delivery!

As soon as your orders emerged victorious from the crafting chamber – or FinOps if you may – Our speedy Toad couriers, equipped with red hats and jumping prowess, are on a mission to deliver your Order Confirmation straight to your inbox! They dodge Goombas, leap over pipes, and ensure your confirmation reaches you in warp speed!

Conclusion: Leveling up with Power Automate!

In the world of business operations, automating workflows is like discovering a hidden 1-Up mushroom. With KoopaKonstruct Manager, our team has not only embraced the challenge but emerged victorious, proving that the right automation can turn any business quest into a successful adventure #Go with the flow #Power User Love

Piratebays utilize Dynamics Crm

With the new groundbreaking back office system for the modern pirate PiRisk. Piratebays have taken full advantage of the tighter inventory management that you can find in Dynamics CRM

With full control over your own inventory and especially your raiding targets, you will see their full inventory of valuable loot: Gold, Silver, Perls ………….

Shiny static electricity!

Did someone yarr-cuse us of having a static interface? Well, not anymore. We Power Usered UP to add a little fire and electricity to the user experience of battling other ships at sea using the ultimate Power User tool: PowerPoint. Outcome varies depending on our strength and resources vs. the defenses of the booty ship we’re going after. But in the end we either lose:

Or preferably win (which we’ll leave as a goodie to be seen at the judges show and tell today)

The Bastards Brand Guide

Claiming Glossy Pictures:

We asked AI to create a pirate color theme:

Here is a color palette that would work well for a pirate-themed app:

  1. Deep Sea Blue (#0E4A7E) – This shade of blue represents the vast ocean that pirates roamed and the mysterious depths that lay beneath its surface.
  2. Sun-kissed Gold (#FFC72C) – Gold is a symbol of pirate wealth and adventure, and this shade of gold has a warm and inviting feel, like the sun shining down on a pirate’s treasure trove.
  3. Rusty Red (#7B2E16) – This color represents the worn and weathered elements of pirate life, such as old ships and rusted treasure chests.
  4. Weathered Wood (#6F5F3E) – This color is a nod to the wooden deck of pirate ships and the rough-hewn timbers used to build pirate hideouts.
  5. Sandy Tan (#D7C3A3) – This color represents the sandy beaches where pirates buried their treasure and the warm, sun-drenched environment of the Caribbean.
  6. Stormy Gray (#5E5E5E) – This color represents the stormy seas that pirates often had to navigate and the treacherous conditions they faced on their journeys.

These colors work well together to create a cohesive and visually appealing palette that captures the essence of the pirate theme.

Based on the colors we drew a logo free hand using Microsoft Whiteboard and added the colors from the color profile.

The logo should appear everywhere to create cohesive branding.

UPDATE!

We updated the brand guide based in feedback from our pirates and this is what the new logo looks like:

Font

All good brands with some selfrespect has special fonts that is designed to give the user crafted associations. Never underestimate the effect of a good font.

We use two fonts in our designs.

Headers and body text we use Lato Hairline in Canvas Apps and Lato Thin wherever this font is too thin.

Lato on Google Fonts:
https://fonts.google.com/specimen/Lato

For decorative contrast we use the font “Dancing Script”.

Dancing Scripts on Google Fonts:
https://fonts.google.com/specimen/Dancing+Script

Color contrast

OF course we also checked that having that dark grey background with white text is accessible, and it is.

We used these graphics in our app that capture new pirates into our system:

Tap the chest to reveal your new pirate self.

Arrr, the scrawp (script) be mighty powerful in this one!

Pirates love talking trash, and where better to spew out all the fun than Microsoft Teams?

As a pirate you don’t have too many tools at hand at any given time. The same is true in 2023. Why learn something new when you have your trusty old swiss army knife at hand?

This time around we’re stealing from our own team mate, Mikael, taking one of the most powerful and mis-used plugins of all time, the PnP Script Editor Web Part, and we use it to easily embed our “Pirate “Capture a pirate” canvas app into Teams.

Teams App Admin

It’s as easy as rum and grog, add the Teams Tab, configure it with and <iframe> tag and you’re all set. Because everyone knows iframes as it has been a trusted valid tag for over 20 years now. Who knew you could embed and use a PowerApp within Teams????

Script editor web part – iframe

Once set up – it works beautifully!

Canvas Apps in Teams – such a novel concept

The beauty is that it even works on mobile! Pick the tab and embrace.

Capture a pirate responsibly on a device

And for some extra fun, here’s PirateGTP pirate in SVG – well hidden 😁

The input
The output

Badges and why – because why not

Client side salsa – Everyone knows teams tabs are browser tabs, and iframe’s are all about browser love. No monolithic front-end used, only simple and easy html and scripting.

Thieving bastards – We stole and borrowed the open source PnP script editor web part solution, even though inception was involved. PirateGPT is our API on crew mate generation, and Stable diffusion (via automatic1111) is our image pirateer solution. And not free I tell you as we had to purchase a used Nvidia RTX3060 gfx card to get this going.

Chameleon – What can we say, Teams, stand-alone, browser, native app, what not – you will not get away from being onboarded with out solution. It adapts portrait, landscape, even black and white. PirateGPT will get you!

Plug’nPlay – We stole it with inception, it plugs into anything SPFx plugs into. Showcased in Teams as we just love the purple.

Power User Love – All stored in Dynamic, all surfaced in Teams and SharePoint – we love ya’ll!