La planificación de un sitio web no tiene por qué ser totalmente digital. Aprenda cómo dibujar wireframes puede ayudar a acelerar e innovar sus creatividades.
Hay un montón de cursos básicos que se enseñan en la escuela de diseño. Y no es de extrañar que las grandes agencias y las nuevas empresas están adoptando un enfoque de vuelta a lo básico para sus procesos de diseño.
Si usted ha sido un doodler toda la vida o tener un serio croquis, pudiendo utilizar papel para explorar nuevas ideas es una habilidad importante en el campo del diseño.
No temas! La alimentación analógica del lápiz no está muerto. En esta era de dispositivo centrado, todavía hay mucho espacio para un proceso simple y probado diseño.
De hecho, he oído hablar de una creciente reacción contra el desperdicio de horas facturables en desarrollo de composiciones de Photoshop totalmente rendidos. Los bocetos te dan la flexibilidad, finura y generar iterativo, diseños evolutivos sin especular el presupuesto en el trabajo plenamente y composiciones digitales.
Si usted es una gran agencia o profesional independiente, puede ser capaz de comunicar ideas a los clientes con un boceto rápido es una herramienta valiosa.
¿POR QUÉ DIBUJO?
Los bocetos tiene algunas ventajas para wireframes digitales o incluso de dibujo digital. Es portátil, accesible, creativo y de eficacia comprobada. No hay nada más simple que el papel y el lápiz - o un bolígrafo.
He encontrado, también, que los clientes tienden a encontrar el trabajo informal suficiente de que pueden sugerir cambios y hacer cambios. Buscar las composiciones completamente terminadas o casi terminadas. Creo que puede dificultar la voluntad de un cliente para sugerir mejoras o cambios.
Wireframes tienden a ser tener mucho texto y rara vez comunicar la dirección de arte. Especialmente para la fotografía y los activos visuales. ¿Cuándo fue la última vez que una gran "X", dijo nada acerca de su fotografía?
Por dibujo, se puede hacer rápido, casi una línea de pensamientos para el desarrollo de tus ideas rápidamente. Funciona sobre la marcha, por lo que pueden pasar horas facturables menos en el monitor y más tiempo generando ideas . Basta con subirse las mangas y encontrar soluciones.
Esto a la larga se convirtió en una imagen de Photoshop para el cliente. Usted puede ver cómo se parece a la estructura dibujada tradicional, refleja fielmente la dirección de arte de la composición.
Y esbozando mata a la necesidad de la for-placement-only (FPO) imágenes. Ya sabes, las grandes "x", las imágenes que pones en tus maquetas y composiciones para mostrar dónde pondrás archivos reales. Y usted ahorrar en el uso de la fotografía de stock caro para FPO.
Este es el borrador de la página web. ¿Ves la progresión de dibujo y wireframe a un borrador final?
¿CÓMO EMPEZAR?
Una cosa es segura, la práctica hace al maestro. Así que dibuja unos garabatos, bocetos, interacción, idea y dibujo.
He descubierto que la mejor manera de hacerlo es mediante el dibujo cada vez que usted está haciendo la cola para hacer las compras, o esperando en el tren. Cualquier forma de esperar es una oportunidad para dibujar.
Y dibuja lo que ve, esta habilidad le ayudará más tarde, cuando se quiere "actuar" para sus clientes. Dibujar las cosas cotidianas te ayuda a estar preparados con ideas y llevar un cuaderno de bocetos significa que usted siempre puede estar listo para anotar ideas para más adelante.
Al esbozar más, usted aprenderá a refinar sus dibujos y desarrollarlas en ilustraciones o dibujos más formales.
SKETCHING PARA DISEÑADORES WEB
Cuando se planifica un sitio web, el dibujo puede ser una parte valiosa de la planificación. Se puede utilizar para el diseño UX, pruebas, elementos de interfaz de usuario e incluso probar ideas de tipografía.
Lo he utilizado en varios sitios web para idear los activos creativos de un proyecto como la fotografía y los iconos. Y también lo he utilizado cuando se enfrentan a problemas críticos de interfaz de usuario, como la forma de hacer un botón o icono intuitivo y fácil de usar.
Sketches son herramientas perfectas para la comunicación de inferencia en los elementos de diseño, también. Y los clientes aman el componente de creatividad. Se meten en el proceso. Usted encontrará que a ellos les gusta dibujar, también.
Tuve un cliente una vez decir "wow, es como yo lo creo y que acaba de dibujar. ¡Increíble!". Y ese es el poder y la magia del dibujo sobre la marcha en reuniones con clientes.
ADVERTENCIA! PRACTICA, PRACTICA, PRACTICA
Doodlers Anónimos es un gran lugar para empezar, ver otros bosquejos, garabato y reflexionar sobre sus ideas . También es una gran comunidad para el intercambio y la interacción entre pares.
Se advirtió, el mundo es un lugar cruel. Bucear en dibujos puede ser duro. Si no eres un dibujante experimentado o no tienen la mano para dibujo... tendrás que tomar un tiempo para dibujar independientemente del trabajo.
Para la inspiración, visitar sitios como Worldwide Sketchcrawl , Doodlers Anonymous y Urban Sketchers .
Lea sobre el diario y dibuje pensando en crear blogs. Entonces te preguntas ... ¿Estoy listo para dibujar a mi cliente?
Urban Sketchers es una organización no lucrativa internacional dedicada a bosquejar observacional. Tienen una comunidad robusta en Flickr y Facebook. El blog principal cuenta con un grupo de corresponsales de boceto seleccionados de todo el mundo que comparten su trabajo. Usted puede encontrar un montón de maneras de inspirar a esbozar el mundo que te rodea en su sitio y en el Flickr y las comunidades de Facebook.
Recuerde, figuras de palo no impresionan. Así que ser capaz de dibujar puede ser un primer paso importante. Es posible que desee tomar el tiempo a la "práctica" y entender cómo esbozar sus ideas antes de sumergirse en proyectos de clientes.
SKETCHING UN DISEÑO
Este es un ejemplo de un boceto para un diseño web de la escuela de privada. El objetivo era profundizar en la estructura metálica página de inicio sin tener que gastar un montón de tiempo en un borrador representado completamente photoshop.
En primer lugar, reunir el contenido crítico de la página. Yo tampoco hacerlo con las notas adhesivas o escribo un documento. Claro, todavía comenzar con las palabras escritas en una página, pero las palabras son típicamente el lugar inicial para obtener ideas y tener una lista completa de todos los contenidos de navegación, el contenido y el apoyo que necesitan.
En segundo lugar, voy a miniaturas mis ideas de la lista inicial de elementos de la página. Así que voy a esbozar navegación, bloques de contenido, anuncios, columnas, bloques de contenidos relacionados de apoyo, encabezados, pies de página y así sucesivamente. Si se me acaba el papel, me peguen más páginas en la parte inferior de la hoja.
En tercer lugar, voy a elegir a los ganadores y perdedores idea para dibujos finales. Una vez que tengo una serie de ideas útiles, tomo una decisión de diseño e ir con ella. Por lo general obtener gran cantidad de información en esta etapa del cliente y los diseñadores de pares. Dibujar es tan visualmente informal, también, que los clientes tienden a sentirse más relajado en cuanto a recoger ideas ganadoras - mucho antes de una maqueta PSD formal se produjo.
PROCESO TÍPICO DEL PROYECTO
Este es el borrador Photoshop totalmente procesada desde el croquis aprobado. Usted puede ver cómo el dibujo modelo ayudó a la dirección de arte fotográfico.
En la mayoría de los proyectos, se inicia con un simple rectángulo y dibuje una serie de imágenes en miniatura. Este proceso es súper simple, pero me ayuda a generar una sólida colección de opciones para los clientes del proyecto, gerentes y diseñadores compañeros.
Una vez que se habla de las miniaturas y las ideas detrás de los pulgares, produzco algunos bocetos de las miniaturas, preseleccionada. Los roughs son generalmente sólo para ayudar a obtener prioridad junto contenido y el diseño de página. Voy a esbozar las ideas hasta la fotografía y de los activos también, para los botones u otros elementos.
En la fase rugosa; Estoy buscando responder a preguntas como "¿qué está buscando el usuario?" y "¿cómo puedo priorizar el contenido?". Esta fase es también muy colaborativo. Voy a compartir mis dibujos con clientes, directivos, compañeros de proyecto y otros diseñadores. Si es necesario, incluso vamos a obtener el pulso de usuarios de prueba y colocar un bosquejo o dos delante de ellos. Entonces refinar, iterar y evolucionar el boceto de nuevo trabajando a través de este escenario.
Una vez que hay una dirección clara para el boceto, voy a dibujar un croquis formal. Al igual que una estructura metálica tradicional, un croquis tiene un contenido sólido en la página ... las palabras, los iconos y la fotografía. Así que mis ideas dirección de arte de la fotografía se ponen a prueba y explora en este dibujo. También uso el croquis para profundizar en los elementos de interfaz de usuario final y asegurarse de que va a funcionar. Probamos estos, en general, y hasta tienen "Entre" wireframes para trabajar a través de las pantallas muy complejas que un usuario podría encontrarse en el diseño.
Muchas veces, si hay presentaciones formales de los clientes, voy a dibujar con tinta en lugar de grafito. Tinta agrega un poco de formalidad al boceto y si se agrega el color, no tiene que preocuparse por la pérdida de los elementos de interfaz de usuario real en la página para bordes suaves y líneas.
Al final, usted desarrollará su propio proceso. Lo fantástico de bocetos es lo conduce a la completa libertad de diseño. Puede capturar ideas en cualquier momento.
¿Y QUÉ?
Como diseñador, su mejor activo es su mente. Su capacidad de presentar información visual en forma rápida, de improvisación que le distingue de los demás en el flujo de trabajo de desarrollo web. Y esbozando puede liberarse del ratón y el monitor.
Con las habilidades de croquis sólidos, los diseñadores pueden tener "riff" de ideas y convertirlas en genuinos caminos a la innovación. Y los bocetos pueden ser informal y relajado, manteniendo proyectos accesibles.
Así que coge un bolígrafo o un lápiz, un cuaderno de dibujo y convertir su garabatos en algo comercial para su empresa y los clientes.
By STEVEN WHITE