Tecnología
PixiJS
PixiJS es un motor de renderizado 2D para la web que dibuja en la tarjeta gráfica mediante WebGL y WebGPU. Lo usé para dibujar juegos de navegador para una pantalla grande, como un shooter cooperativo de zombis y un juego de carreras
- Tipo
- Tecnología
- Sitio oficial
- pixijs.com
- En mi trabajo
- Proyectos 1 · Servicios 1
- Publicado
Dónde la uso
QRuma: juegos en grupo en una pantalla grande con el móvil como mando
QRuma lleva juegos en grupo a una pantalla grande: los jugadores escanean un QR y su móvil se convierte en el mando, sin instalar nada. Nació en VibeCatter
ServiciosDe la idea a un MVP que funciona
Desarrollo de MVP para startups: alcance, UX, diseño, frontend, backend, IA y lanzamiento, a cargo de un ingeniero sénior que ha sido fundador y CTO
¿Qué es PixiJS y cómo lo uso en juegos de navegador?
Un juego de fiesta en una tele tiene que seguir fluido con decenas de personajes, efectos y partículas en pantalla. PixiJS lo dibuja todo en la tarjeta gráfica, mientras la lógica del juego se queda en el servidor
Datos clave
Cómo uso PixiJS
- Immune Z. Un shooter cooperativo de zombis con vista cenital para hasta 10 jugadores. La pantalla grande dibuja con PixiJS la arena, los personajes, el fuego y los efectos, mientras los móviles hacen de mandos.
- Race Track. Un juego de carreras para hasta 8 jugadores en la misma plataforma.
- Servidor y pantalla por separado. El servidor decide lo que pasa; PixiJS solo dibuja el estado que recibe y suaviza el movimiento entre actualizaciones. Lee el caso.
Cuándo elijo PixiJS y sus límites
PixiJS encaja en juegos 2D, visualizaciones interactivas y escenas animadas con muchos objetos en movimiento. Es ligero y rápido, y deja el diseño del juego en tus manos.
Es un renderizador, no un motor de juego: la física, el sonido y la gestión de escenas vienen de otras bibliotecas o de tu propio código. Para una escena 3D usaría un motor 3D, y para unos pocos elementos animados en una página bastan CSS o una pequeña biblioteca de animación.
Se usa junto con
Fuentes
- PixiJS — PixiJS ·
- PixiJS Guides — PixiJS ·
