06. Herramienta de recorte y sector

<< / 5. / Herramientas para mover, medir y anotar _____ / 7. / Herramienta de retoque >>

cursos papel y web

6.1 Herramienta Recorte

Cursos / Photoshop básico / 06_Herramientas_Recorte_Sector / Recorte.jpg

Probamos los recortes, viendo que se pueden generar fotos del mismo tamaño y resolución, dando valores en los campos correspondientes, en la barrra de opciones. Si dejamos vacío uno de los campos de tamaño el programa buscará el dato para hacer la foto proporcional. Vemos también que podemos girar el recorte. Nos vamos ahora a abrir Recorte.jpg para ver en las opciones de herramienta el recorte en perspectiva, y arreglar las aberraciones ópticas producidas por la lente de la cámara.

cursos papel y web

6.2 Herramienta Sector

Cursos / Photoshop Básico / 06_Herramientas_Recorte_Sector /Sector_Machu_Picchu.jpg / Sector_Paracas.jpg / Sector_Selva.jpg

Desde Bridge abrimos las tres imágenes en Photoshop y seleccionamos Sector_Machu_Picchu.jpg para realizar prácticas. Los sectores nos ayudan a optimizar imágenes y hacer diseños en la web. Generamos varios sectores. Con la herramienta de selección de sectores hacemos doble clic en uno y abrimos las opciones de sector. No es una herramienta de retoque sino que nos va a permitir diseñar páginas web sin conocer html. Esto combinado con Fireworks y Dreamweaver nos va a permitir diseñar web profesionales.

cursos papel y web

6.3 Mini web

Cursos / Photoshop Básico / 06_Herramientas_Recorte_Sector / Sector_Machu_Picchu.jpg / Sector_Paracas.jpg / Sector_Selva.jpg

Vamos a hacer un pequeño ejercicio con varias de las herramientas que hemos utilizado hasta el momento. Abrimos las tres imágenespara realizar prácticas. Empezamos utilizando la herramienta de recorte para generar fotos de 200 x 200 px a 72 pp, que guardaremos como… en formato .png en una carpeta que llamaremos “Miniweb” dentro de la carpeta “06._Herramientas_Recorte_Sector” en nuestra carpeta del curso.

cursos papel y web

6.4 Ampliar lienzo

Cursos / Photoshop Básico / 06_Herramientas_Recorte_Sector / Miniweb / Sector_Machu_Picchu.png /

Imagen / Tamaño de lienzo ampliamos a 600 x 300 px desde el margen superior izquierdo.

cursos papel y web

6.5 Arrastrar imágenes

Cursos / Photoshop Básico / 06_Herramientas_Recorte_Sector / Miniweb /Sector_Machu_Picchu.png / Sector_Paracas.png / Sector_Selva.png

Vamos a Bridge en modo compacto, y sobre la imagen Sector_Machu_Picchu.png de 600 x 300 px. arrastramos Sector_Paracas.png y la colocamos en la posición X: 200 Y: 0, después arrastramos Sector_Selva.png y la colocamos en la posición X: 400 Y: 0

cursos papel y web

6.6 Crear los sectores

Creamos los sectores (200 x 200 px), uno por cada foto en formato de imagen, cada uno con su link a Wikipedia / Machu_Picchu / Paracas / Amazonas

Nombrando cada sector y ajustando sus tamaños y posiciones. Y otro sector más en la parte inferior en formato de texto para escribir (P.ejem: Probando los sectores, hemos creado tres sectores de imagen y aquí uno de texto.).

cursos papel y web

6.7 Guardar para la web

Una vez hecho esto Guardamos para la web como Miniweb.html en formato de HTML e imágenes y todos los sectores, generando todos los documentos necesarios. Guardamos también el documento Miniweb.psd dentro de Cursos / Photoshop Básico / 06_Herramientas_Recorte_Sector / Miniweb /

Siempre que hacemos una web tenemos que pensar primero lo que queremos. Este caso es muy sencillo.

Descarga las imágenes desde aquí

Descarga las imágenes / Recorte.jpg /  / Sector_Machu_Picchu.jpg / / Sector_Paracas.jpg / / Sector_Selva.jpg / guardalas en en tu disco duro dentro de Cursos / Photoshop básico / 06_Herramientas_Recorte_Sector /

Nota: Si es necesario crea las carpetas que necesites. Es muy importante mantener la estructura de carpetas que recomendamos en estos apuntes, para seguir el curso sin perdidas de tiempo adicionales.

Envia un comentario

Debes ser Conectado Para publicar un comentario.