Wiki de Creación/Skills/Juegos con IA
Look cinematográfico en Three.js: luz, niebla y bloom
De la Wiki de Creación de OpenDrama
Con los ajustes por defecto, una escena de Three.js parece una demo técnica: luz plana y gris, materiales de plástico, objetos flotando en un vacío que termina en una línea dura. El aspecto «de consola» no sale de un shader mágico. Sale de siete capas aplicadas en orden: gestión de color, tone mapping, iluminación basada en imagen, una luz principal con sombra, atmósfera, un bloom contenido y una cámara con un objetivo creíble y algo de peso. En el orden correcto, casi toda la mejora sale gratis; fuera de orden, ningún ajuste de luces salva la imagen.
A continuación, capa por capa: nuestros valores de partida, lo que deberías ver y lo que cuesta. Los valores son para una versión reciente de three (r18x en el momento de escribir esto); si una API cambió de nombre, damos también el antiguo.
Cuándo usarlo
Cuando el juego se juega bien pero las capturas no convencen. Diagnostica por síntoma; cada uno apunta a una capa que falta:
- Colores lavados, negros grises. La gestión de color está rota: una textura de color se lee como datos lineales, o la gamma se aplica dos veces.
- Las luces altas se queman en blanco plano; parece un juego de 2005. No hay tone mapping, así que todo lo que pasa de 1.0 se recorta.
- El metal se ve negro y todo lo demás parece plástico. No hay mapa de entorno. Los materiales PBR necesitan algo que reflejar.
- Los objetos flotan. No hay sombra, o es tan difusa y desplazada que parece una mancha.
- El mundo se siente vacío y termina en un borde visible. No hay niebla, así que no hay perspectiva aérea.
- Lámparas y magia no se sienten «calientes». No hay bloom, o el emisivo nunca pasa de 1.0 y el bloom no tiene nada que atrapar.
- Parece un visor de CAD. FOV por defecto de 75°, cámara pegada al personaje o manejada con OrbitControls.
Sáltatelo, o quédate en las dos primeras capas, en estilos planos, pixel art o toon donde los colores deben coincidir exactamente con la ilustración, y en juegos 2D.
Las cuentas de rendimiento: gestión de color, tone mapping, luz de entorno y niebla son casi gratis por fotograma. Una sombra vuelve a dibujar todo objeto que la proyecta. El bloom y los demás efectos de pantalla completa se pagan por píxel, y ahí es donde el móvil se queda sin presupuesto. Ese también es el orden de valor por milisegundo: aplica las capas en orden y para cuando se acaben los 16.7 ms del fotograma (60 fps).
Los miembros siguen leyendo
El resto de esta página es para miembros
- 10 pasos más
- 2 tablas de referencia
- 6 secciones más
Crea una cuenta gratis, recarga una vez —desde 0,99 US$— y toda la wiki es tuya.
- Todos los desmontajes, Skills y Prompts
- Páginas nuevas cada día
- Copia los prompts con un toque
Véase también
Desmontajes que lo usan
Más en Juegos con IA
Ver todo →Carreras antigravedad en dos días: tres copas, salas online y coches de la IA de los jugadores
Stefan rehízo con IA en dos días su juego favorito de la infancia, F-Zero X, como el juego de carreras para navegador ZERO-G, que se jugó más de 1.000 veces. Desmontamos su flujo de assets y el diseño que hace que la gente termine la carrera.
Día 20 de un juego de estrategia hecho con IA: un gólem de piedra que despierta y una taberna
Stefan construye con IA el juego de estrategia que lleva 15 años queriendo hacer. El día 20 suma un gólem que se esconde como un montón de piedras y una taberna para contratar luchadores. Seguimos al gólem desde las referencias hasta Unity.
De fotos de un escritorio a un juego de karts: Gemini 4 Argon, Blender MCP y Three.js
genevieve__h, de Google AI Studio, convirtió fotos del escritorio de su casa en un juego de karts jugable con Gemini 4 Argon, Blender MCP y Three.js. Reconstruimos el método fotograma a fotograma.
Una persona, 16 días y Opus 5.5: El Principito como juego 3D explorable
Sac creó un Principito en 3D, planeta a planeta, con Opus 5.5, Tripo y Blender, jugable en el navegador. Desmontamos su flujo de assets y cómo organiza las escenas.
Tras hacerse viral: Sky Reach suma un mundo anillo y salas multijugador
Según Tesana, el juego espacial de un usuario, hecho con unos pocos prompts, pasó de 2,5 a más de 3 millones de reproducciones en algo más de una semana. Así añadió un mundo anillo y multijugador sin romper lo que ya funcionaba.
Lyrio: exploración 3D hecha de movimiento, con Opus 5.5 y Three.js
Un explorador con orejas de zorro corre, sale disparado desde Manantiales de Viento y planea entre islas flotantes. Desmontamos cómo el movimiento se convierte en todo el juego y cómo lo alimentan los coleccionables.







