- Desde
- 11 Abr 2014
- Mensajes
- 110
Holaa!
En este tutorial os voy a enseñar cómo crear un logo/icono para vuestra web de forma sencilla paso a paso(igual para los que nunca o casi nunca han usado Photoshop se les puede hacer un poco laborioso), por ejemplo para el favicon (icono de pestaña) de vuestra web. Para ello necesitaremos usar Adobe Photoshop (supongo que cualquier versión), yo uso Photoshop CC.
Vamos al lío :
Paso 1:
Lo primero de todo será abrir un nuevo proyecto y establecéis los siguientes ajustes (para ir más rápido también podéis seleccionar en predefinir “Papel EE.UU” y en Contenido de Fondo seleccionar “Transparente”) :
Paso 2:
Giraremos la imagen 90º a la derecha o izquierda para tener un rectángulo horizontal (landscape) :
Paso 3:
Crearemos un círculo con la herramienta de creación de figuras, y seleccionaremos “Herramienta Elipse” y crearemos un círulo del tamaño que queráis. Yo por ejemplo usaré el color #d3f819 :
Paso 4:
Ahora vamos a darle un poco de profundidad. Creamos una nueva capa que llamaremos “Gradiente” y seleccionamos la figura exacta de nuestro círculo manteniendo “Ctrl + click en la figura del círculo” en la paleta de capas.
Veremos cómo se selecciona nuestro círculo con una línea de puntos. Una vez seleccionado iremos a “Selección->Modificar->Contraer”, y le metermos 10 pixeles.
Paso 5:
Una vez hecha la contracción en la selección, seleccionamos la capa que creamos, y cogemos la herramienta de degradado.
Seleccionamos el degradado que vaya de blanco a transparente.
Una vez seleccionado y configurado el degradado pinchamos desde un poco más arriba de la imagen y arrastramos hasta el centro del circulo pasándonos un poco.
Paso 6:
Duplicamos la capa que creamos recientemente (click derecho sobre la capa-> Duplicar capa) y la llamaremos “Luz”. En nuestra nueva capa, iremos a Editar->Transformar->Voltear verticalmente (manteniendo nuestra selección del círculo). Nos quedará algo así:
Nada más haber volteado, le damos a Editar->Rellenar, y ponemos el color #a5e902 :
Paso 7:
Bajaremos la opacidad de la capa “Gradiente” al 70% :
Ahora en la capa “Luz” iremos a Editar->Transformar->Distorsionar y ajustaremos los márgenes de la siguiente manera:
Sobre la misma capa iremos a Filtro->Desenfoque->Desenfoque Gaussiano, y cambiamos el radio a 70 pixeles.
Paso 8:
Añadiremos el texto que queramos dentro de la esfera, yo voy a usar una ‘w’ :
Paso 9:
Agregaremos una nueva figura esférica colocando su capa por debajo de la primera esfera con el color el color que queramos (para ajustar mas fácil el tamaño de las figuras hay una opción en la barra de arriba que se llama “Mostrar contr. transf.” ), y rasterizamos la capa de la nueva figura en Capa->Rasterizar->Contenido de relleno. Ahora duplicaremos esta capa y la pondremos como oculta (pinchamos en el ojo que hay a la izquierda de las capas) :
Paso 10:
A la capa de la figura que tenemos visible le vamos a aplicar un gradiente, con los ajustes de la imagen ( colo gris #595959 ), con esto conesguiremos darle un toque metálico :
Paso 11:
Ahora haremos visible la capa que teníamos oculta, y la traeremos al frente, para ello podemos arrastrarla capa hasta la primera o ir a Capa->Organizar->Traer al frente :
Paso 12:
Ahora iremos a la herramienta de la izquierda de figuras, pincharemos en “Herramienta de forma personalizada” y en la parte de arriba a la derecha seleccionaremos “Forma” y usaremos el logo de media luna. Si no tenemos esa forma en la paleta, le daremos a opciones y seleccionamos “Formas” y le damos a añadir.
Una vez añadida la media luna ajustaremos el tamaño para que se adapte perfectamente a la mitad de la esfera, una vez conseguimos que se ajuste la tendremos que invertir, para ello iremos a Edición->Transformar->Rotar. Nos quedará algo así :
Paso 13:
Ahora seleccionaremos la capa con la esfera blanca que pusimos delante y la eliminaremos. Con la capa de la media luna seleccionada iremos a Capa->Rasterizar->Contenido de relleno, y le aplicaremos el mismo gradiente de efecto metálico:
Ahora le daremos un contorno, para ello iremos a Capa->Estilo de capa->Trazo, y le daremos un tamaño de 12 px con el color #404040 :
Paso 14:
Este paso es para darle ya un toque a tu gusto, yo por ejemplo voy a rotar la letra un poco y le daré un destello de luz en Filtro-> Interpretar-> Efectos de iluminación. La intensidad de luz y el ancho de haz lo modificáis cada uno al gusto. Y quedará algo como esto :
Y esto es todo!! Espero que os sirva un saludo!! :welcoming::welcoming:
En este tutorial os voy a enseñar cómo crear un logo/icono para vuestra web de forma sencilla paso a paso(igual para los que nunca o casi nunca han usado Photoshop se les puede hacer un poco laborioso), por ejemplo para el favicon (icono de pestaña) de vuestra web. Para ello necesitaremos usar Adobe Photoshop (supongo que cualquier versión), yo uso Photoshop CC.
Vamos al lío :
Paso 1:
Lo primero de todo será abrir un nuevo proyecto y establecéis los siguientes ajustes (para ir más rápido también podéis seleccionar en predefinir “Papel EE.UU” y en Contenido de Fondo seleccionar “Transparente”) :
Paso 2:
Giraremos la imagen 90º a la derecha o izquierda para tener un rectángulo horizontal (landscape) :
Paso 3:
Crearemos un círculo con la herramienta de creación de figuras, y seleccionaremos “Herramienta Elipse” y crearemos un círulo del tamaño que queráis. Yo por ejemplo usaré el color #d3f819 :
Paso 4:
Ahora vamos a darle un poco de profundidad. Creamos una nueva capa que llamaremos “Gradiente” y seleccionamos la figura exacta de nuestro círculo manteniendo “Ctrl + click en la figura del círculo” en la paleta de capas.
Veremos cómo se selecciona nuestro círculo con una línea de puntos. Una vez seleccionado iremos a “Selección->Modificar->Contraer”, y le metermos 10 pixeles.
Paso 5:
Una vez hecha la contracción en la selección, seleccionamos la capa que creamos, y cogemos la herramienta de degradado.
Seleccionamos el degradado que vaya de blanco a transparente.
Una vez seleccionado y configurado el degradado pinchamos desde un poco más arriba de la imagen y arrastramos hasta el centro del circulo pasándonos un poco.
Paso 6:
Duplicamos la capa que creamos recientemente (click derecho sobre la capa-> Duplicar capa) y la llamaremos “Luz”. En nuestra nueva capa, iremos a Editar->Transformar->Voltear verticalmente (manteniendo nuestra selección del círculo). Nos quedará algo así:
Nada más haber volteado, le damos a Editar->Rellenar, y ponemos el color #a5e902 :
Paso 7:
Bajaremos la opacidad de la capa “Gradiente” al 70% :
Ahora en la capa “Luz” iremos a Editar->Transformar->Distorsionar y ajustaremos los márgenes de la siguiente manera:
Sobre la misma capa iremos a Filtro->Desenfoque->Desenfoque Gaussiano, y cambiamos el radio a 70 pixeles.
Paso 8:
Añadiremos el texto que queramos dentro de la esfera, yo voy a usar una ‘w’ :
Paso 9:
Agregaremos una nueva figura esférica colocando su capa por debajo de la primera esfera con el color el color que queramos (para ajustar mas fácil el tamaño de las figuras hay una opción en la barra de arriba que se llama “Mostrar contr. transf.” ), y rasterizamos la capa de la nueva figura en Capa->Rasterizar->Contenido de relleno. Ahora duplicaremos esta capa y la pondremos como oculta (pinchamos en el ojo que hay a la izquierda de las capas) :
Paso 10:
A la capa de la figura que tenemos visible le vamos a aplicar un gradiente, con los ajustes de la imagen ( colo gris #595959 ), con esto conesguiremos darle un toque metálico :
Paso 11:
Ahora haremos visible la capa que teníamos oculta, y la traeremos al frente, para ello podemos arrastrarla capa hasta la primera o ir a Capa->Organizar->Traer al frente :
Paso 12:
Ahora iremos a la herramienta de la izquierda de figuras, pincharemos en “Herramienta de forma personalizada” y en la parte de arriba a la derecha seleccionaremos “Forma” y usaremos el logo de media luna. Si no tenemos esa forma en la paleta, le daremos a opciones y seleccionamos “Formas” y le damos a añadir.
Una vez añadida la media luna ajustaremos el tamaño para que se adapte perfectamente a la mitad de la esfera, una vez conseguimos que se ajuste la tendremos que invertir, para ello iremos a Edición->Transformar->Rotar. Nos quedará algo así :
Paso 13:
Ahora seleccionaremos la capa con la esfera blanca que pusimos delante y la eliminaremos. Con la capa de la media luna seleccionada iremos a Capa->Rasterizar->Contenido de relleno, y le aplicaremos el mismo gradiente de efecto metálico:
Ahora le daremos un contorno, para ello iremos a Capa->Estilo de capa->Trazo, y le daremos un tamaño de 12 px con el color #404040 :
Paso 14:
Este paso es para darle ya un toque a tu gusto, yo por ejemplo voy a rotar la letra un poco y le daré un destello de luz en Filtro-> Interpretar-> Efectos de iluminación. La intensidad de luz y el ancho de haz lo modificáis cada uno al gusto. Y quedará algo como esto :
Y esto es todo!! Espero que os sirva un saludo!! :welcoming::welcoming:
