El diseño móvil me ha hecho dibujar más verticalmente. Y no creo que sea solo yo.
Estoy viendo más y más sitios a través de plataformas que incorporan más componentes verticales en su diseño general. ¿Olvidarse? ¿Por encima del pergamino? hablemos de ir verticalmente
Diseño horizontal vs. vertical
Durante mucho tiempo, el diseño del sitio web se ha centrado alrededor de un rollo bastante distinto? mentalidad. El diseño para tabletas y dispositivos móviles requiere que cambies tu orientación predeterminada y todos los sitios móviles bien diseñados por ahí realmente están agregando una influencia vertical a los proyectos de diseño, tanto en línea como impresos.
Muchos de los mismos principios básicos se aplican tanto si está trabajando horizontal como verticalmente. Tipografía limpia, una paleta de colores fuertes e imágenes, y la organización general son importantes.
Diseñar en un espacio vertical no es un concepto nuevo. Los diseñadores de impresión lo han estado haciendo durante años: piense en los periódicos y las revistas como ejemplos clásicos. Lo que es nuevo es la posibilidad vertical casi ilimitada. En proyectos web verticales, puede extender la profundidad todo lo que quiera (aunque esto no siempre es recomendable).
Crear un espacio vertical
A veces, el primer desafío es crear un espacio vertical que sea apropiado para su proyecto. Ocurrirá casi por defecto cuando se trabaje en cualquier proyecto que incluya una contraparte móvil, pero ¿qué pasa con el sitio web en sí? (Esto, en el entorno del navegador actual, nunca tendrá una forma vertical constante).
Si tiene un blog o un sitio web con una barra lateral, su espacio de trabajo puede ser más vertical de lo que cree. Enfatice esa forma con otras partes verticales, como una imagen fuerte hacia arriba y hacia abajo o un bloque de texto corto que se lee verticalmente.
Otra opción es extender su espacio más allá del desplazamiento. ¿Crear pantallas en cascada? que se navegan de arriba a abajo. Este es un concepto que estuvo mal visto durante algún tiempo pero está ganando terreno nuevamente porque los usuarios han sido "reentrenados". para desplazarse por un sitio web gracias a la abundancia de aplicaciones móviles y tabletas que funcionan de esa manera.
También puede planificar su diseño alrededor de varios espacios verticales creando una cuadrícula de varias columnas anchas. En esta configuración, cada columna tiene un propósito distinto (muy parecido a una barra lateral) que crea un espacio de trabajo vertical. Puede crear un espacio de trabajo vertical de una sola columna al reducir el ancho de píxeles del espacio de trabajo y rellenar el resto con una imagen de fondo.
La clave no es forzarlo. A veces simplemente no podrás hacer que un espacio vertical funcione. Si no puede diseñar utilizando una orientación totalmente vertical, intente utilizar algunos elementos de diseño vertical, como barras de navegación o imágenes, dentro de su diseño general.
Usando elementos verticales
A veces, la planificación de un diseño vertical es algo más que el espacio general. Considere usar elementos verticales en un espacio horizontal para crear una sensación de arriba y abajo. Experimenta con fotos verticales o bloques de texto altos y delgados. Pero de nuevo no lo fuerce; estas herramientas solo son efectivas si funcionan (no en contra) de su contenido.
Cree elementos estáticos, como barras de navegación o logotipos, también verticalmente. Solo recuerda estructurar estos elementos para que sigan siendo utilizables. Las barras de navegación funcionan mejor para un diseño de desplazamiento cuando no son demasiado profundas y se mueven con la página a medida que los usuarios navegan. (No quieres que los usuarios se frustren tratando de encontrar cosas).
También puede usar el color para establecer una sensación más vertical para su sitio. Piense en el fondo: las rayas verticales pueden agregar un? Más alto? Sentirse cuando se coloca detrás de otros objetos.
Diseño vertical en acción
El diseño de impresión se ha basado en un lienzo vertical durante cientos de años. Algunas de las publicaciones más conocidas (The New York Times, USA Today, Vogue y People) tienen formatos más altos que anchos.
Pero no termina ahí. Los carteles de películas son uno de los ejemplos más conocidos de proyectos de diseño orientados verticalmente.
Cada vez más tarjetas de visita, aunque la mayoría de las veces se imprimen horizontalmente, están tomando un formato vertical. ¿Por qué? Porque los hace destacar entre los cientos de otros en la pila. Lo mismo ocurre con otros materiales promocionales impresos, como imanes y pegatinas. Para los proyectos de impresión, la decisión de usar una orientación vertical cuando la mayoría de los demás están trabajando horizontalmente puede agregar algo de estilo y estilo al proyecto.
Consideraciones verticales
"Los diseños verticales pueden ser pesados y difíciles de navegar a toda prisa".Los diseños verticales pueden ser pesados y difíciles de navegar a toda prisa. Asegúrese de dar un gran peso a los encabezados y las herramientas de navegación al diseñar en un espacio vertical para que su usuario (o lector) no pierda de vista lo que está viendo.
Puede considerar aumentar el tamaño del texto (y con caracteres iniciales adicionales) al usar un formato vertical y probablemente desee incluir dispositivos de navegación (ya sean barras de desplazamiento o descripciones) que siguen al usuario a través del sitio web.
También tenga cuidado con el espacio horizontal en el diseño vertical. Resista la tentación de forzar un estilo horizontal en un espacio diferente; es probable que se quede corto. No desea juntar otros elementos solo para hacerlos encajar en un espacio más estrecho. Busque formas de reorganizar o apilar elementos para que el espacio de trabajo no se sienta abarrotado.
Amor vertical
Aquí hay algunos de los sitios que están tomando el concepto vertical y funcionando.
Activar
El sitio está construido verticalmente y le ayudan a navegar utilizando el desplazamiento para "abrir" La botella y el resto del sitio. (Esto nunca pasa de moda.)
Casas enviro
Esta barra de navegación en la parte superior de este sitio vertical se ajusta para que siempre tengas la imagen perfecta en la pantalla de tu computadora.
Lotta Nieminen
Este sitio utiliza columnas verticales para establecer la forma.La mezcla de rectángulos le anima a moverse a través de la página.
100% pura Nueva Zelanda
Desplazarse hacia abajo en esta página crea un efecto de video que le permite ver más de Nueva Zelanda.
Conclusión
Me encanta el resurgimiento y el énfasis que los conceptos móviles tienen en los proyectos orientados verticalmente. Los cambios en los entornos de los usuarios y la aparición de un diseño sensible también influyen en esta tendencia.
En general, el diseño vertical no es realmente diferente de su contraparte horizontal. Puede que sea un poco desconocido al principio, pero al usar las mismas herramientas y conceptos que se relacionan con un buen diseño en un esquema horizontal puede crear grandes proyectos verticales. Si está preocupado por el resultado, comience con poco y desarrolle algunas partes verticales para incorporar en un proyecto antes de volverse completamente vertical. ¡Puede que descubras cuánto disfrutas con la nueva vista!
Fuentes de imagen: Illyissimo, Food SenseSimon Collison y Spigot Design.