Mostrando entradas con la etiqueta Crear tu logo. Mostrar todas las entradas
Mostrando entradas con la etiqueta Crear tu logo. Mostrar todas las entradas

miércoles, 8 de febrero de 2012

Logo de Burger King en Inkscape



 

 burger king

 

Ha ce 15 días comencé mi dieta, que mejor que celebrar mis kilos bajados con un logo de burger king en vectores, pasa que muchas veces necesitaremos el logo de X empresa en vectores para modificarlo o como inspiración para una nueva creación. Hoy en ves de usar la herramienta que trae por defecto inkscape(vectorizar mapa de bits), lo haremos de la forma mas larga. Esto nos sirve de practica, usaremos técnicas como operaciones booleanas y modificación de tipografías para lograr nuestro fin.

Primero que todo descargamos esta imagen que usaremos de base o molde

burguer king 

Luego abrimos inkscape e importamos la imagen, se nos habré una ventana que nos pregunta si queremos la imagen enlazada o incrustada en nuestro archivo svg, por supuesto yo la quiero incrustada, como saben nuestra imagen esta colocada en una capa que por defecto se llama capa 1, que la veremos en la parte de abajo, con un candado y un ojo pequeño, el ojo cuando clicamos desaparece la imagen y lo volvemos a clicar y vuelve aparecer, es para escondermapa de bits una capa mientras trabajamos, el candado evita cualquier modificación accidental que podamos sufrir en el manipuleo de nuestro mapa de bits, entonces clicamos el candado.

Ahora procedemos a trabajar con nuestro dibujo, lo primero será crear una nueva capa, ya que estando clicada la capa 1, no nos dejara hacer ningún cambio en ella y por supuesto tampoco meter nuevos dibujos vectoriales.

Creamos capa con capas-nueva capa y le damos un nombre capa 2 o lo que les guste, luego empezamos a trabajar con la semiesfera azul, como se darán cuenta es un poco complicada ya que tiene una forma aguzada en el extremo superior, la solución será hacer tres esferas para poder lograr esto, otra cosa cuando crean un objeto sobre sus dibujos bajen la opacidad al 50% para poder trabajar mejor,  debería de quedar así

Dibujo2

ahora pasaremos a la operación booleana de diferencia, primero seleccionamos el circulo 1 con un clic y apretando shift seleccionamos el circulo dos y hacemos Trayecto – diferencia, luego repetimos con el circulo 1 y el circulo 3 para que nos quede así

Dibujo3

Ven como queda, solo nos falta cortarla parte mas gruesa de nuestro primer vector y lo haremos con un cuadro de esta forma

Dibujo4

repetimos los pasos y nos queda listo la primera parte

 

Dibujo5

Ahora pasaremos al circulo amarrillo, es importante trabajar en otra capa para no provocar cambios a nuestra primera parte, y también salvar el trabajo por cualquier motivo.

Una ves creado la nueva capa vamos a trabajar con la herramienta pentool, que esta acá al costado y trazamos un triangulo de esta forma

Dibujo6 Luego trabajamos con la herramienta editor de nodos y suavizamos los nodos de los extremos, luego arrastramos lados y los acomodamos a nuestro gusto para quedar asi

Dibujo7

Dibujo8

 

Luego solo falta duplicarlo y darle el color que corresponda, para eso podemos usar la herramienta cuenta gotas y nos dará el color exacto, nos queda así

Dibujo9

 

para darle la sombra podríamos recurrir a nuestro pentool, de la siguiente forma, el pan de abajo hacemos un pequeño triangulo y suavizamos las bases, sacamos el color adecuado con el cuentagotas, con el de arriba costo un poco mas, lo que hice fue duplicar el pan y darle un color blanco, lo disminuí de tamaño con Ctrl + ( , luego lo volví a duplicar y le puse el color del pan y lo coloque de tal forma que me diera los reflejos, los disminuí nuevamente y quedo genial

Dibujo10

ahora pasamos a las font, debemos buscar una que mas se asemeje, en mi caso y como no estoy con ganas de buscar voy a usar la arial black, que es la que mas se parece con pequeñas diferencias que luego podremos modificar,

lo primero es escribir la primera parte del texto que es BURGER, luego debemos crear una perspectiva, de la siguiente forma, primero convertimos a trayecto nuestro texto con Trayecto – objeto a trayecto luego creamos la perspectiva que queremos con el pentool, pero ojo respeten siempre la dirección que tienen en la perspectiva como se las enumero en la siguiente imagen

Dibujo11

ven como esta la imagen, si lo hacen al revés les saldrá la imagen de cabeza, luego seleccionamos primero el texto convertido en trayecto y lo seleccionamos primero y luego el rectángulo que servirá de guía para la perspectiva y hacemos lo siguiente Extensiones – Modificar trayecto – perspectiva, este es un script que lo hace automáticamente quedando así

Dibujo12

 

no nos quedo muy bien verdad, pero tranquilos ahora lo arreglamos, seleccionamos el rectángulo y lo llevamos lejos de nuestro logo, para que no moleste, no lo borren o desaparece la perspectiva, como ya esta el texto convertido a trayecto los vamos a desagrupar, seleccionamos el texto y Objeto – desagrupar y luego colocamos cada letra por separado modificando su tamaño y ubicando hasta estar conformes, así

Dibujo13lo mismo hacemos con el KING para luego darles color con el cuentagotas y nuestro resultado seria este, si quieren perfección busquen la misma font o modifíquenla con la herramienta editar nodos y listo.

 

 

Dibujo14

Aquí les dejo el archivo svg para descargar

 

descargas

--> Leer más...

jueves, 14 de julio de 2011

Efecto plástico con Inkscape



 

texto de plastico con inkscape

 

Hoy les traigo un tutorial de efectos sobre texto para dar la apariencia de plásticos. El tutorial de inkscape es muy sencillo y fácil de hacer, además las formas son variados en cada texto, primero abrimos inkscape y creamos el texto, como es de esperar nosotros ponemos nuestro bien conocido y siempre usado “Crear tu Ebook” , la Font que usaremos es una que viene con el PC el Berlín san fb demi y otra cosa háganla bien grande para que se note el efecto.

texto plastico con inkscape

Luego le daremos un bonito degradado con dos colores de su preferencia, si no sabes como hacer un degradado te dejo un tutorial para aprender “Aplicación de degradado con paradas en Inkscape(tutorial básico)”

nos queda de la siguiente forma

 

texto plastico con inkscape1

Una ves que tenemos la Font con el degradado, la duplicamos y le cambiamos de color a blanco, algo que me olvidaba si les gusta pueden poner un borde a la Font del color mas fuerte para que resalte y le damos un grosor de unos 4 px

Todo lo anterior lo hago en este paso

texto plastico con inkscape2

ven como queda el duplicado en blanco sobre el original, bueno ahora vamos a apretar ctrl+( para reducir el duplicado blanco hasta que nos quede como mas nos gusta

texto plastico con inkscape3

Luego vamos a aplicarle un degradado a la capa de arriba, a la blanca pero este degradado será de blanco a transparente

texto plastico con inkscape4

Ven como ahora si esta tomando forma, bueno solo nos queda bajar la opacidad a mas o menos un 60% y darle un efecto de sombra para que nos quede mejor

texto plastico con inkscape5

El efecto de arriba lo hice con dos círculos uno negro que lo desenfoque a 4px y uno de color turquesa mas o menos el mismo color de la parte baja de la Font y desenfocado a 3px. El efecto de abajo lo hice duplicando la capa y darle un color negro y desenfocando a 4px, colocarlo atrás de nuestro texto y bajarlo un poco y colocarlo a la derecha para que simule la sombra.

--> Leer más...

jueves, 30 de junio de 2011

Buscando inspiración para logos



A la hora de buscar inspiración en el diseño de un logo, que  mejor cosa que ver a los mejores en este rubro. Acá les traigo unos cuantos de los mejores trabajos que encontré en internet. Se destaca el degradado en el logo, es una herramienta importantísima en la fabricación de logos, con ellas obtienes logos fresco y bellísimos.

 

1-

adfly-creative-gradient-3d-logo-design

2-

aramova-creative-gradient-3d-logo-design

3-

celebrationz-creative-gradient-3d-logo-design

4-

cocoa-stuff-gradient-3d-logo-designs

5-

connect-soft-creative-gradient-3d-logo-design

6-

crative-atelier-creative-gradient-3d-logo-design

7-

flutterfly-creative-gradient-3d-logo-design

8-

fyc-creative-gradient-3d-logo-design

9-

geneauter-creative-gradient-3d-logo-design

10-

grey-and-saurian-creative-gradient-3d-logo-design

11-

loop-creative-gradient-3d-logo-design

12-

m4oon-creative-gradient-3d-logo-design

13-

samarras-creative-gradient-3d-logo-design

14-

sidewinder-creative-gradient-3d-logo-design

15-

union-creative-gradient-3d-logo-design

16-

vavao-creative-gradient-3d-logo-design

17-

webics-creative-gradient-3d-logo-design

18-

yncense-creative-gradient-3d-logo-design

--> Leer más...

jueves, 16 de junio de 2011

Propuesta de logo para web de decoraciones



 

decorando1

Como el titulo lo dice, entregue mi propuesta hoy vamos a esperar a ver que dice el cliente, espero les guste

--> Leer más...

miércoles, 15 de junio de 2011

Logotipo para web de telenovelas



 

televisa

Ayer participe de una solicitud para un logo de una web, se presentaron mucho diseñadores, algunos mejores otros no tan buenos. Esto me sirve, no solo por el dinero que nunca nos cae mal, no! sino que también para ejercitarme un poco, cosa que hace tiempo no lo hago. Presente mi propuesta  mañana decidirán quien es el elegido, esperemos tener suerte.

--> Leer más...

viernes, 15 de abril de 2011

Texto Neón con Inkscape



texto neon
Hoy les voy a enseñar una técnica muy sencilla para crear texto de neón en inkscape vamos al tutorial, lo primero una ves que abrimos inkscape ponemos un cuadro de color negro para trabajar mejor, luego creamos el texto que queremos y ojo mejor elegir unas letras de trazo fino para que el efecto sea mucho mejor y lo duplicamos e veces asi como tengo en la imagen
texto_neon_inkscape
Ahora lo que vamos a hacer es al primer texto le sacamos el relleno y ponemos un borde de 5 px del color que les guste, al segundo le hacemos lo mismo y al tercero lo dejamos así como esta
texto_neon_inkscape1al primero le aplicamos un desenfoque de 10 px, luego lo superponemos todos nos queda así
texto_neon_inkscape2 
una ves que lo superponemos con la herramienta alinear y distribuir nos queda así
texto_neon_inkscape3
fácil no, ahora les toca a uds y luego me lo muestran
--> Leer más...

Texto de piedra en 3d con Inkscape



textopiedra3
El tutorial de hoy es una mescla del tutorial anterior Texto en 3d con Inkscape y una técnica que es mescla de dos herramientas que trae inkscape que son la herramienta clip y el script de movimiento. Pasemos al tutorial lo primero será eliminar el recuadro que trae por defecto inkscape para que no moleste, eso lo hacemos de la siguiente forma, vamos a archivo-propiedades del documento, se nos abre una ventana y en la opción Borde desmarcamos mostrar borde del papel, luego cerramos la ventana.
texto_piedra_3d_inkscape 
lo siguiente será escribir el texto que queremos darle el efecto, en mi caso piedra y lo duplicamos con Ctrl+D, dejamos uno de lado y el otro lo convertimos en trayecto haciendo el comando trayecto-objeto a trayecto y luego lo desagrupamos.
texto_piedra_3d_inkscape1
vamos a darle movimiento a este texto de la siguiente forma, hacemos  extensiones-generar desde trayecto-movimiento, nos aparece una ventana donde ponemos los siguientes valores magnitud 30 y Angulo 100
texto_piedra_3d_inkscape2nos queda de la siguiente forma
texto_piedra_3d_inkscape3es hora de cargar la imagen o mapa de bit, en este caso usaremos esta, les dejo para que puedan guardarla y usarla en este u otros proyectos.
40  
una ves cargado esta imagen vamos a usar el comando clip, que lo encontramos en objetos-clip, una recomendación seleccionen el texto y luego la imagen para luego hacer el comando objeto-clip, otra cosa dupliquen el mapa de bit ya que lo usaremos otra ves. Otra cosa pueden agrupar nuevamente el texto que le dimos el movimiento para mejor comodidad. Nos debe quedar así
texto_piedra_3d_inkscape4

Ven como queda, ahora vamos a duplicar el otro texto piedra dos veces con Ctrl+D y a uno le vamos a dar nuevamente un clip con la imagen y luego vamos a armar nuestro texto 3D, nos queda  así
texto_piedra_3d_inkscape5Bueno lo primero será colocar la imagen de fondo y encima la imagen que posee el movimiento, verán como no se nota nada ya que se superpone la imagen de fondo sobre el texto ahora lo arreglamos 
texto_piedra_3d_inkscape6para que esto no ocurra vamos a utilizar uno de esos textos negros que nos queda, para ponerlo en el medio de la siguiente forma y le vamos a dar un desenfoque de 3px
texto_piedra_3d_inkscape7ven como queda ahora si se distingue el texto ahora vamos a poner el siguiente texto de piedra y entre ellos le ponemos el otro texto negro y le damos un desenfoque de 5px, nos queda así
texto_piedra_3d_inkscape8ahora vamos a poner un cuadro con los bordes redondeados, sin relleno, un ancho de trazo de 40px y le damos 10 px de desenfoque con un color RGBA: 917c14ff nos queda así
texto_piedra_3d_inkscape10 
textopiedra4
--> Leer más...

Related Posts with Thumbnails