02 enero 2010

EL GIMP (Crear un icono)

Voy a empezar el nuevo año creando una carpeta icono.



1.Creamos un nuevo documento de 250X250 con el fondo blanco.
1
2.Nueva capa que llamaremos carpeta y con la herramienta RUTAS  dibujamos
la carpeta base:
2

3.Vamos a Seleccionar> a partir de una ruta  se convertirá la imagen en un camino de hormigas
y cambiamos los colores de frente fff29e y de fondo a ffd46f
2a
y con la herramienta DEGRADADO en  modo normal , desplazamiento
de 60
y forma lineal
3a
arrastramos desde la parte superior
de la carpeta hasta la parte mas baja. y soltamos.
4.Con la carpeta seleccionada vamos a Seleccionar>Agrandar 1px.y aceptamos.
Volvemos a Seleccionar>Borde 1px. y cambiando el color de frente por fff4db
vamos a editar> rellenar con el color de frente y deseleccionamos ,MAYÚS+CTRL+A.
5.Volvemos a seleccionar la carpeta y en Seleccionar>agrandar 2px. y aceptamos.
ahora en Seleccionar> borde 1 px. y cambiamos de nuevo el color de frente a f4c85b y
rellenamos como en el paso anterior y deseleccionamos o  MAYÚS+CTRL+A.
4

6.Duplicamos la capa carpeta y la renombramos carpeta tapa, cerramos el ojo a
la capa carpeta y con la carpeta tapa activa
pinchamos en herramientas perspectiva y ensanchamos desde las dos esquinas superiores.
5
7.Activamos de nuevo la capa carpeta y con la herramienta de escalado
alargamos la carpeta a lo alto y el bajo hasta llegar a la altura de la otra carpeta.
5a

8.Ahora vamos a crear la sombra y para ello creamos una nueva capa y la llamaremos Sombra.
6 7
Con la herramienta Selección elíptica creamos un oval debajo de la carpeta, lo rellenamos
de color negro y le bajamos la opacidad a 0.
Hecho esto vamos a Filtros> Luces y sombras> Sombra arrojada y le damos los siguientes valores:
X=8; Y=8; Blur=25; opacidad=47 y desactivamos la casilla Permitir redimensionado y aceptamos.
8
9.Bajamos la capa que se ha creado hasta colocarla encima del fondo y con la herramienta Mover
la colocamos debajo de la carpeta.
9

10.Eliminamos la capa sombra y fondo y guardamos la imagen en PNG.
Podemos colocarle antes de guardar alguna imagen dentro de la carpeta.
Si pensamos colocar alguna cosa debemos poner la capa entre las 2 capas carpeta.
10
Yo os aconsejo guardar una copia de la carpeta  con la extensión xcf. para poder hacer cambios
cuando la necesitemos para imágenes, música, documentos, etc….
11.Para convertirla en icono abriremos de nuevo la imagen que hemos guardado en PNG
y una vez abierta la guardaremos con la extensión ico.

30 diciembre 2009

EL GIMP (Efecto luces de colores)

Aprovecho este tutorial para felicitar el Año Nuevo:

Lo primero será crear un nuevo documento 800 x 600 y con relleno de color negro,
aunque puede ser de  cualquier otro tamaño.
1
Creamos una nueva capa transparente y la llamaremos NUBE.
Con la capa NUBE activa vamos a  Filtros> renderizado> Nubes>  ruido solido> vamos cambiando
los valores hasta encontrar el que más nos agrade. En mi caso le puse de tamaño  X6  y Y 6.
2
a continuación bajamos la opacidad de la capa entre 15 y 30.
3
Creamos una nueva capa que llamaremos linea1 y utilizando la herramienta de selección rectangular
crear un rectángulo igual de amplio que el documento pero de altura de 10px.
4
Rellenamos con el color # cccccc. y  duplicamos 3 veces esta capa y
las renombramos linea2, linea3, linea4.
6
Con la  capa de  línea1 activa , ir a Filtros> Blur> desenfoque gaussiano y
seleccionar 70px. como su radio de desenfoque.
Repite este paso para las próximas dos capas, para la linea2 un radio de 30px . , para la linea3
sólo se pone de radio Desenfoque 10px. y la linea4  no se toca, que es la de más arriba.
Crear una nueva capa que llamaremos EXPLORACIÓN y utilizar el patrón de rayas finas Stripes Fine
para rellenarla.
7
Crear otra nueva capa que llamaremos COLOR y  con el uso de la herramienta degradado y
el degradado Full saturatión spectrum  CW y de izquierda 
a derecha arrastramos(pulsa la tecla Ctrl para mantener la línea horizontal). y ponemos la capa en modo color.
7a
Colocar la capa  EXPLORACIÓN por debajo  de la capa  línea1 y
le ponemos el modo en pantalla.
Con la capa NUBE activa Ir a Filtros> Blur> desenfoque de movimiento> LINEAL y los parámetros
 longitud 256 y  en ángulo de 90 grados .
8
En realidad ya debería está terminado pero se le puede añadir un logo, texto, etc…
9
En mi caso escribimos  texto con el mismo color gris utilizado anteriormente.
Duplicamos el texto 2 veces y en Filtros> Desenfocar> Desenfoque gaussiano> aplicamos
un desenfoque de 70px. a la primera capa de texto y de 10 px. a la segunda y dejamos
la tercera como  está.
La capa NUBE queda en modo normal,


pero si queremos que el fondo sea completamente
negro la ponemos  en modo multiplicar .

20 diciembre 2009

EL GIMP (Efectos de iluminación)

1.Creamos una nueva imagen de 1024 x 768 pixeles y el fondo negro.
2. Ahora vamos a agregar una luz. pinchamos en la herramienta PINCEL  o tecla P y
abrir ventana pinceles y pinchamos en  crear un nuevo pincel,
editar y aplicamos los siguientes  ajustes:
2
3. Creamos una nueva capa y la llamaremos LUZ y con el color de frente en blanco hacemos
clic DOS VECES en   el medio de la imagen .
Ajustando previamente la opacidad a 60 y activando la casilla desvanecimiento a 100.
3
4. Ahora vamos a añadir algo de color. Crear una nueva capa que llamaremos COLOR y aplicar FILTROS ->
RENDERIZADO ->NUBES -> PLASMA ,  con el valor 0,1 en la turbulencia.
Ponemos el modo de capa en DIVIDIR. Ajustar la opacidad a 65%
 4
5. Vamos a crear rayos de luz . Crear una nueva capa con el nombre de RAYOS DE LUZ
Ir a FILTROS -> RENDERIZADO -> NUBES -> RUIDO SOLIDO. Establecer el tamaño de X y Y a 16,0.
Volvemos a FILTROS -> DESENFOQUE ->PIXELAR y le damos 5px anchura y la altura  de la imagen 768px.
Volvemos a abrir FILTROS  -> DISTORSIONES -> COORDENADAS POLARES y lo dejamos con los valores 0 | 0.
Ahora ponemos el modo de capa a EXTRAER GRANULADO.
 5
6. Activamos la herramienta TEXTO y escribimos una letra, por ejemplo la A.  Elegimos como fuente SANS
y un tamaño de 490px y la movemos al centro. Ahora vamos a  FILTROS -> LUCES Y SOMBRAS -> SOMBRA ARROJADA,
con los valores 0 | 4 | 30 | blanco | 80 | desactivar PERMITIR REDIMENSIONADO .
 6
7. Ahora vamos a darle brillo a la letra A. Ir a CAPA -> TRANSPARENCIA –> ALFA A SELECCIÓN.
Utilice la herramienta de selección ELIPTICA y mantenga presionadas las teclas MAYÚS + CTRL.
Crear una nueva capa que llamaremos BRILLO. Con la herramienta de DEGRADADO de  blanco
a transparente arrastramos el cursor desde la parte inferior derecha de la letra hasta la parte superior izquierda.
A continuación combinamos las capas  texto y la sombra. 
7
8. Vamos a crear el reflejo de la A. Activamos la capa BRILLO y combinamos hacia abajo.
Duplicamos la capa resultante y la llamaremos REFLEJO y vamos a  CAPA ->
TRANSFORMAR -> VOLTEAR VERTICALMENTE
. Una vez volteada pinchamos sobre ella con la herramienta MOVER
 y con la tecla de desplazamiento hacia abajo la colocamos un poco más abajo de la otra A.
Ahora añades una máscara de capa ,con total opacidad en blanco y con la herramienta DEGRADADO de nuevo, pero
ahora con el negro como color frontal y el blanco como fondo lo arrastramos de abajo hacia arriba de la
letra reflejada y obtendremos un bonito efecto de desvanecimiento.
 8
9. Para terminar vamos a añadir un reflejo de lente.Para ello creamos una nueva capa, la llamaremos
LENTE DE REFLEXION ,lo rellenamos de negro Y ajustamos la capa a modo  PANTALLA.
Quiero poner el destello en la parte superior de la letra A, así que necesitamos la posición.
Basta con mover el ratón a la parte superior de la imagen
y en la parte inferior izquierda de la ventana de El Gimp se puede ver la posición.
La mía es de 530, 215 y una vez la posición clara vamos a  FILTROS -> LUCES Y SOMBRAS ->
DESTELLO DE LENTE
con los valores de 530px y 215px en mi caso.
Y ya lo tenemos terminado.


Deciros que la idea principal esta sacada del tutorial
en inglés de Fabio Sasso y que yo lo e traducido al castellano y siguiendo sus explicaciones lo hice y e creado las capturas.
http://fabiosasso.com.

18 diciembre 2009

PHOTOSHOP (Texto siguiendo trazado)

Me ha pedido una amiga que le explique como crear un texto siguiendo un trazado y lo pongo en el blog
por si a alguno de vosotros os puede también interesar.
En primer lugar creo un nuevo documento:

En la barra de herramientas activamos la
PUMA DE FORMA LIBRE y
pinchamos arriba en TRAZADOS

como os marco en la siguiente captura:

y dibujamos el recorrido que queremos par
 nuestro texto.



Activamos la herramienta TEXTO y acercamos el cursor al borde izquierdo de
nuestra ruta hasta que este cambie a:y ya podemos
empezar a escribir nuestro texto que como podéis comprobar va recorriendo
el trazado.
una vez terminado nos dirigimos a la ventana TRAZADOS y eliminamos la capa:
para que desaparezca el trazo que hemos utilizado de guia,
si aún así no se elimina pinchamos sobre la capa del texto y desaparecerá.
 Ya solo nos queda guardarlo tal com está en JPEG o si queremos
que no se vea el fondo blanco, eliminamos la capa FONDO y lo
guardamos como gif.
yo le e añadido un pequeño detalle, una bola de navidad.

17 diciembre 2009

FLASH ( Efecto nevando)

Vamos a crear nieve cayendo sobre una imagen con tan solo un copo de nieve.
Lo primero que hacemos es crea un nuevo documento:
1
con las medidas que tiene la imagen que vamos a importar, le cambiamos el color
de fondo a #663300 y la velocidad de fotogramas, yo le puse 60, pero eso depende
de la velocidad en la que queréis que caiga la nieve y una vez todos los cambios
efectuados aceptamos.
ahora pulsamos CTRL+ F8  y se nos abrirá otra ventana para crear un nuevo símbolo:
2
nombre: copo de  nieve
tipo: clip de película
pinchamos en AVANZADO y se nos desplegará
VINCULACION y esto es muy importante:
en identificador pondremos flake pero activaremos
primero la primera y la tercera casilla y ya podemos
aceptar


en el área de trabajo que se acaba de abrir vamos a crea nuestro copo de nieve y para ello
dibujamos con el pincel sin borde y fondo blanco una especie de gota
3
y le damos los valores:
ancho: 3.0
alto: 5.0

X: 0
Y: 0


y a continuación pinchamos en la flecha que señalo y volvemos a la escena principal:
3a
Ahora vamos a ARCHIVO- IMPORTAR- A ESCENARIO y buscamos el lugar donde guardamos
nuestra imagen y la importamos. La colocamos centrada con el fondo :
4

En la biblioteca que se encuentra en la parte derecha ahora tenemos el paisaje y el clip
copo de nieve:
4a 5
Pinchamos en copo de nieve y sin soltar  arrastramos una instancia hasta el ángulo superior izquierdo de la imagen,
en PROPIEDADES le pondremos nombre a la instancia,  nieve y para situarlo en el sitio exacto X: 1.0,   Y: –5.0.
Solo nos falta crear la acción y para ello hacemos clic en el primer fotograma y abrimos la pestaña ACCIONES.
6
Una vez abierta  acciones copiamos el siguiente código:
Como podéis apreciar e marcado amount=500 que es el ancho de
la imagen, que debéis cambiar según el ancho de la vuestra.


amount = 500;
mWidth = Stage.width;
mHeight = Stage.height;
for (var i = 0; i<amount; i++) {
            thisnieve = this.attachMovie("flake", "flake"+i, i);
            with (thisnieve) {
                        _x = Math.random()*mWidth;
                        _y = Math.random()*mHeight;
                        _xscale = _yscale=_alpha=50+Math.random()*50;
            }
            thisnieve.yspeed = Math.random()*2.5+1;
            thisnieve.onEnterFrame = function() {
                        this._y += this.yspeed;
                        if (this._y>=mHeight) {
                                   this._y = -10;
                                   this._x = -10+Math.random()*mWidth;
                        }
                        if (this._x>=mWidth || this._x<=0) {
                                   this._y = -10;
                                   this._x = -10+Math.random()*mWidth;
                        }
            };
}
Cerramos la pestaña  ACCIONES y ya podemos probar nuestra nevada en CONTROL- PROBAR PELICULA.
Si queréis que la nieve caiga más deprisa en MODIFICAR-DOCUMENTO y cambiáis la velocidad de fotogramas
hasta que se ajuste a vuestras necesidades.
cuando todo esté de vuestro agrado  en ARCHIVO- PUBLICAR y a continuación vamos a guardar la película
en ARCHIVO- EXPORTAR PELICULA y le damos un nombre y la extensión swf.
Luego ARCHIVO- GUARDAR COMO con la extensión fla. que es la que se deja editar de nuevo.

y este otro ejemplo:

SI VUESTRO NAVEGADOR NO VISUALIZA LAS IMAGENES FLASH AQUI DEJO ESTE
ENLACE
 
IR ARRIBA