Вы находитесь на странице: 1из 26

Este diseño tiene un rectángulo transparente que cubre la foto y la tiñe

de blanco. Lleva otro marco interior que trasluce la foto original. La


tipografía es grande, va en mayúscula y minúscula en el naranja de la
marca.

Aquí vemos el resultado final de la primera plantilla.

Lo primero que vamos a hacer es crear una cuenta en Canva y crear un


espacio de trabajo del tamaño de la imagen para nuestro blog, desde
“usar dimensiones personalizadas”:
Al crear un nuevo diseño, elige la opción de «Usar dimensiones personalizadas».

Las imágenes que ves debajo de las opciones de diseño, son anteriores
trabajos que he realizado en Canva desde mi cuenta. Conforme hagas
nuevos diseños, éstos se mostrarán aquí.

Creamos el espacio de trabajo de 800 x 550 px.

Dentro de las dimensiones personalizadas, indica el ancho y el alto en pixeles. En el caso del
ejemplo, 800 *550.

En el menú de la izquierda tienes varias opciones; para subir la foto de


tu diseños, tienes que hacer clic en “subir”. Como verás, ya he subido
previamente los logotipos como la fotografía.
Ahora clicamos sobre la foto o la arrastramos, para llevarla al espacio de trabajo.

Para llevarla al espacio de trabajo, podemos arrastrarla o hacer un clic


encima de la foto y listo. Como ves, está más pequeña que el espacio
de trabajo. Como queremos que ocupe todo el tamaño del lienzo, debes
ajustar el tamaño arrastrando desde cada esquina.

Puedes utilizar fotografías de una web de stock gratuítas o tomarlas tú,


pero siempre utiliza un mismo efecto de retoque de fotos.
Así ajustamos el tamaño de la foto al tamaño del lienzo.

Vamos a ir al menú de la izquierda y vamos a elegir una forma. Haz clic


en el menú “elementos” y una vez dentro, en el cuadrado “forma”.
A continuación, elegimos una forma del menú de la izquierda.

Se van a desplegar muchas posibilidades. Mientras más te familiarices


con la herramientas, más rápido sabrás cual es la forma que necesitas
para tu diseño.

El abanico de formas que podemos escoger es amplio.

Para esta plantilla voy a elegir un recuadro que tiene un marco


transparente dentro. Para encontrarlo debes hacer scroll o seguir
bajando hasta localizarlo. Hacemos clic en él y se añade encima de
nuestro diseño.
En este caso, la forma que escojo es un recuadro con marco transparente dentro.

Como ves, en cada extremo hay unos controladores desde donde


puedes ajustar el tamaño del recuadro hasta reducirlo o agrandarlo. Lo
agrandamos hasta que ocupe el tamaño de la foto.

Al hacer click en el recuadro, se abre una ventana de diálogo y en el


triangulito de la derecha se despliegan mas opciones como, por
ejemplo, hacer este elemento transparente.

Como no quiero que quede blanco 100%, sino que sea transparente
para poder ver la fotografía que hay debajo, le daré un 66 % de
transparencia. Para eso arrastro el circulito hacia la izquierda, y mientras
lo hago me va a indicar el número de porcentaje de la transparencia.
Ajustamos el tamaño del recuadro, y en la ventana de diálogo que se abre ajustamos también
el porcentaje de transparencia que queremos.

Es momento de añadir texto para escribir el título del post. En el menú


de la izquierda vemos la opción “T Texto”, hacemos clic y se abren unas
opciones. O bien vamos añadiendo de uno en uno el título o podemos
elegir un formato de texto prediseñado (más abajo). Para nuestra
plantilla vamos a añadir “titulo”.
Ahora ya podemos escribir el texto para añadir el título del post.

Escribimos nuestro título y, para poder darle diferente tamaño a ciertas


palabras, debemos añadir líneas separadas de esas palabras.
Desplegamos las distintas tipografías que tiene la herramienta y
elegimos Raleway y el tamaño adecuado.

Algunas líneas de texto serán en light, familia regular o familia bold. Eso
te da bastante juego para diseñar con la tipografía.

Procedemos a darle color a la tipografía de uno de los que conforman


nuestra marca. Pinchamos en la rueda de color, luego en el signo “+” y
se abre otra paleta de colores, donde podemos añadir el tono exacto si
ya lo conocemos.

En este ejemplo optamos por el color naranja de la marca de Ciudadano


2.0.
Una vez elegida la tipografía, procedemos a darle color. En este caso, escogemos el naranja.

Este diseño de plantilla tiene 2 grosores distintos de tipografías, para


diferenciar algunas palabras del título. Además, he reducido el tamaño
entre líneas (el interlineado), en la opción “espaciado de texto” –
[Símbolo] “line heigth” a 1.0. Esta alternativa te permite juntar más las
líneas entre sí para que el texto no ocupe demasiada altura y no se vea
tan separado.

El siguiente paso será añadir un elemento de diseño en la carpeta


llamada “línea” para separar el logotipo del título del post. Se despliegan
muchas posibilidades.
Ahora, en la carpeta llamada «línea», añadimos un elemento de diseño que separe el título
del post del logotipo.

Vamos a cambiar el color de la “línea” por el azul corporativo de


Ciudadano 2.0. Y añadimos el logotipo que ya habíamos subido
anteriormente.
Cambiamos ahora al color azul y añadimos el logotipo ya subido.

Una de las ventajas que consigues trabajando con Canva, es que


además de ser muy fácil de usar, te guarda todos los diseños que has
trabajado en tu cuenta personal. Por eso, cuando tengas que hacer la
próxima imagen de cabecera para tu blog, lo harás en menos de 3
minutos. Solo tendrías que entrar abrir la plantilla y cambiar el título y la
foto.

Trabajar una plantilla para la cabecera de tu blog significa realmente dar


un paso adelante para ser más profesional y conseguir más y mejores
clientes.
Ésta es la segunda plantilla sobre la que vamos a trabajar.

Plantilla 2: este diseño tiene una zona naranja transparente, para


colocar el título del post y otra zona naranja muy clarita para que el
logotipo se vea bien al ir encima de la foto. Hay ocasiones como ésta en
las que necesitamos un recurso para que el logotipo no pase
desapercibido o se confunda con la foto. Para asegurarme de que la
zona naranja clarita combina con otro tipo de fotografías he utilizado la
misma plantilla y he probado con 3 fotos. Éste es el resultado. Me
parece que combina perfecto.
Probamos con tres fotos distintas, para ver cómo contrastan con el color .

Una característica de esta plantilla es que todos los textos del título van
en mayúsculas pero en 3 tamaños distintos.

Lleva una franja azul en diagonal, tiene 3 profundidades distintas, y el


corte del triángulo le añade cierto dinamismo; además, el que sea
transparente deja ver la fotografía.

Desde mi punto de vista, el logotipo resalta bien, el texto se lee y hemos


conseguido otra plantilla atractiva para el blog de Berto.

Vamos a ver cómo hacerla.

Para poder trabajar varios diseños en un mismo documento, lo que


hago es duplicar el diseño 1, haciendo click en la opción “añadir una
nueva página” debajo del diseño 1. Automáticamente se genera un
nuevo formato con la fotografía de fondo, pero sin ningún elemento.
Verás que a la derecha de la nueva página dice número “2”. Puedes
trabajar en el mismo archivo todos los diseños que quieras.
Creamos ahora una nueva página, duplicando el diseño 1, para poder trabajar en un mismo
documento varios diseños.

Una vez que ya tengo mi segunda página empiezo a crear el siguiente


diseño de plantilla.

Voy a añadir un triángulo que voy a personalizar con mis colores.


En este nuevo diseño, escojo la forma de triángulo y le pongo color.

Como ves, ya tiene mis colores y ahora lo voy a hacer transparente.

Lo voy a pegar en la esquina inferior izquierda y voy a sacar fuera del


área del diseño parte del borde del triángulo.
Lo coloco ahora en la esquina inferior izquierda y ajusto la transparencia.

Tiene un 51% de transparencia. Ahora añado los textos del título y le


doy formato al texto, como vimos en el tutorial anterior.
Ahora añado el texto del título y le doy formato.

Toca agregar el logotipo. Como el logotipo tiene un tamaño grande, lo


reduzco arrastrando los manejadores de las esquinas.

Me parece que el logotipo no va a quedar así porque el fondo se come


el logo y no resalta adecuadamente.

Pienso que necesito algún color debajo que haga contraste y que ayude
a que siempre se lea bien el logotipo. Si cambio la foto, y elijo una de
colores claros, va a funcionar mejor, pero si tengo una fotografía de
colores oscuros voy a tener el mismo problema.
Y, a continuación, añado el logotipo.

Se me ocurre que puedo añadir otro triángulo que contraste con el


naranja y que haga resaltar el logotipo. Voy a la zona de “elementos” y a
“formas”. Selecciono este triángulo.
Quiero resaltar el logotipo; selecciono, entre las formas, un triángulo.

Lo arrastro bien abajo y lo giro un poco para que haga de fondo del
logotipo.
Lo coloco bien, de modo que quede como fondo del logotipo.

Busco un tono degradado del naranja hacia el blanco para crear un


color que se diferencie del naranja y que además combine con el
logotipo. Envío este elemento hacia “atrás” para poder ver el logotipo.
Y ahora escojo un color distinto del del texto del título y que combine además con el logotipo.

El diseño ya está listo. Para descargarlo pincha en el botón arriba a la


derecha “descargar”. Si es para la web puedes elegir una imagen jpg.
Tienes 4 opciones.
¡Listo! Ya podemos descargarlo.

La siguiente plantilla es muy fácil de lograr. Ya sabes cómo se insertan


los elementos; ahora te voy a comentar cuáles han sido los pasos, sin
enseñarte la secuencia gráficamente.

Plantilla 3:
Ahora vemos qué pasos habría que seguir en la plantilla 3.

Pasos:

1. Subir la foto
2. Añadir un recuadro blanco y hacerlo transparente al 51%.
3. Subir una forma como la de la imagen y llevarla hacia fuera hasta
que quede solo la parte que vemos.
4. Elegir el color azul corporativo.
5. Añadir la tipografía y darle el formato de nuestra marca.
6. En “elementos” clicar en “líneas” y elegir este diseño. Colocarla
hacia ambos lados de la última línea. Elegir un tono naranja
corporativo y hacerla un 35% más clara.

Plantilla 4:
Y éstos son los pasos que daríamos en la plantilla 4.

Pasos: Para hacer esta plantilla seguimos estos pasos:

1. Subir la foto.
2. Añadir un recuadro y pintarlo de azul corporativo. Ajustarlo al
tamaño que vemos en la imagen.
3. Hacer 3 bloques de texto: el primero tiene 16 px y es Raleway
thin. El segundo tiene 40mpx y es Raleway Regular, se ha
disminuido el interlineado. El tercer grupo de texto tiene 20 px y se
ha ampliado la separación entre letra y letra. Esta tipografía es
Raleway thin.
4. Subimos otro recuadro y lo pintamos de blanco. Lo reducimos
hasta el tamaño de la muestra. Le damos una transparencia de
88%. Subimos el logotipo.
5. Insertamos un recuadro nuevo, lo reducimos hasta hacerlo tan
delgado como la línea naranja arriba y abajo del título. Lo pintamos
del naranja corporativo y lo duplicamos para llevarlo hacia abajo.

Como ves, no necesitas ser un diseñador exitoso para disfrutar de una


plantilla. Será suficiente con usar una misma tipografía, los colores
corporativos de tu marca y un estilo de fotografía similar en todas tus
imágenes.

Después de escribir más de 3.000 palabras explicando con pasión cómo


puedes aprovechar para hacer branding con tu blog, espero que te
lleves nuevas ideas y que te pongas manos a la obra.

¿Utilizas una imagen de cabecera para tus post? ¿Qué resultados has
notado? Comparte tu experiencia en los comentarios.

Etiquetada con: cabeceras, imágenes

Acerca del autor: Susana Morin


Susana Morin, creadora de Love Visual Marketing, especialista en diseño
estratégico y marketing visual. Ayudo a profesionales y pymes de éxito con
presencia online que buscan impactar y vender más a través de una identidad
visual atractiva.

¿Te ha gustado esta lectura?

Pues únete a la "Zona VIP" de Ciudadano 2.0. Es gratis :)


Ya somos +30.000. Haz clic en el botón y descubre todo lo que te ofrece.
¡Quiero acceder a la Zona VIP!
¿Te gustaría leer un poco más sobre éste u otros temas?

Вам также может понравиться