How to create a STEM game or application

To create a digital STEM or E-learning game ‘app’ you will need to make a plan, download software to construct the game and have access to or own software to create the artwork and ‘assets’ for the game. This post covers all of the details on how to create a STEM game or application in a step by step process from software suggestions, to hints and tips.

Blossom Tree E-learning - How to make STEM game
Caption from E-learning game

The steps I used to create an E-learning / STEM game.

This post covers the steps and stages I undertook to create a STEM game or what was then an E-Learning game that could be played on a computer, be it either an iMac or PC.

I would like to mention now that I am not a teacher or a STEM specialist. I took what was a principle and applied it to my game design for a major project. This article focuses more on the creation of the application itself, opposed the focus of STEM subject matter itself. If you wish to read more specifically on the subject of STEM you can find out more here : source

Why Create an E-learning (STEM) Game?

Before STEM was a term I had heard of, I wanted to create an application that was both entertaining and educational for young children. Games or gaming has a bad rap for being mindless and many are (I do like a mindless shooter as much as the next person). I was also a fan of the classic puzzlers growing up such as Monkey Island and Fate of Atlantis.

I wanted to create a fun purposeful experience through the medium of gaming that will help children.

And…

When the project was assigned to create a big experience I wanted to create a game that would utilise some of my existing skills as a young designer and illustrator (as a student) and create a product that I would be proud of. I wanted the E-learning game to have engaging puzzles and characters that would pull the children in and compel them to explore through the levels. They also had a mission, they needed to save a friend.

Illustration of a crooked castle for an E-learning game
Crooked Castle for E-learning

About this E-learning game – Blossom Tree

The game was aimed towards children aged 7 +. As the player progresses through the game, they would have to answer questions of varying difficulty until they arrive at the final stage and save their friend. There were 2 main paths that had 2 types of questions.

  • Path 1 = Sums
  • Path 2 = Spelling

    It should be noted that you can pick any of the core STEM subjects for your own project.

Both paths converge at the end to logic and problem-solving questions which broke format from traditional ‘yes” and ‘no’ English and maths.

Black game background for e-learning game.
Blank background for level

The steps used to create the E-learning game whilst adopting STEM

After studying design this was my first venture into developing websites, apps and 2D games in Adobe Flash. From the start, I planned the project from the look and feel to how it would play. I also made a level randomiser but the concept ran into technical difficulties late into the game development – get into your “white boxing people” please. It is such a valuable stage for the process. I have mentioned in detail below what “White boxing” is.

1 ) The idea for the E-learning Game

Sounds obvious, but the idea was an important step. I had a vision and idea for what I wanted the game o achieve and how it may look! After developing a viable idea I set about doing some research online into “pedagogy” and how it could be applied to the design of my e-learning game.

2 ) Game Objectives – “The Mission”

So you have an idea, now what do you want it to achieve? You will need to consider the age range for your game, whether it will be for all educational subjects or will it just 1. If this going to be for free? Etc. As a teacher or somebody looking to make a STEM game grab a piece of paper or open word and start jotting down what you would like your application to do for the world.

3 ) Planning your STEM / e-learning game

Great, so you have established what you want your game to achieve and what will happen in the game. I approached a more narrative approach to my game which lent itself well to word challenges and maths questions. If you are making a Science themed game maybe you could have a lab and you need to find the secret ingredient for a concoction? Of you have calculated sums and outwit an evil computer! The ideas are endless. Start to the application – you game, how many levels, how many characters, sound, animations, and try to do a rough cutting list of what will need to be created. This may change as time goes along.

* note: the more ideas you have the longer it will take finish

Basic Level map for gaming app
Level map for game

4 ) Your Game Project Timeline

If this is your first venture into creating a game project it’s tricky to gauge how long it will take to create a fully-fledged game. If you are building it all yourself – and learning all of yourself it could be a steep old slope = a lot of time. None the less, in order to get your STEM game live you need to set up milestones. I would advise breaking your milestone down into smaller steps if not for timekeeping, then for your own morale.

So, with your idea ready and your research finished and plan set to be into motion. Now is the time to roll up your sleeves and start building. The next set of steps covers the more technical steps for getting started.

Technical steps on “how to create your STEM game”

The game that you see displayed was created by me in Adobe Flash (See product here). To create this game, I had learned how to code in a language called “Action Script”. Action Script is what made the nuts and bolts of the game tick, from the scene transitions to the answers boxes checking to see if the question is right or wrong. I have attempted to break down the process of making your game.

1) What gaming program should I use? Select a program to start making your game

Example of game engines you could use for your STEM project

  1. Stencyl (great for beginners with no programming knowledge)

    Stencyl is great for complete coding novices. The coding system works similar in principle to Lego Bricks, where you can stack and click together the functions and activities in your game. I have attached an example of what you can do in Stencyl. Or if you would like to, you can navigate to the post here and get an idea of how it works – (Stencyl post, custom cursor) Although Stencyl is good and has merits it has many limitations in my opinion. It should also be noted, that this engine is 2D only.

    Stencyl Code Block Example

  2. Unity Software (great for someone with some coding skills, create powerful games)

    Unity software is everywhere and with large developer communities constantly improving the assets and the software but, be warned – it can have a steeper learning curve if you are wanting to create e-learning or STEM games this is truly a powerful piece of kit. One great advantage is that Unity comes with LOTS of tutorials, assets and game templates to bump up your game into completion.

  3. Adobe Animate (Used to be king of the game makers, still good but not the most powerful)

    The E-learning / Stem game shown throughout this post was created in what was known as Flash. Flash, now Adobe Animate has somewhat fallen out of favour with powerful programs such as Unity bumping it out of top position and accessibility issues for Smartphones driving in the wedge.

    It’s a misconception that you can’t use Animate anymore to create rich-media applications – it’s not true. You can still create phone apps, HTML 5, animations, video indents, and games!

2) ‘White Box’ your game first

White boxing is single-handedly one of the best modern techniques I have been taught in recent years as it can save so much time. When I say ‘white box’ its a case of roughing out functionality and lose the form of your game. Worry about the function and how the game plays first and use place holder graphics in the early stages of development.

One terrible mistake I have made in the past with utilising time is to create artwork for a component (part) of a game that will not work and you end up having to junk not only the component but the artwork/animation also.

Rough it, test it, play it and then make it beautiful!

3) Find a game Artist or Designer

A very important step for your STEM Learning game is creating artwork that will be visually appealing to children (and adults) when they interact with your awesome puzzles. I tried to make the artwork for my game appealing to a younger audience, to keep them engaged in the topic. You can either create the visuals yourself, hire an artist (link) or look for free and open-source artwork and make a Frankenstein monster of moving stock graphics! (yes, a pinch of sarcasm)

4) Test, test again and assess – then develop your game further

Test your game on players that have never heard of it or played it. Although, I have to confess that I had trouble finding young testers and the youngest I could go to was 9 years old. Watch how people play your game and take notes on what you can improve. This is a valuable step, more so if this is being created for commercial purposes.

5) Publish your STEM application / E-learning game

You’ve done it! Depending on the size of your game, you have spent a year, 6 months, 2 weeks and you have published the application ready to go out to your classroom. You have created a game with a purpose that will hopefully help with learning and STEM development. – Well, in theory, you have made it, now you need to put it into practice.

How “I” created my STEM / E-learning game

I have outlined how you can create a STEM or E-learning game based on my experience and playtesting. I have attached a few conceptual details and visuals of the original game – Called “Blossom Tree” which was my first major foray into interaction and game design at the University of Cumbria.

Field Background For e-learning game
Static visual for field

I wanted the game to feel warm, friendly and filled with the freshness or being the outside, you never know – the artwork my spur children to go play outside, maybe build a den. You may also notice in the background there is a twisted silhouette of a castle. That is the final destination for the player.

E-learning game spoiler alert!

(Wilber Worm)
(Wilber Worm)

Speed rounds and classroom chalkboard.

Speed Round from e-learning game
Speed Round from e-learning game. (Do you reckon children will know what a blackboard is 20 years? Probably not.
Castle level Background - getting near the end!
Castle level Background – getting near the end of the game.
The empty end scene
Dungeon

Looking back

I feel I may have constructed this game slightly ahead of its time. This game was created as part of a final major project whilst studying at the Cumbria Institute of the Arts in my final year of study. This would have pre-dated the surge in the smartphone and the tablet technology and well before the surge in digital downloading platforms such as Steam, Google Play, Apple Store, PS4 network etc.

This e-learning game was created to be a web application or CD ROM .exe. The platforms for downloading such games weren’t as prevalent then, whether they existed at all. The commercial standpoint if I was to create this game again I do a lot of things differently.

things I would do differently, for my STEM / E-learning game

If I was to remake this game I would add so much more interaction into the game, maybe some quicklimes scenes, a bit more movement and generally make feel a little less static, but hey, this was my first ever go at making something like this. I look at many aspects of the project – especially on the design side of things and hiss through my teeth or feel my toes curl as some of the aesthetics but still proud to this day to hear this from around the corner.

“This is F*****g ace!”

in a Cumbrian accent. And that was directed at what I had learned, what I had created and I had hoped would be an of a benefit to a few.

The take way on how to create a STEM game application

I hope my project and how to post has motivated you and given some insight on how to create a STEM application or learning game. The process of creating a game such as this can be incredibly rewarding. It can also be a big undertaking and if you need any help or have any questions. Well, you know where I am.

If the found this post on “how to create a stem game application” useful please share. It could be helpful for those looking to create an educational game or something for friends and family.

Jimm – Designer & Developer

Other useful posts

My Services :

External and reference services for topic

Cumbria Institue of the Arts (now known as Faculty of Arts)

About Pedagogy

STEM Information

Unity is Awesome – 5 key reasons to use Unity Software for your next game project

In this post I have decided to write 5 valid points of why to use Unity Software in your next gaming project. To put it out there – it is awesome! (in my opinion) and once you have read to the bottom of this post hopefully you will want download and start using it to!

Test tube vector graphics from unity dev lab website

To begin with I was dubious about using Unity. The interface looked complicated and I had little prior knowledge of using 3D software, that was all OK… because I wanted to make 2D games and applications anyway – for now, at least. Whilst writing this post I came across a video that was an inspiration to myself and maybe other startups, designers, artists and gaming indies. The original founder of Doom – John Romero himself created video on starting an indie game. You can watch his interview by following the link.

John Romero Hurrah to Doom

Game icons and unity application icons
Unity Dev Lab Icons

Before Unity (You can skip this bit)

Prior to using Unity, I used Adobe Flash software to create games, applications and motion graphics which were used for commercial and personal purposes. I still use Adobe Animate, although I have now expanded my tool-set and started to use other applications such as Adobe After Effects which gives fantastic results. If you are animator or motion designer I would highly recommend after effects.

( On this new website, you may be interested in reading this – Is Adobe Animate used professionally )

I was trained in using Adobe Flash to an industry standard and used it on numerous projects in the 2000s and early 2010s, it was part of my bread and butter money along with graphic and website design. It was a solid piece of software but something happened… the Smartphone. If you are asking yourself what the ‘smartphone’ has to do with anything, it has a lot. When the iPhone (can’t recall which model) came out, Apple announced that it would stop supporting flashplayer – in other words, the player that displays your video, game or application in the browser stopped! Without going into too much detail and the technicalities, this was the start of the end Flash being displayed in the browser, it became less commonplace for the flash (.swf) to be displayed. HTML5, Applications, and video became some of the best applications but this is a different topic. In a word, flash player fell away for progress.

As time went on, “Flash” started to die out and even became a dirty word. I would assume that this was also a motivation among many, that Flash rebranded itself to Animate – in essence, it was still the same software but the name of the software – ‘Flash’ was gone.

a fun project that was created to promote a painter

I still hold it dear, and Flash (now Animate) is still a very capable program for 2D today, but tech and software are evolving. So this is where I started to look into gaming platforms and have so far settled on Unity after trial and error.

Lets talk about the perks of Unity Software!

The 5 keys points – Why Use Unity

1) It’s Free ( Sort of )
Unity Software is free for personal use and for smaller scale developers. If you are just starting a game, VR or development project you will not have to fork out huge upfront cost for the software. It’s also great even if you are hobbyist. Who doesn’t love free! I can only recommend that you download it now and form your own opinions.

2 ) It’s A Capable And Versatile Piece of Software
Whether you are looking to build a 2D game, an app or a full-scale 3D game Unity is great for both. Unity comes with 1000’s of ready to use assets to start creating your game. And that’s not all. With simple touch the button you can flick between 2D and 3D and even 2.5D. Here are some examples of the what has been made in Unity. (made with)

3 ) The Asset Store
The asset store is a huge library filled with gaming goodies to help you make your game. Its filled with sound effects, graphics, models, game templates, monsters, AI, and a whole host of other bits and pieces to the get the ball rolling. The Asset Store is constantly expanding with new assets ready for you to download and use. Please note, some of the assets vary in quality. You can use the rating system to gauge whether the asset you are looking to buy or use for free is good for you.

4 ) Tutorials
The tutorials are great. Unity has a learning curve and there is no easy way round this. The good news is, you can start using the basics quickly and you don’t have to be a coding guru. I would advise downloading Unity Software and following some of their tutorials first. You may be pleased to know that if you are ‘design heavy‘ you can download a template that will do a lot of the leg work out for you. But this can also be limited for the scope of the project.

5 ) Community – Forums
For me this is one of the best things that put Unity above the other free gaming engines I have tried and tested. Unity comes a with great community, that is friendly and willing to help.

This community will help you out when you are stuck, add new assets to the store and push the quality of Unity. I have used other free game engine forums and they are no where near as helpful and busy.

Potion bottles from Unity UI

What Unity Software can Achieve

Based on a couple of free engines I have used (wasted my time on) I can say that Unity Software is a great piece of kit. The only thing I might say is, that Unreal seams to offer a better rendering engine for the lighting and environments. I have never personally used Unreal but it does look very good. But, whilst we are talking about the quality of graphics, have you heard of the Book of The Dead? This looks amazing!

Book of the Dead

Book of the Dead is a game / live demo created in Unity Software. The game shows the graphical might of Unity and what can be achieved using their engine, creativity and skilled in 3D modelling. I was blown away with the Blacksmith, and then I watched the Book of the Dead demo. You can watch the Book of the Dead demo to see what Unity is capable of but please note :- you need a powerful computer to download and run the demo and its assets.

Watch the Book of the dead demo to see what can be achieved using Unity 3D

Unity Software Testing Website

On my showcase and Unity sandpit website I have added a couple of my own mini games and experiments to show you what you can do with Unity. These are small scale experiments showing live the demo’s which can be played in your browser on your PC or Imac.

Enjoy Reading About Why Unity is Awesome?

if you would like to see more Unity Ramblings, artwork, cool assets then feel free to sign up to my mailing list.

So you know… I am not an advocate, affiliate or linked to Unity Software, I just watched to sing its merits and perhaps save you a little bit of time.

You may also find this new website dedicated in making indie games interesting