I-O games have taken the gaming world by storm, offering multiplayer experiences that are easy to pick up and play for extended periods. They cater to short attention spans with endless gameplay. The craze began in 2015 with Agar.io, a simple game where players moved blobs around and ate other blobs. What set it apart was the massive lobbies that required collaboration and competition among players. This simplicity and social aspect made it a huge hit, even appearing in popular culture like the TV show House of Cards.
Following Agar.io, other games like Slither.io and Splix.io emerged, featuring simple mechanics and large player lobbies. These games became popular on platforms like Iogames.space, a web portal dedicated to I-O games. The absence of review processes and the need for downloads allowed developers to iterate quickly, creating games that matured over time. This trend filled the void left by the phasing out of Flash and Shockwave games.
Evolution of Game Mechanics
By 2016, developers began adding depth to I-O games by introducing more complex mechanics. Titles like Diep allowed players to build unique tanks, while MooMoo offered a PvP sandbox experience with fort building. These additions provided layers of strategy and engagement, attracting a diverse audience. Developers recognized that many players were students playing in classrooms, leading to the creation of browser-based versions of popular games for short play sessions.
Games like Krunker brought Counter-Strike-like gameplay to the browser, while titles like Zombs Royale and Build Royale offered 2D versions of Fortnite. The focus was on creating accessible yet engaging experiences that could capture players' attention even in short bursts.
Adapting I-O Games for Mobile
The potential of I-O game mechanics on mobile platforms didn't go unnoticed. Developers saw the opportunity to tap into new audiences and increase ad revenue. Companies like Voodoo successfully adapted games such as Paper.io and Hole.io for mobile devices, optimizing them for touch controls and offline play with AI opponents. This approach proved fruitful, with Voodoo generating substantial revenue and downloads.
Key elements for success in I-O games include quick startup times, simple mechanics, ephemeral leaderboards, and leveraging network effects. These aspects ensure players can dive into games quickly, engage with minimal learning curves, and enjoy competitive experiences without long-term commitments.
Technical Strategies for Quick Load Times
Achieving quick load times is crucial for I-O games, especially when catering to students with limited attention spans. Gen Z has an average attention span of eight seconds, so games must load swiftly to retain interest. To meet this challenge, it's essential to ensure that games load within five seconds on low-end hardware.
Web platforms are well-suited for this, as demonstrated by tools like Google Docs and Figma, which load rapidly. Avoiding game engines like Unity can significantly reduce load times, as seen in the development of Krunker. Lazy loading of nonessential assets, similar to web pages, is also key. This approach allows players to connect to servers before additional content loads, ensuring a seamless experience.
Engaging Players with Simple Mechanics
Once players are in the game, keeping them engaged is the next priority. I-O games thrive on quick learning curves, with players understanding game mechanics within 60 seconds. MooMoo, for example, offers sandbox-style gameplay with minimal complexity. Players gather resources like wood, stone, and food, building structures from skill trees without the intricacies of traditional crafting systems.
This simplicity ensures players can jump into the action without a steep learning curve, keeping them engaged for extended sessions. Ephemeral leaderboards, another hallmark of I-O games, provide motivation to climb rankings without the pressure of long-term commitment.
The Power of Network Effects
Marketing costs for I-O games are typically minimal, thanks to the power of network effects. Players often share game codes with friends and colleagues, encouraging group play and organic growth. This approach mirrors the way social networks spread, creating a user base without traditional advertising efforts.
Implementing features like party code systems and shareable server links further enhances this effect. Players can easily invite others to join games, fostering a sense of community and competition. This method has proven successful in growing I-O game audiences rapidly.
Challenges and Opportunities in Monetization
Monetizing I-O games can be challenging due to their nature. Players often view these games as quick distractions rather than long-term investments. This mindset can make it difficult to generate significant revenue from in-app purchases. Traffic fluctuations, particularly during weekends and school breaks, also impact monetization efforts.
To address these challenges, developers can encourage players to engage with games on other platforms, such as desktops or mobiles. Offering unique perks for cross-platform play can increase player investment and boost revenue. Strategies like daily rewards and ads on mobile platforms have proven effective in enhancing monetization.
Future of Multiplayer Web Gaming
Multiplayer web gaming continues to evolve, with developers exploring new opportunities for innovation. Improvements in web standards make it easier to publish resource-intensive games, attracting attention from developers on other platforms. The low barrier of entry and network effects make web gaming an attractive user acquisition strategy.
Emerging technologies like WebXR and advancements in web transport protocols promise smoother and more immersive multiplayer experiences. As companies explore user-generated content platforms, leveraging the web's accessibility could lead to new successes in the gaming world.
In this dynamic landscape, developers have a wealth of opportunities to create engaging I-O games. By focusing on quick load times, simple mechanics, and leveraging network effects, it's possible to build games that capture players' attention and drive success.
Having worked for 7 years on popular .io games like Krunker.io, Diep.io, and Ev.io, I've seen the multiplayer web game market grow and evolve on the bleeding edge of web tech over the years.
This talk has been presented at JS GameDev Summit 2023, check out the latest edition of this JavaScript Conference.
I-O games are multiplayer web games that are easy to play and can be addictive with gameplay extending for hours. They cater to players with short attention spans by offering simple mechanics and the ability to play in large lobbies, making them engaging and accessible.
Agar.io, launched in 2015, was pivotal in popularizing I-O games by featuring simple gameplay where players control a blob to consume others in a competitive lobby. Its simplicity and multiplayer aspect attracted massive player engagement and set the stage for subsequent I-O games.
Initially characterized by basic graphics and simple gameplay, I-O games evolved around 2016 by incorporating more complex game mechanics like skill trees and themed gameplay, enhancing depth and engagement without compromising the ease of access.
I-O games engage players through features like five-second startup times, quick learning of game mechanics, ephemeral leaderboards, and network effects that encourage frequent and short play sessions. These elements help maintain player interest and competitive spirit.
I-O games typically grow their user base through network effects and organic sharing among players, especially in school settings. This grassroots approach allows them to acquire users without the need for traditional marketing expenditures.
Monetizing I-O games is challenging due to their casual nature and the environments they are often played in, like schools. Strategies such as offering in-game purchases or pushing players to other platforms where monetization is easier have been employed to tackle this issue.
Recent improvements in web gaming standards, such as WebGPU, WASM threads, and enhanced web transports for low latency, are set to significantly enhance the quality and performance of multiplayer web games, making them more competitive with traditional gaming platforms.
I-O games are multiplayer web games that are easy to pick up but can be played for hours. Developers have added deeper game mechanics and adapted I-O games for mobile, generating high revenue. Acquiring users for I-O games is done by sharing the games to play together at school. Monetization of I-O games is primarily through ads, as it is difficult to generate in-app purchases from the web. Web standards and user-generated content are opening up new possibilities for better web games.
I've been working on I-O games for seven years and I'm going to share some tips on game design technology and business decisions that you can use to build a killer I-O game yourself. I-O games are multiplayer web games that are easy to pick up but can be played for hours on end. The whole .IO craze was kicked off in 2015 with Agar.io, a game where players move a blob and eat other blobs. It became so popular that it even appeared in House of Cards. This led to the creation of Iogames.space, a web portal featuring I.O. games.
2. Evolution of I-O Games
Around 2016, developers started adding deeper game mechanics to I-O games. Around 2018, developers realized that many players were students in classrooms, playing these games as a substitute for console and desktop games. Some developers adapted I-O game mechanics for mobile, generating high revenue. Key pillars of I-O games include fast startup times, short learning times, ephemeral leaderboards, and network effects. To achieve fast startup times, games are designed to load within five seconds on low-end hardware. Nonessential assets are lazily loaded, and the engine is structured to load assets individually as needed. The initial JavaScript bundle for Kronka includes core maps, class configuration, and character models.
3. Game Mechanics and Engagement
In Kronka, players can instantly play the game as a guest without signing in, reducing bounce rates. IO games have a short play session and players need to understand game mechanics within 60 seconds. Mumu simplified the mechanics by providing four types of resources and a skill tree for structure building. The game keeps players engaged with ephemeral leaderboards, and successful IO games don't spend money on marketing.
4. Acquiring Users and Launching IO Games
Sharing IO games to play together at school is how almost all IO games acquire users. There are several ways to leverage this in your own games. First, build a party code system that lets players play on the same server. Second, allow players to share links to join game servers. Finally, the most successful IO games were launched in less than a month. IO games are easier to distribute, don't need fancy graphics, and require no marketing budget. IO games can be played on Chromebooks in school, but players usually switch to other platforms at home.
5. Challenges and Monetization of IO Games
Players can play IO games in their Chromebooks in school, but they will usually play other games on other platforms when they get home. It's unlikely you're going to be able to generate in-app purchase revenue comparable to mobile, but getting players to play your game outside of school will push you in the right direction. On Krunker, we invested a lot of resources into the Krunker hub, where players can buy and trade skins and compare rankings. Ads make up 90% of revenue for most IO games, largely because it's incredibly difficult to get users to make in-app purchases from web. However the best thing you can do to increase in-app purchase revenue is to convert users to play their game on a different platform where it's easier to monetize them. Hopefully you have a good idea of what it takes to launch an IEO game today.
6. Web Standards and User-Generated Content
It's a free to play battle royale game primarily distributed on steam but fully playable in the browser. Numerous web standards have also been recently stabilized or are coming soon which will open the door to better web games. Specifically for multiplayer games adopting web transports, unreliable transport and congestion control will make low latency games to run much smoother than over web sockets. I'm really excited to see what developers also do with web GPU, wasm threads and wasm cindy. I was happy to see that Apple included support for WebXR and the vision pro given that their poor track record for supporting web standards. We'll probably see a few notable user-generated content platforms leaning heavily into web to reach larger audiences.
PlayCanvas is an open-source game engine used by game developers worldwide. Optimization is crucial for HTML5 games, focusing on load times and frame rate. Texture and mesh optimization can significantly reduce download sizes. GLTF and GLB formats offer smaller file sizes and faster parsing times. Compressing game resources and using efficient file formats can improve load times. Framerate optimization and resolution scaling are important for better performance. Managing draw calls and using batching techniques can optimize performance. Browser DevTools, such as Chrome and Firefox, are useful for debugging and profiling. Detecting device performance and optimizing based on specific devices can improve game performance. Apple is making progress with WebGPU implementation. HTML5 games can be shipped to the App Store using Cordova.
Remix Flat Routes is a new convention that aims to make it easier to see and organize the routes in your app. It allows for the co-location of support files with routes, decreases refactor and redesign friction, and helps apps migrate to Remix. Flat Folders convention supports co-location and allows importing assets as relative imports. To migrate existing apps to Flat Routes, use the Remix Flat Routes package's migration tool.
This Talk explores the use of Babylon.js and WebXR to create immersive VR and AR experiences on the web. It showcases various demos, including transforming a 2D game into a 3D and VR experience, VR music composition, AR demos, and exploring a virtual museum. The speaker emphasizes the potential of web development in the metaverse and mentions the use of WebXR in Microsoft products. The limitations of WebXR on Safari iOS are discussed, along with the simplicity and features of Babylon.js. Contact information is provided for further inquiries.
Little.js is a super lightweight and fast JavaScript game engine that has everything included to start making games right away. It has a tiny footprint and no dependencies, making it perfect for size-coding competitions like JS13K. Little.js is built with an object-oriented structure and comes with several classes. It provides a fast rendering system, a comprehensive audio system, and various starter projects for different game types. Little.js is designed to be simple and easy to understand, allowing you to look at and modify the code.
The Talk discusses ways to boost the performance of WebGL Unity games, including issues with bundle size, memory usage, and runtime performance. It suggests using Brotli for compression and non-exception support for better performance. Choosing the appropriate texture compression format and experimenting with separate builds can also help. The Talk also covers optimizing textures, models, audio, and assets by reducing build size, using compression, disabling unnecessary models, and optimizing audio quality. Unity's optimization tools and profilers are recommended for analyzing performance and memory issues.
The Talk showcases the development of a video game called Athena Crisis using web technologies like JavaScript, React, and CSS. The game is built from scratch and includes features like multiple game states, AI opponents, and map editing. It demonstrates the benefits of using CSS for game development, such as instant load times and smooth transitions. The Talk also discusses optimizing performance, supporting dark mode, and publishing the game to other platforms.
In this workshop, we’ll build a game using the PlayCanvas WebGL engine from start to finish. From development to publishing, we’ll cover the most crucial features such as scripting, UI creation and much more. Table of the content:- Introduction- Intro to PlayCanvas- What we will be building- Adding a character model and animation- Making the character move with scripts- 'Fake' running- Adding obstacles- Detecting collisions- Adding a score counter- Game over and restarting- Wrap up!- Questions Workshop levelFamiliarity with game engines and game development aspects is recommended, but not required.
Dive into the world of AI with our interactive workshop designed specifically for web developers. "Hands-On AI: Integrating LangChain with JavaScript for Web Developers" offers a unique opportunity to bridge the gap between AI and web development. Despite the prominence of Python in AI development, the vast potential of JavaScript remains largely untapped. This workshop aims to change that.Throughout this hands-on session, participants will learn how to leverage LangChain—a tool designed to make large language models more accessible and useful—to build dynamic AI agents directly within JavaScript environments. This approach opens up new possibilities for enhancing web applications with intelligent features, from automated customer support to content generation and beyond.We'll start with the basics of LangChain and AI models, ensuring a solid foundation even for those new to AI. From there, we'll dive into practical exercises that demonstrate how to integrate these technologies into real-world JavaScript projects. Participants will work through examples, facing and overcoming the challenges of making AI work seamlessly on the web.This workshop is more than just a learning experience; it's a chance to be at the forefront of an emerging field. By the end, attendees will not only have gained valuable skills but also created AI-enhanced features they can take back to their projects or workplaces.Whether you're a seasoned web developer curious about AI or looking to expand your skillset into new and exciting areas, "Hands-On AI: Integrating LangChain with JavaScript for Web Developers" is your gateway to the future of web development. Join us to unlock the potential of AI in your web projects, making them smarter, more interactive, and more engaging for users.
In this workshop, we’ll build a complete game using the PlayCanvas engine while learning the best practices for project management. From development to publishing, we’ll cover the most crucial features such as asset management, scripting, audio, debugging, and much more.
In this workshop, we'll introduce you to the core concepts of building Mixed Reality experiences with WebXR and Balon.js. You'll learn the following:- How to add 3D mesh objects and buttons to a scene- How to use procedural textures- How to add actions to objects- How to take advantage of the default Cross Reality (XR) experience- How to add physics to a scene For the first project in this workshop, you'll create an interactive Mixed Reality experience that'll display basketball player stats to fans and coaches. For the second project in this workshop, you'll create a voice activated WebXR app using Balon.js and Azure Speech-to-Text. You'll then deploy the web app using Static Website Hosting provided Azure Blob Storage.
Dive into the captivating world of micro-game development with Frank Force in this interactive live coding workshop. Tailored for both seasoned developers and curious newcomers, this session explores the unique challenges and joys of creating games and demos with extreme size constraints.
A Developer’s Guide to Communicating, Convincing, and Collaborating Effectively With Stakeholders It’s a tale as old as time - collaboration between developers and business stakeholders has long been a challenge, with a lack of clear communication often leaving both sides frustrated. The best developers can deeply understand their business counterparts’ needs, effectively communicate technical strategy without losing the non-technical crowd, and convince the business to make the right decisions. Working at a consultancy, I’ve both failed and succeeded in architecting and “selling” technical visions, learning many lessons along the way.Whether you work at a product company, are a consultant/freelancer, or want to venture beyond just being a developer, the ability to convince and clearly communicate with stakeholders can set you apart in the tech industry. This becomes even more important with the rise of GenAI and the increasingly competitive developer market, as problem-solving and effective communication are key to positioning yourself.In this workshop, I’ll share real-world examples, both good and bad, and guide you through putting the theory into practice through dojos.
Comments