Crear el Logo del Firefox en Photoshop!

Este tutorial se va a través de cómo se puede crear el logotipo de Firefox en un formato escalable Photoshop.

El Mundo

En primer lugar crear un nuevo documento en 1024px x 970px y empezar con la selección de la herramienta elipse (U) y dibujar un círculo grande (mantenga Mayús para limitar las proporciones) y la parte superior del círculo casi toque la parte superior del documento y la parte inferior del círculo casi toque la base del documento. Cambia el color de esta nueva forma haciendo doble clic en el color al lado de su forma en la paleta Capas y, a continuación, entrar en # 1f0e6d en el espacio por debajo RGB. Esta es su forma básica de su mundo y debe tener este aspecto:

Logotipo de Firefox Paso 1

1.) En primer lugar, la forma de crear el mundo

Ahora tenemos que duplicar el mundo la forma haciendo clic derecho en el círculo que hemos creado en la paleta Capas y haga clic en Duplicar. Es necesario que esta escala ligeramente inferior, de modo que presione CTRL + T y se le cambió a Libre Transforma en el que puede manipular libremente la forma. Escala por la forma tan poco por la selección de la parte superior derecha manipular y cambiar el tamaño arrastrando hacia el interior, mientras que la celebración de ambos SHIFT + ALT. Ahora añadimos una nueva capa de gradiente va Capa> Nueva capa de relleno> Degradado. Darle un nombre y haga clic en Aceptar y usted debe ser educado con un relleno de degradado diálogo. Ahora tiene que hacer clic en el gradiente junto a Desnivel: (no el menú desplegable, el gradiente) y esto debería traer un editor de gradiente. A lo largo de la pendiente deslizante debe haber un recuadro negro en la parte inferior izquierda y un cuadro blanco en la parte inferior derecha. Haga doble clic en el cuadro de la izquierda negro y cambiar su color a # 251979 y, a continuación, haga doble clic en el cuadro de la derecha y cambia el color a # 67c4d4. Luego haga clic en el cuadro de arriba a la derecha y cambie su valor de opacidad al 100%. Haga clic en Aceptar y se le presentará con una paleta de capas que tiene este aspecto:

Su paleta de capas debe ser similar a este.

Ahora tiene que hacer clic en su 3 ª capas (o lo que debería ser llamado "Forma 1 Copiar ') vector máscara y arrástrelo a su nueva creación del gradiente capa. Esto debería crear un vector para su máscara de capa de relleno de degradado y debe tener este aspecto:

La paleta de capas vectoriales con la nueva máscara.

Ahora viene la parte difícil, la creación de la tierra en el mundo. Para ello, utilice la herramienta pluma (P) a crear las formas orgánicas necesarias para parecerse a la tierra. Seleccione la herramienta pluma (P) y asegúrese de que está seleccionada la forma de capas en el menú de herramientas en lugar de Senderos. Comenzará ahora el clic y arrastrando los procesos involucrados en el uso de la herramienta de la pluma hasta que alcanzar los siguientes resultados (no puedo más de esta herramienta de la pluma (P), pero si quieres cubrir los fundamentos salida este tutorial):

El mundo con la tierra añadida.

Ahora tenemos que restar una porción de tierra de la isla que hemos creado y para ello haz clic en el vector de la máscara en la tierra la forma en la paleta de capas (con la herramienta pluma (P) aún seleccionado) para seleccionar la tierra; a continuación, haga clic en el Espacio Forma De Restar botón de la barra de opciones de herramienta. Ahora acaba de quitar el pedazo de tierra utilizando el mismo método utilizado para añadir que hasta que haya retirado la pieza se muestra en la siguiente imagen:

Retire el trozo de su tierra muestra la forma.

Con su forma seleccionada, ahora tenemos que invertir la tierra de modo que aparezca la misma que la del logotipo de Firefox. Para ello, seleccione la herramienta de selección de ruta (A) y seleccionar la ventana principal de la tierra (no la resta uno). Ahora presione el '-' (menos) para invertir la selección y, a continuación, haga clic en su pedazo de tierra resta y pulse '+' (más) para añadir la isla de nuevo a la forma. Ahora haga clic derecho en su capa en la paleta de capas y seleccione Crear Máscara de recorte para recortar su tierra para el mundo y que debería tener este aspecto:

Así es como eres mundo debe mirar con la tierra removida.

Ahora, para lograr un efecto de gradiente, utilizando estilos de capa. Para lograr esto es necesario seleccionar Capa> Estilo de capa> Superposición de gradiente de Photoshop en el menú y se le presentará las opciones necesarias para editar un degradado. Haga clic en el gradiente junto a Desnivel: (no el menú desplegable, el gradiente) y esto debería traer un editor de gradiente. A lo largo de la pendiente deslizante debe haber un recuadro negro en la parte inferior izquierda y un cuadro blanco en la parte inferior derecha. Haga doble clic en la parte inferior izquierda y el negro cuadro para cambiar su color # 00022e y deslícela Ubicación lecturas a lo largo de hasta 40%. A continuación, haga doble clic en el cuadro de abajo a la derecha y cambia el color a # 0f80bc, haga clic en OK, OK, OK y se le presentará con el presente:

El mundo con una sutil gradación.

Ahora tenemos que crear el clásico de la Web 2.0 orbe efecto brillante (cuando vamos a cansar de él?) Mediante la selección de la herramienta elipse (u), y aprovechando un óvalo en la parte superior del globo para que se parezca a esta:

Añadir la reflexión.

Ahora seleccione Capa> Estilo de capa> Superposición de gradiente de Photoshop en el menú y se le presentará las opciones necesarias para editar un degradado. Haga clic en el gradiente junto a Desnivel: (no el menú desplegable, el gradiente) y esto debería traer un editor de gradiente. A lo largo de la pendiente deslizante de doble click en el cuadro de negro la parte inferior izquierda y el cambio a # FFFFFF (blanco). Ahora haga clic en el recuadro superior izquierdo negro y cambiar la opacidad al 0% y el lugar al 40%. Haga clic en Aceptar y esto parece que no hacen ninguna diferencia. Haga clic en Opciones en la mezcla de la capa de estilo diálogo y busque la sección de mezcla avanzada. En esta sección debe ser un regulador Opacidad de relleno que se necesita para arrastrar a 0%. Por encima de esta sección es el general para mezclas donde encontrará un regulador Opacidad que debe ser arrastrado a un 50%.

Después de esta breve avanzado poco de mezcla, haga clic en Aceptar y se le presentará con el presente:

El acabado mundo.

El Zorro

El zorro es, sin duda, el truco y usted necesita tener una buena comprensión de la herramienta de la pluma y la forma en que las obras para tirar esto. Estoy escribiendo lo siguiente en la presunción de que ha logrado la sección anterior de este tutorial y confiamos con el lápiz y los estilos de capa.

En primer lugar tenemos que empezar con el brazo. Las siguientes forma con la herramienta de la pluma (P) y haga doble clic en la capa para abrir el diálogo Estilo de capa. Cambiar el gradiente de propiedades hasta lograr un resultado que se asemeja a la imagen siguiente. He utilizado los colores # 941403 y # c04b11 para lograr los siguientes efectos (recuerde ajustar el ángulo y la escala en la capa estilos de diálogo para lograr el resultado deseado):

Empezamos con el brazo.

Ahora tenemos la base del brazo. Ahora debemos duplicar esta capa para que podamos añadir el naranja de la mitad superior del brazo. Después de la capa se ha duplicado (clic con el botón derecho, doble ejemplar en la paleta de capas) tenemos que restar un pedazo de ella en la misma forma en que eliminan la tierra desde el mundo en la primera parte de este tutorial, haga clic en el vector de su máscara la duplicación de la forma en la paleta de capas y con la herramienta pluma (p) seleccionado haga clic en el botón Área Restar Forma. Ahora dibuja una curva que coincide con la imagen que sigue, la eliminación de la parte inferior del brazo zorros. Una vez completo, haga doble clic en el color a un lado de la capa y aplicar # d46518 como llenar las formas de color. Pellizcar el ángulo y la escala en la capa estilos de diálogo para lograr el resultado deseado y que ahora tienen algo que se parece a esto:

El brazo y la sombra.

Ahora tenemos que crear una rápida resaltar. Para ello seleccionar la herramienta pluma (P) y dibujar una forma en la pata del zorro que se asemeja a la imagen siguiente. Aplique una capa de estilo sencillo con un degradado que utiliza # f5f498 color de la caja de la izquierda gradiente y el mismo color de la derecha, pero con 0% de opacidad. Haga clic en Aceptar, Aceptar y vaya a Opciones de la mezcla de estilos de capa en el diálogo y avanzada mezcla de cambiar la opacidad de relleno a 0%. Modificar la escala y el ángulo de la capa de estilo en el diálogo para lograr el resultado deseado y el resultado debe ser que algo como lo siguiente:

Completado con el brazo más iluminacion.

Ahora tenemos que empezar a crear la mayor parte de la forma del zorro. Empezaremos con el primer esbozo y luego construir los detalles de la zorra como capas individuales. Empezar por crear el zorro esquema que incluye el oído, pero excluye a la cabeza como muestra la siguiente imagen (utilizando la herramienta pluma (p)).

El cuerpo base de la forma.

A continuación, abrir el diálogo de estilo de capa y aplicar un nuevo degradado utilizando los colores de una manera similar a lo que he utilizado de la siguiente manera (para añadir nuevos colores a la paleta, haga clic en un espacio vacío de la pendiente deslizante). Pellizcar el ángulo y la escala en la capa estilos de diálogo para lograr el resultado deseado.

El zorro del cuerpo degradado.

El zorro esbozo debe esperar ahora este aspecto:

El zorro con el gradiente aplicado.

Usted notará que el zorro de la cola es demasiado roja con el existente gradiente aplicado. Una manera rápida y fácil de librarse de esto es duplicar el esquema y los zorros con el lápiz, seleccione la herramienta y Restar de zona seleccionada formas, dibujar una forma, pero la eliminación de todo zorros cola. Luego, en la capa de estilo diálogo, modificar la pendiente para eliminar el enrojecimiento de la punta de la cola.

Ahora, utilizando las técnicas empleadas antes tenemos que empezar sobre la zorra de la boca y la mandíbula. Empezar por señalar a la parte inferior de la boca con la herramienta pluma (P) y cambiar las formas a llenar de color # ffffcc.

Los comienzos de la mandíbula.

Ahora crear una nueva forma de actuar como la mandíbula de destacar. Dibujar una forma similar a la que se indica, mediante el relleno de color # eea273. La forma puede extenderse la mitad inferior de la mandíbula, ya que entonces aplicar una máscara de recorte haciendo clic derecho en la nueva capa y seleccionar Crear Clipping Mask. Esto debe anclar bien su nueva forma a la mandíbula y eliminar cualquier excedente de las formas.

Sombreado de la mandíbula.

Ahora la parte superior del hocico debe ser creado, por lo que con la herramienta pluma (P) las siguientes forma y el cambio de gradiente en la capa estilos diálogo (doble clic en la capa en la paleta de capas) para utilizar los colores # # 9a1d06 y db5009, recordar para modificar la escala y el ángulo de la capa estilos diálogo.

La parte superior del hocico comienza a tomar forma.

Ahora tenemos que crear un sutil relieve a la parte superior del hocico de zorro. Para ello, duplicar la parte superior del hocico que acaba de crear y con la herramienta pluma (P), elija la forma de Restar Espacio y eliminar el fragmento como se ilustra a continuación.

Añadir a sutiles destaca el zorro del hocico.

Ahora cambiar el estilo de esta capa de relieve a tener un gradiente usando el color # df731b en ambos cuadros, pero con el cuadro de la derecha tener 0% de opacidad. Luego recuerdo ir a la mezcla de opciones, busca avanzada mezcla de cambio y la opacidad de relleno a 0%. Recuerde que debe volver a Superposición de gradiente en la capa de estilo diálogo y ajustar el ángulo y la escala para que coincida con la imagen de abajo. Usted debe terminar con algo como esto:

Fundido a cabo los aspectos más destacados de los aspectos más destacados.

Por último añadir un botón negro nariz con un simple blanco / negro degradado Superposición y arrastre la capa de debajo de las otras formas en el hocico la paleta de capas.

Ahora tenemos que afinar los detalles de la cola de la zorra. Crear una forma similar a la siguiente y aplicar una capa de degradado Superposición de estilo con un gradiente similar al siguiente (recuerde ajustar el ángulo y la escala en el gradiente de superposición opciones en el diálogo Estilo de capa):

La forma debe ser como este:

Fox destacar la cola de forma.

El gradiente debe tener este aspecto:

El gradiente de la cola destaca.

En conjunto, debe tener este aspecto:

La cola de relieve con gradiente aplicado.

Repita este proceso hasta que todos los detalles en la cola está completa, utilizando el mismo gradiente de estilos, modificando sólo ligeramente para adaptarse a cada poco de detalle. Después de haber terminado el detalle que debe tener algo parecido a éste:

La cola empieza a mirar más definido.

Ahora lo que necesitas para crear la pieza final de detalle de la cola, que también actúa como la sombra a la espalda de la zorra. Para ello, duplicar la forma que constituye el cuerpo de la zorra y en la paleta Capas, arrastre en la parte superior a fin de que todas las superposiciones de capas existentes. Ahora selecciona la herramienta pluma (P) y Ctrl + clic en su forma de educar a las formas esbozo con todos los puntos de anclaje mostradas. Solo haga clic en la mayoría de los puntos de anclaje para eliminarlos y tire de algunos de los ya existentes hasta llegar acerca de una forma que se asemeja a la imagen siguiente. Cambiar el gradiente de superposición en el diálogo Estilo de capa también se asemejan a los siguientes (ajustar la capa estilo que utilizan para las colas antes de detalle):

El zorro la espalda y cola terminada definición.

El zorro del pelo de la cabeza ahora tiene que ser creado por el dibujo siguiente forma con la herramienta pluma (P). Usted necesidad de crear un estilo de capa con un degradado que utiliza la superposición de colores y df731b # # e79041 degradado y en la superposición de propiedades en la paleta de estilos de capa, cambiar el tipo de degradado radial en lugar de lineal. De esta manera podemos añadir una circular destacar que sigue el arco de la cabeza de la zorra. El resultado debería ser algo como esto:

Casi hecho - el zorro la cabeza empieza a tomar forma.

Este gradiente radial que empleadas anteriormente por desgracia no ha abarcado la parte superior de la cabeza del zorro como se esperaba, por lo que necesitamos duplicar la capa anterior y utilizando la herramienta pluma (p) seleccione Restar Espacio y formas de eliminar el 80% de la el pelo de zorro aproximadamente por debajo del hocico. Me han puesto de relieve la forma como verde en el siguiente ejemplo para que puedas ver lo que me refiero:

El área que usted necesita para restar duplicado de la forma.

Ahora cambiar el gradiente de superposición en el diálogo Estilo de capa para crear un relieve en la parte superior de la cabeza de la zorra. El resultado debe ser como sigue:

El gradiente se aplica a la parte superior de la cabeza.

Ahora tenemos la oreja para aparecer en la parte frontal de la cabeza, por lo que tenemos que duplicar la capa que acaba de crear y corte de todo el mundo aparte de la oreja utilizando la herramienta pluma (P) con Reste De Forma Espacio seleccionado. Tengo un ejemplo a continuación, con la oreja de relieve en verde para que pueda ver la forma exacta que se debe utilizar:

El oído de la forma de eliminar su capa duplicada.

Ahora aplica un gradiente de superposición en el diálogo Estilo de capa y modificar la pendiente por lo que se asemeja a la siguiente imagen:

La oreja con un gradiente aplicado.

Por último lo que necesitas para crear las últimas cosas de detalle a la zorra en el pelo de forma similar a cómo se creó el detalle de la cola de la zorra. Dibuja una serie de cabellos erizados formas como se ve en la imagen de abajo y crear un degradado que utiliza los colores y e27d23 # # efa869, asegurándose de que modificar el ángulo y la magnitud del gradiente en cada espiga para mezclarlo con el del zorro pelo.

El resultado final!

Click Acá Para Bajar el PSD del Tutorial!