Si has escuchado el término "estructura alámbrica" pero estás un poco confundido acerca de qué es realmente, para qué sirve o por qué es útil, este artículo debería resolver tus dudas.
¿Qué es una estructura alámbrica?
Una estructura alámbrica es algo así como el dibujo de un arquitecto. Es borrador representación visual de la interfaz de usuario Su sitio o aplicación. Puedes utilizar wireframes para comunicar cuatro cosas:
- La estructura - navegación y arquitectura de la información.
- Cronograma - Por ejemplo. jerarquía de páginas, así como posicionamiento de elementos en la pantalla
- El contenido - la idea de cómo el contenido encajar con el diseño
- Funcionalidad – una descripción de cómo funcionará el producto y cómo lo utilizará la gente
Esta es una herramienta indispensable para cualquier diseñador de UX y es útil en muchas situaciones diferentes. Puedes crear wireframes con diferentes niveles de fidelidad (ing. fidelidad) y es precisamente por eso que son una herramienta tan poderosa.
Baja fidelidad (menor nivel de fidelidad) implica bocetos dibujados a mano, que son excelentes para desarrollar ideas iniciales, ya sea para usted o para presentarlas a su equipo. Es manera rápida para crear, editar y perfeccionar tus ideas, y no importa lo bueno que seas dibujando. Cualquiera que sepa dibujar un círculo, un cuadrado y un triángulo sencillos es perfectamente capaz de realizar un boceto de este tipo.
Ahora pasemos a lo que la mayoría de los expertos piensan primero cuando decimos "estructura alámbrica". Hay cientos de herramientas diferentes que puedes utilizar para crearlos. Figma, Balsamic, OmniGraffle, Illustrator y UXPin son sólo algunos de ellos. Los wireframes de este tipo son la forma de comunicas tu idea a tu equipo, clientes o clientas. Es una excelente manera de explicar su producto y exactamente lo que hace.
Sobre el alta fidelidad (alta fidelidad) parte del espectro, un prototipo en el que se puede hacer clic le permite diseñar interacciones y su flujo. Los prototipos en los que se puede hacer clic son una buena opción cuando pruebas la usabilidad. Puedes usar Axure, Keynote o incluso crear wireframes directamente en tu navegador usando HTML.
A veces, todo lo que necesita es un boceto rápido y, a veces, es más apropiado una estructura alámbrica con notas detalladas de lo que debería estar, dónde, cómo debería verse y para qué sirve. Realmente depende del proyecto y de la etapa en la que te encuentres.
Foto por Federica Galli él desempaquetar
Su estructura alámbrica debe mostrar un nivel de detalle adecuado, nada más. Entonces, aquí hay algunos consejos prácticos:
- Mantenlo simple – la velocidad y la simplicidad son claves para el wireframing. En la mayoría de los casos, desecharemos o eliminaremos la estructura alámbrica al final, tan pronto como cumpla su propósito. Por eso no es necesario que esté perfectamente delineado, ni que cada elemento esté colocado exactamente en un píxel.
- Utilice la grilla de coordenadas (ing. red) – Grid te ayuda a crear estructura y simplicidad en tu diseño. Todo sitio decente hoy en día está construido de acuerdo con este principio, por lo que te recomiendo que lo uses también.
- Utilice notas breves y precisas. - Los miembros del equipo leerán tu estructura alámbrica, así que no dejes de dejarles notas adecuadas que transmitan de forma clara y precisa el objetivo de lo que has esbozado. No exageres, sólo transmite el mensaje.
- Fomentar la retroalimentación – Muestra el wireframe a tus compañeros y pídeles su opinión. Esa es una forma segura de mejorarlo. No dudes en colgarlo en la pared más cercana y animar a todo el equipo a dar su opinión.
Como puedes ver, crear wireframes puede ser relativamente fácil, aunque por supuesto se necesita algo de experiencia para entender cómo aprovecharlos al máximo para tus objetivos.
Si está interesado en ayuda profesional en el campo del diseño UX u otros servicios de TI, Lee más sobre nosotros.
Fuente: youtube.com/uxmastery
