Log in
September 28 - 29, 2023
JS GameDev Summit
Online

JS GameDev Summit 2023

All Stars GameDev and Graphics on the Web

JavaScript GameDev Summit is a 2-day online event for engineers, technical artists, and creative developers who develop games and graphics-heavy applications with Web technology. See the latest updates from graphics engine crews, game development case studies, best practices, and much more in September, 2023.

Esta edición del evento ha finalizado, las últimas actualizaciones de este Tech Conference están disponibles en el sitio web de la marca. Sigue para más Tech Conferences.
CrazyGamesPOKIEvolution GamingFocusReactive
ES
Construyendo la IA para Athena Crisis
37 min
Construyendo la IA para Athena Crisis
Christoph Nakazawa
Christoph Nakazawa
CEO at Nakazawa Tech
Join Christoph from Nakazawa Tech in building the AI for Athena Crisis, a game where the AI performs actions just like a player. Learn about the importance of abstractions, primitives, and search algorithms in building an AI for a video game. Explore the architecture of Athena Crisis, which uses immutable persistent data structures and optimistic updates. Discover how to implement AI behaviors and create a class for the AI. Find out how to analyze units, assign weights, and prioritize actions based on the game state. Consider the next steps in building the AI and explore the possibility of building an AI for a real-time strategy game.
case studyartificial intelligencegame developmentbuilders and founders
Desarrollo de juegos con ReactJS, CSS y React Three Fiber
22 min
Desarrollo de juegos con ReactJS, CSS y React Three Fiber
Jorge Rubiano
Jorge Rubiano
Huge
Jorge Rubiano, a Software Engineer from Colombia, shares puzzle, isometric, and board games developed using React.js and CSS. He demonstrates the use of WebGL and 3.js for creating 3D games on the web. ReactiveFiber, a renderer that combines React and 3.js, is showcased in movement-based and color-changing games. The Talk concludes with the development of a bowling game using ReactiveFiber and complex components.
reactcomponent libraryuser interfacesgame developmentreact games
Lecciones de 7 años de juegos .IO: Lo que funciona, lo que no funciona, hacia dónde ir a partir de aquí
14 min
Lecciones de 7 años de juegos .IO: Lo que funciona, lo que no funciona, hacia dónde ir a partir de aquí
Nathan Flurry
Nathan Flurry
Rivet
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.
developer experiencegame development
Utilizando la API del Gamepad para una mejor experiencia de juego en la web
21 min
Utilizando la API del Gamepad para una mejor experiencia de juego en la web
Arun Michael Dsouza
Arun Michael Dsouza
Using the Gamepad API for a Better Gaming Experience on the Web
The Talk discusses the web gamepad API and its use in game development on the web platform. It explores the GamePad API, which allows developers to connect gaming devices to the browser and use them in gaming applications. The implementation of the GamePad API involves tracking button presses and joystick movements using request animation frame. The Talk also introduces the JoypadJS library, which extends the GamePad API to track button presses, axis movements, and provides haptic feedback. JoypadJS works on modern browsers with GamePad API support and is used in games, interactive applications, and IoT projects.
developer experiencegame development
Potencia las características sociales de tu juego con Nakama
17 min
Potencia las características sociales de tu juego con Nakama
Tom Glenn
Tom Glenn
Heroic Labs
Social features in games increase player engagement, drive in-app purchases, and allow for community building. Nakama is a tool that enables the addition of multiple social features to games, such as authentication, friend management, and leaderboards. The implementation process involves installing the nakama.js package, creating a client object, and using custom authentication. Users can log out, manage friends, view user information, and interact with leaderboards. Additionally, Nakama allows for the implementation of player participation rewards through custom code.
game developmentgame engine
Migración de WebGL a WebGPU
21 min
Migración de WebGL a WebGPU
Dmitrii Ivashchenko
Dmitrii Ivashchenko
MY.GAMES
This talk explores the differences between WebGL and WebGPU, with a focus on transitioning from WebGL to WebGPU. It discusses the initialization process and shader programs in both APIs, as well as the creation of pipelines in WebGPU. The comparison of uniforms highlights the use of uniform buffers for improved performance. The talk also covers the differences in conventions between WebGL and WebGPU, including textures, viewport and clip spaces. Lastly, it mentions the differences in depth range and projection matrix between the two APIs.
performancewebglgame developmentwebgpu
Patrones y Arquitecturas de Desarrollo de Juegos en JavaScript
28 min
Patrones y Arquitecturas de Desarrollo de Juegos en JavaScript
Olayinka Atobiloye
Olayinka Atobiloye
GitHub
Today's Talk covers game design and architecture, including entity component systems, game loops, and decoupling game logic from rendering. Entity component systems are popular in JavaScript game development for representing games as entities and their components as behavior on data. Game loops control the flow of the game and updating its state, with different architectures like fixed time step and variable time step. Decoupling game logic from rendering improves performance and flexibility, allowing for independent updates and easy addition of new features. Having a clear separation of concerns in game development improves performance, increases flexibility, and makes debugging easier.
javascriptarchitecturepatternsgame development
El Secreto para una Buena Iteración de Juegos
21 min
El Secreto para una Buena Iteración de Juegos
Tamta Asatiani
Tamta Asatiani
CIDA
This talk explores game design, iteration, and prototyping, emphasizing the importance of playtesting with non-developers and smooth prototype testing. Observing playtesters carefully and gathering their feedback is crucial for understanding their thoughts and feelings. Playtesters are essential during the design process to ensure a cohesive and enjoyable game. The speaker shares a personal example of solving multiple problems with a single solution in the game Beast of Colchis. The talk concludes with a reminder to prototype, be nice to playtesters, and focus on making gameplay fun.
designdeveloper experiencegame development
Desatando Experiencias Web 3D de Última Generación con Babylon.js 6.0
20 min
Desatando Experiencias Web 3D de Última Generación con Babylon.js 6.0
Raanan Weber
Raanan Weber
Microsoft
Babylon.js is an open-source 3D rendering engine that aims to be powerful, beautiful, simple, and open. It supports WebGL, WebGPU, and canvas accelerated UI, and offers features like physics integration and WebXR abstraction. The engine provides tools like the Playground and Inspector for debugging and editing scenes. Babylon Native brings the power of Babylon Engine to Native platforms, and the latest release integrates the Havok physics engine for improved performance. Version 7.0 will introduce new features like the Node Geometry Editor and Flow Graph, and will revamp the API and audio engine.
game developmentgame engine
Machine Learning en el Desarrollo de Juegos
18 min
Machine Learning en el Desarrollo de Juegos
Denis Kondratev
Denis Kondratev
Playrix
Today's Talk explores cheating in video games and the role of machine learning in detecting and preventing it. Trust and fairness are crucial in gaming, as players invest time and emotion into virtual worlds. Traditional rule-based models assess player actions, while machine learning can detect complex and evolving cheating methods. Training models and organizing data are key challenges in utilizing machine learning for cheating detection. The future lies in collaborative security systems that combine rule-based models with machine learning to protect against cheating.
machine learningdeveloper experiencegame development
¡Mejora el rendimiento de tus juegos WebGL Unity!
7 min
¡Mejora el rendimiento de tus juegos WebGL Unity!
Florin Ciornei
Florin Ciornei
CrazyGames
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.
performancewebglgame developmentreact unity webgl
¿Por qué es tan difícil construir un juego multijugador y qué podemos hacer para solucionarlo para todos?
18 min
¿Por qué es tan difícil construir un juego multijugador y qué podemos hacer para solucionarlo para todos?
Asad Memon
Asad Memon
Google
Asad Nehman discusses the challenges of making multiplayer games and suggests ways to simplify the process. He highlights the need for a backend, such as a Node.js server with Socket.io, to handle player connections. Rooms are introduced to connect players and their friends, allowing communication within each room. Hosting options like AWS EC2, Vercel, and Netlify can help scale the game globally. Playroom framework eliminates the need for server code, lobby systems, and managing player profiles.
performancegame development
Mejora el rendimiento de tus juegos utilizando Canvas
8 min
Mejora el rendimiento de tus juegos utilizando Canvas
Ilia Chernetskii
Ilia Chernetskii
Evolution
The Talk discusses the use of the canvas element in games and web applications to improve performance. It compares the Canvas API and WebGL API, highlighting the advantages and disadvantages of each. The Canvas API allows for both CPU and GPU rendering, while WebGL API only uses GPU and hardware acceleration. Using the canvas element can significantly enhance performance, but it comes with increased complexity and development costs.
game development
Creando herramientas CAD personalizadas en la web con ThreeJS
8 min
Creando herramientas CAD personalizadas en la web con ThreeJS
Adrian Herbez
Adrian Herbez
Together Labs
Today we're going to be talking about creating custom CAD tools on the web with 3JS. We'll explore the reasons why you should make web-based tools, including their novice-friendly nature and their suitability for user-generated content. We'll learn how to create custom and parametric geometry using Three.js, set up geometry and material in Three.js, and improve visibility by adding normals to the geometry.
game developmentthree.js
Uso de UDP en el navegador para conexiones más rápidas entre cliente/servidor
21 min
Uso de UDP en el navegador para conexiones más rápidas entre cliente/servidor
Top Content
Yannick
Yannick
BBZ CFP Biel-Bienne
This talk introduces geckos.io, a real-time client-server communication library using UDP and WebRTC. The speaker discusses the benefits of UDP for real-time multiplayer games and explains how geckos.io enables UDP connections between browsers and Node.js servers. The deployment process for geckos.io involves opening UDP ports and handling signaling through an HTTP request. The speaker demonstrates how geckos.io works with Docker and showcases the ability to host multiple servers on the same machine. Overall, this talk provides an overview of geckos.io and its applications in real-time communication.
developer experiencegame developmentreact native updates
JavaScript Haikus: Mis Aventuras en la Programación Mínima
27 min
JavaScript Haikus: Mis Aventuras en la Programación Mínima
Frank Force
Frank Force
Game Designer, Software Engineer
This Talk is about writing super tiny JavaScript programs, known as tiny code. It explores the concept of code golf and the use of a live editor for instant feedback. The Talk discusses various ways to share tiny code, including Twitter.net. It also covers creating graphics, games, and sound in a small space. The speaker highlights inspiring tweets and showcases examples of tiny code, including asemic writing. The future of tiny code includes new techniques, better browser support, and AI-assisted programming.
javascriptinspirationfun demos
Construyendo Juegos de Pensamiento en Equipo en Synthesis
16 min
Construyendo Juegos de Pensamiento en Equipo en Synthesis
Vivek Vidyasagaran
Vivek Vidyasagaran
Synthesis School
Today's Talk is about building team thinking games at Synthesis, an enrichment program aiming to build a generation of super collaborators. The key insight is that design is the main constraint, not graphics or AI. Synthesis uses open-source software and develops its own tools for game design and networking. The architecture of Synthesis games involves a server-native approach and a client-authoritative model for movement. The modular approach allows for quick iteration and flexibility in game development, and investing in content pipeline tools enables the creation of fresh content every week.
performancegame developmentopen-source
Raygui: Una interfaz de usuario inmediata de modo C para el desarrollo de herramientas Wasm
19 min
Raygui: Una interfaz de usuario inmediata de modo C para el desarrollo de herramientas Wasm
Ramon Santamaria
Ramon Santamaria
Raylib technologies
Welcome to the presentation of RightGui, an immediate mode CUI library for tools development. RightGui is a high-performance library that is stateless and uses small self-contained functions to process inputs and draw controls. It provides a variety of controls, customizable styles, and support tools for live style configuration. Additionally, there are tools like the icons editor and layout creator that allow for customizations and code generation. Reiki offers a variety of tools, including a sound editor, image manipulation canvas, and resource packer.
user interfacesgame development
Rogule: Historias desde el Calabozo de un Juego Roguelike Basado en la Web
19 min
Rogule: Historias desde el Calabozo de un Juego Roguelike Basado en la Web
Chris McCormick
Chris McCormick
Independent Game Dev
Chris McCormick, an independent software developer, discusses his latest game Rogl, a minimalist online roguelike game. He shares the story of how Rogl gained popularity and emphasizes the importance of marketing and giving your creations a chance. McCormick highlights the value of frugality and underengineering, as well as the power of finding the best tech for efficiency. He explains why ClojureScript is the best tech for him and discusses deployment strategies using Piku. Overall, the talk emphasizes the importance of informing people about your project, prioritizing fast development, and user feedback.
developer experiencegame developmentopen-source
Cómo hacer un juego web tú solo
27 min
Cómo hacer un juego web tú solo
Matt Hackett
Matt Hackett
Valadria
This talk guides you on how to make a web game by yourself, emphasizing the importance of focusing on tasks that interest you and outsourcing the rest. It suggests choosing a game engine that allows distribution on the web and aligns with your understanding and enjoyment. The talk also highlights the significance of finding fun in the creative process, managing scope, cutting features that don't align with the game's direction, and iterating to the finish line. It concludes by discussing the options for publishing the game on the web and leveraging unique web features.
developer experiencegame development
Desarrollo de juegos con Threejs
22 min
Desarrollo de juegos con Threejs
Anderson Mancini
Anderson Mancini
Neotix
Hi there! I'm Anderson Mancini, a creative developer from Brazil. Let's dive into 3JS game development and how you can start your journey. React ThreeFiber offers a more organized and compact approach to building scenes using components. Explore exciting examples of what you can build with React ThreeFiber and 3JS. Learn the creative process of building a game using 3JS and recommended courses and learning resources. Performance tips for creating games with 3JS will be discussed in tomorrow's session.
game developmentgame enginethree.js
Masterclass de Codificación en Vivo de Juegos Pequeños
115 min
Masterclass de Codificación en Vivo de Juegos Pequeños
Workshop
Frank Force
Frank Force
Sumérgete en el cautivador mundo del desarrollo de microjuegos con Frank Force en este interactivo masterclass de codificación en vivo. Diseñado tanto para desarrolladores experimentados como para curiosos principiantes, esta sesión explora los desafíos únicos y las alegrías de crear juegos y demos con restricciones extremas de tamaño.
game developmentgame engine
Real-Time Virtual Content Adaptation with AI
Recording pending
Real-Time Virtual Content Adaptation with AI
Abde Ali Lokhandwala
Abde Ali Lokhandwala
Booking.com
"Real-Time Game Virtual Content Adaptation with AI: Unleashing the Power of Personalized Immersion" is an enthralling talk that explores the magical world of AI-driven real-time content adaptation in gaming. The talk highlights how AI algorithms dynamically adjust virtual game content, environments, characters, challenges, and narratives to cater to each player's preferences and actions. By delving into AI-driven player profiling and content reshaping, the talk showcases how personalized immersion enhances player engagement and fosters a profound sense of presence in the virtual realm. Attendees will gain insights into the transformative potential of AI-curated storytelling and intelligent gameplay mechanics, making every gaming experience a unique and unforgettable journey for each individual player.
artificial intelligencegame development
Available in other languages: