Progressive Web Apps will increase in the future, and with the game engines out there we think that PWA games will be a good plan for developers
We will show you the pros and cons related to progressive web app games. At the end, the user will have a great gaming experience: with the Offline feature, avoid installing and having canvas (and HTML), JS, and CSS to create the game.
We have a set of tools to make a really great game experience. Let's begin with your PWA Game Development Plan:
It may sound crazy, but the games are available on the browsers more and more since HTML5 got released some time ago. That's why PWA Games are the future. Players love online and multiplayer, and since they're already in a browser, they can play the game easily and you can share it as a multiplayer. Usually game developers fail because they launch their games on any platform and usually they get the most sells the first day, then later on games usually start decreasing their sells.
The good thing about having a PWA Game or how they're also called Web Games (because Progressive Web App is most like a technical term), is that you can post things related to the game in order to engage with more people by using any search engine or social media and they have several points to get into your Web Application.
With a good strategy, you can point your users to become players and so you will have more people playing your game, which I believe is the main objective of every game developed.
There are some reasons why we picked web for our game to be launched:
There are also some things you may need to take into account. Here are some ideas you should consider when developing a PWA, based on our experience:
Here are 7 scenarios when you should use Progressive Web Apps for games:
If you already have a native app, you might want to stick with it, because migration is not always easy. On the other hand, if your project is just starting from zero, you may want to consider implementing it using Progressive Web App in the first place.
PWAs are mostly oriented for Mobile experience, since they offer a website as a Native Application so if your focus are phones, you should consider progressive web app.
If your designs looks like an app, feels like an app and you want to look like one, PWA is for you.
Remember that PWA are on the browser, and not all the features of a device are available there. If you rely on any device feature, PWA might not be the way to go.
One good thing about PWA is the offline feature. Projects with the idea of working without internet match with progressive web apps.
One good thing about PWA is the offline feature. Projects with the idea of working without internet match with progressive web apps.
You can have both! If you develop a game in any other platform, you must go to either PlayStore, Steam or a Console Store, with your game on the web, people does not need to have the program, the console or any other associated. They can go directly to your website using Google (and recently, you can add it to the PlayStore as well).
Yeah Mobile! Nowadays in 2020 people uses their cellphones ALL THE TIME. There's a rumor that people is usually giving up on applications because they want to have space on their phones for things like photos or videos. Everyone has a phone with internet connection, then why would you ask them to download a game that
Nowadays, the PWA are increasing a lot, and two years ago maybe, they were just kind of an idea that was looking good but not good enough to implement now. As you know, Javascript gets more and more power everyday, and having PWA that you can even use in the playstore, will give a lot of power to your application.
We say that this is an Online Game, because in fact it is... that does not mean that it shouldn't work when offline. Progressive Web App offers that to us, and it's just amazing! In fact, this was also a decisition we took when creating our application, we could implement online on a native app, but it was more the deal than the revenue. Now that PWAs offers both, well... we decided.
You can install PWAs as if they were native aplication and that is awesome! Users don't care if it's a browser at the end, if they can see the content, the user will be glad to see it and you will be happy to get a visitor everytime. So why not giving progressive web apps the chance?
We have also been reading that there's a way to get the PWAs into the PlayStore. We are really interested in that, currently we are still in progress to become one PWA Game, but we are looking towards also appearing on the PlayStore.
Trusted Web Activities (TWA) are the way to go for deployment and Android Studio help us doing this. Here are the steps you should follow to deploy your PWA to the play store:
We believe that the application have an expiration date, and browser games based on web apps will be trending soon. Every day, the people prefers to navigate directly to the content, rather than downloading it and then playing.
As Game Developers, of course we want to have a set of tools to make our work easier, that's why some of us look for game engines to make that process easier.
Basically, is a software development environment designed to build video games and provides game developers a set of tools to create them quickly and efficiently. With that said, there are plenty of game engines out there, some are famous and used a lot and some are not. In this section, we will be focusing on engines that help build games using Javascript, Canvas and WebGL.
Since we are using JS for our website, we need an engine for Javascript. There are many out there but the one I suggest is Phaser JS. There’s a plenty of content related of how to use it, examples and documentation and also it’s pretty simple to implement (of course, it depends on the complexity of your game).
Phaser is a fast, free and fun open source framework used for Canvas and WebGL. It works also on Mobile and Desktop and it’s developed by Photon Storm.
No. As we mentioned above, it’s used for Canvas and WebGL, but since on our PWA we can implement those, we are going to use them right away.
Here are 5 web games examples built using Javascript, HTMl5 and of course, PhaserJS. I tried to get some that you can actually play, since there are many that ask you to pay first for the game:
A pixel art game which objective is to get as many gold coins as you can by buying and selling goods. You move your ship using AWSD keys and visit several places.
A real-time strategy game, pretty fun to play without going into deep mechanics. The game focuses on capture points that generate resources, and controlling/positioning your units as you feel is the best way.
Really fun idea where you play as a goat and you lick the clues in order to discover all the hidden secrets.
A dungeon based game, you know, you're a wizard... duh... It's pretty fun!
Amazing game with a simple idea: let's make the snake going in circles everytime the user touches it!
You can visit this blog to check more games that are made with PhaserJS.
One of the nice things about Phaser is that there's many content related for you to start understanding and develop your game as you want. You can check out the learn section from the PhaserJS Website. There's a plenty of code examples, docs and blogs you can use as a base for your game.
Another option I suggest is to get one of the following books, which are amazing and helped me a lot understanding PhaserJS.
Now, there's also content shared by others like videos and blogs. Here are some that I've found that are useful:
Also here are a couple of tutorials that are really good when starting on the PhaserJS World:
Finally, you can just go and check out the PhaserJS site in order to look for more details.
Of course, there are a lot of other engines we can use, personally I don’t have much experience on any of the following but I’ve seen some really nice games coded using those frameworks/engines
When we were creating this application, I was really new in terms of PWA, but I found the following series of videos that you can watch, so that you have more context on how to build your own Progressive Web App. This video is not mine, but I believe is really good to check out the series that The Net Ninja Channel has created:
User Experience is a topic you must pay attention to, so I would suggest this Web Design Master Course to maximize your knowledge about this topic.
On your website!! Of course there's space for all that content you have available. Now, you can say that having a website might not be what you want since what you want is just to deploy your game and people should play it...
Well, that's true, but if you take a look at the big games out there almost all of them have a website related, and even the story or lore is shared using social media, youtube or a the website itself. Having a website will give you more benefit than the one you think:
A place where you can play and also check for the content of the game? That's the dream. We have gamers that are really into the lore, story, images or community shares about the game. Even if they play it on console, what they usually do nowadays is look for other person playing it, google the game and search for some amazing background images. Why should you keep that content in a social media profile, instead of having a professional website AND the game in the same place, so that people can do both whenever they want? Well, that's one of the reasons why having a PWA is also worth.
Oh dear marketing... It is usually one of the big mistakes we (the developers) make when we have to deploy the game. Yeah, we created a nice looking game, with tons of amazing code, content and a story that would make cry anyone... but nobody ever plays the game, and they can only rank it on a platform and then 3 days later, nobody else is going to see it. There is not engagement, no way to really interact with your player, just by dropping a comment and that's it. From my point of view, that's an opportunity that you may be missing
Having a PWA Game (or even a PWA about your game), opens a door of creating a new experience to the player so that they can understand why your game is relevant to the world, they have a place to see things related to the game they love, a place they can visit later and see new updates, new things from you, new designs, you can
Appscope is one reference page where you can find a lot of PWA that have already been released. I have been checking this out for reference and it has a lot of categories where you can check out! Currently I believe there around 70 different PWAs you can see on that page. One of the most famous you can find out there is the 2048 game, which is a really fun game to play.
If you are looking for a nice place to host your Web Application, I would suggest visting WebHostingPad, since it offers great options and pricing:
Here I will give you 5 advices if you want to create your own PWA Game. This is just based on my experience:
Your own project... and its a game! Just having that in mind should make you feel proud! But as everything in life, it may be really hard. We created a blog talking about how important your feelings are and you should always keep this in mind. There's a wonderful world waiting for you if you understand how to control your feelings and your productivity will increase a bunch.
Even when you already finished development, you have something to share for sure. That's one of the reasons why I love having a Web Game, because you can keep sharing content with the people that likes your game. I mean, you can do that on any social media but having control on the player experience is beyond just sharing an image or something. It's like a piece of art that is also part of your game, a section that may not be present on the game itself, but they can see it now through a blog, post, video or any other interaction you put down on the web.
Take some time to review your day routine. We all have one time lapse where we feel like we can do everything. For those who have played Super Mario, it's like when you get the Star and you are invincible, you star running through the level and crazy music start playing and all kind of colors are seen (at this point, I'm not sure what these stars were made of). But the point is that you feel unstoppable, you need to get the most difficult stuff done in this time lapse.
Last Updated:
We use cookies, services amd others for the best experience. Please read our privacy policy and disclaimer.