Jekyll2019-06-19T08:01:08+00:00https://miguelpef.github.io/feed.xmlAR/VR/MR Indie Game Developer2019-06-16T00:00:00+00:002019-06-16T00:00:00+00:00https://miguelpef.github.io/opciones-graficas-android-ue4<p><img src="/images/graficos/Graficos.png" alt="_config.yml" /></p> <p>Dentro del mundo Android encontramos muchas diferencias entre dispositivos. A nivel de Hardware es un gran impedimento para la reproducción de aplicaciones que requieran una gran potencia. En este sentido el juego que estoy desarrollando necesita de las mejores condiciones para funcionar ya que se desarrolla bajo OpenGL ES 3.1 un render específico para móvil con un componente visual muy potente. Para más información sobre OpenGL ES 3.1 puedes ir a este <a href="https://docs.unrealengine.com/en-US/Platforms/Mobile/Android/OpenGLES31MobileRenderer/index.html" target="_blank">enlace</a>.</p> <h2>Gestionando la configuración gráfica en Android</h2> <p>En primer lugar hay que dar la posibilidad de cambiar las opciones gráficas desde algún tipo de menú que se encuentre tanto en el inicio del juego por si el dispositivo no puede iniciarlo con la máxima calidad posible y otro durante el juego por si en cualquier momento se quiere cambiar por cualquier motivo. Para ello usaremos tres botones, calidad alta, calidad media y calidad baja. Lo único que cambiaremos por el momento será el porcentaje de resolución de pantalla, haciendo que en la calidad más baja se llegue a distorsionar la imagen y dando a los bordes unos dientes de sierra que si bien empeoran la experiencia de juego, permiten aceptar un mayor número de dispositivos. <br /> Para realizar este cambio ejecutaremos en consola los siguientes comandos:</p> <ul> <li>r.ScreenPercentage 40</li> <li>r.ScreenPercentage 80</li> <li>r.ScreenPercentage 100</li> </ul> <p>Donde el número es el porcentaje de resolución que comprende desde el 0 hasta el 100 siendo este último la máxima posible. Puedes ver más información sobre esta opción en el siguiente <a href="https://docs.unrealengine.com/en-US/Resources/ContentExamples/PostProcessing/1_13/index.html" target="_blank">enlace</a>. <br /> <img src="/images/graficos/settinggraph.png" alt="_config.yml" /> <br /></p> <h2>Ejemplo y diferencias entre las distintas resoluciones en dispositivo Android</h2> <h3>Calidad Baja</h3> <p><img src="/images/graficos/Lowset.png" alt="_config.yml" /> <br /></p> <h3>Calidad Media</h3> <p><img src="/images/graficos/mediumset.png" alt="_config.yml" /> <br /></p> <h3>Calidad Alta</h3> <p><img src="/images/graficos/highset.png" alt="_config.yml" /> <br /></p> <h2>Otros comandos para cambiar la configuración gráfica</h2> <p>El número que se escribe es el rango entre el que se puede variar la configuración, si nos encontramos 0-4 podemos poner 0,1,2,3,4 pero solo un número que será la configuración que tendrá. <br /> <b>Post Procesado</b> <br /> <code> r.MotionBlurQuality=0-4<br /> r.BlurGBuffer=0-1<br /> r.AmbientOcclusionLevels=0-3<br /> r.AmbientOcclusionRadiusScale=1.7-1.0<br /> r.DepthOfFieldQuality=0-2<br /> r.RenderTargetPoolMin=300-400<br /> r.LensFlareQuality=0-2<br /> r.SceneColorFringeQuality=0-1<br /> r.EyeAdaptationQuality=0-2<br /> r.BloomQuality=4-5<br /> r.FastBlurThreshold=0-7<br /> r.Upscale.Quality=1-3<br /> r.Tonemapper.GrainQuantization=0-1<br /> </code> <br /> <b>Sombras</b> <br /> <code> r.LightFunctionQuality=0-1<br /> r.ShadowQuality=0-5<br /> r.Shadow.CSM.MaxCascades=1-4<br /> r.Shadow.MaxResolution=512-1024<br /> r.Shadow.RadiusThreshold=0.06-0.03<br /> r.Shadow.DistanceScale=0.6-1.0<br /> r.Shadow.CSM.TransitionScale=0-1.0<br /> </code> <br /> <b>Texturas</b> <br /> <code> r.Streaming.MipBias=2.5-0<br /> r.MaxAnisotropy=0-8<br /> r.Streaming.PoolSize=200-1000<br /> </code> <br /> <b>Efectos</b> <br /> <code> r.TranslucencyLightingVolumeDim=24-64<br /> r.RefractionQuality=0-2<br /> r.SSR=0-1<br /> r.SceneColorFormat=3-4<br /> r.DetailMode=0-2<br /> r.TranslucencyVolumeBlur=0-1<br /> r.MaterialQualityLevel=0-1<br /> </code> <br /> <br /> <br /> Para más información acerca de las opciones gráficas en Unreal Engine 4 ir al siguiente <a href="https://docs.unrealengine.com/en-US/Engine/Performance/Scalability/ScalabilityReference/index.html" target="_blank">enlace</a>.</p>MiguelPeF

2019-06-10T00:00:00+00:002019-06-10T00:00:00+00:00https://miguelpef.github.io/uso-de-camaras-UE4<p><img src="/images/rashanCamera.png" alt="_config.yml" /></p> <p>Desde que comencé el proyecto de creación de mi primer videojuego con Unreal Engine 4 no me han dejado de surgir retos… El último de ellos, la elección de la cámara (posicionamiento, seguimiento…) Explicaré de forma resumida por qué finalmente incorporé varios tipos de cámara al entorno y cómo generé el cambio de cámara para cada situación, los problemas con los que me encontré y la mejor solución para ellos.</p> <h1>Elección de cámaras</h1> <p>Unreal Engine da la posibilidad de generar plantillas en primera y tercera persona, es una forma muy sencilla de comenzar un proyecto para no iniciar de 0. Sin embargo, el problema nos lo encontramos cuando no nos resulta ninguna de estas la forma de elaborar nuestro videojuego. Para el proyecto Rashan quería que en los exteriores la vista fuese en tercera persona y que acompañase al jugador en el movimiento, todo era muy sencillo desde esta primera perspectiva. El problema llegó cuando entraba en interior, al situarse la cámara en el blueprint del personaje siempre mantenía la distancia esto hacia que la visión del espectador chocase contra el techo de las casas, las paredes…</p> <p>Por ese motivo una vez tenía resuelto la visión desde exteriores me puse a investigar cómo se desenvolvían otros videojuegos. Me llamó la atención cómo lo hacian los antiguos Resident Evil que seguro que muchos recordaréis…</p> <p><img src="/images/resident-evil.jpg" alt="_config.yml" /></p> <p>Comencé con la creación de este sistema de una forma sencilla, aplicando triggers de accionamiento con Begin Overlap y referenciando la cámara que se posicionaba siempre abarcando el espacio que ocupaba el trigger box. Los blueprint que usé son:</p> <p><img src="/images/bp1.png" alt="_config.yml" /></p> <p>Todo funcionaba de forma correcta, pero empezaron a surgir los problemas…</p> <h1>Problemas con cámaras estáticas</h1> <h2>Problema 1: Control del personaje y perspectiva</h2> <p>Supongamos que la cámara que tenemos al principio se encuentra mirando al frente, pero cuando accedemos al trigger mencionado anteriormente la cámara a la que cambia se encuentra mirando exactamente hacia el sentido contrario. El movimiento del personaje se invierte totalmente haciendo que el control sea un infierno e imposibilitando el disfrute del juego.</p> <h2>Problema 2: Escasa visión del entorno</h2> <p>Al ser una cámara estática y no poder rotar sobre el entorno, se limita la posible sensación de descubrimiento, hablamos de un juego de aventura y descubrimiento donde hay que recoger objetos por el mundo… La visión sobre el escenario debe alcanzar el máximo espacio posible para detectar todos los secretos que el entorno tiene para el jugador.</p> <h2>Problema 3: Transición entre cámaras estáticas y móviles</h2> <p>Pongamos el ejemplo que estamos en la cocina con la cámara X, y pasamos al salón que tiene la cámara Y. El cambio de imagen si es instantáneo nos hará perdernos por unos segundos en el entorno. Por ello me gusta siempre realizar cualquier cambio de vista de forma progresiva, que el espectador entienda que está ocurriendo y no pierda la sensación de control.</p> <h1>Solución para el Proyecto Rashan</h1> <p>Podría haber modificado el control para solucionar de forma rápida el problema 1, pero el juego acabaría siendo más complejo de lo que en un principio se ideo. <br /> Para resolver el problema 2 habría sido buena idea que las cámaras estáticas rotaran en función de la posición del jugador, pero continuaríamos con el problema 1. <br /> La solución para el Proyecto acabó siendo lo que se había pensado en un principio, un cambio de cámara de móvil a estático. Sin embargo, la cámara estática siempre tendría que estar mirando al frente y nunca a la derecha, izquierda o invertido… Además habría que posicionar un número elevado de cámara por los interiores para que se pudiese solucionar el problema 2. El cambio de cámara sería progresivo gracias a la opción del blueprint set view target with blend, posicionando blend time con valor de 1.0, logramos conseguir que el cambio se realice durante 1 segundo.</p> <div class="video-container"><iframe width="560" height="315" src="https://www.youtube.com/embed/8yNQEdk9gOE" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>MiguelPeF