Al crear un sitio web de nivel empresarial, el wireframing es necesario por una o más de las siguientes razones:
- Los requisitos del usuario no se entienden completamente
- Aún se están realizando estudios de mercado o desarrollo de productos
- Es demasiado pronto para tomar decisiones sobre tecnología
- WordPress
- Drupal
- HTML5 plano
- PHP a medida
- Se necesitan pruebas exhaustivas
- Se necesita participación
Por supuesto, el diseño es imperativo y estos sitios deben funcionar según lo propuesto. Pero el mayor obstáculo de desarrollo suele ser interno: llegar a un acuerdo sobre la apariencia, el estilo y la función del sitio antes de que comience la codificación.
El Proceso de Wireframing
Comprender estos cinco pasos te ayudará a realizar correctamente el wireframing.
Marca
Puede parecer extraño, pero muchas organizaciones que encargan un sitio web grande no tienen una especificación de marca o no tienen una que sea suficiente para un sitio web. Un logotipo, una tipografía y una paleta de colores pueden ser suficientes para folletos de ventas simples, pero un sitio web también necesita definiciones de tono de voz, postura con respecto al lector, estilo fotográfico, elementos gráficos secundarios e interacciones. Como mínimo, una especificación de marca debe cubrir la promesa de la marca, la posición en el mercado o la categoría, los valores de la marca, el estilo o la personalidad de la marca, la arquitectura de la marca, la identidad de la marca (nombre, logotipo, tratamiento gráfico) y las decisiones específicas de implementación. De lo contrario, a medida que el proyecto crezca, el equipo volverá una y otra vez a decisiones que deberían haberse tomado desde el principio.
Función
Toda comunicación estructurada debe responder preguntas sobre resultados, audiencias, mensajes y entrega. Los resultados se relacionan con cambios en el «mundo real» como resultado de cambios en el pensamiento y el comportamiento de los individuos. ‘Producir un sitio web’ no es en sí mismo un resultado. Las audiencias son las personas a las que debemos llegar para que eso suceda. Las audiencias relevantes son los tomadores de decisiones, por ejemplo, una persona que presiona un botón para comprar un producto, los influencers, por ejemplo, personas que comparten una publicación rápida en Facebook, y porteros. Los guardianes son personas que no necesariamente pueden hacer que las cosas sucedan, pero pueden evitar que sucedan. El ejemplo obvio son las autoridades reguladoras, pero los guardianes suelen ser internos: un equipo de ventas que no impulsa el sitio web, un equipo ejecutivo que decide cancelar el proyecto o incluso un oficial de finanzas que retiene el presupuesto.
Los mensajes son «lo que creemos que persuadirá a los responsables de la toma de decisiones para lograr el resultado, si les creen». Si bien aparecerán muchos mensajes en un sitio web complejo con numerosos colaboradores, el sitio también tendrá tres o cuatro mensajes subyacentes. Estos a menudo se comunicarán por la apariencia y solo se reforzarán con palabras.
La entrega es cómo los mensajes llegan a las audiencias de manera constante y repetida. Para un sitio web, esto se expresará en última instancia en la codificación, pero, si se les deja solos, los codificadores se dejan llevar fácilmente. Por ejemplo, WordPress se ha convertido en una plataforma enormemente poderosa con una variedad de complementos. En el último minuto, un codificador puede simplemente agregar un complemento de mapa, un complemento de calendario o una plataforma de redes sociales. Sin embargo, a menos que estos sean parte de una decisión deliberada de entregar los mensajes de esta manera, el resultado restará valor, no agregará.
Creativo
El tratamiento creativo es donde entra en juego el wireframing. Una vez entendida la marca y la función, debemos buscar la presentación más efectiva posible. Siempre es mejor entregar mensajes a través del trabajo creativo que a través de la codificación. Si observa el sitio web de Apple, notará que la página principal es «plana», con gráficos magníficos pero sin interacciones ni animaciones. Una vez que hace clic en una línea de productos, comienza una codificación inteligente, pero solo en la medida en que puede configurar su producto en función de algunas opciones simples
La creatividad se beneficia de ser probada por muchas personas. Esto puede ser un poco diferente de la forma en que a muchos diseñadores les gusta trabajar, pero un diseñador que puede ayudar a todo un equipo al hacer que se reúna alrededor de su estación de trabajo y solicite agregar elementos adicionales, y luego verlos un minuto más tarde como un sitio web en funcionamiento —obtendrá una participación cada vez mayor en el proceso.
Compra
Los grandes proyectos web entran en círculos crecientes de aceptación. Esto se debe a que el riesgo para toda la organización es mucho mayor con un sitio web que con una sola publicación impresa. Los ejecutivos que no estarían interesados en un folleto de ventas querrán que se escuche su voz en un proyecto que representará a toda la organización. Esto casi siempre significará producir informes escritos adicionales del proyecto web, en lugar de simplemente mostrar esquemas (como con PowerPoint) o incluso permitirles jugar con un sitio web flexible producido por QuarkXPress. Sorprendentemente, la calidad de los materiales impresos que respaldan la decisión a menudo tendrá más peso para el equipo ejecutivo que el trabajo digital en sí.
Codificación
En un momento determinado, el trabajo creativo está listo y se completa la aceptación. Aquí es cuando el sitio se entrega al equipo de codificación. De hecho, es posible convertir un sitio QuarkXPress Flex a WordPress, Drupal u otros sistemas, pero la mayoría de los programadores preferirán usar el sitio producido por QuarkXPress como comunicación visual y funcional y hacer su propia codificación. Darles un sitio web funcional desde el que trabajar les permitirá hacerlo bien a la primera. También permitirá que el equipo del proyecto explique qué está mal si la codificación produce algo sustancialmente diferente.
En última instancia, el wireframing tiene tres objetivos:
- 1. Produce el sitio que realmente deseas
- 2. Persuadir a los socios para que lo acepten
- 3. Publica tu contenido fácilmente
La creación de tramas con QuarkXPress puede ayudar a lograr estos objetivos de forma más rápida, sencilla y con más confianza en los resultados. Es mucho más adecuado para propagar cambios en todo el diseño mediante estilos de elementos, contenido compartido y actualización de imágenes y, lo que es más importante, el estado actual del diseño se puede convertir en una vista previa o en un sitio web en funcionamiento con un clic del mouse. Esto da confianza al equipo, ya que pueden experimentar el sitio por sí mismos en cualquier momento durante el desarrollo. También significa una comunicación mucho mejor con el equipo de codificación al final del proceso.
Mire la repetición del seminario web de «Wireframing Enterprise Websites».