Development is nothing if your not in control. We are of course using seperate environments, so that we are totally in control of development, testing and our players in production.
Pipelines using the Power Platform Builder Tools is the Key here. The Pipeline exports our solution from the Development Environment, Imports it into our UAT (User Acceptance) Environment, before an approval step decides if the solution is finally deployed to the Production Enviroment.
Total control – total awesomeness!
The images below shows the solution in production before a change and after a change. We decided to use the NPC “Butler” as a story teller through the game. So when you complete a room and go back to the Main Map – the Butler now provides you with some context and information thats important for your progress in the game.
As the ACDC Hackathon draws to its climax, our team’s dedication and innovative spirit have led us to target three advanced badges, each reflecting our commitment to solving complex problems with cutting-edge technology and best practices.
Crawler: Revolutionizing Assistance with Copilot Studio
In our quest for the “Crawler” badge, we’ve integrated Copilot Studio into our Power Page site, embedding a Copilot bot designed to aid users when they’re stuck on a course level. This ingenious feature utilizes a cloud flow triggered by the user’s input, leveraging the Dataverse action “Search Rows (Preview)” to find and return answers for the specified course level. This not only enhances user experience but also showcases our innovative use of search to solve a real-world business problem.
Client Side Salsa: Ensuring Smooth Performance with Modern Frameworks
Our pursuit of the “Client Side Salsa” badge highlights our application’s fluidity, achieved by running entirely within the client’s browser without becoming a cumbersome monolith. By crafting a PCF control for our interactive course game using TypeScript and React, we ensure our setup’s compatibility across a wide range of browsers. This approach underlines our strategic use of modern front-end frameworks to deliver a seamless and responsive user interface.
ACDC Craftsman: Demonstrating Development and Deployment Excellence
The “ACDC Craftsman” badge is a testament to our adherence to development and deployment best practices. We’ve established three environments (dev, UAT, & prod), focusing our component development within the dev environment. Our deployment strategy is streamlined through Power Platform ALM pipelines, incorporating a pre-deployment approval step via Teams. This allows for meticulous control over deployment timing and participants. Moreover, our use of Azure DevOps Repositories for the PCF control exemplifies our commitment to source control and project management excellence.
As we conclude this hackathon journey, these badges represent more than just our technical achievements; they signify our team’s holistic approach to innovation, user engagement, and operational efficiency. Our efforts to blend advanced technological solutions with practical application and meticulous project management illustrate the essence of true ACDC craftsmanship, setting a high bar for what can be accomplished in such a collaborative and competitive environment.
When connecting to as many services as we do (humblebrag), it’s extremely important to keep keys and access credentials secret. There are bots and such that continuously scan GitHub, picking up anything that resembles access keys or connection strings. Therefore, we have set up dependency injection in our Azure Function App, and we keep all our important keys in local.settings.json. These settings are loaded into program.cs and added to the function app via the Config class. This makes them easily accessible in all the files we need. We set the same settings in Azure, it just works!
Using Github Actions to deploy our React app to Azure with built-in es-lint and verification ensures us that only functional code is published to azure.
Git strategy
Using branches, commit messages, pull requests, static code analysis we are cruising through the waves with our git strategy. Keeping everyone on the team informed on our progress and the way forward.
ACDC Craftsman – for practicising development and deployment best-practices
Hello, Developers! We’re thrilled to share an update that marks a significant leap forward in our development workflows. In addition to refining our Git branching strategy, we’ve seamlessly integrated a new Azure Pipeline for Resource Template Deployment. Let’s explore the details of this cohesive development ecosystem:
Branching Strategy Overview:
Our branching strategy revolves around creating distinct branches for various stages of development and deployment. Here’s an overview:
Main Branch:
Represents the production-ready code.
Protected to prevent direct commits.
Only updated through pull requests after rigorous testing.
Development Branch (Dev):
Branches off from Main.
Developers create feature branches based on user stories, bugs, or work items.
Naming conventions:
users/username/description
users/username/workitem
bugfix/description
feature/feature-name
feature/feature-area/feature-name
hotfix/description
Development Workflow:
Feature Development:
Developers create branches based on the naming conventions.
Work is isolated in feature branches, promoting parallel development.
Regularly synchronize feature branches with Dev.
Merge to Dev:
Feature branches are merged into Dev using the “merge squash commit” option in Azure DevOps.
This creates a cleaner and more readable history, grouping related changes.
Testing on Dev:
Dev serves as the integration branch.
Rigorous testing, including unit tests and integration tests, is performed on Dev.
Staging Environment:
Rebase and Fast-Forward:
Once Dev passes all tests, it’s time to merge into the Staging branch.
Use the “rebase and fast-forward” merge type in Azure DevOps.
This keeps the commit history linear and ensures a clean transition to the staging environment.
Staging Testing:
Staging serves as a mirror of the production environment.
Conduct thorough testing in the staging environment to validate the deployment readiness.
Azure Functions CI/CD:
CI/CD pipeline for Azure Functions ensures swift deployment of updates.
Real-time communication capabilities are maintained at the forefront of efficiency and reliability.
Unified CI/CD Ecosystem:
Building upon our recent achievements in Git branching strategy and Azure Functions CI/CD, our focus has expanded to create a unified CI/CD ecosystem that seamlessly incorporates both application and infrastructure deployments.
Azure Resource Template Deployment:
Here’s an overview of the latest addition to our arsenal:
Pipeline Creation:
A dedicated Azure Pipeline has been crafted to handle the deployment of Azure Resource Templates.
Purpose:
This pipeline is purpose-built to automate the creation and updates of Azure services based on Resource Templates.
Conclusion:
The synergy of our refined Git branching strategy with the new Azure Resource Template Deployment Pipeline creates a unified and streamlined development lifecycle. Changes smoothly propagate through testing and into production, ensuring a reliable and efficient deployment process.
Stay tuned for more updates as we continue to innovate and refine our project, delivering cutting-edge solutions to meet dynamic user needs.
The captain log business value is that he has an app with all the tools he needs at the tip of his hook.
A new feature:
Behold the “Reveal your true face feature”
Revealing the true face
Some pirates find their interest in hiding away, and then it is handy to have an app to show the true face and spot if this is a know fellow shipmate or a rivalling pirate that deserves to be keel hauled.
The service uses a mobile or tablet camera to take a picture of the person in-question and then posts it to mutiny services for identification and face recognition in order to find who this person is.
Our main goal with this years ACDC was to make the workday a lot easier for both the Pirate Planners and the Pirates itself. We had identified that the use of Finance and Operations standard functionality for both planning and Employee Self-Service is far from easy and user friendly to use. Therefor we decided to use these days to create this:
A Model driven app for the Pirate Planners to use when they plan for what raid what pirate should be on, based on the skills that pirate has. This Planner app receives all the data it needs regarding the raids/projects and the pirates with skill profile directly from F&O, so that they always have the up to date data to work with as this is crucial to be able to do the correct planning.
A Canvas app for the Pirates to use on their mobiles, where they can see and update their personal information while the app talks directly with F&O, accsess other information that is relevant for them that we have integrated into the app like your calendar and meeting, let you see where the Planners has booked you, an AI chat that can give you answers for whatever you want and more.
PowerBI reports showing what the Planners have planned for in the different raids and other relevant information.
And, to make it easier for you judges, here are the reasons why we think we deserve a lot of points in the different categories:
Excellent User Experience:
Our entire idea before the ACDC was that we wanted to create something that gives everyone that struggles with the user experience in F&O a better workday, every day! The solution we now have created will give all the Planners out there a new, innovative and very user friendly way to plan their pirates and other resources with the data that is already in place in F&O. And, for every pirate and other employee in the company, their experience with the brand-new mobile app for Self-Service, they difference from what they experience now in F&O is almost impossible to describe! This is so much more user friendly, cool and awesome that they will be amazed!
Most Extreme Business Value:
As we have said before, this work is not easy for companies using it today. We know that for example with planning, many companies have a excel sheet that they update manually with data from F&O to do raid/project planning. All of these companies will be thankful that we created this Model driven app these days, as it really will both save them time, make sure they always have the correct data to work with, and give the company a much better up-to-date overview over how their pirates and employees are booked the next weeks.
And if that wasn’t good enough (to be honest, we first only planned to create the solution over, but we also wanted to do something very good for all the pirates, not just the planner), the Canvas app will give a huge business advantage to all companies using F&O! Even if they don’t do Planning for their resources, they can of course still use the Pirate app for all their employees, where they can show and give the employees the possibilities to do everything they do in F&O as Self-Service today, and we can include whatever other data or solutions they use directly in the mobile app so that the employee gets all the information and possibilities they need in one place instead of having to go several places! And, the app will of course be teamed with the companies logo and colors, so that for the Employee, the experience will be that this is an app only for them!
Rock Solid Geekness:
When we are three low-code and two no-code pirates going to a Hackaton, then something we really wants to learn more about is code and Geekness. We have learned a lot and used react and Node.js as you will see in the solution under, and all the time we have spent drilling into how to use the data from F&O correctly in POwerPlatform… Phu, we now know a lot more about many more tables and data coming out from F&O and how we can use it than what we did before. And, that ladies and gentlemen, is rock solid geekiness in the ERP world!
Killer App:
The way all components in this solution is tied together, really is what makes it a Killer App! We have connected F&O to a Model driven app and to a Canvas app, and the canvas app updates data back in F&O. In addition to this, PowerBI collects data both from F&O and the Model driven app, to show the reports we want. We have also extended the Canvas app to have so much more information that is relevant for the Pirate (and remember, the canvas app also shows information from the Model driven app regarding how they are planned!). When all of this is connected in a solution we now only have used 3 days to build, yeah, this deserves a lot of point! If you haven’t worked with F&O data in PowerPlatform before, then it’s hard to know, but this not straight forward.
Screenshoots of the Pirate Planner app and the technology used to fill it with data (with explenations under the pictures):
For the captain to check the various available project raidsOnce the project/raid is selected, you set what assignement you want to rederve hours forAnd then you reserve the piratePowerBI report that shows the info needed from the model driven Planner appTo save time without a datalake when gathering data from F&O we use the old and lovely tool PowerQuery inside Dataflows
Screenshots of the Pirate app and the technology used for that app (with explenations under the pictures):
Frontpage of the appView your calendar and meetingsView your bookings coming from what the planners has done in the new Planner appView your information from F&O and directly update the infor in F&O when you submit changesOpenAI embedded chat for the Pirate to use to whatever!PCF code used to integrate a PowerApps Custom Control to run the Node.js (shown under)React and Node.js web app on Azure used for the OpenAI chatbotCustom connector for Microsoft Graph API we have built to get picture and other data for the logged in user of the Canvas app.Custom connector codePowerAutomate to give you the greating of the dayPowerAutomate to find jokes/insults
And what has this even given us?
Why we have clamied the badges we have in this post: ACDC Craftsman: For the entire solution, how it all is connected and works! Dash it out: The PowerBI report for the data fra F&O and model driven app Client side salsa: For the OpenAI embedded chat using react and node.js Retro: For using PowerQuery to collect data from F&O Feature bombing: For this fun screen in a canvas app that gives you a lot of features at the same time:
Thank you all for an amazing event!! This has been so much fun and we will definetly be back next year!
Keeping track of what badges, you (and you teammates) are working on. Which one you have sent to the judges and the ones you have won is an important task when competing in ACDC.
The proper way of doing this is of cause to use Azure DevOps 🤓
Importing the tasks
From the website we created .csv files for the badges. We added coluns for the work item type (User story), Tags, Title and Description:
When the .csv files were done, we imported them using the import from CSV function:
Arranging the Epics, Features and User stories
We created Epics for each of our Pirates 365 modules and features for the applications inside each module. We then added the different badges as user stories on each application (feature):
Working with the board
We could then keep track, and work on the user stories using the board view:
Badges we are working on goes into the active column and is assigned to the correct teammate. Badges sent do judgeing are set to “Ready for tesing”, and the one we have won goes into the Closed column🏆
Retrospect
This is the first year we have kept track of the badges in DevOps, earlier years we have used OneNote. My personal opinion is that it worked out fantastic! After doing a retrospect with the team the we got the following quote:
“As the Head of Development at Evidi, I’ve had the opportunity to work with a variety of project management tools and systems, but I must say that incorporating badges and points into our Azure DevOps board has truly transformed the way we approach project management.
First and foremost, badges and points add a level of gamification to our workflow, which has greatly increased motivation and engagement among our team members. This has not only led to higher quality work, but also a more positive and collaborative working environment.
In addition, the ability to earn and display badges for achievements such as completing tasks on time or going above and beyond on a project has led to a more competitive and driven team. This has resulted in faster project completion times and higher overall productivity.
But perhaps most importantly, the use of badges and points has provided us with a clear and tangible way to track and reward individual contributions and accomplishments. This has helped us to recognize and reward our team members for their hard work, which has in turn led to higher job satisfaction and employee retention.
Overall, incorporating badges and points into our Azure DevOps board has been a game-changer for Evidi, and I highly recommend it to any team looking to improve their project management process.”
Since our team is on the law-abiding side of the game, we want to be orderly at all stages. When new code is written and pushed, we make sure to create pull requests so that a colleague can review the code and ensure that we are on the right track.
For build and deploy we use Github Actions
Transparency is also important to us, which is why our repo is open. We have nothing to hide. Feel free to run a code review on our code 😉
Travelling the seven seas is great fun and pirates can get as moody as anyone else. The ships current loot holding will continue to diminish in between raids and weather sickness can strike at any time. The below input is what we use to simulate mood swings, also output as logic in code.
Of course, we have no idea if this is the actual code or not, as we ask to get schematized JSON – sanitized for input into the dataverse. With mood data available we can start tracking if a mutiny is far away or close at bay.
We’re thinking the following badges apply:
The Existential Risk – text-davinci-003 has never looked better
ACDC Craftsman – documenting verbatim logic for the logical heads out there just makes sense, ensuring everyone can consume and understand the logic at hand independent of their skillset.
Dataminer – LLM are nothing but a huge heap of external data baby! We’re thinking Babels tower in blob.
When we need new pirates on our crew we have an app where we can take their picture, and the app send the picture to a server that uses AI to piratefy your face.
The app is a Canvas App with a camera control on the first screen
When user click the camera control they navigate to the next screen where they will see their picture.
They can go back and take a new picture if they are not happy, or move on to “Piratefy me”.
If user click the “Pratefy me” button a power automate flow is triggered. We pass the image base64 value as a value and store the reply value in a variable.
The flow is “Me as a Pirate”
The trigger is a power apps trigger.
First we initiate reusable variables
We grab the image value from the Power Automate
Passing the image over to the CLIP service powered by Stable Diffusion at the Frogner/Oslo datacenter we annotate images to mostly correct the gender or non-gender of the person in the photo. This is our responsible way to ensure the pirate representation of the person is not turning the most beautiful guy and girl into something they definitely don’t identify with.
We parse the response we get
Next we pass in the captured photo, and overlay it with some serious pirate’y prompting to ensure our new crew mates meats the bar (and also the real bar when port-side).
We need to modify the image string to make it the right format for the Ai to handle.
We trigger a child flow (documented further down)
We gather the reponse and send it back to the Power App.
The flow triggered as a Child flow is called “get Crew Member Data – PirateGDP”
The core API in out solution is PirateGPT, a large language model fully capable assigning awesome pirate names and corresponding ships, with the identifiable traits of the pirate. Which we as a responsible HR ship keep fully secure and up to date as needed. When you have seven John’s on one ship, it’s quite important to distinguish them by traits such as red beard or cock farmer.
We PARSE the results we get for get the right format
Respond with the values to the “parent” flow
The Power App
Back in the Canvas App the user will see the newly created name and their picture Piratified:
It also navigate to the next screen where they will see the pirate name they are given and their picture Piratified.
If this isnt glossy and extreme business value, I don’t know what is?
Imagine this being a manager taking pictures of new employees. We all know that Gen Z are used to looking at themselves with prettifying filters. This way the old middle manager can take pictures of their new employees and let Open AI add the familiar filters so that when the Gen Z employee see their own new profile picture they will actually recognize themselves.
Badges
Glossy Pixels – because pirates are beautiful.
Go with the Flow – because it’s all flowing left and right
The Existential Risk – Who knew LLM could be used to generate schematized JSON data structures, and who knew all those crazy internet pics would be the basis for pirate faces of 2023?
ACDC Craftman – All API’s are tested and documented in a shared Postman collection, all is ran over https (not from the beginning) to avoid photo snooping, and API keys are used as the extra layer. No one wants to be the next TMZ victim!
