Ejercicio

Post on 28-Jul-2015

292 views 0 download

Transcript of Ejercicio

Ejercicio Ps

Abres el archivo que descargaste de 960grid system el de 12 columnas

Después eliminas la capa 12 col y deben quedar las lineas guía

Con ctrl+ , puedes manejar las guías

Después vas a tamaño de lienzo

Ir a tamaño de lienzo y modificar el ancho y el alto

Renombramos la capa “fondo”

Cambiamos el color del lienzo

el lienzo debe quedar del color elegido

Creas tres carpetas y las nombras en el siguiente orden: header main footer

Creas dentro de la carpeta header una nueva capa y la llamas fondo

con el color blanco y la herramienta rectángulo

si presionamos dos veces en la lupa veremos el tamaño real

ahora le agregas un degradado con click derecho+opciones de fusión +superposición de degradado

cambias el degradado

creamos un carpeta dentro de header que se llame logotipo

activas la herramienta texto

escribes o traes la imagen de tu logo tocando las reglas o lineas guía

nombre o imagen del logo

centrarlo verticalmente para eso seleccionas las dos capas con ctrl

nombre o imagen

con este botón centran el contenido

nombre o imagen del logo

y después shift+las flechas para centrar horizontalmente

nombre o imagen del logo

haces una nueva carpeta la dejas debajo de logotipo y la llamas menú

generas texto para crear los botones

seleccionas las dos capas y centras verticalmente

duplicas las capas para hacer los botones que necesites

con shift + las flechas mueves las capas duplicadas y las colocas en la misma posición

Tomas la herramienta de rectángulo redondeado

Creas una capa debajo de inicio y le cambias el color

nombre o imagen del logo

Realizar un rectángulo como lo muestra la imagen

Creas una carpeta dentro de main que se llame slideshow

Dentro creas una capa y trazas un rectángulo como lo muestra la imagen.

nombre o imagen del logo

seleccionas la capa t con ctrl se crea una zona de selección

Vas a selección + modificar + contraer 20px

nombre o imagen del logo

este es el resultado

Pintas esa capa de un nuevo color

nombre o imagen del logo

Traes una imagen la haces mas pequeña

Colocas la capa de la foto encima de la capa donde esta el rectángulo que coloreaste y

oprimes alt justo en la mitad de esas capas (aparece la flechita apuntando hacia abajo

con un cuadro blanco)

nombre o imagen del logo

después presionas ese símbolo y la foto se debe adaptar al recuadro

Seleccionas la herramienta elipse para generar los botones del slide

en la carpeta slideshow juntas las tres capas creadas

nombras ese grupo como imagen

creas una nueva carpeta debajo de imagen y llamas controles

En esa nueva carpetas haces el pequeño circulo

nombre o imagen del logo

Seleccionas la capa que acabas de crear con el fondo y alineas

nombre o imagen del logo

luego duplicas la capa en dos oportunidades

Generas una carpeta llamada banner después de slideshow

creas una nueva capa y trazas un rectángulo

Que quede 20 px debajo de los botones del slideshow

Cambias el color de la siguiente manera

Pueden agregar una sombra paralela

ahora colocan un texto

Modificas la fuente

pegas el texto

separas donde están los puntos y eliminas el texto último

modificas el auto 30px

Creas una carpeta llamada articulo

imagenes de 220 x 150 ejemplo

Seleccionas capas y las metes en la carpeta articulo

Nueva carpeta llamada sidebar

Una nueva caja de texto dejando 10 px a cada lado

Ajusta el texto

Cambias el color del texto

El texto lo metes en la carpeta de articulo

Duplicas articulo y la nombras como articulo 2

Para el sidebar cambiaremos el fondo

Cambias el color

Seleccionas con click

Selección invertir

Agregar una sombra

Agregas otra capa y haces un rectángulo

agregas un texto

Haces un grupo y le cambias a widget

Duplicas

haces una nueva capa dentro de la carpeta footer

Realizas un rectángulo

Seleccionas con control

luego selección + invertir

y presionas suprimir

el resultado esta en la imagen

Cambiar el fondo

para la parte de abajo del rectángulo

para la parte superior del rectángulo

Activas la opción invertir degradado

Agregan una sombra paralela

agregas un texto

Agregas lorem ipsum

recuerden auto para la separación entre lineas

Seleccionas estas dos capas

las agrupas y nombras este grupo

Extraes los iconos de redes sociales

estos iconos pueden descargar de iconspedia por ejemplo aunque los vas a encontrar en muchas pagina recuerda los tienes que guardar en recursos

observar que la licencia sea gratuita

los arrastras a Ps

Agrupas

y después para cada icono creas una carpeta

A cada icono le haces un texto

Haces el texto de la parte inferior debajo de todas las capas de

iconos

guardas