{"id":4046,"date":"2026-04-24T10:28:37","date_gmt":"2026-04-24T08:28:37","guid":{"rendered":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/?p=4046"},"modified":"2026-04-24T13:35:20","modified_gmt":"2026-04-24T11:35:20","slug":"que-es-wireframe","status":"publish","type":"post","link":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe","title":{"rendered":"Qu\u00e9 es un wireframe: tipos, para qu\u00e9 se usan&#8230;"},"content":{"rendered":"<p>En el sector del dise\u00f1o y desarrollo digital, el <strong>wireframe<\/strong> es el plano esencial sobre el que se construye cualquier proyecto exitoso. Se trata de una representaci\u00f3n visual esquem\u00e1tica que define la estructura de una p\u00e1gina, un <a href=\"https:\/\/www.inesem.es\/revistadigital\/informatica-y-tics\/estandares-web\/\" target=\"_blank\" rel=\"noopener\">est\u00e1ndar web<\/a> o una aplicaci\u00f3n. Su funci\u00f3n principal es permitirte planificar la arquitectura de la informaci\u00f3n y el contenido antes de que intervengan el dise\u00f1o visual o <a href=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/el-diseno-de-apps-en-10-pasos\/\">dise\u00f1o de apps,<\/a> asegurando que cada elemento tenga un prop\u00f3sito funcional claro.<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_72 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\/#%C2%BFQue_es_un_wireframe_web\" title=\"\u00bfQu\u00e9 es un wireframe web?\">\u00bfQu\u00e9 es un wireframe web?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\/#Por_que_necesitas_crear_wireframes\" title=\"Por qu\u00e9 necesitas crear wireframes\">Por qu\u00e9 necesitas crear wireframes<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\/#Como_crear_un_wireframe_Aspectos_a_tener_en_cuenta\" title=\"C\u00f3mo crear un wireframe: Aspectos a tener en cuenta\">C\u00f3mo crear un wireframe: Aspectos a tener en cuenta<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\/#Tipos_de_wireframes\" title=\"Tipos de wireframes\">Tipos de wireframes<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\/#Wireframes_de_baja_fidelidad\" title=\"Wireframes de baja fidelidad\">Wireframes de baja fidelidad<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\/#Wireframes_de_alta_fidelidad\" title=\"Wireframes de alta fidelidad\">Wireframes de alta fidelidad<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\/#Ejemplos_de_wireframe_online_en_figma\" title=\"Ejemplos de wireframe online en figma\">Ejemplos de wireframe online en figma<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"%C2%BFQue_es_un_wireframe_web\"><\/span>\u00bfQu\u00e9 es un wireframe web?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Un <strong>wireframe web<\/strong> es un boceto o esquema de baja complejidad que muestra la estructura b\u00e1sica de la interfaz de usuario (UI). Su objetivo es organizar la disposici\u00f3n de los elementos, establecer la jerarqu\u00eda de la informaci\u00f3n y trazar el flujo de navegaci\u00f3n. Al responder a la pregunta sobre <strong>qu\u00e9 es un wireframe<\/strong>, debemos entenderlo como el esqueleto del sitio: no incluye colores, tipograf\u00edas finales ni im\u00e1genes complejas, ya que su prioridad absoluta es la funcionalidad y la optimizaci\u00f3n de la <a href=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/diagrama-de-flujo-ux\/\"><strong>experiencia de usuario (UX)<\/strong>.<\/a><\/p>\n<h2><span class=\"ez-toc-section\" id=\"Por_que_necesitas_crear_wireframes\"><\/span>Por qu\u00e9 necesitas crear wireframes<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Crear un <strong>wireframe online<\/strong> o f\u00edsico es imprescindible para ahorrar tiempo y evitar errores costosos en etapas avanzadas. Esta herramienta te permite visualizar la viabilidad del proyecto y facilita la comunicaci\u00f3n con los desarrolladores, ya que todos trabajan sobre una gu\u00eda clara. Adem\u00e1s, los wireframes son el escenario ideal para realizar pruebas r\u00e1pidas de usabilidad, permiti\u00e9ndote detectar fallos en la navegaci\u00f3n o en la jerarqu\u00eda de contenidos antes de invertir recursos en el desarrollo visual final.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Como_crear_un_wireframe_Aspectos_a_tener_en_cuenta\"><\/span>C\u00f3mo crear un wireframe: Aspectos a tener en cuenta<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Para crear un esquema eficaz, debes priorizar la claridad sobre la est\u00e9tica. Es fundamental definir primero el nivel de fidelidad que requiere el proyecto seg\u00fan su fase actual y asegurar que la jerarqu\u00eda de la informaci\u00f3n gu\u00ede al usuario de forma natural hacia sus objetivos. Debes incluir elementos esenciales de la interfaz como botones, men\u00fas de navegaci\u00f3n y formularios de contacto. Actualmente, la eficiencia en este proceso ha crecido exponencialmente gracias al uso de <a href=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/aplicaciones-de-inteligencia-artificial-para-diseno-grafico\/\" target=\"_blank\" rel=\"noopener\">IA para el dise\u00f1o gr\u00e1fico<\/a>, que permite generar estructuras base en segundos para que t\u00fa puedas centrarte en la estrategia.<\/p>\n<table style=\"width: 100%;border-collapse: collapse;font-family: sans-serif;font-size: 14px;line-height: 1.5\">\n<thead>\n<tr style=\"background-color: #192b5d;color: #ffffff\">\n<th style=\"padding: 10px 14px;text-align: center;font-weight: 600;font-size: 13px;width: 40px\">#<\/th>\n<th style=\"padding: 10px 14px;text-align: left;font-weight: 600;font-size: 13px;width: 220px\">Pasos<\/th>\n<th style=\"padding: 10px 14px;text-align: left;font-weight: 600;font-size: 13px\">En qu\u00e9 consiste<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #ffffff\">\n<td style=\"padding: 10px 14px;text-align: center;font-weight: bold;font-size: 15px;color: #54c9d6;vertical-align: top\">1<\/td>\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">Define el objetivo antes de tocar ninguna herramienta<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Responde a qu\u00e9 acci\u00f3n quieres que realice el usuario. Sin eso, el wireframe es una colecci\u00f3n de elementos sin prop\u00f3sito.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #f0f8fb\">\n<td style=\"padding: 10px 14px;text-align: center;font-weight: bold;font-size: 15px;color: #54c9d6;vertical-align: top\">2<\/td>\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">Conoce a tu usuario antes de decidir la estructura<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">La arquitectura de la informaci\u00f3n debe seguir c\u00f3mo piensa tu usuario, no c\u00f3mo est\u00e1 organizada tu empresa internamente.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #ffffff\">\n<td style=\"padding: 10px 14px;text-align: center;font-weight: bold;font-size: 15px;color: #54c9d6;vertical-align: top\">3<\/td>\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">Elige el nivel de fidelidad adecuado a la fase del proyecto<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Baja fidelidad para explorar, media para validar con cliente, alta para pasar a desarrollo. Avanzar antes de tiempo no acelera: complica.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #f0f8fb\">\n<td style=\"padding: 10px 14px;text-align: center;font-weight: bold;font-size: 15px;color: #54c9d6;vertical-align: top\">4<\/td>\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">Establece la jerarqu\u00eda visual desde el primer trazo<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Define cu\u00e1l es el elemento principal de cada pantalla y construye el resto alrededor. Si todo compite por la atenci\u00f3n, nada la retiene.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #ffffff\">\n<td style=\"padding: 10px 14px;text-align: center;font-weight: bold;font-size: 15px;color: #54c9d6;vertical-align: top\">5<\/td>\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">Incluye todos los elementos de interfaz esenciales<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Cabecera, navegaci\u00f3n, bloques de contenido, CTAs, formularios y estados de error. Lo que no est\u00e1 aqu\u00ed alguien lo tendr\u00e1 que improvisar en desarrollo.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #f0f8fb\">\n<td style=\"padding: 10px 14px;text-align: center;font-weight: bold;font-size: 15px;color: #54c9d6;vertical-align: top\">6<\/td>\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">Piensa en m\u00f3vil desde el primer momento<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Dise\u00f1a primero para m\u00f3vil y luego escala. Obliga a priorizar lo esencial y garantiza una experiencia de usuario coherente en todos los dispositivos.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #ffffff\">\n<td style=\"padding: 10px 14px;text-align: center;font-weight: bold;font-size: 15px;color: #54c9d6;vertical-align: top\">7<\/td>\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">Documenta las interacciones y los flujos de navegaci\u00f3n<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Anota qu\u00e9 hace cada bot\u00f3n y a d\u00f3nde lleva cada enlace. Sin anotaciones, un wireframe es solo un boceto.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #f0f8fb\">\n<td style=\"padding: 10px 14px;text-align: center;font-weight: bold;font-size: 15px;color: #54c9d6;vertical-align: top\">8<\/td>\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">Valida con usuarios reales antes de pasar al dise\u00f1o visual<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Un error detectado en wireframe cuesta minutos. Detectarlo en producci\u00f3n puede costar semanas. Pon el wireframe delante de dos o tres personas y p\u00eddeles que lo usen.<\/td>\n<\/tr>\n<\/tbody>\n<tfoot>\n<tr style=\"background-color: #54c9d6\">\n<td style=\"padding: 8px 14px;font-size: 12px;color: #083040;font-style: italic\" colspan=\"3\">Recuerda: el wireframe es el momento m\u00e1s barato para equivocarse. Aprov\u00e9chalo.<\/td>\n<\/tr>\n<\/tfoot>\n<\/table>\n<h2><span class=\"ez-toc-section\" id=\"Tipos_de_wireframes\"><\/span>Tipos de wireframes<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Dependiendo del detalle y el objetivo que busques, existen diferentes <strong>tipos de wireframe<\/strong> que se adaptan a cada momento del proceso creativo, dividi\u00e9ndose principalmente por su grado de precisi\u00f3n y funcionalidad t\u00e9cnica.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Wireframes_de_baja_fidelidad\"><\/span>Wireframes de baja fidelidad<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Los wireframes de baja fidelidad son esquemas de trazo r\u00e1pido construidos con rect\u00e1ngulos, l\u00edneas y cajas simples, sin colores, tipograf\u00edas definidas ni proporciones exactas. Su funci\u00f3n no es mostrar c\u00f3mo va a quedar algo, sino decidir d\u00f3nde va a estar cada cosa. Son extremadamente f\u00e1ciles de modificar, lo que los convierte en la herramienta ideal para explorar estructuras y validar la arquitectura de la informaci\u00f3n en las primeras fases del proyecto, antes de invertir tiempo en ning\u00fan detalle visual.<\/p>\n<table style=\"width: 100%;border-collapse: collapse;font-family: sans-serif;font-size: 14px;line-height: 1.5\">\n<thead>\n<tr style=\"background-color: #192b5d;color: #ffffff\">\n<th style=\"padding: 10px 14px;text-align: left;font-weight: 600;font-size: 13px;width: 30%\">Caracter\u00edstica<\/th>\n<th style=\"padding: 10px 14px;text-align: left;font-weight: 600;font-size: 13px\">Detalle<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #ffffff\">\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">\u00bfQu\u00e9 incluye?<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Rect\u00e1ngulos, l\u00edneas y cajas simples. Sin colores, sin tipograf\u00edas definidas ni proporciones exactas.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #f0f8fb\">\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">\u00bfQu\u00e9 no incluye?<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Colores reales, im\u00e1genes, tipograf\u00eda final, dimensiones exactas ni interacciones.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #ffffff\">\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">\u00bfCu\u00e1ndo se usa?<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">En la fase de exploraci\u00f3n inicial, cuando todav\u00eda hay incertidumbre sobre la estructura o el flujo de navegaci\u00f3n.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #f0f8fb\">\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">\u00bfCon qui\u00e9n se valida?<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Con el equipo interno o el cliente en reuniones tempranas. Su aspecto inacabado invita a opinar sin el reparo que genera un dise\u00f1o pulido.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #ffffff\">\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">Ejemplo pr\u00e1ctico<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Est\u00e1s dise\u00f1ando la p\u00e1gina de producto de un ecommerce. Con un wireframe de baja fidelidad pruebas en minutos si el bot\u00f3n de compra funciona mejor debajo del precio o debajo de las valoraciones, sin invertir tiempo en ninguna de las dos opciones.<\/td>\n<\/tr>\n<\/tbody>\n<tfoot>\n<tr style=\"background-color: #54c9d6\">\n<td style=\"padding: 8px 14px;font-size: 12px;color: #083040;font-style: italic\" colspan=\"2\">Herramientas habituales: papel y bol\u00edgrafo, Balsamiq, Whimsical o los wireframe kits b\u00e1sicos de Figma.<\/td>\n<\/tr>\n<\/tfoot>\n<\/table>\n<h3><span class=\"ez-toc-section\" id=\"Wireframes_de_alta_fidelidad\"><\/span>Wireframes de alta fidelidad<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Los wireframes de alta fidelidad son documentos t\u00e9cnicos que representan la interfaz con un nivel de detalle muy pr\u00f3ximo al producto final: dimensiones reales en p\u00edxeles, espaciados exactos, jerarqu\u00eda tipogr\u00e1fica definida y estados de cada componente (activo, desactivado, error). No incluyen el acabado visual completo \u2014paleta de color final, im\u00e1genes reales\u2014 pero s\u00ed toda la l\u00f3gica estructural y funcional que el equipo de desarrollo necesita para trabajar, lo que permite que front y back arranquen en paralelo sin esperar a que el dise\u00f1o est\u00e9 terminado.<\/p>\n<table style=\"width: 100%;border-collapse: collapse;font-family: sans-serif;font-size: 14px;line-height: 1.5\">\n<thead>\n<tr style=\"background-color: #192b5d;color: #ffffff\">\n<th style=\"padding: 10px 14px;text-align: left;font-weight: 600;font-size: 13px;width: 30%\">Caracter\u00edstica<\/th>\n<th style=\"padding: 10px 14px;text-align: left;font-weight: 600;font-size: 13px\">Detalle<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #ffffff\">\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">\u00bfQu\u00e9 incluye?<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Dimensiones reales en p\u00edxeles, espaciados exactos, jerarqu\u00eda tipogr\u00e1fica definida, estados de los componentes (activo, desactivado, error) y flujos de navegaci\u00f3n enlazados entre pantallas.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #f0f8fb\">\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">\u00bfQu\u00e9 no incluye?<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Paleta de color final, im\u00e1genes reales ni ilustraciones. La l\u00f3gica estructural y funcional s\u00ed est\u00e1 completa; el acabado visual, no.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #ffffff\">\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">\u00bfCu\u00e1ndo se usa?<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">En la fase de entrega a desarrollo o en pruebas de validaci\u00f3n final con usuarios, cuando la estructura est\u00e1 aprobada y el equipo t\u00e9cnico necesita especificaciones concretas para empezar a trabajar.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #f0f8fb\">\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">\u00bfCon qui\u00e9n se valida?<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Con el equipo de desarrollo y con usuarios reales en pruebas de usabilidad. Permite que front y back empiecen a trabajar en paralelo sin esperar al dise\u00f1o visual terminado.<\/td>\n<\/tr>\n<tr style=\"border-bottom: 1px solid #e0e8f0;background-color: #ffffff\">\n<td style=\"padding: 10px 14px;font-weight: 600;color: #192b5d;vertical-align: top\">Ejemplo pr\u00e1ctico<\/td>\n<td style=\"padding: 10px 14px;color: #444444;vertical-align: top\">Est\u00e1s redise\u00f1ando el proceso de checkout de una app. El wireframe de alta fidelidad especifica qu\u00e9 campos lleva cada pantalla, en qu\u00e9 orden aparecen, qu\u00e9 ocurre si el c\u00f3digo de descuento es inv\u00e1lido y c\u00f3mo se comporta el formulario en m\u00f3vil, todo ello antes de que el dise\u00f1o visual est\u00e9 terminado.<\/td>\n<\/tr>\n<\/tbody>\n<tfoot>\n<tr style=\"background-color: #54c9d6\">\n<td style=\"padding: 8px 14px;font-size: 12px;color: #083040;font-style: italic\" colspan=\"2\">Herramientas habituales: Figma, Adobe XD o Sketch con componentes y auto-layout activados.<\/td>\n<\/tr>\n<\/tfoot>\n<\/table>\n<h2><span class=\"ez-toc-section\" id=\"Ejemplos_de_wireframe_online_en_figma\"><\/span>Ejemplos de wireframe online en figma<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Si buscas referentes actuales, el <strong>wireframe figma<\/strong> se ha consolidado como el est\u00e1ndar de la industria debido a su capacidad colaborativa en la nube. En la comunidad de esta plataforma puedes encontrar innumerables <strong>ejemplos de wireframe<\/strong> que sirven de base para entender c\u00f3mo estructurar desde una *landing page* hasta un *e-commerce* complejo. Trabajar con un <strong>wireframe online<\/strong> en este ecosistema te permite recibir *feedback* en tiempo real, garantizando que el dise\u00f1o final sea intuitivo, moderno y totalmente alineado con las necesidades del mercado.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Un wireframe mal hecho puede costarte semanas de trabajo. Aprende qu\u00e9 es, cu\u00e1ndo usar baja o alta fidelidad y los 8 pasos para crearlo.<\/p>\n","protected":false},"author":91968,"featured_media":4856,"comment_status":"open","ping_status":"open","sticky":true,"template":"","format":"standard","meta":{"footnotes":""},"categories":[339],"class_list":["post-4046","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-diseno-web"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v23.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Qu\u00e9 es un wireframe y c\u00f3mo hacerlo sin cometer los errores t\u00edpicos<\/title>\n<meta name=\"description\" content=\"Un wireframe mal hecho puede costarte semanas de trabajo. Aprende qu\u00e9 es, cu\u00e1ndo usar baja o alta fidelidad y los 8 pasos para crearlo.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Qu\u00e9 es un wireframe y c\u00f3mo hacerlo sin cometer los errores t\u00edpicos\" \/>\n<meta property=\"og:description\" content=\"Un wireframe mal hecho puede costarte semanas de trabajo. Aprende qu\u00e9 es, cu\u00e1ndo usar baja o alta fidelidad y los 8 pasos para crearlo.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\" \/>\n<meta property=\"og:site_name\" content=\"Canal Dise\u00f1o y Arquitectura\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/InesemBusinessSchool\/\" \/>\n<meta property=\"article:published_time\" content=\"2026-04-24T08:28:37+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-24T11:35:20+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1301\" \/>\n\t<meta property=\"og:image:height\" content=\"703\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"jefferson.mera\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@inesem\" \/>\n<meta name=\"twitter:site\" content=\"@inesem\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"jefferson.mera\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\"},\"author\":{\"name\":\"jefferson.mera\",\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#\/schema\/person\/191b07216f6896be60fc0b8b75c14342\"},\"headline\":\"Qu\u00e9 es un wireframe: tipos, para qu\u00e9 se usan&#8230;\",\"datePublished\":\"2026-04-24T08:28:37+00:00\",\"dateModified\":\"2026-04-24T11:35:20+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\"},\"wordCount\":1351,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe.png\",\"articleSection\":[\"Dise\u00f1o Web\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\",\"url\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\",\"name\":\"Qu\u00e9 es un wireframe y c\u00f3mo hacerlo sin cometer los errores t\u00edpicos\",\"isPartOf\":{\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe.png\",\"datePublished\":\"2026-04-24T08:28:37+00:00\",\"dateModified\":\"2026-04-24T11:35:20+00:00\",\"description\":\"Un wireframe mal hecho puede costarte semanas de trabajo. Aprende qu\u00e9 es, cu\u00e1ndo usar baja o alta fidelidad y los 8 pasos para crearlo.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#primaryimage\",\"url\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe.png\",\"contentUrl\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe.png\",\"width\":1301,\"height\":703},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Dise\u00f1o Web\",\"item\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/categorias\/diseno-web\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Qu\u00e9 es un wireframe: tipos, para qu\u00e9 se usan&#8230;\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#website\",\"url\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/\",\"name\":\"Canal Dise\u00f1o y Arquitectura\",\"description\":\"En los art\u00edculos de Dise\u00f1o y Arquitectura de Revista Digital INESEM encontrar\u00e1s informaci\u00f3n actualizada e innovadora sobre tu sector. Nuestros art\u00edculos est\u00e1n elaborados y contrastados por profesionales de diferentes especialidades del sector. Si est\u00e1s buscando informaci\u00f3n sobre Arquitectura y Edificaci\u00f3n, Decoraci\u00f3n e Interiorismo, Dise\u00f1o Gr\u00e1fico, Dise\u00f1o Web o Edici\u00f3n y Posproducci\u00f3n Digital, est\u00e1s en el sitio indicado.\",\"publisher\":{\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#organization\",\"name\":\"Canal Dise\u00f1o y Arquitectura\",\"url\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#\/schema\/logo\/image\/\",\"url\":\"\",\"contentUrl\":\"\",\"caption\":\"Canal Dise\u00f1o y Arquitectura\"},\"image\":{\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/InesemBusinessSchool\/\",\"https:\/\/x.com\/inesem\",\"http:\/\/www.linkedin.com\/company\/2370697\",\"https:\/\/www.youtube.com\/user\/inesembusinesschool\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#\/schema\/person\/191b07216f6896be60fc0b8b75c14342\",\"name\":\"jefferson.mera\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/3ff3f1ac95ff609e4a442c4de0742907?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/3ff3f1ac95ff609e4a442c4de0742907?s=96&d=mm&r=g\",\"caption\":\"jefferson.mera\"},\"url\":\"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/autores\/jefferson-mera\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Qu\u00e9 es un wireframe y c\u00f3mo hacerlo sin cometer los errores t\u00edpicos","description":"Un wireframe mal hecho puede costarte semanas de trabajo. Aprende qu\u00e9 es, cu\u00e1ndo usar baja o alta fidelidad y los 8 pasos para crearlo.","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:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe","og_locale":"es_ES","og_type":"article","og_title":"Qu\u00e9 es un wireframe y c\u00f3mo hacerlo sin cometer los errores t\u00edpicos","og_description":"Un wireframe mal hecho puede costarte semanas de trabajo. Aprende qu\u00e9 es, cu\u00e1ndo usar baja o alta fidelidad y los 8 pasos para crearlo.","og_url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe","og_site_name":"Canal Dise\u00f1o y Arquitectura","article_publisher":"https:\/\/www.facebook.com\/InesemBusinessSchool\/","article_published_time":"2026-04-24T08:28:37+00:00","article_modified_time":"2026-04-24T11:35:20+00:00","og_image":[{"width":1301,"height":703,"url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe.png","type":"image\/png"}],"author":"jefferson.mera","twitter_card":"summary_large_image","twitter_creator":"@inesem","twitter_site":"@inesem","twitter_misc":{"Escrito por":"jefferson.mera","Tiempo de lectura":"6 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#article","isPartOf":{"@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe"},"author":{"name":"jefferson.mera","@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#\/schema\/person\/191b07216f6896be60fc0b8b75c14342"},"headline":"Qu\u00e9 es un wireframe: tipos, para qu\u00e9 se usan&#8230;","datePublished":"2026-04-24T08:28:37+00:00","dateModified":"2026-04-24T11:35:20+00:00","mainEntityOfPage":{"@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe"},"wordCount":1351,"commentCount":0,"publisher":{"@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#organization"},"image":{"@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#primaryimage"},"thumbnailUrl":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe.png","articleSection":["Dise\u00f1o Web"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe","name":"Qu\u00e9 es un wireframe y c\u00f3mo hacerlo sin cometer los errores t\u00edpicos","isPartOf":{"@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#primaryimage"},"image":{"@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#primaryimage"},"thumbnailUrl":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe.png","datePublished":"2026-04-24T08:28:37+00:00","dateModified":"2026-04-24T11:35:20+00:00","description":"Un wireframe mal hecho puede costarte semanas de trabajo. Aprende qu\u00e9 es, cu\u00e1ndo usar baja o alta fidelidad y los 8 pasos para crearlo.","breadcrumb":{"@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#primaryimage","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe.png","contentUrl":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe.png","width":1301,"height":703},{"@type":"BreadcrumbList","@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/que-es-wireframe#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/"},{"@type":"ListItem","position":2,"name":"Dise\u00f1o Web","item":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/categorias\/diseno-web"},{"@type":"ListItem","position":3,"name":"Qu\u00e9 es un wireframe: tipos, para qu\u00e9 se usan&#8230;"}]},{"@type":"WebSite","@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#website","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/","name":"Canal Dise\u00f1o y Arquitectura","description":"En los art\u00edculos de Dise\u00f1o y Arquitectura de Revista Digital INESEM encontrar\u00e1s informaci\u00f3n actualizada e innovadora sobre tu sector. Nuestros art\u00edculos est\u00e1n elaborados y contrastados por profesionales de diferentes especialidades del sector. Si est\u00e1s buscando informaci\u00f3n sobre Arquitectura y Edificaci\u00f3n, Decoraci\u00f3n e Interiorismo, Dise\u00f1o Gr\u00e1fico, Dise\u00f1o Web o Edici\u00f3n y Posproducci\u00f3n Digital, est\u00e1s en el sitio indicado.","publisher":{"@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#organization","name":"Canal Dise\u00f1o y Arquitectura","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#\/schema\/logo\/image\/","url":"","contentUrl":"","caption":"Canal Dise\u00f1o y Arquitectura"},"image":{"@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/InesemBusinessSchool\/","https:\/\/x.com\/inesem","http:\/\/www.linkedin.com\/company\/2370697","https:\/\/www.youtube.com\/user\/inesembusinesschool\/"]},{"@type":"Person","@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#\/schema\/person\/191b07216f6896be60fc0b8b75c14342","name":"jefferson.mera","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/3ff3f1ac95ff609e4a442c4de0742907?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/3ff3f1ac95ff609e4a442c4de0742907?s=96&d=mm&r=g","caption":"jefferson.mera"},"url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/autores\/jefferson-mera"}]}},"autor_name":{"name":"jefferson.mera"},"featured_image":{"attachment_meta":{"width":1301,"height":703,"file":"2024\/03\/que-es-wireframe.png","filesize":188729,"sizes":{"medium":{"file":"que-es-wireframe-300x162.png","width":300,"height":162,"filesize":68732,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-300x162.png"},"large":{"file":"que-es-wireframe-1020x551.png","width":1020,"height":551,"filesize":620062,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-1020x551.png"},"thumbnail":{"file":"que-es-wireframe-345x180.png","width":345,"height":180,"filesize":85815,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-345x180.png"},"medium_large":{"file":"que-es-wireframe-768x415.png","width":768,"height":415,"filesize":367708,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-768x415.png"},"thumb-small":{"file":"que-es-wireframe-80x80.png","width":80,"height":80,"filesize":10489,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-80x80.png"},"thumb-standard":{"file":"que-es-wireframe-320x320.png","width":320,"height":320,"filesize":110412,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-320x320.png"},"thumb-medium":{"file":"que-es-wireframe-520x245.png","width":520,"height":245,"filesize":166763,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-520x245.png"},"thumb-large":{"file":"que-es-wireframe-720x340.png","width":720,"height":340,"filesize":300873,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-720x340.png"},"thumb-anteriores":{"file":"que-es-wireframe-230x163.png","width":230,"height":163,"filesize":50295,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-230x163.png"},"thumb-inverso":{"file":"que-es-wireframe-369x261.png","width":369,"height":261,"filesize":114480,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-369x261.png"},"thumb-cercano":{"file":"que-es-wireframe-650x200.png","width":650,"height":200,"filesize":171954,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-650x200.png"},"thumb-slider":{"file":"que-es-wireframe-574x430.png","width":574,"height":430,"filesize":261138,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-574x430.png"},"thumb-busqueda":{"file":"que-es-wireframe-580x375.png","width":580,"height":375,"filesize":243888,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-580x375.png"},"thumb-formacion-continua":{"file":"que-es-wireframe-440x336.png","width":440,"height":336,"filesize":163304,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-440x336.png"},"thumb-xlarge":{"file":"que-es-wireframe-980x450.png","width":980,"height":450,"filesize":520230,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-980x450.png"},"thumb-xxlarge":{"file":"que-es-wireframe-1301x500.png","width":1301,"height":500,"filesize":420259,"mime_type":"image\/png","url":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/files\/2024\/03\/que-es-wireframe-1301x500.png"}},"image_meta":{"aperture":"0","credit":"","camera":"","caption":"","created_timestamp":"0","copyright":"","focal_length":"0","iso":"0","shutter_speed":"0","title":"","orientation":"0","keywords":[]}}},"_links":{"self":[{"href":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/wp-json\/wp\/v2\/posts\/4046"}],"collection":[{"href":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/wp-json\/wp\/v2\/users\/91968"}],"replies":[{"embeddable":true,"href":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/wp-json\/wp\/v2\/comments?post=4046"}],"version-history":[{"count":0,"href":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/wp-json\/wp\/v2\/posts\/4046\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/wp-json\/wp\/v2\/media\/4856"}],"wp:attachment":[{"href":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/wp-json\/wp\/v2\/media?parent=4046"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.inesem.es\/revistadigital\/diseno-y-artes-graficas\/wp-json\/wp\/v2\/categories?post=4046"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}