Tendencia de diseño Cómo usar rayas a tu ventaja

Las rayas son una adición divertida que puede agregar interés visual y profundidad al diseño de proyectos en una variedad de formas. Pero las rayas son algo más que los patrones náuticos azules y blancos que podrías estar imaginando.

Las rayas pueden tomar varias formas. Vertical, horizontal y de patrones clásicos a líneas basadas en cuadrícula para fondos y componentes de imagen, las rayas son una excelente opción de diseño. Aquí hay algunas formas de usarlas que quizás no hayas pensado.

Rayas tradicionales

Cuando piensas por primera vez en diseño de rayas, es posible que se te ocurra algo de la idea tradicional. Rayas náuticas azules o rojas y blancas. Las barras rojas y blancas de la bandera americana. Los calcetines divertidos usados ​​por Raggedy Ann o Pippi Longstockings. Pero las rayas son mucho más versátiles que los patrones tradicionales. Se pueden utilizar de varias maneras.

Pero vamos a echar un vistazo a un uso tradicional: el sitio anterior utiliza un palo de rayas estilo barbería como un pequeño acento dentro del diseño del sitio. Este aspecto tradicional es una excelente manera de enfocar la atención en una cierta parte del diseño y crear énfasis.

Diseño clásico

Las rayas pueden ayudar a establecer el tono con una apariencia clásica. Agregue un poco de textura o cree rayas en un diseño basado en cuadrícula para enfatizar ese concepto.

Cuando se trata de visiones clásicas de rayas en diseño, el color también es un factor importante. Considere algunos de los usos clásicos de las rayas y el color, como los uniformes en blanco y negro para los prisioneros. (Use esta combinación para una apariencia minimalista o más rígida). Rayas rojas o azules para una sensación tradicional o de la vieja escuela.

Las texturas también pueden crear énfasis en las rayas al traerlas más al primer plano. Mientras que las rayas se usan a menudo en fondos, a menudo con poco contraste en colores pálidos, para "textura invisible". Rayas más grandes con textura pueden ser un punto focal. El truco es mantener las texturas simples y alineadas con otras imágenes en el diseño.

Las texturas de rayas también pueden ayudarte a crear? Más ligero? líneas para que no se vean pesadas y pesen el diseño, incluso cuando se usan con un color brillante o audaz. Orchard Keepers, arriba, usa la textura de esta manera para crear un sentido del tiempo con una "sensación antigua".

Rayas modernas

En el diseño de sitios web, las franjas se usan para ayudar a crear enfoque, conducir la navegación y ayudar a los usuarios a encontrar y concentrarse en las llamadas a la acción. El par de sitios de arriba usa rayas de diferentes maneras para ayudar a la usabilidad.

Industry West utiliza una franja horizontal gruesa para contener la navegación. Debido al contraste de la tira con las imágenes de fondo, sirve como un punto focal de referencia estático. La barra ancha de alto contraste facilita la lectura de los botones de navegación y el desplazamiento por el sitio.

La reconstrucción conjunta utiliza una raya delgada en la parte superior del diseño para crear un flujo de color en toda la página. La franja (o línea) naranja ayuda a atraer el ojo de arriba a abajo de la página, con el usuario haciendo una pausa en los botones de acento naranja. El diseño inteligente ayuda a los usuarios a saber qué hacer a continuación (haga clic en los botones naranjas).

Rayas de fondo

Las rayas de fondo pueden ser más que una serie de líneas horizontales o verticales espaciadas en un patrón. Las rayas se pueden crear utilizando una serie de otras formas o incluso con un aspecto más casual o natural.

Pastaria utiliza una divertida serie de formas redondas para crear un patrón de rayas en el fondo de la página. Dependiendo de su perspectiva, el patrón puede aparecer vertical u horizontal. El truco para que esto funcione tan bien es que el patrón crea interés y profundidad sin ser el elemento visual dominante.

De manera muy opuesta, Night Owl Interactive utiliza un patrón de rayas natural (grano de madera) para textura y profundidad. Lo bueno de este estilo de franja natural es que tiene un aspecto aleatorio.

Rayas en imagenes

Si bien los patrones de rayas son a menudo algo que creas, también pueden ser parte de las imágenes que seleccionas para la página. Ya sea que planee incluir rayas en una imagen como parte del diseño o que ocurran por casualidad, pueden agregar interés y profundidad al instante.

Los dos ejemplos anteriores incluyen texturas de grano de madera para establecer patrones y rayas dentro de las imágenes principales. No es cuán diferentes son las líneas, dónde le ayudan a mirar y la profundidad adicional que proporcionan para el diseño general.

Color y patrón

Uno de los usos más modernos es el emparejamiento de rayas anchas y / o de colores finos para un patrón de bloqueo de color. Como una técnica de diseño para digital, impresión e incluso moda y diseño de interiores, el bloqueo de color agrega énfasis instantáneo de manera contenida.

Las franjas de colores pueden ser una excelente herramienta para agregar colores de marca a un diseño que tenga una imagen pesada o minimalista. El color crea contraste y énfasis en lugares donde puede faltar y el efecto general tiene una sensación moderna. (Esta es una excelente opción si quieres probar un concepto moderno que no sea demasiado difícil y tenga un aspecto más atemporal).

'Mini' Rayas

Si bien muchas de las rayas en los ejemplos anteriores son grandes y fáciles de detectar, las tiras también pueden ser pequeñas divots o acentos de diseño.

Uno de los ejemplos más pequeños de rayas es el icono de la hamburguesa. Tres pequeñas líneas apiladas. Eso es. Pero es un ejemplo de usar rayas en el nivel más pequeño.

El diseño del sitio web del Día de los Muertos usa rayas como detalle de acento de una manera que también tiene mucho interés visual. Casi cayendo en el fondo, un par de rayas intrincadas rodean el texto y ayudan a llamar la atención. Las líneas subsiguientes y el trazado de líneas con color ayudan a crear un flujo a través del desplazamiento en la página de inicio.

Conclusión

Un último pensamiento para ti. Si bien a menudo la idea de rayas evoca una imagen mental de filas o columnas si las líneas, las líneas también se pueden usar en forma singular. Muchos de los ejemplos anteriores incluyen franjas de maneras que no son la primera imagen mental que puede tener, pero cada una es interesante y ayuda a crear una imagen visual sólida.

Considere usar rayas de maneras que sean un poco diferentes para el mayor impacto. Juega con color y textura y forma y tamaño. ¡Experimente con rayas como lo haría antes de probar cualquier otra herramienta de diseño y diviértase!

Fuente de la imagen: Bill Lapp.