Phaser is a natural choice for games, but you can also use it for apps. OpenForge, a top-rated mobile app development company specializing in mobile and web solutions since 2016, uses Phaser to build its product, StartupWars. OpenForge kindly agreed to talk about their experience using Phaser.

In their own words, this is what Startup Wars is:

Startup Wars is a simulation platform for entrepreneurship education. Catering to the distinct needs of academic entities, Startup Wars helps educators bridge the gap between theoretical knowledge and practical application in Entrepreneurship education. By offering a risk-free environment for learners to immerse themselves in entrepreneurial activities, the Startup Wars platform not only facilitates experiential learning but also tailors the journey to students' individual interests and majors, ensuring relevance and engagement.

Startup Wars is a simulation platform for entrepreneurship education

Jedidiah Weller, founder and CEO, recounted how Startup Wars started out as a mobile app but had to pivot to the desktop web because its main audience, higher education institutions, had strict accessibility requirements.

an early version of the StartupWars prototype

Accessibility is the process of enabling software and web sites to be used by as many people as possible. Tools and techniques used to create accessible websites include voiceover tools, semantic HTML, and more. With a proper structure, a website can communicate with screen reader software and provide a rich experience for persons with low vision.

Accessibility in web games can be difficult to achieve because they are typically displayed in a canvas element which just draws graphics - it doesn’t have any of the built-in benefits of the other HTML elements.

Still, the team chose to pivot to the web and thanks to Phaser being made for it, the migration was fairly seamless.

In the end, the team solved the accessibility challenge by using Phaser to display the graphics of the simulation and Angular, a web framework, to draw HTML elements on top of the game. What you end up with is, effectively, two separate apps, but since they are both built in JavaScript, it’s fairly easy to communicate between the two. Clever!

Screenshot from a more recent build

Besides the ability to work together with other web technologies, Phaser had a number of benefits that made the team choose it.

Jedidiah talked about how the technology made sense because it's easy to learn for web developers.

Besides that, Phaser is open source, free, and makes for a lightweight build, meaning that it is quicker to load on slower internet connections. If you are interested in the way OpenForge made Angular and Phaser work together, they have a number of YouTube videos on the subject. Here is one such example.

From Phaser Studio, we’d like to thank OpenForge for collaborating with us for this case study and we invite everyone to check out Startup Wars! Learn how to build your own web-based game with Phaser today!

StartupWars