Hay una gran cantidad de diseños de estilo de bloques y tarjetas que hay ahora. Para los diseñadores, son modernos y funcionales. La apariencia es simplificada y simple, y en términos de diseño de sitios web, funciona muy bien en marcos de respuesta.
La raíz de esta tendencia de diseño es el diseño modular. Y sin importar lo que pienses, no es nuevo. El diseño modular está profundamente arraigado en la teoría del diseño y ha sido utilizado por varios diseñadores durante mucho tiempo. ¡Hoy estamos ahondando en el fondo, y las aplicaciones prácticas, del diseño modular!
¿Qué es el diseño modular?
El diseño modular es una técnica en la que todo se construye mediante un patrón de cuadrícula de bloques. Cada uno de los elementos del diseño encaja en los módulos en patrones rectangulares.
El diseño modular ha existido durante mucho tiempo. Fue popularizado en varias etapas por los diseñadores de periódicos, ya que crearon módulos para los componentes de cada historia en la edición del periódico de ese día. Pero los módulos también son populares para otros estilos de diseño, porque el uso de una cuadrícula distinta es una buena manera de organizar y administrar el contenido.
La cuadrícula modular es especialmente útil para proyectos en los que hay una gran cantidad de contenido o una gran cantidad de fragmentos de contenido que pueden no estar relacionados en la cara pero aparecer en un diseño en conjunto (esta es la razón por la que el estilo era tan popular para los periódicos con muchas partes no relacionadas). sobre un gran lienzo).
En el panorama de diseño de sitios web, el diseño modular es una opción popular debido a la naturaleza flexible de la red modular. Los conceptos modulares pueden ser fáciles de trabajar cuando se diseñan para marcos con capacidad de respuesta y el formato de estilo de cuadrícula funciona especialmente bien con algunas otras tendencias como las tarjetas y el minimalismo.
El diseño modular toma cierta consideración al final de los proyectos, pero en realidad es solo un sistema de diseño basado en cuadrícula que funciona como cualquier otra cuadrícula. Funciona para cualquier tipo de proyecto o estilo. Y te ayudará a diseñar con organización y armonía.
Raíces en otros campos
El diseño modular no es un concepto que sea solo para diseñadores gráficos. Todo, desde la arquitectura hasta el diseño de interiores, la forma en que se construyen las computadoras o incluso los automóviles, puede ser de naturaleza modular. (Y cualquiera de estos lugares puede ser un buen lugar para buscar inspiración de diseño gráfico modular).
En otros campos, la definición de diseño modular es un poco más amplia, pero aún puede aplicarse en la teoría del diseño gráfico. El diseño modular incluye elementos que encajan visualmente como bloques, como cubículos en una oficina o una pared de ladrillos en el exterior de un edificio. Los elementos de diseño modular también están diseñados para ser intercambiables, como piezas que puede usar en una computadora u otra o un tipo específico de batería de automóvil que funciona en varios automóviles. En la práctica física, el diseño modular a menudo hace que las personas piensen en un diseño de estilo Lego-block donde las piezas se pueden unir o separar entre sí.
Modular en diseño de impresión
El diseño modular para proyectos de impresión comienza con la cuadrícula. La cuadrícula y los módulos incluidos en la cuadrícula determinan cada elección de diseño que realice. La cuadrícula lo ayuda a determinar dónde colocar los elementos, el espaciado y cómo alinear el texto.
Afortunadamente, el uso de esta cuadrícula no es tan restrictivo como podría imaginar. Debido a que puede dibujar dentro de las líneas de la cuadrícula en cualquier número de patrones o combinaciones, las posibilidades reales son prácticamente ilimitadas.
Este tipo de cuadrícula se puede configurar en casi cualquier tipo de software de diseño gráfico que desee utilizar y consiste en cuadrículas horizontales y verticales y canales (guías de espaciado). Una vez que la cuadrícula se coloca en el lienzo, debería verse como una serie de bloques. - aunque no tienen que ser cuadrados - y bloques delgados (que son el canal, o espacio abierto, guías).
El funcionamiento es simple. Cada bit de contenido vive dentro de los bloques y debe haber un ancho de espacio de canal entre los elementos. Puede mezclar y combinar bloques de diferentes formas y tamaños, pero todo permanece en un patrón de diseño armonioso con flujo horizontal y vertical.
A continuación, le ofrecemos un vistazo a algunas de las combinaciones de foto-imagen para darle una idea de cómo funcionan juntos los bloques de la cuadrícula:
Modular en diseño web
Lo primero que encontrará al hablar de diseño modular para sitios web es la resistencia a que es aburrido. Puedes superar eso ahora mismo. Cualquier diseño puede ser aburrido o interesante, pero una cuadrícula por sí sola no determinará eso.
Modular es una opción popular de diseño de sitios web en este momento porque se alinea con algunos otros elementos bastante modernos. Los diseñadores volvieron a la conversación con un diseño plano y apilaron muchos bloques de colores como un patrón de diseño. Windows usó una interfaz modular para el "Metro". Diseño de Windows.
Pero también es una gran herramienta para crear muchos otros tipos de sitios web. Al igual que con el diseño modular de impresión, el concepto se basa en una cuadrícula vertical y horizontal en el lienzo. Donde es diferente es en el desplazamiento y para los puntos de interrupción para diferentes resoluciones de pantalla. (Puedes trabajar tu magia CSS aquí y nos centraremos únicamente en el aspecto visual).
Cuando se trata de diseño modular para sitios web, lo que pensamos primero es un estilo casi WYSIWYG para el diseño, similar a lo que a menudo se encuentra con los temas de sitios web premium. Los bloques prefabricados vienen que ya encajan, como la idea de construir autos y computadoras, por lo que cada bloque encaja en un marco general y ni siquiera tiene que pensar en la modularidad del diseño.
Esa es la ruta fácil a modular.
También está la opción de hacerlo usted mismo. Las cuadrículas de sitios web modulares tienden a tener bloques más grandes que las cuadrículas de impresión y dividen la pantalla en partes digeribles. La forma más fácil de pensarlo es en un formato de dos columnas que divide la pantalla en la mitad verticalmente (con un canalón).Las divisiones horizontales son a menudo la profundidad de un desplazamiento, que es una opción especialmente popular cuando se trabaja con animaciones de desplazamiento de paralaje.
Una de las mejores definiciones simples (y visuales) de cómo funciona el diseño modular para sitios web proviene de Christopher Butler de Newfangled:
10 recursos de diseño modular
Ahora que está listo para comenzar su primer proyecto de diseño modular, aquí hay algunos recursos más para ayudarlo en el camino.
- Patrón de cuadrícula modular: cuadrículas modulares que puede personalizar y descargar.
- Diseño modular frente a no modular: la conversación continúa por maria garcia
- Architizer All Mod Everything: ejemplos de inspiración
- ¿Haciendo sistemas de diseño modular? por Jason Santa Maria
- Libro sobre cuadrículas y diseños: "Aspectos esenciales de diseño: 100 Principios de diseño para el uso de cuadrículas"
- Grillas y tipografía experimental (PDF descargable)
- Rejilla modular compleja por Karl Gerstner: si realmente quieres que te vean las maneras de pensar y desarrollar una rejilla modular
- Griddle: CSS para un sistema de cuadrícula fluido y modular para navegadores modernos
- Cómo crear una grilla modular en Adobe Illustrator
- Temas modulares de ThemeForest
Conclusión
No dejes que las grandes ideas detrás de un esquema de diseño modular te asusten. Comenzar con el diseño modular es como usar cualquier otra cuadrícula o marco. Haz un boceto, desarrolla un plan y comienza a diseñar.
Los beneficios del diseño modular son el espacio y la organización claros, una cuadrícula que funciona en casi cualquier estilo y facilidad de uso para proyectos digitales. Se está convirtiendo en una opción más popular todo el tiempo por una razón. Funciona. Ahora salga y pruebe su suerte en un proyecto con un estilo modular.
Fuentes de imagen: Louise Cohen y Nils Mengedoht.