INFORMATICA Y OCIO

Ottoniel · Publicado: Mie Dic 28, 2005 9:08 pm **Título del mensaje**: Interfaz

Interfas
By Ottoniel

Introducción:
Esta es una cencilla interfas la cual puede ser util para muchas cosas en fin ya me callo y empecemos. Salud2 Gente.

Paso1:
Lo primero que aremos será tomar la Herramienta Lazo Poligonal

ya echo esto Trasaremos algo parecido a esto.

Paso2:
Luego de tener esto ya listo tomamos Herramienta bote de pintura

y rellenamos lo que hemos trazado y nos quedará algo asi:

Paso3:
Bueno nos vamos a capas, creamos una nueva capa ensima de la que ya tenemos y nos quedara algo asi:

Por ahora no tocamos eso y lo dejamso tal y como está y proceguimos al paso que sigue.

Paso4:
Ahora sobre presionamos la tecla Ctrl + Clic sobre la capa donde esta el trazo que hemos echo y se vera algo asi.

Despues que tenemos esto seleccionado nos vamos a canales y creamos un canal alfa dadole click donde lo muestra la imagen.

de las clic y selección se verá asi

Paso5:
Ya listo esto lo rellenamos de color blanco y nos quedara algo asi.

Paso6:
Ahora nos bamos a Filtro/Desenfocar/Desenfoque Gaussiano..
y le damos los siguientes valores

y la imagen nos quedara algo asi.

Paso7:
Luego de esto nos vamos a Imagen/Ajuste/Niveles y le damos los siguientes valores tal y como lo muestra la imagen.

La imagen nos quedara algo asi.

Paso8:
Ya que aun estamos en los canales selecciónamos el canal alfa1 que creamos anteriormente le damos click presionando la tecla Ctrl y seleccionaremos la parte redondeada. biendose algo asi.

Paso9:
No uqetamos la selección y ahora nos vamos a capas presionamos eliminamos la capa de abajo y nos quedara algo asi por. Espero no se te ahiga olvidado crear la capa como se te mensiono anteriormente. entoces todo te se vera algo asi

Paso10:
Lo rellenamos de color negro y nos quedara algo asi.

Paso11
Ya terminado todo estoy proseguimos a lo siguiente:

Nos vamos a añadir estilo de capa]

presionamos clic y le damos opciones de fusión.

y agregamos los siguientes valores.

Luego estos otros valores.

y finalmente estos.

Ya agregado todo esto se tiene que ver mas o menos asi.

Paso12:
Y lograto esto creamos una nueva capa y presionamos Mayus+Ctrl+E esto lo hacemos para la hora que hagamos un recorte en el centro no hagan efecto las opciones de fusion que agregamos.

bueno ya echo todo esto creamos una nueva capa ensima de la que ya tenemos y creamos un trazo como este.

Luego selecciónamos la capa donde esta el trazo.

La que esta seleccionada en azul y presionamos Ctrl + G

y la imagen nos quedará algo asi.

ahora a la capa seleccionada la cual es la de arriba por supuesto le agregamos los siguientes valores en efectos de fusión.

ya echo esto te vas a donde muestra la imagen.

echo todo esto se verá paresido a esto.

Paso13:
Ya logrado todo esto trazaremos algo asi tal y como lo muestra la imagen creamos una nueva capa quedandonos asi:

En la capa creamos un trazo com el que muestra la imagne y se vera algo asi.

Luego lo rellenamos de:
Color Gris oscuro = # 575757

y se vera algo asi:

b]Paso14:[/b]
Ya concluido le damos click a la primera capa la que mestra la imagen si teinen todo como va en el tuto o si no a la capa que corresponada
img]http://img330.imageshack.us/img330/2893/capas6uv.gif[/img]
en la capa correspondiente en este caso la primera presonamos la tecla Ctrl + Click con el maus y se seleccionara automaticamente ya echo esto nos vamos a Selección/Modificar/Contraer y le damos un valor de 4 luego presionamos La tecla Supr o delete segun el lenguaje del teclado. luego seleccionamos la capa donde tenemso la interfas y nuevamente presonamos delete o suprimir segun el lenguaje de tu teclado y nos quedara algo asi.

b]Paso15:[/b]
Luego a nuestro pequeño borde le damos los siguentes valores.

ya echo echo todo esto vajamos la Opacidad a 45% y nos quedará algo parecido a esto.

Creamos una nueva capa.

asi es como se veran las capas de nuestro proyecto y para finalizar creamos un traso asi en la capa que hemos creado y le damos degradado y todo se verá mas o menos asi.

ya optenido esto a nuestra nueva capa le agregamos los siguetens valores

y deve quedar mas o menos asi:

b]Paso16:[/b]
bueno ahora trazamos unas lineas en la base de la interfas pero eso si creamos una nueva capa intermedio que quede mas o menos asi

y en esa capa trazamos unas lineas a un Grosor de 1px lo cual el proyecto quedará algo asi:

Luego agregamos los siguientes valores a la capa donde estan las lineas

y por ultimo lo dejamos asi:

ya listo esto finalmente das click a la capa y presionas Ctrl+G y el proyecto te quedará mas o menos asi.

b]Paso17:[/b]
Ya listo todo esto agregamos una nueva capa por ensima de todas, Tomamos la Herramienta Pluama

y creamos un trazo asi.

b]Paso18:[/b]
Luego que tenemos esto tomamos el pincel

lo ponemos a un color Girs claro = # 9E9D9D y ponemos el pincel cerca del trazo y presonamos Enter y el resultado deve ser parecido a este.

Luego de tener esto le agregas los siguientes valres:

y nos tiene que quedar algo parecido a esto

Paso19:
Creamos una capa debajo de donde tenemos el último trazo creado lo cual es el tubo por llamarlo así. Lo cual nuestras capas se veran ago asi.

Ya echo esto seleccionamos la capa que esta pro encima de todas y presionamos ctrl.+E y las capas nos quedarán mas o menos así.

Nota: Esto lo hacemos para que la capa quede sin ningún efecto de fusión, ya más adelante te enteraras el por que.

Así es como tienen que quedarle las capas en le proyecto.

Paso20:
Bueno ya echo esto trazamos un pequeños circulo de esta manera, poniéndolo en el lugar donde corresponde tal como lo muestra en la imagen.

Copiamos el círculo y lo ubicamos en el otro extremo de la línea y nos queda algo así:

Ya listo esto aremos lo siguiente. En la capa donde tenemos la línea gris en mi caso la primera bueno les dejo la imagen que vale más que mil palabras jeje.

Nos ubicamos en el diseño y con la herramienta Marco elíptico

Trazamos un pequeño círculo. la imagen muestra donde.

ya echo esto le damos clic a circulo con el boton derech del mause raton damos calar y un valor de 10 tal y como se muestra en la imagen

echo esto se nos reducira el circulo quedando asi.

ahora presionamos la tecla Supr o Delte segun el lenguaje de tu teclado. Presionamos hasta que de más o menos este efecto. En este caso yo presione 4 Veces.

Luego haces lo mismo con el otro extremo y optienes algo mas o menos asi:

Paso21:
Ahora echo esto creamos una capa por esima de todas y trazamos un cuadro algo asi:

lo rellenamos con un degradado blanco y negro de esta forma
[

y nos queda algo asi.
[

ya optenido esto trazamos un cuadro asi.

luego le damos con el boton derecho del mause dentro de cuadro y se nos despliega la ventana y le damso cortar.

Automaticamente se nos crea una nueva capa la seleccionamos y nos vamos a Edición/Transformar/Perspectiva y en la esquina de tu derecha lo mueves asia adentro y te tiene que quedar algo parecido a esto.

haces lo mismo con le otro extremo hasta lograr esto

Ojo:Ya listo esto aremos lo siguiente nos vamos a la primera capa la seleccionamos y presionamos Ctrl+E dos veces esto ará que las tres primeras capas se agrupen y que asi el cilindro que creamos no este conformado por tres capas si no por una.

Ya echo esto le aplicamos los siguientes efectos de fusión:

y nuestro silindro se verá asi.

ya para darle el toque final al cilindro trazamos unas lineas de esta manera con un valor de 5px o si no al gusto.

Luego le damos ]

y finalmente en la capa donde estan las lineas presionamos Ctrl + G y nos tienen que quedar algo parecido a esto.

b]Paso22:[/b]
Bueno ahora lo mas simple agragamos un fondo a la parte hueva.
solo nos buscamos un fondo cualquiera y lo agregamos en la ultima capa.
quedandonos algo asi.

Luego trazamos algo asi para cortar los bordes y que el fonde paresca dentro de la parte hueca

Ahora presionamos dentro de la selección con el boton derecho del mause raton y le damos Seleccionar inverso. Ya echo esto presonamos la tecla Supr o Delete Segun el lenguaje de tu telcado y tendremos algo mas o menos asi.

Finalmente por fin Very Happy

Seleccionamos algo como esto

luego lo rellenamos con una opacidad tal y como lo muestra en la imagen.

Nota: Para rellenar lo haces de arriba hacia abajo.[/b]

Asemos lo mismo en la parte de abajo repiteindo el paso anterior
y este es el resultado final.

Saludos y Felices trazos.
_________________

moly · User destacando Registrado: 13 Sep 2005 Mensajes: 238

mooola. siempre kise saber como hacer los bordes... mu buen tuto

w0rm · Publicado: Jue Dic 29, 2005 4:02 am **Título del mensaje**:

Gracias por el tuto, muy buen efecto!!!
He probado dicho tuto ya que estaba aburrido y he aquí el resultado:

¿Que os parece? Bueno espero que os guste.
Salu2.
_________________

netw0rm.com[a:R`r,0+b¨a]G|v|4¡L[p^u.n-t'O]C0|v|
NO ATIENDO A PEDIDOS POR MP...

Ottoniel · Publicado: Jue Dic 29, 2005 4:14 am **Título del mensaje**:

wow pues que rapido w0rm si no esta terminado el tuto aun, pero a la grande rapido eres muy bueno en esto men.
_________________

w0rm · Publicado: Jue Dic 29, 2005 4:23 am **Título del mensaje**:

gracias, cuando lo termines por completo ya mejoraré la técnica e inventaré la mia propia.
Esto es muy útil para crear tus propias interfaces de programas, webs lo que sea...
Siempre es bueno aprender ^.^!

Salu2 Wink

.
_________________

netw0rm.com[a:R`r,0+b¨a]G|v|4¡L[p^u.n-t'O]C0|v|
NO ATIENDO A PEDIDOS POR MP...

Ottoniel · Publicado: Jue Dic 29, 2005 6:56 am **Título del mensaje**:

ahi les dejo el otra parte salu2
_________________

Elu · User destacando Registrado: 25 Sep 2005 Mensajes: 463

igualito que tu firma no? xD
_________________
Todo el mundo puede mear en el suelo, se un heroe!!!! MEA EN EL TECHO!!!!!

Elurisoto_algarroba_jemail_punto_com

JJDesign · Publicado: Jue Dic 29, 2005 12:30 pm **Título del mensaje**:

Muy completo el tutorial, lo añado a la recopilación
_________________
¿El Lienzo en Blanco?

CriSs · Publicado: Jue Dic 29, 2005 1:26 pm **Título del mensaje**:

ME encanta el tuto!
_________________

t4t0 · Publicado: Jue Dic 29, 2005 4:20 pm **Título del mensaje**:

Siempre me pregunte como carajo se hacian esos bordes XD--- ahora ya lo se. Gracias otoniel

	Índice del Foro Foroz comunity :: Tutoriales photoshop	Todas las horas están en GMT + 1 Hora Ir a página 1, 2, 3 ... 15, 16, 17 Siguiente
Página 1 de 17