{"id":273,"date":"2026-02-16T08:00:00","date_gmt":"2026-02-16T07:00:00","guid":{"rendered":"https:\/\/mallpath.ovh\/darkphoenix\/?p=273"},"modified":"2026-02-09T21:37:48","modified_gmt":"2026-02-09T20:37:48","slug":"avances-motor-grafico-webgl","status":"publish","type":"post","link":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/","title":{"rendered":"Primeros avances del motor gr\u00e1fico en WebGL"},"content":{"rendered":"\n

En paralelo al trabajo de modelado y dise\u00f1o del mapa, hemos comenzado con los primeros avances del desarrollo de nuestro propio motor gr\u00e1fico en WebGL<\/strong>. Esta parte del proyecto supone un reto t\u00e9cnico importante, pero tambi\u00e9n un paso clave para tener un mayor control sobre c\u00f3mo se representa el entorno 3D dentro de la aplicaci\u00f3n.<\/p>\n\n\n

\n
\"Primera<\/figure>\n<\/div>\n\n\n

Desarrollando nuestro propio motor gr\u00e1fico<\/strong><\/h3>\n\n\n\n

Actualmente, Juan Cam\u00fas<\/a><\/strong> y Marcos Flores<\/a><\/strong> est\u00e1n trabajando en el desarrollo del motor gr\u00e1fico desde cero utilizando WebGL<\/a><\/strong>, tal y como se nos pide en la asignatura de T\u00e9cnicas Avanzadas de Gr\u00e1ficos<\/strong>. El objetivo es construir una base gr\u00e1fica propia que nos permita representar el mapa 3D directamente en el navegador.<\/p>\n\n\n\n

Control total sobre el renderizado<\/strong><\/h3>\n\n\n\n

Desarrollar nuestro propio motor nos da un control mucho mayor sobre aspectos como el renderizado, la gesti\u00f3n de escenas y la forma en la que se muestran los modelos 3D. Aunque supone m\u00e1s trabajo que usar soluciones ya existentes, tambi\u00e9n nos permite adaptar el motor exactamente a las necesidades de MallPath<\/a>.<\/p>\n\n\n

\n
\"Segunda<\/figure>\n<\/div>\n\n\n

Integraci\u00f3n progresiva de las plantas<\/strong><\/h3>\n\n\n\n

Uno de los primeros objetivos ha sido conseguir cargar correctamente las distintas plantas del centro comercial dentro del motor. Cada planta se va incorporando de forma progresiva, asegurando que la estructura, posiciones y escalas sean coherentes antes de a\u00f1adir m\u00e1s complejidad.<\/p>\n\n\n\n

Una base s\u00f3lida para el futuro<\/strong><\/h3>\n\n\n\n

Estos avances iniciales sientan las bases para todo lo que vendr\u00e1 despu\u00e9s: c\u00e1maras, interacci\u00f3n, rutas y navegaci\u00f3n en tiempo real. Contar con una estructura gr\u00e1fica estable desde el principio es fundamental para evitar problemas m\u00e1s adelante.<\/p>\n\n\n

\n
\"Tercera<\/figure>\n<\/div>\n\n\n

Pensando en la experiencia final<\/strong><\/h3>\n\n\n\n

Todo el desarrollo del motor gr\u00e1fico se est\u00e1 planteando con la experiencia del usuario en mente. El objetivo es que la navegaci\u00f3n por el mapa sea fluida, clara y c\u00f3moda cuando implementemos la ruta en primera persona dentro de la aplicaci\u00f3n.<\/p>\n\n\n\n

Avances visibles dentro de MallPath<\/strong><\/h3>\n\n\n\n

Este trabajo t\u00e9cnico se suma al resto de avances del proyecto y poco a poco ir\u00e1 integr\u00e1ndose en la aplicaci\u00f3n. Puedes consultar el estado actual de MallPath aqu\u00ed: https:\/\/mallpath.ovh\/app<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

Mostramos los primeros avances del motor gr\u00e1fico en WebGL desarrollado para MallPath, con la carga inicial de las distintas plantas del mapa 3D.<\/p>\n","protected":false},"author":1,"featured_media":276,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-273","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-sin-categoria"],"yoast_head":"\nMotor gr\u00e1fico en WebGL: primeros avances<\/title>\n<meta name=\"description\" content=\"Primeros avances en el desarrollo del motor gr\u00e1fico en WebGL para MallPath, con las tres plantas del mapa cargadas en el navegador.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Motor gr\u00e1fico en WebGL: primeros avances\" \/>\n<meta property=\"og:description\" content=\"Primeros avances en el desarrollo del motor gr\u00e1fico en WebGL para MallPath, con las tres plantas del mapa cargadas en el navegador.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/\" \/>\n<meta property=\"og:site_name\" content=\"Dark Phoenix\" \/>\n<meta property=\"article:published_time\" content=\"2026-02-16T07:00:00+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/mallpath.ovh\/darkphoenix\/wp-content\/uploads\/2026\/02\/primera-planta.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1917\" \/>\n\t<meta property=\"og:image:height\" content=\"933\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"darkphoenix\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"darkphoenix\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/\"},\"author\":{\"name\":\"darkphoenix\",\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/#\\\/schema\\\/person\\\/736b6bad4a7bf9aa43ad623cbff79cc5\"},\"headline\":\"Primeros avances del motor gr\u00e1fico en WebGL\",\"datePublished\":\"2026-02-16T07:00:00+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/\"},\"wordCount\":379,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/wp-content\\\/uploads\\\/2026\\\/02\\\/primera-planta.png\",\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/\",\"url\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/\",\"name\":\"Motor gr\u00e1fico en WebGL: primeros avances\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/wp-content\\\/uploads\\\/2026\\\/02\\\/primera-planta.png\",\"datePublished\":\"2026-02-16T07:00:00+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/#\\\/schema\\\/person\\\/736b6bad4a7bf9aa43ad623cbff79cc5\"},\"description\":\"Primeros avances en el desarrollo del motor gr\u00e1fico en WebGL para MallPath, con las tres plantas del mapa cargadas en el navegador.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/#primaryimage\",\"url\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/wp-content\\\/uploads\\\/2026\\\/02\\\/primera-planta.png\",\"contentUrl\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/wp-content\\\/uploads\\\/2026\\\/02\\\/primera-planta.png\",\"width\":1917,\"height\":933},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/avances-motor-grafico-webgl\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Primeros avances del motor gr\u00e1fico en WebGL\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/#website\",\"url\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/\",\"name\":\"Dark Phoenix\",\"description\":\"Dark Phoenix es un grupo especializado en desarrollo web y proyectos tecnol\u00f3gicos como MallPath.\",\"alternateName\":\"MallPath\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/#\\\/schema\\\/person\\\/736b6bad4a7bf9aa43ad623cbff79cc5\",\"name\":\"darkphoenix\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/bfb00e4b94fbe1ae2731384a6b3a30239598c8710d6a9d22a6b0b559927d9cfe?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/bfb00e4b94fbe1ae2731384a6b3a30239598c8710d6a9d22a6b0b559927d9cfe?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/bfb00e4b94fbe1ae2731384a6b3a30239598c8710d6a9d22a6b0b559927d9cfe?s=96&d=mm&r=g\",\"caption\":\"darkphoenix\"},\"sameAs\":[\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\"],\"url\":\"https:\\\/\\\/mallpath.ovh\\\/darkphoenix\\\/author\\\/darkphoenix\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Motor gr\u00e1fico en WebGL: primeros avances","description":"Primeros avances en el desarrollo del motor gr\u00e1fico en WebGL para MallPath, con las tres plantas del mapa cargadas en el navegador.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/","og_locale":"es_ES","og_type":"article","og_title":"Motor gr\u00e1fico en WebGL: primeros avances","og_description":"Primeros avances en el desarrollo del motor gr\u00e1fico en WebGL para MallPath, con las tres plantas del mapa cargadas en el navegador.","og_url":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/","og_site_name":"Dark Phoenix","article_published_time":"2026-02-16T07:00:00+00:00","og_image":[{"width":1917,"height":933,"url":"https:\/\/mallpath.ovh\/darkphoenix\/wp-content\/uploads\/2026\/02\/primera-planta.png","type":"image\/png"}],"author":"darkphoenix","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"darkphoenix","Tiempo de lectura":"3 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/#article","isPartOf":{"@id":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/"},"author":{"name":"darkphoenix","@id":"https:\/\/mallpath.ovh\/darkphoenix\/#\/schema\/person\/736b6bad4a7bf9aa43ad623cbff79cc5"},"headline":"Primeros avances del motor gr\u00e1fico en WebGL","datePublished":"2026-02-16T07:00:00+00:00","mainEntityOfPage":{"@id":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/"},"wordCount":379,"commentCount":0,"image":{"@id":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/#primaryimage"},"thumbnailUrl":"https:\/\/mallpath.ovh\/darkphoenix\/wp-content\/uploads\/2026\/02\/primera-planta.png","inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/","url":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/","name":"Motor gr\u00e1fico en WebGL: primeros avances","isPartOf":{"@id":"https:\/\/mallpath.ovh\/darkphoenix\/#website"},"primaryImageOfPage":{"@id":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/#primaryimage"},"image":{"@id":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/#primaryimage"},"thumbnailUrl":"https:\/\/mallpath.ovh\/darkphoenix\/wp-content\/uploads\/2026\/02\/primera-planta.png","datePublished":"2026-02-16T07:00:00+00:00","author":{"@id":"https:\/\/mallpath.ovh\/darkphoenix\/#\/schema\/person\/736b6bad4a7bf9aa43ad623cbff79cc5"},"description":"Primeros avances en el desarrollo del motor gr\u00e1fico en WebGL para MallPath, con las tres plantas del mapa cargadas en el navegador.","breadcrumb":{"@id":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/#primaryimage","url":"https:\/\/mallpath.ovh\/darkphoenix\/wp-content\/uploads\/2026\/02\/primera-planta.png","contentUrl":"https:\/\/mallpath.ovh\/darkphoenix\/wp-content\/uploads\/2026\/02\/primera-planta.png","width":1917,"height":933},{"@type":"BreadcrumbList","@id":"https:\/\/mallpath.ovh\/darkphoenix\/avances-motor-grafico-webgl\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/mallpath.ovh\/darkphoenix\/"},{"@type":"ListItem","position":2,"name":"Primeros avances del motor gr\u00e1fico en WebGL"}]},{"@type":"WebSite","@id":"https:\/\/mallpath.ovh\/darkphoenix\/#website","url":"https:\/\/mallpath.ovh\/darkphoenix\/","name":"Dark Phoenix","description":"Dark Phoenix es un grupo especializado en desarrollo web y proyectos tecnol\u00f3gicos como MallPath.","alternateName":"MallPath","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/mallpath.ovh\/darkphoenix\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Person","@id":"https:\/\/mallpath.ovh\/darkphoenix\/#\/schema\/person\/736b6bad4a7bf9aa43ad623cbff79cc5","name":"darkphoenix","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/secure.gravatar.com\/avatar\/bfb00e4b94fbe1ae2731384a6b3a30239598c8710d6a9d22a6b0b559927d9cfe?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/bfb00e4b94fbe1ae2731384a6b3a30239598c8710d6a9d22a6b0b559927d9cfe?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/bfb00e4b94fbe1ae2731384a6b3a30239598c8710d6a9d22a6b0b559927d9cfe?s=96&d=mm&r=g","caption":"darkphoenix"},"sameAs":["https:\/\/mallpath.ovh\/darkphoenix"],"url":"https:\/\/mallpath.ovh\/darkphoenix\/author\/darkphoenix\/"}]}},"_links":{"self":[{"href":"https:\/\/mallpath.ovh\/darkphoenix\/wp-json\/wp\/v2\/posts\/273","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mallpath.ovh\/darkphoenix\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mallpath.ovh\/darkphoenix\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mallpath.ovh\/darkphoenix\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mallpath.ovh\/darkphoenix\/wp-json\/wp\/v2\/comments?post=273"}],"version-history":[{"count":2,"href":"https:\/\/mallpath.ovh\/darkphoenix\/wp-json\/wp\/v2\/posts\/273\/revisions"}],"predecessor-version":[{"id":279,"href":"https:\/\/mallpath.ovh\/darkphoenix\/wp-json\/wp\/v2\/posts\/273\/revisions\/279"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/mallpath.ovh\/darkphoenix\/wp-json\/wp\/v2\/media\/276"}],"wp:attachment":[{"href":"https:\/\/mallpath.ovh\/darkphoenix\/wp-json\/wp\/v2\/media?parent=273"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mallpath.ovh\/darkphoenix\/wp-json\/wp\/v2\/categories?post=273"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mallpath.ovh\/darkphoenix\/wp-json\/wp\/v2\/tags?post=273"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}