Hoy cuento en el blog con Manuel Carlos, especialista en diseño gráfico digital, de la emrpesa Color Printer. A través de este post, nos va a dar una serie de importantes claves sobre diseño gráfico digital.
Os dejo con el:
El diseño gráfico es uno de los mejores recursos como instrumento de marketing, tanto en formatos físicos como en medios digitales. Centrándonos en el diseño gráfico digital, en este post vas a tener una guía básica con la que conseguir mejores resultados que el 90% de los que se autodenominan diseñadores gráficos.
He decidido escribir este post en horizonweb.es en vez de en nuestro propio sitio web, debido a que a nuestra tienda online suelen llegar clientes que quieren contratar el servicio de diseño gráfico y aquí llegan otros diseñadores web que pueden aprovechar mejor esta información.
En este post veremos cómo realizar un diseño digital de calidad para sitios webs y tiendas online.
ACCEDE A TODOS MIS CURSOS ONLINE POR SOLO 10€/MES
ÍNDICE CÓMO HACER UN DISEÑO GRÁFICO DIGITAL PROFESIONAL
1.- Las herramientas del diseñador gráfico
Lo que necesitas y lo que no necesitas para hacer un buen diseño. Aunque no sea nadie para decirte lo que debes o no hacer, en este apartado de la guía te expondré mi punto de vista acerca de las herramientas que deberías usar en tu trabajo.
Hoy en día tenemos cientos de herramientas al alcance de nuestras manos para prácticamente cualquier trabajo que queramos desarrollar y en diseño tenemos unas pocas que te vendrá muy bien conocer.
1.1.- Software libre vs software de pago.
Según el proyecto que tengas en mente, te expondré 3 herramientas (dos versiones de cada una, gratuita y de pago) con las que podrás hacer prácticamente cualquier cosa que necesites. Llevo muchos años trabajando como diseñador y coordinando un equipo de diseñadores y con solo uno o dos de estos programas podemos hacer el 99% de los trabajos que nos solicitan.
Gimp (versión libre) y Photoshop (de pago) son, respectivamente, la versión libre y la de pago de programas de edición fotográfica. Éstos los vas a necesitar si tienes que «pintar» o cambiar el aspecto de las imágenes. Estos programas son muy útiles para corregir fotografías, hacerlas más dinámicas, crear efectos visuales… tareas que los otros programas no permiten o están muy limitados. Para el diseño para medios digitales viene perfecto, ya que usualmente serán archivos de pequeño tamaño y podemos dar rienda suelta a nuestra imaginación.
Inkscape (versión libre) e Illustrator (versión de pago) los necesitarás para diseñar en formato vectorial. Es la única forma de crear un archivo que sea fácil de escalar sin perder calidad. Con estos programas podemos diseñar de forma escalable y además con unos tamaños de archivo realmente bajos. Esto es perfecto para el diseño de impresión en grandes y medianos formatos.
Ejemplo del resultado de ampliar un diseño vectorial y otro con píxeles
Scribus e InDesign, el libre y el de pago. Estos programas son para editar archivos multipágina como revistas, catálogos, libros… Con este tipo de software se puede editar prácticamente los mismos trabajos que en Inkscape o Illustrator, pero ofrece mayor facilidad para archivos con multitud de páginas. Es uno de los programas más utilizados por imprentas.
Además, hay otros programas para la maquetación en 3D, para diseñar planos, edición de vídeo… Entre estos, los más útiles para los medios digitales suelen ser los de animaciones y edición de vídeo.
Por supuesto, con unos programas puedes realizar las funciones de otros y hay más cosas que se pueden realizar con todos ellos. Pero esta es una forma muy simplificada de diferenciar cada uno de ellos.
La elección del programa que utilizarás queda a tu elección. Depende del conocimiento que tengas de cada una de ellas y del desembolso que quieras hacer por tenerlas. Si no puedes costearte las versiones de pago, no tienes excusas para no trabajar con software libre, pueden hacer prácticamente lo mismo.
Somos un equipo mediano de diseñadores, cada uno con un equipo. Te puedo garantizar que lo que ahorramos anualmente al usar software libre en todos ellos es una cantidad muy interesante.
Si estás pensando que es «más fácil» diseñar en Photoshop que, en Gimp, sigue leyendo el siguiente punto que te va a gustar.
1.2.- Conocimiento de las herramientas.
Es posible hacer un buen diseño gráfico sin conocer bien las herramientas. Te lo repito con otras palabras de una forma más clara. El conocimiento de las herramientas no es importante para diseñar.
No vas a ser diseñador por conocerte todos los filtros ni por ser un máquina con la pluma. Si no sabes a lo que me refiero con la pluma no te preocupes, es una herramienta que casi seguro que no necesitas.
He conocido a varias personas que se vendían como expertos en diseño gráfico por haber hecho algunos cursos de Photoshop. Saben recortar una imagen tan perfecta que nadie pensaría que ese día el cielo estaba gris. Sin embargo, si un día no puede pagar la suscripción por su programa no sería capaz de hacer nada en otro software diferente. Sin incurrir en el uso fraudulento de usar software sin su oportuna licencia.
La conclusión que debes sacar de todo esto es que deberías conocer las herramientas básicas de cada programa y de ingeniártelas para hacer un buen diseño con eso.
2.- El factor creativo del diseño gráfico
Si has leído el punto anterior, ahora tenemos que compensar el desconocimiento de las herramientas con algo que nos permita realizar un buen trabajo. Y ese algo es… la creatividad.
Si a mí me dieran un maletín con las mejores pinturas, todos los pinceles y paletas que existan, el mejor espacio para trabajar y un lienzo de la calidad más alta y a Van Gogh le dieran un par de lápices. Estoy casi seguro de que el amigo Vincent se las ingeniaría para hacer algo que dejaría mi trabajo en pañales.
En el diseño gráfico pasa lo mismo. Tu labor será dar lo mejor de ti, estudiar casos de éxito, ver lo que está haciendo la competencia, analizar a otros diseñadores y coger las mejores ideas de cada uno. La creatividad es algo más innato que el conocimiento, pero también es cierto que el conocer muchas cosas te hace abrir la mente.
Ahora te dejaré dos de los conceptos que siempre tengo en cuenta a la hora de diseñar. Con esas dos ideas en mente, seguro que tus diseños tendrán un aspecto mucho más profesional.
2.1.- La distribución del contenido.
Deja espacio. Deja tanto espacio como puedas. No hay nada más dañino para los ojos que un texto que quiere escaparse del diseño.
El diseño gráfico quiere expresar algo, puede ser que pretendas mostrar una oferta, puede que sólo quieras presentar una marca o que quieras contar una historia. Si lo que quieres expresar lo puedes hacer en la mitad de espacio pues será más fácil de transmitir.
Mi estilo casi roza el minimalismo, y el de mi equipo se va pareciendo cada vez más al mío, aunque cada diseñador tiene su propio estilo. Cuando el contenido es demasiado y literalmente no cabe en el diseño, llamo al cliente y le digo que voy a borrar la mitad de las cosas que me ha puesto.
Cuando tengas delante un diseño, antes de colocar el contenido pon unas guías como márgenes, luego mételas un poco más. Seguro que tu creatividad se suelta cuando tiene espacio para trabajar.
2.2.- Conocer al cliente.
Con esto me refiero a conocer al cliente de tu cliente (o a tu cliente si es caso de que diseñas para ti mismo). No se trata de que te guste a ti, ni se trata de que le guste a quien te encarga el diseño. Se trata de llegar al público objetivo.
Cuando diseñes, crea varios personajes que reúnan las características del cliente perfecto. Imagina que se lo quieres enseñar a ellos y haz algo que les guste.
Juega con los colores y con las tipografías, sólo con una buena selección tendrás medio camino hecho. Como yo me enteré que haces un diseño y utilizas las fuentes que vienen en el Word te busco y te pego con la zapatilla hasta que pidas perdón.
3.- Aspectos técnicos del diseño para medios digitales
Si piensas que diseñar un cartel para imprimirlo y diseñar un cartel que se publicará en las redes sociales es lo mismo estás muy equivocado.
No entraré en todas las diferencias que existen entre el diseño para impresión y el diseño gráfico para medios digitales, pero son muchas y muy importantes. Simplemente te expondré los conceptos técnicos de que debes contemplar cuando tu trabajo vaya a ser utilizado de forma digital.
3.1.- El color. Modo y gestión de los colores.
Cuando imprimimos utilizamos tintas que mezclamos en determinados porcentajes para crear el color que necesitamos. Por eso cuando queremos pintar de verde mezclamos el azul y el amarillo.
Cuando mostramos algo en una pantalla, esta mezcla los colores primarios de luz para obtener lo que buscamos. Por eso cuando queremos mostrar algo amarillo se mezclan el verde y el rojo.
¿A que si haces la misma mezcla en la situación contraria el resultado no es el mismo? Pues por eso, cuando diseñamos para impresión usamos el modo de color CMYK (Cian, Magenta, Yellow y blacK) y para diseños digitales usamos RGB (Red, Green y Blue)
En cuanto a la gestión del color, realmente es un aspecto más avanzado, es importante en el diseño para impresión, pero para el digital, con tener los colores en RGB es suficiente.
3.2.- Los tipos de archivos. Cómo guardar tus diseños.
Ya tienes un buen diseño, has respetado los márgenes, has plasmado las ideas, has pensado en su público objetivo y has trabajado en el formato correcto. Ahora tienes que guardarlo para poder subirlo a tu web o la web del cliente o para publicarlo en cualquier lugar.
Éstos son los tres tipos de archivos que vas a necesitar conocer:
JPEG. Es un archivo que muestra píxeles de colores. Guarda puntitos de muchos colores que cuando los ves juntos parecen formar una imagen. Lo más habitual es utilizar este diseño cuando quieres publicar el diseño en cualquier medio digital. También se utiliza para la impresión, aunque para esa finalidad existen opciones mucho mejores.
PNG. Resumido es un JPEG que permite que los puntitos, además de ser de colores, sean transparentes. Este tipo de archivo viene genial para realizar el diseño gráfico de iconos, logotipos e imágenes sin fondo para sitios web.
PDF. El PDF tiene muchas opciones. Se puede guardar en PDF una fotografía, pero realmente sería un JPEG disfrazado de PDF. La función ideal es para guardar textos o trazados vectoriales. Se utiliza para diseñar por ejemplo un folleto o catálogo descargable en un sitio web.
3.3.- La optimización del tamaño de tus archivos.
Si quieres que una imagen tenga la máxima calidad el archivo pesará al menos unos cuantos megas. ¿Y qué pasa con eso? Pues que si quieres enviar esa foto por Internet tardará más en llegar (los navegadores tardarán más en cargar). Eso parece que no es importante pero sí lo es. Si la imagen la vas a utilizar en tu sitio web o en el de un cliente, eso afecta a la velocidad de carga. En el siguiente punto hablo un poco más del tema.
Si quieres reducir el peso de tus archivos te recomiendo tinypng o tinyjpg esta web tiene la función de reducir el peso sin apenas reducir la calidad de la imagen. A simple vista no vas a notar diferencia.
Si tu diseño va a ir directo a las redes sociales no te tienes que preocupar por este paso, pues la misma red se encargará de optimizarla.
4.- Cómo afecta el diseño a la conversión y al SEO
Afecta de forma directa e indirecta.
De forma directa porque la velocidad de carga de la web será mayor y el usuario no se aburrirá esperando a ver tus imágenes. Y lo peor es que hoy en día nos aburrimos si tarda unos segundos en aparecer.
De forma indirecta porque mejora la conversión. Un buen diseño gráfico transmite confianza. Dar claridad con tus diseños es hacer una imagen de marca más transparente, y eso al cliente le gusta. Si a los usuarios les gusta lo que ven, se quedan más tiempo, y si se quedan más tiempo, Google lo sabe.
En sólo dos frases:
• Un diseño técnicamente correcto y que pese poco mejora el SEO.
• Un diseño gráfico visualmente atractivo mejora la conversión de tus usuarios y eso indirectamente mejora el SEO.
Cómo afecta el diseño a la conversión
Espero que te sea de ayuda este artículo. Estoy seguro de que me he saltado muchas cosas que también te interesan, pero he intentado ceñirme a los puntos más importantes y sin entrar en demasiados detalles.
Si hay interés en conocer también algo más acerca del diseño gráfico para impresión, también podría dar algunos conceptos básicos. De hecho, Colorprinter es una empresa especializada en diseño gráfico para los productos de imprenta que vendemos.
Diseñador gráfico, jefe de equipo en Color Printer Material de imprenta y diseño gráfico.
Super importante tener estos consejos o recomendaciones en cuenta. La estrategia previa es fundamental
Gracias por los datos. Lo importante que es una primera imagen, tanto en la vida como en el mundo digital
el diseño es un factor fundamental para las webs. La verdad es que sin una estética atractiva no funcionará igual de bien
Buenas
Equilibiro entre funcionalidad y diseño web, la clave
un saludo