Entrega 2 - Computacion-Visual-Interactiva/proyecto GitHub Wiki

Para esta entrega hubo mejorar significativamente la calidad visual, la funcionalidad y la interacción del proyecto gráfico actual. Los principales aspectos abordados incluyen:

• Reemplazo del modelo de la mariposa
• Conversión del modelo OBJ mediante Python
• Control y movimiento de cámara
• Generación y renderizado del cielo

El modelo inicial de la mariposa presentaba limitaciones visuales significativas que afectaban directamente el realismo de la escena. Algunas irregularidades, como vértices mal calculados que generaban áreas con una textura blanca, afectaban negativamente la presentación visual.

Para resolver este problema se optó por generar un nuevo modelo utilizando la herramienta Meshy.ai. Esta plataforma permitió obtener un modelo mucho más detallado, generando automáticamente los vértices, índices y coordenadas de textura basado en la imagen. El resultado se exportó como un archivo OBJ que, mediante un script personalizado de Python, fue transformado en un archivo de cabecera (.hpp) llamado butterfly_verts.hpp. Esta nueva estructura permitió cargar los datos directamente en el motor gráfico, resultando en una integración más eficiente y una notable mejora visual.

Se hizo un script de Python que sirvio para simplificar y agilizar el proceso de incorporación del modelo al proyecto. El script desarrollado lee y extrae la información esencial del archivo OBJ como las posiciones de vértices y coordenadas de textura, procesándola para generar automáticamente un archivo .hpp bien estructurado. Este archivo contiene arrays estáticos y constantes que en diligent engine puede utilizar directamente, optimizando significativamente el flujo de trabajo.

namespace Butterfly {
    constexpr float ButterflyVerts[] = {
        // coordenadas de vértices (x, y, z), coordenadas de textura (u, v)
        0.5f, 0.3f, 0.0f,   0.0f, 1.0f,
        ...
    };

    constexpr Uint32 ButterflyIndices[] = {
        0, 1, 2, 2, 3, 0, ...
    };

    constexpr Uint32 ButterflyIndexCount = sizeof(ButterflyIndices) / sizeof(Uint32);
}

En la versión anterior del proyecto, la cámara no tenia movimiento que impedían una exploración del entorno 3D. Para desarollar este feature se implementó una nueva mecánica de cámara utilizando la clase FirstPersonCamera del motor gráfico Diligent. Esta implementación permite desplazarse libremente usando controles estándar como las teclas W, A, S, D para el movimiento y el ratón para controlar la direccion. La matriz de vista-proyección se actualiza en tiempo real, facilitando una interacción más intuitiva y realista:

Implementación técnica:

• Se utilizó la clase FirstPersonCamera del motor gráfico Diligent.
• Las actualizaciones de la cámara se integraron directamente en el ciclo de renderizado (método Update).
• Se actualiza la matriz de vista-proyección en tiempo real para asegurar una respuesta natural a la interacción del usuario.

void Tutorial03_Texturing::Update(double CurrTime, double ElapsedTime)
{
    m_Camera.Update(m_InputController, static_cast<float>(ElapsedTime));

    const auto SurfT = GetSurfacePretransformMatrix(float3{0, 0, 1});
    m_WorldViewProj = m_Camera.GetViewMatrix() * SurfT * m_Camera.GetProjMatrix();
}

Previamente, la escena carecía de un entorno ambiental adecuado, lo que provocaba que la mariposa apareciera aislada y poco realista. Para proporcionar una vista mas inmersiva, se agregó un cielo usando una imagen panoramica.

Este fondo ambiental fue implementado utilizando una técnica eficiente basada en un triángulo que cubre la totalidad de la pantalla full-screen triangle. Shaders específicos (SkySphere.hlsl) se encargan de mapear correctamente la imagen panorámica sobre el fondo, utilizando una matriz de vista-proyección invertida para mantener el cielo estático en relación con la cámara y ofrecer así una sensación realista de distancia y profundidad:

// Shader de vértices 
float4 VSMain(uint vertexID : SV_VertexID) : SV_POSITION {
    float2 pos = float2((vertexID << 1) & 2, vertexID & 2);
    float4 projectedPos = mul(float4(pos * 2 - 1, 0, 1), CB.InvRotProj);
    return projectedPos;
}

// Shader de píxeles 

float4 PSMain(...) : SV_TARGET {
    float3 direccion = normalize(worldPosition.xyz);
    float2 uv = direccionAUV(direccion);
    return SkyTex.Sample(Sampler, uv);
}