New aspiring plumbers can now apply do get rank 1 certification through our certificatior app. If completed a badge will be generated on SharePoint in the users own folder!
Go with the flow clairification: Heres the code that runs the flow (second red line) to create a user folder in sharepoint with the corresponding badge.
First updating data verse from the cansvas app – then triggering the flow in context of the authenticated user The actual Power Automate flow
Retro badge statement: I mean, look at the apperal used…. nothing more retro than that!
Thieving, shameless… Using unsigned gamepad hax code component to fire up the (retro) controllers, happenly stolen from John Lius Github: GitHub – johnnliu/gamepad (Thanks John) In addition we have stole more than a few dozens of original super mario assest from the dark corners of the internet ( dont tell anyone)!
Why reinvent the wheel when you can have a flying start from the tech that others already have created.
SharePoint: The amazing community behind PNP created an awesome template that we have decided to use for the intranet.
Power Automate:
Working with Power Automate connected to Dataverse is almost impossible without the great tools of XRMToolbox and Jonas Rapps FetchXML Builder!
This tool has saved the “lives” of som many Dataverse/Dynamcis Consultants.
We also have used a community connector for the OpenAI that returns pirate name from contacts that are entered.
PCF: Even though we are not going to use our Model driven app for the end result, we imported a PCF controll from pcf.gallery just for the purpose of making it look better:)
Shiny, glossy user interfaces would earn this badge, it won’t break on small screens right?
So, at the request of the judges, we will shed some more light on our app, its UI and super glossy pixels.
The app is made in vue.js and contains three main components:
The ThreeD component, responsible for rendering our 3d parrot
The FormUI component, responsible for rendering text and input
The Camera component, responsible for gathering camera input, object detecting and debug interface
The ThreeD Component
In this component we use troisjs and three to setup a scene containing camera, lights, our parrot model, and positioning this to match the rest of the UI.
As the model we are using contains all the different animations inside on animation sequence, we have to split it up into different actions, like idle, scream, takeoff etc.
The FormUI Component
Adhering to the shadow first(tm) principle
In this component we use vue template logic in combination with CSS and stolen borrowed texture to create the interface for providing instructions and gather inputs. We also managed to sneak in the actual font borrowed from The Secret of Monkey Island, after battling with getting ttfs converted to woff🐶.
The Camera component
The camera component is not seen on the screen and does not directly contribute to the UI. However when for debugging we’ve build a little UI to show the detected objects.
Vi har vært på bloggkurs og har lært at det er viktig med clickbait-titler for å få clicks. Men jokes aside, vi har forsøkt å dra den visuelle identiteten til PowerAppen langt ut over normalen.
Vi har latt oss inspirere av Munch-museets visuelle identitet. Blant annet bruk av store kontraster, fete fonter og høy grad av asymetri.
En viktig del av arbeidet var å finne frem til former og symboler som kunne skape en futuristiskfølelse samtidig som vi tok vare på noe av det tradisjonelle som du finner i Munchs kunstnerskap. Det startet med en wireframing og idemyldring i Figma den første dagen, hvor vi la grunnlaget for designelementene som vi har bruk i appen. Se bildet under:
Vi innså raskt at PowerApps ikke har avrundede hjørner, men vi ville bevare samme felling, så vi lekte litt med vektorer for å skape samme uttrykket, bare motsatt vei:
Vi ønsket en high-end feeling i appen og for å oppnå det ville vi gjerne ha litt flere alternativer å vlege blant enn de standard fontene i PowerApps. Vi stjal derfor komponenten PowerFont fra pcf.gallery som lot oss laste inn alle fontene fra Google Fonts direkte i PowerApps: https://pcf.gallery/powerfont/
Etter å ha diskutert en del frem og tilbake landet vi på Fira Sans Condensed, da denne har et uttrykk som var likt nok, men samtidig hadde ok kontrast til Munch sin custom-brand font.
Etter å ha brukt mye tid på å lage svg.-filen til topp-logoen i appen bestemte vi oss for å stjele resten av ikonene. Disse lånte vi fra: https://www.svgrepo.com/
Sammen med ulike figurer og former tilsynelatende plassert «tilfeldig» på lerretet, oppnådde vi det abstrakte og figurative uttrykket i appen som vi var ute etter (merk: knappene får den sterke Munch-rødfargen når man fører pilen over). Vi har også gjenbrukt mange av de samme elementene i vårt Power BI-dashbord.
Vi ville også ha chatboten vår som en del av appen. For å embedde den stjal vi på nytt fra pcf-gallery. Denne gangen stjal vi komponenten PCF ChatBot for å få åpnet chatten direkte i appen: https://pcf.gallery/pcf-chatbot/.
The turtle’s IT department, named Pizza Time, is hard at work showcasing their awesome setup. To make it easy to follow what happens we’ve brought the blog posts back into the intranet.
Setup consists of crawling the ACDC blog, for Pizza Time posts only via Graph Connectors.
Graph Connector Crawl Setup
To show these back on the home site we use the PnP Modern Search web parts (https://microsoft-search.github.io/pnp-modern-search/) with Graph connector support. The display is using a custom handle bars template matching the ACDC blog schema.
The custom template uses HTML5 content tags for proper screen reading and navigation.
When our turtles aren’t swinging around New York City or munching on their favorite past time food of pizza’s – they are checking in on the TMNT HQ Intranet to see what’s happening, or chatting with other crime fighting colleagues in Teams.
Using a Home site via Viva Connections is the best way to do this, but unfortunately there’s a bug where the home site shines thru the navigation menu and breaks the user experience.
Quickest way to solve this? Contact Pizza Times trusted member Mikael and have him install the swizz army knife off all time – https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-script-editor. With a simple accessibility script in place, things are back to normal.
Script to fix the order of business
(Thieving bastard badge is attributing to other 3rd party usage in the solution – API’s etc)
We are proud to announce the launching of our website with our new concept. This website is responsive and adapts to different screen sizes. Our website is created with the help of the third party solution; webflow. Please take a look to learn more about our work!
MaMNT have travelled around the internets and found clever, ready-for-use third party solutions to aid them in the development process. The list below shows all the third party solutions they have proudly stole from other hard-working individuals and companies to lighten their own load.
gRPC (Google): two-way communication between the mobile app and backend
Discord: collaboration and integration with GitHub: events are posted to the MaMNT Discord server
XrmToolbox: managing plugins
Level up for Dynamics 365: Debugging and configuration
