Filtro o Shader para efecto de televisor CRT

Started by Ikki, March 20, 2017, 09:13:06 PM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

JaViS

Quote from: La momia que fuma on March 29, 2017, 05:53:12 PM

Javis, igual tú me puedes iluminar en el tema del scroll a mapa...como decía, tu propio ejemplo que enlazo ahí atrás (o el de la wiki) no compila con la última versión....sabes si ha cambiado la sintaxis o algo así? Yo creo que mi solución, una vez montada, es bastante sencilla (trabajar el juego normalmente a baja resolución en un scroll con todos los objetos del juego, renderizar el scroll al mapa de un proceso "pantalla" y ponerlo ampliado con el filtro por encima a resolución real).


Pues, tienes razon en eso del movimiento, no lo habia pensado, igual con un poco de esfuerzo extra se puede emular el movimiento pixel a pixel de un juego a baja resolucion.


Por otro lado, yo no tengo problema en renderizar el scroll en un mapa, y estoy usando la última version de Bennu que viene en BennuPack.


start_scroll(0,0,stage_render_source,0,1,0,0,stage_render_map);
Working on Anarkade. A couch multiplayer 2D shooter.

Ikki

Quote from: JaViS on March 29, 2017, 01:28:19 PM
Me parece que le estan dando demasiadas vueltas a algo que es bastante evidente y obvio.


Si queres tener los scanlines a una resolucion mas chica, simplemente haz el juego a la mitad (o menos incluso) de la resolucion del scanline, no hace falta escalar nada por software, simplemente tus graficos deben tener el tamaño (en proporcion a la resolucion) correcta. Es decir, si quieres puedes escalar tus graficos antes de meterlos en los FPG, o simplemente diseñarlos con un tamaño de pixel escalado

Son muchas las ventajas de mantener los gráficos en su tamaño original y escalar la resolución, siendo las dos más importantes el menor tamaño de distribución del juego final y la posibilidad de no limitar la resolución de pantalla a valores prefijados. Además, y esto es una opinión personal, el look retro se ve muy favorecido por la simulación de un display CRT; cuando jugábamos en un Spectrum, la NES o en Mega Drive no veíamos claramente los pixels de los juegos. Incluso los diseñadores aprovechaban las limitaciones de los antiguos televisores para superar las restricciones impuestas por el hardware de los sistemas (el uso de dithering para simular más colores o transparencias, por ejemplo). Y, claro, la nostalgia; las scanlines y los filtros que simulan la señal de TV están presentes en los emuladores casi desde el comienzo porque a mucha gente le gusta vivir una experiencia de juego lo más cercana posible a lo que experimentaron originalmente.
Hadoken!!!

JaViS

Sisi, estoy totalmente de acuerdo, por eso lo hago en mi juego. A lo que me refería es que puedes hacer tus graficos al doble del tamaño de la resolucion que vas a usar, y de esa forma, el efecto CRT va a quedar con pixeles mas chicos que tus graficos
Working on Anarkade. A couch multiplayer 2D shooter.

JaViS

Quote from: JaViS on March 30, 2017, 01:26:56 PM
Sisi, estoy totalmente de acuerdo, por eso lo hago en mi juego. A lo que me refería es que puedes hacer tus graficos al doble del tamaño (escalados) de la resolucion que vas a usar, y de esa forma, el efecto CRT va a quedar con pixeles mas chicos que tus graficos
Working on Anarkade. A couch multiplayer 2D shooter.

SplinterGU

momia

scroll_start( n, fileid, graphid, backid, region, flags, destfile, destid )
Download Lastest BennuGD Release: http://www.bennugd.org/node/2

La momia que fuma

#20
Gracias, Splinter y JaVis....hacer lo estaba haciendo bien a nivel código, pero me debí equivocar en algo al actualizar bennu. Ahora hice una carpeta nueva con la última versión (en lugar de sobreescribir la nueva sobre la vieja en mi carpeta de "experimentos") y ya funciona...antes aunque si estaba usando la última versión del compilador seguramente fue que no sobreescribí la mod scroll con la nueva versión o algo por el estilo, jeje...

Ahí va:



program FiltroCRT;


import "mod_key"
import "mod_video"
import "mod_map"
import "mod_scroll"
import "mod_proc"
import "mod_grproc"
import "mod_screen"
import "mod_wm"


global
//RESOLUCIÓN DE JUEGO
    resx= 384, resy= 224;
//GRÁFICO A USAR COMO PANTALLA (SERÁ UN PNG A RESOLUCIÓN DE JUEGO)
    pantalla;
//GRÁFICO DEL FILTRO CRT (SERÁ UN PNG A RESOLUCIÓN REAL)
    crt;
//MAPA AL QUE RENDERIZAR EL SCROLL
    pantallaB;   


begin
//PONEMOS LA RESOLUCIÓN AL DOBLE DE LA RESOLUCIÓN DE JUEGO.
    set_mode(resx*2, resy*2, 16);
//CARGAMOS LOS PNGS DE PANTALLA Y CRT
    pantalla= png_load("./pantalla.png");
//EL GRAFICO DEL CRT ES UNA IMAGEN BLANCA CON LAS SCANLINES (Y UN POCO DE OSCURIDAD POR LOS BORDES) QUE IRÁ CON FLAGS 32.
//TAMBIÉN SE PUEDE HACER UN GRAFICO TRANSPARENTE SIN ESE BLANCO DE FONDO, PERO NECESITARIAMOS PONER COLOR A 32 BITS EN SET MODE (Y NEW MAP) Y NO SERÍA NECESARIO FLAGS 32
    crt= png_load("./crt.png");
//CREAMOS UN MAPA TAMAÑO RESOLUCIÓN DEL JUEGO DONDE RENDERIZAR EL SCROLL
    pantallaB= map_new(resx, resy, 16);
//INICIAMOS SCROLL INDICANDO QUE RENDERIZE AL MAPA QUE HEMOS CREADO   
    scroll_start(0, 0, pantalla, 0, 0, 0, 0, pantallaB);
   
    filtro_crt();
    pantalla();
   
    repeat frame; until(key(_esc))
    exit();
end


process filtro_crt()


begin
//ASIGNAMOS EL GRÁFICO Y LO COLOCAMOS EN EL MEDIO DE LA PANTALLA
    graph= crt;
    x= resx;
    y= resy;
    flags= 32;

//NOS ASEGURAMOS QUE SALGA POR ENCIMA DEL PROCESO PANTALLA Y NO DEBAJO
    z=-99999;    loop
//SI MANTENEMOS CUALQUIER TECLA, SE OCULTA, PARA APRECIAR LA DIFERENCIA
        if(scan_code==0)
            graph= crt;
        else
            graph= 0;
        end       
        frame;
    end


end


process pantalla()


begin
//PANTALLA REAL DONDE TRANSCURRE EL SCROLL. SE LE ASIGNA EL GRÁFICO, SE ESCALA AL DOBLE Y SE COLOCA CENTRADO.
//HAY QUE TENER EN CUENTA QUE TODOS LOS OBJETOS DEL JUEGO DEBEN IR INTEGRADOS EN EL SCROLL CREADO CON CTYPE
    graph= pantallaB;
    size= 200;
    x= resx;
    y= resy;   
    loop
        frame;
    end


end



(Editado: Añado asignarle una Z al filtro que asegure que vaya por encima del proceso que hace de pantalla)

Ikki

Momia, genial lo tuyo. Ya mismo trato de implementarlo en mi demo y les muestro que sale de eso. ¡Mil gracias!
Hadoken!!!

La momia que fuma


Drumpi

Momia ¿Qué andas tramando? No se sabe nada de ti desde hace tiempo y parece que ya estás preparando otra de tus obras de arte :D
Hala, como con 1001 procesos sólo va a 9 FPS, vamos a meterle 32 veces más, a ver si revienta.
(Drumpi epic moment)

Ikki

Aquí les dejo un pequeño demo de lo que hice con el código de Momia. Está listo para correr en Windows, pero incluyo el código fuente por si hay algún usuario de Linux. Creo que voy a seguir convirtiendo Minescape a Bennu, ya que di los primeros pasos. Pido perdón por el código fuente, es un auténtico desastre que espero limpiar y mejorar en el futuro, en cuanto le haya agarrado mejor la mano al lenguaje  :P.

Consultas:

1) ¿Es posible que los textos en pantalla (escritos con write o write_var) también se dibujen dentro del scroll, para que se escalen como todo el resto de los elementos?

2) ¿Se puede aplicar algún tipo de blur o filtrado bilineal al escalar el buffer?
Hadoken!!!

JaViS

Quote from: Ikki on March 31, 2017, 02:19:58 PM
Consultas:

1) ¿Es posible que los textos en pantalla (escritos con write o write_var) también se dibujen dentro del scroll, para que se escalen como todo el resto de los elementos?

2) ¿Se puede aplicar algún tipo de blur o filtrado bilineal al escalar el buffer?




1) se puede usar write_in_map, y eso lo usas con un proceso, o lo pintas como mas te convenga dentro del scroll.
2) se puede usar un filtro de blur, creo que de hecho la funcion blur() existe, pero es lenta, quita mucho rendimiento.
Working on Anarkade. A couch multiplayer 2D shooter.

La momia que fuma

#26
Quote from: Drumpi on March 30, 2017, 11:17:04 PM
Momia ¿Qué andas tramando? No se sabe nada de ti desde hace tiempo y parece que ya estás preparando otra de tus obras de arte :D


Jeje, desgraciadamente hace tiempo que no hago nada con bennu, pixtudio o similares (por eso me gustó especialmente ayudar con el ejemplillo este para desoxidarme un poco)....pero os tengo vigilados  ;)


Aunque si estoy adaptando y ampliando una cosilla mía que conoces de bennu a otro motor (aunque no como juego-juego sino para venderlo como plantilla en la store del motor en cuestión), ya lo pondré por offtopic cuando este visible.


EDITO (Que se me olvidaba):


Quote from: Ikki on March 31, 2017, 02:19:58 PM
Aquí les dejo un pequeño demo de lo que hice con el código de Momia. Está listo para correr en Windows, pero incluyo el código fuente por si hay algún usuario de Linux. Creo que voy a seguir convirtiendo Minescape a Bennu, ya que di los primeros pasos. Pido perdón por el código fuente, es un auténtico desastre que espero limpiar y mejorar en el futuro, en cuanto le haya agarrado mejor la mano al lenguaje  :P .


Hostia! El Manic Miner! (Que ha pegado el estirón)  ;D

Drumpi

Pues ya nos contarás, Momia :) No te aficiones mucho al Construct2 que eso es HTML5 y al final vas a tener que usar lenguajes de marcas, y para marca la que te va a dejar en el cerebro :D

Respecto al escalado, sé que para el scale_mode (que escala x2) tienes diversos filtros:
http://wiki.bennugd.org/index.php?title=Scale_modes
Pero por la salud de mis ojos, no uses filtros... Bueno, tienes el de scanlines y... no sé por qué no me he acordado de él ^^U
Aparte, para hacer blur, según la wiki tienes los siguientes modos para el comando blur() (hay un enlace a como funciona en esa página):
http://wiki.bennugd.org/index.php?title=Blur_modes

Consejo para novatos: bichea las funciones de la wiki, ve mirando las funciones que te vayan llamando la atención y mira los comandos relacionados, porque puedes aprender muchísimo sin darte cuenta ;)
Hala, como con 1001 procesos sólo va a 9 FPS, vamos a meterle 32 veces más, a ver si revienta.
(Drumpi epic moment)

La momia que fuma

Pequeña chorrireflexión, lo que nunca me gustó del filtro scanline es como oscurece la imágen. Se me ocurrió ahora probar a hacerlo al reves, con scanlines tirando a blancas en lugar de negras y da el pego también pero sin dejar la imágen tan tristona y apagada. Da la sensación de que le sube el brillo un poco y queda bien, a mi me gusta más.





De izquierda a derecha, scanline clara, oscura, y sin scanline.

Ikki

#29
Quote from: La momia que fuma on April 01, 2017, 02:20:20 AM
Pequeña chorrireflexión, lo que nunca me gustó del filtro scanline es como oscurece la imágen. Se me ocurrió ahora probar a hacerlo al reves, con scanlines tirando a blancas en lugar de negras y da el pego también pero sin dejar la imágen tan tristona y apagada. Da la sensación de que le sube el brillo un poco y queda bien, a mi me gusta más.





De izquierda a derecha, scanline clara, oscura, y sin scanline.


Yo uso scanlines negras, pero con 75% de transparencia en el png, y me gusta bastante como queda. Está bueno que el efecto apenas se note, pero que esté ahí.

Quote from: Drumpi on April 01, 2017, 01:15:21 AM
Pero por la salud de mis ojos, no uses filtros... Bueno, tienes el de scanlines y... no sé por qué no me he acordado de él ^^U

Sí, los filtros pueden arruinar bastante la imagen. Aunque sé que tiene muchos simpatizantes, nunca me gustó HQ2X aplicado sobre pixel art de baja resolución (lo mismo para Super Eagle. 2xSai y otros similares). El efecto final me parece... no se... anti-natural, por llamarlo de alguna forma.
Hadoken!!!