BIENVENID@S A MI POST
Hola amigos de la familia P!
En esta tarde quiero compartir con ustedes
un tutorial para que aprendan a crear un "Menu de Usuario" usando photoshop 🙂
1.
creamos un archivo nuevo de 1000px de ancho por 200px de alto, luego creamos un rectangulo redondeado con su respectiva herramienta...
A ese rectangulo le podemos agregar un estilo de los que tenemos guardados en photoshop, o si prefieres puedes agregarle solo color, eso lo decides tu 😉
2.
Ahora usando la herramienta de Texto, escribimos:
Perfil - MP- Post - y por ultimo Poringa! esta ultima es opcional
3.
Como escribimos cada palabra en distinta capa, entonces debemos agrupar las capas de texto,
para eso debemos seleccionar las capas de texto y luego usaremos el comando Ctrl + G , y asi optenemos nuestro grupo
4.
Ahora para darle vida a nuestro Menu de Usuario podemos utilizar un Rander
Si no tenemos ningun rander guardado en nuestra maquina, como en mi caso entonces usaremos una imagen normal 😉
podemos usar la imagen de dos formas:
la primera opción es ir a Archivo y damos click donde dice "Colocar".
la segunda opción es arrastrar la imagen desde la carpeta donde la tenemos guardada y soltarla en el phoshop.
Ya con la imagen abierta en el photoshop, podemos ubicarla en el sitio que deseamos y también podemos cambiar el tamaño de la misma...
Si la imagen no nos quedo del tamaño que deseamos, podemos volver a editar su tamaño con el comando "Ctrl + T" o moverla con la herramienta "Mover" (V)
Nota: si no tenemos practica usando el photoshop es mas facil utilizar una imagen con fondo blanco, porque esto hace mas facil el trabajo a la hora de quitar el fondo 😉
5.
Con la herramienta -"selección rapida", seleccionamos el fondo de la imagen
6.
Ahora seleccionamos la herramienta borrador, pero cuando pasamos el borrador nos dice que no se puede editar el contenido de la imagen porque es un objeto inteligente, entonces debemos rasterizar el objeto... hay seleccionas ok.
7.
Ya con el objeto rasterizado podemos pasar el borrador y quitar el fondo
No debemos preocuparnos de borrar la imagen porque al seleccionar el fondo solo sera posible borrar el fondo 😉
Y la imagen nos quedara asi:
Cuando hayas borrado el fondo es necesario volver a usar la herramienta "selección rapida" y dando click derecho sobre la imagen seleccionas la opción"Deseleccionar"
8.
Ya con la imagen que usamos sin fondo nos va dando vida nuestro querido Menu de Usuario 🙂
pero para darle algo mas de vida seleccionamos la capa y dando click derecho seleccionamos donde dice: "opciones de fusión"
9.
Seleccionamos la opción " sombra paralela" y nos da un toque de fondo en la imagen
10.
Ahora hacemos el mismo proceso de fusión con nuestro grupo de texto, entonces: seleccionamos el grupo, y dando click derecho sobre el seleccionamos "opciones de fusión" aqui también usamos sombra paralela y para darle un toque rasgado a las letras usamos la opción "Bisel y relieve", señalando la opción "textura"
11.
Con nuestro menú de usuario prácticamente listo, nos queda lo mas importante: la división de la imagen!
Para hacer dicha división usaremos la herramienta "Sector"
12.
Dividimos nuestra imagen final asÃ:
13.
Cuando tengamos nuestra imagen dividida, vamos a "Archivo" y seleccionamos: Guardar para web y dispositivos "Alt + Mayus + Ctrl + S"
14.
Ahora Guardamos nuestra imagen como PNG-24 para que nos de transparencia y Ajustamos la imagen a 720px de ancho 😉
Y damos click en guardar, hay cada uno mira en que carpeta lo quiere guadar y que nombre ponerle 😉
15.
Si hemos hecho todos los pasos bien, nos debe quedar una carpeta con las 4 imagenes 🙂
Si no te queda asÃ, devuelvete y mira que paso hiciste mal 😉
16.
Ahora viene el momento de subir las imagenes, cada uno tiene su host de imagenes preferido entonces cada uno es libre de subir la imagen al host que prefiera...
Una vez las imagenes subidas entonces tenemos algo asÃ:
pero si dejamos nuestro post con la imagen asi.. no va a pasar nada porque va a quedar como una imagen comun y corriente
Para que nuestro menú de usuario nos quede funcionando es necesario que quede de la siguiente manera:
[*url=http://www.poringa.net/perfil/cardenasx][*img=http://s2.subirimagenes.com/privadas/1480645menudeusuario01.gif*][/url][*url=http://www.poringa.net/mensajes/a/cardenasx][*img=http://s2.subirimagenes.com/privadas/1480631menudeusuario02.gif*][/url][*url=http://www.poringa.net/perfil/cardenasx/posts][*img=http://s2.subirimagenes.com/privadas/1480632menudeusuario03.gif*][/url][*url=http://www.poringa.net][*img=http://s2.subirimagenes.com/privadas/1480635menudeusuario04.png*][/url]
hay que reemplazar mi username: cardenasx, que yo señale con color rojo, lo cambias por tu username y sin los asteriscos (*)
debe quedarnos asÃ:
debe quedarnos asÃ:
Amigos hay miles de formas para hacer un menu de usuario, se puede hacer con una imagen, se puede hacer en forma de barra separadora (sin render), se puede colocar un estilo al texto; hay que dejar volar la imaginación, para hacer las cosas que nos agradan y darle vida a nuestros post 😉
Si tengo errores u horrores de ortagrafia me disculpan 😀 pues no me dedico a escribir y es mi primer tutorial 😬
GRACIAS POR PASAR 😉
@cardenasx
Si tengo errores u horrores de ortagrafia me disculpan 😀 pues no me dedico a escribir y es mi primer tutorial 😬
GRACIAS POR PASAR 😉
@cardenasx
20 comentarios - crea tu propio menu de usuario
Muy buen tutorial y muy clara la explicación !!!
Gracias por compartir.
Besos y Lamiditas !!!
Compartamos, comentemos, apoyemos, hagamos cada vez mejor esta maravillosa Comunidad !!!
2 Años en Poringa junto a todos !!!
BUEN TUTORIAL Y GRACIAS X EL TRABAJO!!!! 😉
A favoritos y volveré con puntos.
EXCELENTE APORTE
GRACIAS POR COMPARTIR
BESIS LAPRIMA
pasare en cualquier momento con puntines
gracias por este aporte
Volvimos con simbólicos puntos de reconocimiento !!!
Genial
Siempre es de agradecer este tipo de aportes,sobre todo para los que no sabes mucho
de estos temas.
Asà que muchas gracias! 😉 😉 😉
recomendado 😉 😉 😉
excelente loco!!! muy util