Share
Pasamos buena parte de nuestro tiempo frente a un monitor, lo más probable es que tengamos más de una computadora, sin mencionar iphones, tabletas gráficas y todos los otros demonios ultra modernos que invaden nuestros escritorios. Todos somos parte de la generación que necesita un mouse para hojear un álbum con las fotos de la familia (adiós a los queridos álbumes de la familia con las páginas de amarillo) y Facebook para enviar los deseos de cumpleaños a un amigo.. 20 ejemplos de grandes sitios inspirados en "bocetos" incluidos!
Sin embargo, en medio de esta era digital, los mejores aliados de un diseñador web son herramientas comunes que pueden comprarse con el cambio debajo de los cojines de su sofá. Estoy hablando de hacer que la pluma, el lápiz y el papel formen parte del proceso creativo que otros diseñadores "no digitales" han estado utilizando durante mucho tiempo:.
Con este artículo trataremos un argumento que seguramente muchos de ustedes tendrán en el corazón: veremos de hecho cómo el boceto puede ayudarnos a organizar las ideas, diseñar un diseño efectivo y, por qué no, dar un toque nuevo y original a nuestro diseño.
Imagina este escenario: Acabamos de terminar una reunión informativa exhaustiva con nuestro cliente y ahora es el momento de reorganizar las ideas. Conocemos las preferencias y necesidades de nuestro cliente; Sobre esta base, deberíamos poder establecer el diseño que tenemos que diseñar. ¡El problema es la cantidad de información que tenemos que considerar! Definimos que en la página de inicio tenemos que colocar un control deslizante y una llamada a la acción visible que invita a un contacto, las páginas del sitio serán siete y también debemos incluir las últimas noticias en la página de inicio, etc..
En este punto, le aseguro que abrir Photoshop con la pretensión de crear un diseño efectivo es inútil; sin un plan para lo que tiene que dibujar en los detalles, será bloqueado y forzado a diseñar esencialmente sin la suficiente previsión para tomar decisiones inteligentes. Esto a menudo significa más trabajo más adelante, solucionando lo que se podría haber hecho correctamente la primera vez con solo un poco de trabajo de esbozo.
¿El boceto ofrece algo único para los diseñadores web? nos ayuda a organizar grandes cantidades de información en partes manejables que podemos diseñar alrededor.
En cambio, si tiene la fortuna de poder metabolizar conceptos e ideas en un diseño, lo más probable es que olvide algo importante, con el resultado de tener que poner sus manos en el diseño nuevamente por segunda vez. Y, probablemente también sepa que hay diseños que, incluso con un pequeño cambio, se alteran por completo y pierden su efectividad comunicativa y estética. un resultado realmente frustrante por cierto.
¿Algunos consejos sobre cómo proceder sin perder la cabeza? Consigue bolígrafo y papel?
Esta primera fase de bosquejo se refiere a la elaboración de la información de forma esquemática y sencilla. ¿Probablemente estás pensando que todo este rigor y disciplina no tiene nada que ver con la creatividad y la imaginación y quieres un cambio de escenario? Está bien, vamos a pasar al siguiente paso.
Dijimos que el boceto es un proceso creativo, pero querer significa esto en la práctica?
Podemos considerar el boceto como una "tierra media"? Entre la información en nuestra propiedad y el diseño terminaremos planeando. En este territorio, hostil y mágico, encontramos colores, fuentes, cuadros, ideas, inspiración, texturas, imágenes, sensaciones, dudas. y mucho más. Inútil decir que en medio de todo esto es fácil confundirse y encontrar la idea correcta, la idea que funciona y que nos enorgullece de ser diseñadores..
Creo que no hay nada más irritante que encontrarse frente a una hoja en blanco, esperando la inspiración que se supone que proviene de quién sabe dónde, y terminando con la creación de diseños feos (entonces, si usted es realmente afortunado como yo, lo hará). Estaré en contacto con un colega que se aproveche al máximo de la situación para decirle que su trabajo apesta sin molestarse en endulzar la píldora para que no dañe su sensibilidad como creativo..
¿Uno de mis propios cuadernos de dibujo? Revisaremos esto más tarde. Personalmente pasé algunos momentos difíciles con algunos clientes: la inspiración no quería venir y mis propuestas gráficas me hicieron avergonzarme de mí mismo. Pasé horas mirando los sitios de las galerías, sintiéndome aún más deprimido porque parecía que todos podían crear hermosos diseños, la única persona que no era capaz de poner dos rectángulos de una manera agradable era yo. En mi caso, la facilidad de la presión se hizo más fácil con la ayuda de un lápiz..
Déle el comienzo a su proceso creativo en papel, de hecho libere su imaginación, permitiéndole trabajar de una manera más espontánea y estimulante..
Especialmente si el proyecto en el que está trabajando es enorme y está lleno de detalles técnicos, teniendo en cuenta todo esto, la primera fase sin duda puede ser castradora para el flujo creativo, sin mencionar el miedo debilitante: ¿fracasar? Eso afecta a muchos diseñadores: atrapados en el deseo de hacerlo rápido y bien, a menudo nos quedamos paralizados frente al monitor, incapaces de reorganizar las ideas y canalizarlas en la dirección correcta.
Por lo tanto, antes de comenzar a trabajar en cualquier tipo de programa gráfico, obtenga lápiz y papel y? ¡bosquejo! Garabatee, anote un par de ideas, comience a rastrear un tipo de diseño abstracto para familiarizarse y, después de liberar su intuición, libere su intuición. Después analizarás las ideas, ahora déjate llevar y evita la lógica y la racionalidad, no te ayudarán en esta fase..
Describa el diseño, escriba un par de notas, bórrelo todo, comience de nuevo: durante este proceso, su mente funciona de manera rápida y frenética, por lo que tome nota de todo antes de que esta fase intuitiva disminuya. Descubrirás que dar total libertad a tus ideas es agradable y relajante, además de útil..
La primera idea rara vez será la correcta, prepárese para aceptarlo. Dibujar le ayuda a desbloquearse y aprovechar diferentes oportunidades gráficas que podrían ser adecuadas para usted de forma inmediata y ligera, pero esto no significa que no cometa errores en esta fase. Lo positivo es que incluso si comete errores en esta fase, siempre puede rasgar la hoja, afilar el lápiz y comenzar de nuevo en una hoja nueva. Desechar un diseño creado con Photoshop, solo porque se dio cuenta de que no es la mejor solución para su caso, es sin duda desmotivar..
En tal asunto, le aconsejo que no confunda los bocetos con la creación de WireFrame: estamos hablando de dos cosas diferentes, incluso si veo que hay cierta confusión sobre el argumento. Hace unos días, un diseñador web me dijo, citando sus palabras exactas: ah, ¿usas lápiz y papel? Hago todo en linea? , mencionando un sitio que permite crear maquetas con una precisión matemática, con un control completo sobre los colores y la tipografía..
Bueno, esto no es bosquejar, esto es completamente otra cosa. Al hacer clic con el mouse en algunos botones para que aparezcan algunos rectángulos, no le permite dar forma a sus ideas y liberar su flujo creativo, trate de creer. Con esta afirmación no dudo de la utilidad de un buen alámbrico, solo quiero subrayar las diferencias entre estos dos enfoques..
¡Guarda tus ansias de precisión, regla y compás! En esta fase no hay espacio para el orden y el rigor, así que no limite el flujo creativo, bloqueándose en los márgenes y espacios en blanco, puede pensar en ellos más adelante. De la misma manera, no se preocupe si no tiene un talento artístico particular y sus habilidades manuales apenas le permiten sostener un lápiz: el boceto se utiliza para reordenar las ideas, no para formar artistas dotados.
A este respecto, debemos agregar que incluso si el boceto nació como un medio libre de expresión de imaginación y creatividad, aparte de sus habilidades gráficas, esto no significa que el boceto no tenga también, de cierta manera, un valor artístico. Veamos juntos de qué estoy hablando..
La tendencia de muchos diseñadores web a dibujar ha dado el inicio a un estilo gráfico real que recuerda de alguna manera los aspectos estéticos del boceto: tenemos pinceles que imitan su espontaneidad y ligereza, sin mencionar cientos de fuentes en un estilo escrito a mano fácilmente. Se encuentra en la web. Gracias a estos recursos, crear hoy en día un diseño en estilo de boceto es bastante fácil, pero además de esto, los diseños que usan este estilo gráfico suelen tener un toque de originalidad que los hace atractivos y fuera de lo común..
El estilo de boceto, solo porque está asociado a una actividad común a muchas creatividades, a menudo se usa en sitios de profesionales independientes o de agencias de comunicación / diseño que desean transmitir este concepto de forma gráfica. De todos modos, incluso la combinación de algunos elementos de boceto en un gráfico más tradicional puede dar una perspectiva nueva a los diseños normales..
Veamos cómo algunos sitios han usado este estilo de una manera efectiva y original y cómo esto ha influido en la estética y la efectividad de sus diseños..
http://www.kunalchhajer.com/ El sitio del diseñador web Kunal Chhajer refleja exactamente el concepto del estilo de boceto. El gráfico es ligero y agradable, se enriquece de forma original con algunos diseños que hacen que el diseño sea único. El estilo también se recuerda en el uso de una fuente escrita a mano en el menú de navegación. Todos estos detalles le dan al diseño la creatividad que un diseñador desea expresar en su sitio personal..
http://www.creativewithak.com/ En el sitio Creative with a K hay un uso masivo de bocetos y garabatos, simplemente para mostrar claramente la "naturaleza creativa". del sitio. En este caso, incluso la peculiaridad del diseño, tan atípico, hace que el sitio sea especial e inusual, incluso si es difícil de consultar..
http://www.lega-lega.com/ El sitio Lega-Lega es una tienda en línea de camisetas con estampados un poco fuera de lo común y está dirigida definitivamente a un mercado joven. La adición de algunos detalles de boceto le da un corte creativo y alegre al sitio..
http://beavory.com/ Beavory es el sitio / blog de Karen Mack, ilustradora israelí. El estilo de su sitio se basa deliberadamente en un estilo que recuerda su naturaleza creativa de manera pronunciada y original. Cada detalle, desde la estructura del diseño basada en líneas irregulares, como si estuvieran dibujadas con un rotulador, hasta los iconos de la red social traza un estilo de boceto efectivo..
http://bowtieperiod.com/ Bowtie es un estudio digital que decidió representarse realmente de manera creativa en la web. Las animaciones del sitio, junto con dibujos lindos y poco comunes, hacen que el diseño sea atractivo y muy extravagante. Se llaman a sí mismos? Creativos? Y, para probarlo, utilizan elementos en el estilo de croquis..
http://www.makomako.cz/home/ El diseño de la banda MakoMako está completamente creado en estilo de boceto, de modo que la misma estructura de la página se basa en una hoja de papel con líneas irregulares, y en la página de inicio, como parte del diseño, encontramos además los detalles gráficos habituales basados en En bocetos y fuentes escritas a mano, un lápiz. Un look curioso y muy inusual para una banda..
http://stanthesnowman.com/ Ahora que es casi verano, gran parte de su encanto se desvanece, pero la efectividad gráfica del sitio Stan, el hombre de nieve, está fuera de discusión. En este caso, la adición de imágenes estilizadas y de una fuente caligráfica da un estilo espontáneo al diseño, lúdico e informal. Y traza el concepto de actividad, basado en la escritura de tarjetas de felicitación..
http://www.greenawaypro.co.uk/ El sitio del festival Greenaway Pro 2011 combina de forma particular y atractiva el estilo de boceto y el estilo grunge, dando a su diseño una impresión realmente original. También en este caso, la elección de este estilo gráfico particular tiende a expresar un aspecto informal, espontáneo y excéntrico. Perfecto para un festival que trata de música y surf, ¿verdad??
http://www.julianlaval.com/ Julian es otro diseñador web independiente que, al querer resaltar sus habilidades gráficas, explotó el poder comunicativo del boceto de una manera realmente creativa. Por supuesto, no es solo esto lo que hace que su sitio sea especial, sino también la naturaleza curiosa y deliberadamente inusual de sus dibujos. Al igual que muchos otros sitios en este estilo, los colores se limitan a una escala de grises, para hacer las ilustraciones más realistas..
https://www.littlecreatures.com.au/ El sitio Little Creatures está completamente diseñado en estilo de boceto y gracias a la peculiaridad de sus bocetos, tan poco restaurado, la página es tan atractiva..
http://carnetordinaire.com/ Carnet Ordinaire es un sitio que es como un diario, con notas de viaje, anotaciones y consideraciones personales. Teniendo en cuenta la naturaleza excéntrica e íntima del sitio, el estilo de boceto es el más apropiado: el diseño se basa en la imagen de una moleskine abierta, mejorada con bocetos y dibujos estilizados. Incluso el fondo se hace más original con algunas caricaturas insertadas en la opacidad y por la presencia de un lápiz, se deja casualmente cerca de la moleskine.
http://www.wingcheng.com/ El portafolio de Wing Cheng es un ejemplo perfecto de la nueva perspectiva que el estilo de boceto puede dar a un diseño. La estructura de la página se basa en una moleskine entreabierta, desde la cual caen las páginas. El efecto se hace más dramático gracias a las sombras que enmarcan el diseño y el uso de fuentes caligráficas para cada contenido del diseño, desde los títulos de los proyectos hasta su descripción. Pero la verdadera peculiaridad de este sitio se refiere a la exposición de los proyectos, también esbozada en lápiz de una manera realmente creativa..
http://www.kutztown.edu/acad/commdes/faculty/ La universidad de Kutztown de comunicaciones y diseño no pudo encontrar una mejor manera de dirigirse de manera efectiva a los creativos o aspirantes. El diseño es ciertamente inusual para una realidad académica: el fondo en el estilo de color de agua, la página basada en una página de un libro, las ilustraciones en colores de agua, las fuentes particulares del menú de navegación? Todos los detalles originales y ciertamente expresivos..
http://www.dannwhittakercreative.com/ Dann Whittaker en su sitio muestra un estilo gráfico común a muchos diseñadores web. Un look casual y espontáneo, basado en un diseño de libro de páginas y en un uso consistente de los detalles en el estilo de boceto. En el complejo, la distribución es muy efectiva y agradable estéticamente..
http://www.chernobylheart.org.uk/ En el caso del sitio de Chernobyl Heart, el estilo de boceto se usa para resaltar gráficamente el concepto de la infancia: aquí estamos hablando de niños y lo vemos a través de pequeños bocetos estilizados que copian su forma de dibujar. Eficaz y agradable.
http://demainjarrete.stpo.fr El estilo de boceto es perfecto para presentar en los cómics e ilustraciones web, por lo que el diseño representa visual y creativamente la naturaleza del sitio. En el caso Demain J'arrete, todo el sitio tiene un? Carbón? Estilo gráfico, desde el degradado del fondo hasta las líneas irregulares que contienen el diseño y el menú de navegación..
http://www.natureshop.co.nz/ Agregar un par de detalles de boceto de manera aparentemente casual, puede dar ese toque creativo especial a un sitio mínimo y esencial. El resultado, visible por ejemplo en el sitio Nature Shop, es extremadamente agradable..
http://www.readytomarket.net/ El diseño de Ready to Market es un ejemplo de cómo combinar un estilo moderno con algunos detalles cómicos y estilizados puede dar un resultado nuevo y estimulante..
http://www.coucoushop.ch/ La tienda Cou Cou es muy agradable y agradable de ver. Uno de los elementos más particulares del diseño es, sin lugar a dudas, el pie de página, que muestra un paisaje estilizado de Suiza. Incluso el boceto de la bolsa desde diferentes ángulos es un detalle muy original..
http://upsidedowntown.me/ Colorido, inusual y caprichoso: el sitio del centro de aprendizaje Upside-Down Town invierte mucho en la originalidad del estilo de boceto. Cada elemento del diseño, especialmente en el encabezado, apunta a la efectividad visual de los dibujos, bocetos y colores que resaltan de forma gráfica y agradable el mundo infantil..
Vimos cómo el proceso de boceto puede ayudarnos a procesar ideas de forma creativa y, al mismo tiempo, cómo algunos bocetos pueden dar una perspectiva diferente y original a nuestros diseños. Convierta el boceto en un hábito cuando comience a trabajar en un nuevo proyecto de diseño, y no solo, puede ser extremadamente útil también en otros campos, como en la redacción de textos, y con el tiempo desarrollará una mente flexible que le resultará útil. trabajo. Por lo tanto, para concluir: apague la computadora y obtenga papel y lápiz!
Termino de compartir con ustedes dos bocetos personales: un esbozo de mi portafolio actual y las primeras ideas que presento para este artículo, durante un viaje en tren realmente aburrido..
Ahora te toca a ti, quiero ver tus bocetos!
Accentsconagua