8 consejos para diseñadores de impresión que cambian a diseño web y digital

Más diseñadores están trabajando a través de plataformas en estos días, cambiando entre proyectos impresos y digitales. Aunque gran parte de la teoría es la misma, en la práctica hay muchas diferencias técnicas cuando se trata de trabajar en algo que se imprimirá frente a un sitio web. Se requiere un conjunto específico de conocimientos y habilidades para trabajar con eficacia y eficiencia en ambos entornos.

Pero es posible. Aquí compartimos ocho consejos para los diseñadores de impresión que cambian a proyectos digitales. (Y puedo responder por cada consejo como diseñador que ha hecho el cambio).

El diseño es fluido

Una de las cosas que no cambia en el diseño de impresión es el tamaño. Cada documento está diseñado e impreso en un tamaño determinado. (Y frecuentemente en un solo medio también).

Esto simplemente no es cómo funciona la web. Cada usuario puede mirar un sitio web utilizando un ancho y alto de navegador diferentes, o mirar el sitio en un teléfono móvil o tableta. Así que cada diseño debe tener en cuenta una variedad de tamaños y dispositivos.

Familiarícese con el diseño responsivo, qué es y cómo funciona. El diseño responsivo (a veces llamado RWD) es un enfoque para el diseño de sitios web donde los sitios se crean para ver de manera óptima sin importar el dispositivo: computadora de escritorio, tableta o dispositivo móvil. Los diseñadores crean el diseño utilizando conceptos de cuadrícula fluidos basados ​​en proporciones y tipografía e imágenes flexibles.

Además de los cambios de tamaño, el espacio es "ilimitado". Como diseñador, no está atrapado en las restricciones de una postal de 4 por 6 pulgadas o un póster de 11 por 17. El lienzo continúa tantas páginas como desee y puede desplazarse casi infinitamente.

Aprende un poco de HTML

Si quieres diseñar para la web, tienes que saber lo básico. Y puedes empezar entrenándote. (Consulte este artículo anterior de Design Shack para obtener una lista de los mejores lugares para comenzar).

Comienza con un poco de HTML, el lenguaje de la web. Con solo un poco de comprensión de HTML, puede aprender a cambiar fácilmente los colores, las fuentes y los tamaños en un sitio web. HTML es la base sobre la que se basa todo en la web y sin él, tendrá dificultades en el diseño digital.

Una vez que se sienta cómodo con los conceptos básicos de HTML, ramifique a CSS y código básico. CSS, o hojas de estilo en cascada, le permiten crear y modificar un conjunto de estilos para su sitio web basado en una hoja de estilo. Crea un conjunto de reglas de diseño y puede utilizarse para crear una jerarquía de sitios web y mantener la coherencia visual. Comprender los conceptos básicos de codificación lo ayudará a comprender por qué las cosas funcionan como lo hacen en la web. A pesar de que la codificación se ve como una tontería al principio, tiene sentido una vez que realmente empiezas a verlo.

No tienes que ser un maestro de HTML o CSS o código para crear un gran proyecto digital, pero te ayudará enormemente.

Crear contenido dinámico

El diseño de impresión es innatamente plano. El texto y las imágenes se encuentran sobre algún tipo de papel u otra superficie plana. El diseño digital es dinámico y activo. Recuerda esto y úsalo a tu favor.

Los objetos pueden moverse, incluir sonido o enlaces e incluso herramientas que hacen que los elementos se abran o se cierren cuando el usuario se acerca a ellos. Los proyectos web y digitales deben estar diseñados para la experiencia del usuario. Esto podría ser un gran cambio de algunas de las filosofías a las que está acostumbrado en el mundo de la impresión.

También es importante utilizar señales visuales comunes y acciones de interfaz de usuario para que su sitio web funcione de la manera que los usuarios esperan y saben cómo usar.

El color es diferente

Los diseñadores de impresión trabajan en CMYK. El diseño digital está basado en color RGB o HEX.

Al igual que el color CMYK se explica usando números para representar los valores de color de los tonos básicos para hacer todos los colores posibles, RGB funciona con el mismo concepto. RGB (rojo, verde, azul) se mezclan en diferentes cantidades para crear todos los colores en el espectro digital.

La diferencia está en cómo se crean los colores. CMYK (cian, magenta, amarillo, negro) se crea combinando colores en el proceso de impresión. RGB es una combinación de colores que se muestran en la luz.

Los colores se nombran con valores RGB (de 0 a 255 o cada color) para crear 16 millones de combinaciones diferentes.

Los valores HEX son una extensión del color RGB y cada valor corresponde a un color RGB. Un valor HEX es simplemente la expresión HTML de un color RGB. Los colores se nombran usando # seguido de un número de seis dígitos, donde cada par de números se refiere a rojo, verde y azul. (Los valores HEX también contienen letras para representar números mayores a 99).

Entendiendo la tipografía web

Los diseñadores de impresión pueden estar acostumbrados a la idea de que pueden usar cualquier fuente y tener una cantidad ilimitada de tipos de letra disponibles. (Dependiendo de la licencia, por supuesto.)

La tipografía web puede ser un poco más complicada, aunque está mejorando todo el tiempo. El mayor desafío es entender el tipo y la compatibilidad del navegador. No todos los tipos de letra se reproducirán de la misma manera en diferentes dispositivos.

Luego están los estándares web básicos y los problemas de legibilidad que se obtienen al leer en una pantalla. Nos guste o no, los tipos de letra sans serif son prácticamente el estándar cuando se trata de texto de cuerpo en la web. Y la tipografía a menudo evitada Arial, está en todas partes. ¿Por qué? Porque siempre se rinde como Arial. No hay sorpresas allí.

El resto de las cosas que sabes sobre el tipo siguen siendo las mismas. Practica el buen kerning, guía y seguimiento. Escale el texto proporcionalmente a otro tipo y elementos en el diseño para una apariencia general limpia y ordenada.

Importa el tamaño de la imagen

La web, que una vez fue el hogar de millones de imágenes de baja resolución, está comenzando a evolucionar nuevamente cuando se trata de imágenes gracias a la aparición de pantallas de retina.

Si bien el estándar para la mayoría de las imágenes web es de 72 ppp, sé que esto parece muy pequeño para los diseñadores de impresión, pero las imágenes más pequeñas se cargan más rápido y se ven bien, hay más sitios que comienzan a considerar las imágenes para la visualización de retina. Estas imágenes web de alta resolución a menudo aún se guardan a 72 ppp, pero son mucho más grandes cuando se trata del tamaño general.

En lugar de guardar una imagen a 600 píxeles de ancho, un estándar común gracias a Pinterest e imágenes fijadas, una imagen para la retina puede tener 1.564 píxeles de ancho.

Las imágenes web a menudo se guardan en formatos específicos, JPEG, PNG o GIF, según el tipo de imagen y el uso. Los formatos de impresión comunes, como TIFF, son inaceptables para el uso web.

SEO tiene un impacto en el diseño

Familiarizarse con la optimización de motores de búsqueda. La forma en que funciona su sitio y el texto que aparece en él (y en las etiquetas ocultas) puede tener un impacto dramático en quién encuentra su sitio y en la clasificación de los motores de búsqueda. SEO es una parte importante del proceso de diseño web.

SEO se relaciona con las redes sociales también. Casi todas las marcas con presencia web tienen redes sociales correspondientes. Tenga esto en cuenta durante el proceso de diseño para que todas las partes puedan crearse y diseñarse de manera consistente.

Aprender a dejar ir

El diseño de impresión es muy preciso. Puede medir cada espacio y detalle y siempre se verá como lo diseñó. La web simplemente no funciona de esa manera. Hay algunas cosas que se verán diferentes en diferentes entornos. Tienes que aprender a dejar ir cuando se trata de estas cosas.

Comprende tu medio y sus limitaciones. No sacrifique su concepto de diseño, sino que también aprenda que algunas cosas funcionarán de maneras que pueden ser desconocidas o que se vean de cierta manera. Acéptalo y sigue adelante.

Conclusión

Comencé mi carrera de diseño en los periódicos. Hoy, diseño un poco de todo y divido mi trabajo entre proyectos impresos y web.

Aunque me costó un poco de trabajo conseguirlo? Cuando se trata del mundo del diseño web y digital, es un conjunto de habilidades invaluables y una necesidad para los diseñadores en el mercado actual. No puedo expresar lo importante que es para los diseñadores aprender a trabajar a través de los medios y comprender las complejidades de cada uno.

Ser capaz de trabajar con proyectos impresos y digitales te hará un mejor diseñador. Aprenderás cosas que llevas a través de medios a proyectos. Usted se volverá más comercial y, con suerte, seguirá satisfecho y desafiado a medida que aprende y use nuevas habilidades.

¿Eres un diseñador de impresión que ha comenzado a trabajar en proyectos de diseño digital? Comparte algunos de tus consejos y experiencias con nosotros en los comentarios.

Fuentes de imagen: Webtype y Jeff Eaton.