Final delivery Peaches Mini Games

Step into the world of Peaches Mini Games, where education meets innovation and business value takes center stage. Join us on a journey through an English classroom case study, user-centric design principles, and the integration of killer AI in crafting an engaging quiz game. Uncover the core philosophy behind Out of the Box Fun and understand why our participation in this competition is driven by a passion for spreading joy and fostering inclusivity. This post will guide you through the various components of Peaches Mini Games, providing insights into its educational impact, user-centric design, and groundbreaking use of AI technologies.

Most Extreme Business Value

The business value of Peach Mini Games is linked to education. The game is designed to make learning motivating for children while providing valuable insights for teachers. By analyzing the results from the game, teachers can tailor their instruction, optimize time usage, and address each student’s specific competency level.

Let’s go through the business value with a case study.

English teacher Katrine is going to teach class 2A about Australia. She wants to focus on where the country is located and what makes it special. She plans to use traditional chalkboard teaching methods, but to ensure that the students have truly grasped the information, she needs to assess them. She will do this in two ways:

  • Quiz
  • Glossary test

The quiz gathers information about Australia from ChatGPT, but Katrine has, of course, double-checked the content to ensure it aligns with her teaching materials. The purpose of conducting the quiz is to find out if the students have understood the key topics from the lesson.

In addition to the quiz, Katrine wants to take the opportunity to have a glossary test focusing on Australian animals. This way, she ensures that the children learn about the country’s unique animals and how to spell the related words.

After conducting the two tests, Katrine sees in her PowerBI dashboard that the class, as a whole, has a good understanding of Australia based on the quiz. However, she notices that many students had difficulty spelling the words for the Australian animals. Therefore, she needs to make some adjustments before moving on to the next topic in the curriculum.

Next week, Katrine focuses on improving the class’s spelling skills, and on Friday, she conducts the vocabulary test again. This time, she sees in PowerBI that the results are excellent, and the measures she implemented have had a very positive impact. This means that Katrine can continue teaching with confidence, knowing that Class 2A has a solid understanding of Australia.

Excellent user experience

From the outset, our primary focus was on designing a seamless and exceptional user experience. Our aim was to establish a cohesive visual identity throughout the entire solution, ensuring that users felt immersed in a unified universe.

Given that the overarching storyline across all the games revolves around the badass Princess Peach rescuing Super Mario from certain peril, we decided to make Peach’s signature color, pink, our primary color. However, we also wanted to infuse our own unique twist into the design, moving away from the traditional 2D aesthetic of the older Super Mario games.

To set the tone and serve as a foundation for our visual identity, we began by creating the logo. Additionally, we strived for consistency by employing the same background across all the games, maintaining a cohesive look and feel. This background was meticulously crafted from scratch, utilizing a photograph of a brick wall and incorporating Photoshop effects. Similarly, the buttons and other geometric elements in our apps were also created from scratch using Photoshop.

During our design process, we stumbled upon an incredible image of Princess Peach donning battle gear, perfectly aligning with the vision of our universe, where she portrays a badass version of herself while rescuing Mario.

In addition to our visual considerations, we were committed to ensuring accessibility in our design. To achieve this, we utilized a color contrast checker to ensure compliance with the Web Content Accessibility Guidelines, particularly in terms of color usage.

To deliver a remarkable user experience, we prioritize physical inclusion and social value creation in our game design. Our game is thoughtfully designed to be played both physically and digitally, catering to different preferences and abilities. In the physical version, players engage in outdoor play by moving around a designated area, scanning QR codes to access various mini-games, promoting physical activity and enjoyment of fresh air. For those with mobility challenges, the digital version allows players to control Princess Peach on a game board, unlocking mini-games in different rooms. This ensures inclusion and flexibility, enabling gameplay outside of school hours. By considering physical inclusion and offering a diverse range of play options, we enhance the user experience while also aligning with business value, expanding our market reach and creating an inclusive environment for all players. Additionally, our website is fully responsive, ensuring seamless access to the game on desktop and mobile devices, further promoting inclusivity and convenience for players of all backgrounds and preferences.

Killer AI

Our journey to make a Bowser Quiz mini-game revolves around creating an innovative chatbot browser quiz game using Copilot Studio. We embarked on an exploration of different AI technologies to enhance the functionality of our game.

Initially, we experimented with Generative AI, which proved effective in generating answers. However, we encountered a challenge in verifying the correctness of these answers. To overcome this limitation, we decided to leverage AI Builder in a power automate flow. Unfortunately, we encountered another obstacle as the process required an approval text before further processing.

Undeterred, we continued our pursuit of a robust solution and discovered the new Prompts feature in Copilot Studio. Through multiple iterations and fine-tuning of the prompts, we successfully trained Copilot to accurately determine whether a given answer is correct or incorrect.

Some examples:

It works!

By combining the power of exploring the limitations and uses of Generative AI, AI Builder, and Copilot’s Prompts, we have created a chatbot browser quiz game that not only provides answers but also verifies their accuracy. This innovative approach showcases our ability to harness the limitless possibilities of AI technologies, such as machine learning and neural networks, to craft unique and intelligent solutions.

Through our project, we aim to demonstrate the potential of AI in creating engaging and interactive experiences. The incorporation of various AI techniques and the iterative development process highlight our commitment to pushing the boundaries of AI innovation.

We are excited to present our Bowser Quiz mini-game, showcasing how we have harnessed the power of AI to create a cutting-edge chatbot browser quiz game that not only entertains but also ensures the accuracy of answers.

Pandoras Box

Out of the Box Fun is in many ways both the core of the product we deliver and the reason why we participate in the competition. The product, or more precisely, the game, is crafted based on pure joy with the primary goal of contributing to learning in a fun and engaging way for students. Inspired by the nostalgia of Super Mario, the opportunity to put our own spin on things (yes, made Super Mario into a pink paradise), and the ability to create whatever we wanted, planted a seed in all of us to develop something that genuinely stems from joy and fun.

In addition to the fact that what we have created obviously has the primary purpose of spreading joy, our participation is also based on the same. Our team comprises superstars in low code as well as those who never felt at home in the coding world but wanted to give it another chance and created their first canvas app this weekend (and now definitely want to do more of it).

The opportunity to create exactly what we want has given us the chance to explore our most creative ideas in an environment with the industry’s most skilled individuals. This unique environment has opened up opportunities for learning and mutual support in a way that surpasses other available options.

Peaches Mini Games

In the description of Peach Mini Games, we will first showcase the game as a whole and then delve deeper into each of the different parts of the solution.

Brettet

Mini game 1: Hangman

This is a Canvas App built only using the out of the box components and Fx logic.
Here is a step by step guide to how to build the Hangman game.

Mini game 2: Bowser Kill Quiz

Here is a step by step description of how the quiz is built

Mini game 3: Glossary test

Mini game 4: Head 2 Head

Mini game 5: Peaches flight

Score board

Here is a description of how we integrated it into Teams.

All together now – in Power Pages

We aim for

Feature Bombing

We can we to four games and a power bi report from the Power Pages site

Power User Love

The Power Pages site is showing that we can use pro code (the game) and low code together seamlessly

Power User Love

Client Side Salsa

All the games and the website is browser based and make up an extremely fluent and cohesive solution. It’s not a heavy monolith, but we have built each app individually.

Retro

We are using HTML and vanilla Javascript (ONLY) to make the interactive game on the website. No libraries, no dependencies, it’s sustainable to not load big libraries and only use a little bit of the code. This is very Retro! vanilla, baby!

Camelion

The website is fully responsive and work on mobile and desktop, enabling users on all devices to have fun with our game.

Styling Power Pages

Bringing it all together with a cohesive visual identity on the Power Pages site that will be the landing page for our game.

Setting the logo – no code style

Setting a theme – no code

Adding Pro Code with custom CSS

Game Play Pro Code in a Low Code solution

Adding the game code in a Web template and including it on the home page

The web template has HTML and vanilla Javascript.

You can find all the code of this web template in this open repository:

https://github.com/peachesofitera/PeachesMiniGamesMap/blob/main/index.html

Responsiveness

Of course the web page is responsive so that players can play from their desktop or phone. Some kids are not able to run outside and we want to be inclusive.

When Peaches hit one of the boxes, the game will be launched in a new tab for the user to play! How’s that for feature bombing!

Hangman

Peaches Flight

Glossary Test

Bowser Kill Quiz

Hammer Bro Head 2Head

PowerBI report

We embedded the Power BI report in the Power Pages site to give the logged in user the ability to see where on the Scoreboard they are.

Mining into Peach’s Kingdom

With this post we claim the badges:

  • Dataminer – for using dataverse as a datasource in Power BI, with data from the games.
  • Plug N’ Play – for embedding the Power BI report into teams.

The data from the Power BI report is coming from a table in dataverse called “Leaderboards”. You have the score of each player for a certain game, and what number of try there was for that game. We then use this data in the Power BI report to show all of the players score in a dashboard. There is also the possibility of seeing one specific players data. Which is of course presented in the same graphical theme as the other apps.

And of course it doesn’t stop there. We then also made sure to embed the Power BI report into Teams. Into our Peaches-team where we can then keep track of the players progress. The report addresses a crucial business need by allowing us to efficiently track and analyze the progress of players in the various games. We can then make data-driven decisions, like seeing which game the kids find more fun and entertaining. This can then be used to further develop games for the kids, and enhance their learning experience. Which will allow us to constantly evolve and improve.

UPDATED! The only way is through Teams

UPDATE: we also aim to claim the Hipster badge with this blog post. This is best practices for governance in Teams.

With this blog post we claim Early Delivery Badge

Early Delivery

For collaboration throughout the development of the Peaches Mini Games we use Teams, SharePoint and Microsoft 365 suite.

Posts and communication

We post and communicate through the Teams Channel that we created specifically for this development.

Files

We use the files area (SharePoint Document Library) for file sharing across the team. We have securely stored in one place, always in sync.

Notes

We keep track of all bigger notes, for example the graphical profile, color codes and other important details in OneNote.

Governance

We create a new private Team for Governance.

We are following the guidance from this amazing Youtube video we found:

Creating the Governance Team

Adding the list for Responsibility and adding the reponsible people:

Superior O365 Governance Plan document:

Glossy neon warrior Princess Peach

With this blog post we are aiming for the Glossy Pixels badge

We will also argue that to have a consistent visual identity across all the games will create a good user experience, so this blog post should also be considered to count towards the Excellent User Experience category.

Excellent user experience

Logo

We created the logo first, to set the tone, find the colors and use this as a baseline in the visual identity.

We use a website to generate this glowing effect

https://www.textstudio.com/logo/3d-neon-pink-text-27

Background

To get the same look and feel across the apps we also use the same background.

This is created from scratch with a picture of a brick wall and effects created in Photoshop

The buttons on the bottom and other geometrical elements used in the apps are created in Photoshop from scratch with the help of this tutorial:

https://www.youtube.com/watch?v=3JxCbwn-6bQ

Why do we bother creating this from scratch? Because it’s fun! 😀 And a bit retro to not use AI to generate everything?

We found a good picture of Princess Peach where she is in her battle gear. In our “Peaches Mini Games” world she is saving Mario – so we wanted her to look badass..

Implement the visual identity across the apps

The Power BI Scoreboard

The Hangman Game

Peaches Flight App

We will also make sure to implement this visual identity across the other websites and apps that we make as the solution progresses to make sure that the user feels that they are playing games in the same universe.

Business in the Front, Party in the Peach Mini Games: Where Fun Meets Fortune!

This post has the topic within Most Extreme Business Value category

Dataminer

Dash it out

At first glance, Peach Mini Games might seem like pure fun – a temporary escape from the realities of everyday life and an invitation to indulge into a dream. However, that’s where one truly misses the mark. When deeply exploring Peach Mini Games it is like stepping into a classic ‘Mullet’ situation: Business in the front, party in the back. Or maybe it is the other way around. Anyway…

You’re met with vibrant colors, pixel-perfection that would make anyone envious, and scalability smoother than a cat’s movement. But beneath this lies a complex tapestry of business value.

Hangman
Through our Hangman game, one not only learns the player meanings of words but also how they are spelled. Research has shown that the use of Hangman for these purposes is highly effective. Studies indicate that this method is motivational for learning, providing a playful approach that makes it more engaging for participants. Additionally, research suggests that interactivity, such as actively participating in game-based learning like Hangman, can enhance vocabulary and spelling skills more effectively than traditional methods.

Reference: https://jurnal.untan.ac.id/index.php/JEEP/article/viewFile/57-65/75676588091

Quiz
To complete the task of saving Mario, Princess Peach must pass a quiz. The quiz is integrated with ChatGPT and serves both as an entertaining and educational part of the game. At the same time, the concept is so versatile that it can be directly applied to create business value in the field of education.

Imagine a scenario where one configures a quiz within a specific subject area. Students can use this quiz to practice and identify knowledge gaps, while ensuring they rely on reliable sources. This setup provides teachers with control over information access, limiting students’ searches to a secure environment instead of allowing unrestricted internet browsing.

Statistics
Similar to how the games described above can motivate learning, our PowerBI scoreboard can better equip teachers to understand what students know and what they need to work on, both on a group and individual level. The statistics can pinpoint specific areas that require more attention, ensuring teachers use their time effectively and work in a more data-driven manner.

Pink Paradise

With this post, we claim the Happy Camper Bagde.

While creating a fun game where Princess Peach saves Mario, our camp at Peaches of Itera is just awesome. We dressed up as Peach and Mario to set the right mood, and the whole camp is buzzing with excitement and friendship.

Our colorful costumes match the game’s energy and our camp is a creative and teamwork-filled space. When the sun sets, lanterns light up our camp, making it magical. It’s not just a game; it’s a super fun experience where everyone is part of a cool story of success and friendship. In our pink paradise, happiness goes beyond the game, leaving lasting memories like the sweet smell of peaches