{"id":10,"date":"2013-07-13T15:59:59","date_gmt":"2013-07-13T15:59:59","guid":{"rendered":"http:\/\/maquetando.com\/?p=10"},"modified":"2013-07-20T19:22:57","modified_gmt":"2013-07-20T19:22:57","slug":"que-es-el-wireframing","status":"publish","type":"post","link":"https:\/\/orpot.com\/blog\/que-es-el-wireframing\/","title":{"rendered":"\u00bfQue es el wireframing?"},"content":{"rendered":"<p><strong>Respuesta corta:<\/strong><\/p>\n<p>Wireframing es una manera de dise\u00f1ar un sitio web en el nivel estructural analizando las necesidades de el usuario, asi como la informaci\u00f3n que llevara dicho sitio .<\/p>\n<p>Los Wireframes se usan al incio de un proceso de desarrollo para establecer la estructura b\u00e1sica de una p\u00e1gina antes de que el dise\u00f1o visual y el contenido se agrege.<\/p>\n<p><strong>Respuesta larga:<\/strong><\/p>\n<p>Un wireframe es el dise\u00f1o previo para mostrar los elementos principales en la interfaz . Es una parte fundamental de la arquitectura de la informaci\u00f3n y proceso de dise\u00f1o.<\/p>\n<p>El objetivo de un Wireframe es proporcionar una comprensi\u00f3n visual de una p\u00e1gina de inicio de un proyecto web para obtener la aprobaci\u00f3n de los interesados \u200b\u200by de el equipo del proyecto, antes de que la fase creativa se ponga en marcha.<\/p>\n<p>Un Wireframe tambi\u00e9n se puede utilizar para crear la navegaci\u00f3n primaria y secundaria garantizando que la estructura cumple con las expectativas de el interesado , as\u00ed como los usuarios tambi\u00e9n pueden utilizarlo como un mecanismo de retro-alimentaci\u00f3n en los primeros tests de usabilidad del prototipo.<\/p>\n<p>Los Wireframes puede ser simplemente dibujados a mano, pero a menudo se forman por medio de software como Microsoft Vision para proporcionar una entrega de la pantalla.<\/p>\n<p>Sin embargo, si los wireframes se va a utilizar para un test de usabilidad de prototipo, lo mejor es crearlos en HTML b\u00e1sico .<\/p>\n<p>Hay algunos buenos programas que te permite hacer esto f\u00e1cilmente como Axure RP o Omnigraffle (s\u00f3lo Mac).<\/p>\n<p>Ventajas de wireframing :<\/p>\n<p>Por mucho, son mas f\u00e1ciles de modificar que por ejemplo un dise\u00f1o completamente realizado, ya que no llevan todo el proceso creativo y por lo tanto se ahorra tiempo en la definici\u00f3n de elementos b\u00e1sicos.<\/p>\n<p>Desde una perspectiva pr\u00e1ctica, los wireframes aseguran el contenido de la p\u00e1gina y la funcionalidad, la posici\u00f3n correcta de cada elemento bas\u00e1ndose en las necesidades de el usuario y las necesidades del negocio. A medida que avanza el proyecto puede ser utilizado como un buen di\u00e1logo entre los miembros del equipo de acuerdo a la visi\u00f3n y alcance del proyecto.<\/p>\n<p>Desventajas de wireframing :<\/p>\n<p>Los wireframes no incluyen el dise\u00f1o, no siempre es f\u00e1cil para el cliente a comprender el concepto con elementos a blanco y negro.<\/p>\n<p>El dise\u00f1ador tambi\u00e9n tendr\u00e1 que traducir los wireframes en un dise\u00f1o, as\u00ed que la comunicaci\u00f3n para apoyarlo es a menudo necesaria para explicar por qu\u00e9 los elementos de la p\u00e1gina se colocan en tal posici\u00f3n.<\/p>\n<p>Adem\u00e1s, cuando se agrega contenido, lo que inicialmente se muestra en espacios predefinidos puede no siempre ser el espacio final que ocupara la informaci\u00f3n, ya que esta podr\u00eda ser demasiada para caber en el dise\u00f1o del wireframe, por lo que el dise\u00f1ador y redactor tendr\u00e1 que trabajar estrechamente para hacer este ajuste.<\/p>\n<p><strong>Conclusi\u00f3n :<\/strong><\/p>\n<p>Un wireframe debe ser utilizado a principios de un proyecto para conseguir la aprobaci\u00f3n del usuario y del cliente en el dise\u00f1o de las p\u00e1ginas clave y la navegaci\u00f3n.<\/p>\n<p>Esto proporcionar\u00e1 el equipo del proyecto, espec\u00edficamente a los dise\u00f1adores, la confianza en seguir adelante. Los wireframes tambi\u00e9n ahorrar\u00e1n tiempo y dinero en la prueba y modificaci\u00f3n a la fase posterior del proyecto.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Respuesta corta: Wireframing es una manera de dise\u00f1ar un sitio web en el nivel estructural&hellip;<\/p>\n","protected":false},"author":1,"featured_media":514,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[47,5],"tags":[6],"_links":{"self":[{"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/posts\/10"}],"collection":[{"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/comments?post=10"}],"version-history":[{"count":5,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/posts\/10\/revisions"}],"predecessor-version":[{"id":513,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/posts\/10\/revisions\/513"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/media\/514"}],"wp:attachment":[{"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/media?parent=10"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/categories?post=10"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/orpot.com\/blog\/wp-json\/wp\/v2\/tags?post=10"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}