Anda di halaman 1dari 40

SEMINARIO DE TRABAJO

Creación y diseño de blogs educativos

Materiales
complementarios

I.E.S. Victoria Kent – Fuenlabrada


Noviembre de 2008-Mayo-2009
Seminario de trabajo – Creación y diseño de blogs educativos

PowerPoint. Creación de presentaciones para el blog.

1.- Actividades a desarrollar

Actividad Nivel dificultad Página

¿Qué es PowerPoint? 1 sobre 10 130


Comenzar una presentación en blanco 1 sobre 10 130
Aplicar una plantilla de diseño 2 sobre 10 131
Añadir contenido a una diapositiva 3 sobre 10 132
Insertar un cuadro de texto 3 sobre 10 132
Añadir diapositivas a la presentación 3 sobre 10 133
Insertar sonidos a la presentación 5 sobre 10 134
Añadir texto desde un archivo 6 sobre 10 135
Completar la presentación 5 sobre 10 136
Insertar el número de diapositiva 3 sobre 10 138
Personalizar la presentación 6 sobre 10 138
Agregar transiciones 6 sobre 10 139
Animar texto y objetos 6 sobre 10 139
Formatos de archivos para guardar
4 sobre 10 141
presentaciones
Formato Presentación 4 sobre 10 141
Formato Presentación de PowerPoint 4 sobre 10 142
Formato de Página Web 4 sobre 10 142

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 1


Seminario de trabajo – Creación y diseño de blogs educativos

2.- ¿Qué es PowerPoint?


PowerPoint es una aplicación incluida en el paquete Microsoft Office, que permite
crear sencillas presentaciones o transparencias sobre cualquier idea en general. El
contenido de estas presentaciones puede variar desde un informe de desarrollo, recomendar
estrategias o ventas de productos, servicios o ideas, informes de capacitación o cualquier
otra idea de carácter general.

PowerPoint nos permite incluir en sus presentaciones imágenes (prediseñadas, desde


ficheros o a través de un escáner), gráficos (sectores, barras, bursátiles, etc...),
organigramas, así como sonidos y vídeos. Todo ello con la posibilidad de poder animarlo. El
límite, lo ponemos nosotros mismos.

Aprenderemos a incluir y utilizar cada uno de estos elementos mediante el desarrollo


de una presentación didáctica, constituida por una serie de diapositivas, en la que haremos
un breve recorrido por la vida y obra de una de los más grandes personajes de la historia:
Leonardo da Vinci.

3.- Primeros pasos con PowerPoint

3.1.- Comenzar una presentación en blanco

Veamos a continuación los primeros pasos que deberemos dar a la hora de


desarrollar una presentación en PowerPoint:

1º.- Abre la aplicación PowerPoint. Se muestra una


pantalla que nos da la opción de crear una
presentación nueva o abrir una ya existente.

2º.- Selecciona la opción Presentación en blanco y


haz clic en el botón Aceptar.

3º.- A continuación, mediante la ventana Nueva


diapositiva, PowerPoint nos solicita el formato de la
primera diapositiva a incluir en nuestra presentación.

4º.- Sel
ecciona la
opción En
Blanco y haz clic en el botón Aceptar,
para insertar una diapositiva en blanco
en la presentación.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 2


Seminario de trabajo – Creación y diseño de blogs educativos

5º.- Aparece la ventana de trabajo de PowerPoint, en la que podemos apreciar dos


partes bien diferenciadas.

En la parte izquierda se muestra un esquema con cada una de las diapositivas


que contiene nuestra presentación

A la derecha, se encuentra la zona de trabajo donde se muestra la diapositiva en


la cual estamos trabajando

Esquema de Zona de trabajo


diapositivas

3.2.- Aplicar una plantilla de diseño

La diapositiva que acabamos de crear se encuentra en blanco, antes de incluir texto e


imágenes en la misma, estableceremos un estilo de diseño para la misma.

1º.- Abre el menú Formato y selecciona la opción Aplicar plantilla de diseño...

2º.- Aparece una ventana


que nos muestra los
distintos diseño de
diapositiva que nos ofrece
PowerPoint.

3º.- Selecciona la opción


Cuaderno.pot y haz clic en
el botón Aplicar.

4º.- Podrás observar


como la dispositiva que

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 3


Seminario de trabajo – Creación y diseño de blogs educativos

anteriormente se encontraba en blanco, ahora ha adquirido el formato de la plantilla


especificada.

4.- Añadir contenido a una diapositiva


Dedicaremos los siguientes capítulos a confeccionar las distintas diapositivas que
constituyen nuestra presentación, para ello PowerPoint nos ofrece la posibilidad de insertar
en la misma una serie de objetos: cuadros de texto, imágenes, sonidos, videos, gráficos,
hipervínculos y tablas.

4.1.- Insertar un cuadro de texto

1º.- Abre el menú Insertar y selecciona la opción cuadro de texto.

2º.- Haz clic con el ratón en cualquier parte de la diapositiva y escribe el siguiente
texto: Leonardo da Vinci. Pulsa la tecla Enter y ahora escribe: Vida y obra.

3º.- Selecciona el texto que acabas de introducir y establece el siguiente formato


para el mismo:

 Fuente: Times New


Roman
 Tamaño: 44
 Alineación: derecha
 Negrita, cursiva,
subrayado y sombra
de texto.

4º.- Abre el menú


Insertar, selecciona Imagen
y haz clic en la opción
Imagen desde archivo...

5º.- Selecciona el archivo


de imagen “Leonardo da Vinci.gif”. Haz clic en el botón Insertar.

6º.- Repite los dos pasos anteriores para insertar la imagen situada en el archivo:
“Proyecto de un carro de combate.jpg”

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 4


Seminario de trabajo – Creación y diseño de blogs educativos

7º.- Cambia el tamaño y la ubicación de los elementos insertados en la diapositiva


hasta obtener una composición como la mostrada a continuación.

4.2.- Añadir diapositivas a la presentación

1º.- Abre el menú Insertar y haz clic en la opción Nueva diapositiva...

2º.- Elige el autodiseño Lista con viñetas y


haz clic en el botón Aceptar.

3º.- Para establecer un título en la


diapositiva pincha con el ratón en el
cuadro de texto que contiene la
leyenda: “Haga clic para agregar
título”.

4º.- Escribe el siguiente texto: Introducción.

5º.- A continuación haz clic en el interior de cuadro que posee el rótulo: “Haga clic para
agregar texto”.

6º.- Selecciona un tamaño para el texto de 18 unidades y escribe la siguiente frase:


Leonardo da Vinci (1452-1519), artista florentino y uno de los grandes maestros del renacimiento,
famoso como pintor, escultor, arquitecto, ingeniero y científico.

7º.- A continuación pulsa la tecla Enter y escribe el siguiente texto: Sus innovaciones en el
campo de la pintura determinaron la evolución del arte italiano durante más de un siglo después de su
muerte.

8º.- Por último, pulsa la tecla Enter e introduce el siguiente rótulo: Sus investigaciones
científicas —sobre todo en las áreas de anatomía, óptica e hidráulica— anticiparon muchos de los
avances de la ciencia moderna.

9º.- Selecciona las tres líneas de texto que acabas de


introducir y abre el menú Formato. Haz clic en la opción

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 5


Seminario de trabajo – Creación y diseño de blogs educativos

Interlineado... Aparecerá la ventana que nos permite establecer el espacio entre


líneas y párrafos.

10º.- Abre la lista desplegable del apartado Después del párrafo y activa la opción Líneas.

11º.- Establece, en el mismo apartado, una distancia entre párrafos de 2 líneas. Haz clic
en el botón Aceptar.

12º.- Inserta las imágenes


que se encuentran en
los archivos “La
Virgen del clavel.jpg”
y “Dibujo

Anatómico.jpg”

13º.- Cambia el tamaño y la ubicación de las imágenes insertadas hasta conseguir un


resultado similar al mostrado en la figura.

Recuerda: que es importante guardar cada cierto tiempo el trabajo realizado. Para ello, abre
el menú Archivo, escoge la opción Guardar y sigue las instrucciones de PowerPoint.

NOTA: puedes ver el resultado, en pantalla completa, del trabajo realizado hasta el
momento abriendo el menú Presentación y seleccionando la opción Ver
presentación o pulsando la tecla F5. Puedes moverte de una diapositiva a la
siguiente o la anterior mediante las flechas derecha e izquierda respectivamente.
Para salir de la presentación pulsa la tecla Esc.

4.3.- Insertar sonidos a la presentación

PowerPoint nos permite incluir distintos sonidos en cada una de las diapositivas o
añadir archivos de música que puedan ser reproducidos a lo largo de la presentación.

1º.- Haz clic en la dispositiva nº 1 de la ventana de esquema de diapositivas para


activarla.

2º.- Abre el menú Insertar, selecciona el apartado


Películas y Sonido y haz clic en la opción Sonido de
archivo...

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 6


Seminario de trabajo – Creación y diseño de blogs educativos

3º.- Selecciona el archivo “La mañana.mp3” y haz clic en el botón Aceptar.

4º.- A continuación nos preguntan si deseamos que el sonido


se reproduzca automáticamente en lugar de tener que
hacer clic en él, durante la presentación.

5º.- Haz clic en el botón Sí.

6º.- Ejecuta la presentación pulsando la tecla F5 y comprueba como el archivo de música


que acabas de insertar se reproduce de forma automática mientras sea mostrada la
primera diapositiva.

7º.- Con el icono seleccionado, correspondiente al sonido que acabas de incluir, abre
el menú Presentación y haz clic en la opción Personalizar animación...

8º.- Abre la pestaña Configuración


de multimedia y en el
apartado Al reproducir:
selecciona la opción
Continuar la presentación.

9º.- En el apartado Detener la


reproducción:, establece que
ésta se detenga Después de
15 diapositivas. De esta
manera la música continuará
sonando durante toda la
presentación.

10º.- Haz clic en el botón Más opciones..., aparecerá el


cuadro de diálogo Opciones de sonido.

11º.- Marca la opción Repetir la reproducción hasta su


interrupción y haz clic en el botón Aceptar. Con este
paso establecemos una reproducción continua del
archivo de sonido, es decir, una vez que termina vuelve a comenzar su ejecución.

12º.- Marca la opción Ocultar con reproducción detenida, de este modo el icono con el
altavoz que representa al sonido insertado no aparecerá en la diapositiva durante la
presentación.

13º.- Por último haz clic en el botón Aceptar de la ventana Personalizar Animación.

14º.- Pulsa F5 para lanzar la presentación y comprueba los resultados.

4.4.- Añadir texto desde un archivo

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 7


Seminario de trabajo – Creación y diseño de blogs educativos

A continuación añadiremos una nueva diapositiva a la que añadiremos el texto que se


encuentra en un documento de Word.

1º.- Abre el menú Insertar y haz clic en la línea Nueva diapositiva...

2º.- En la ventana Nueva diapositiva escoge el autodiseño Lista con viñetas y haz clic
en el botón Aceptar.

3º.- A continuación haz clic en el interior de cuadro que contiene el rótulo: “Haga clic para
agregar título” y escribe: Los comienzos en Florencia.

4º.- Ahora inicia la aplicación Word y abre el archivo “Comienzos en Florencia.doc”.

5º.- Selecciona todo el texto que aparece en dicho archivo y cópialo en el portapapeles
(Edición / Copiar).

6º.- Cierra el procesador de texto Word y retorna a PowerPoint.

7º.- Selecciona el cuadro con el título “Haga clic para agregar texto”.

8º.- Abre el menú Edición y selecciona la opción Pegar, de esta forma insertamos en la
nueva diapositiva el contenido del portapapeles.

9º.- Muy posiblemente el texto insertado, debido al tamaño de fuente, salga fuera de los
límites de la diapositiva. Selecciona todo el texto que acabas de insertar y establece
un tamaño de fuente de 14.

10º.- Adapta las dimensiones del cuadro al nuevo tamaño del texto.

11º.- Añade a la diapositiva las imágenes contenidas en los siguientes archivos:

 “Adoración de los magos.jpg”


 “San Jerónimo.jpg”
 “Retrato de Ginevra Venci.jpg”

12º.- Cambia el tamaño y la ubicación de las tres imágenes insertadas hasta obtener una
diapositiva similar a la mostrada a continuación.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 8


Seminario de trabajo – Creación y diseño de blogs educativos

4.5.- Completar la presentación

Si sigues los pasos apuntados en los ejercicios anteriores podrás completar la


presentación con las cuatro nuevas diapositivas que se muestran a continuación. Todas
ellas se pueden elaborar a partir del autodiseño Lista con viñetas. Se indica, además, los
archivos que son necesarios para la composición de las mismas.

Diapositiva nº 4

Texto: “Los años en Milán.doc”


Imágenes: “La última cena.jpg” y “La
Virgen de las rocas, (María con el niño,
San Juan Bautista y un ángel).jpg”

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 9


Seminario de trabajo – Creación y diseño de blogs educativos

Diapositiva nº 5

Texto: “Retorno a Florencia.doc”


Imagen: “La Mona Lisa.jpg”

Diapositiva nº 6

Texto: “Última etapa de su


trayectoria.doc”
Imágenes: “Dibujo de un ingenio para
volar.jpg”, “Carro de combate con hoces
móviles.jpg” y “Santa Ana, la Virgen y el
Niño.jpg”

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 10


Seminario de trabajo – Creación y diseño de blogs educativos

Diapositiva nº 7

Texto: “Proyectos científicos y


teóricos.doc”
Imágenes: “El hombre de Vitrubio.jpg”,
“Estudio de piernas y pata de
caballo.jpg” y “ballesta.gif”

4.6.- Insertar el número de diapositiva

Veamos a continuación los pasos a seguir para numerar las diapositivas de nuestra
presentación.

1º.- Abre el menú Ver y


selecciona la opción
Encabezado y pie de
página.

2º.- Surge la ventana


Encabezado y pie de
página, en la que
debemos abrir la ficha
Diapositiva.

3º.- Activa la casilla de


verificación Número de
diapositiva.

4º.- Haz clic en el botón Aplicar a todas.

NOTA: observa que mediante los pasos anteriores también se podría haber incluido en
cada una de las diapositivas tanto la hora y la fecha, como un pie de página.

5.- Personalizar la presentación


Cuando una presentación es ejecutada, el contenido de cada una de las diapositivas
es mostrado de manera inmediata. En los siguientes ejercicios se indicarán los pasos a

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 11


Seminario de trabajo – Creación y diseño de blogs educativos

seguir para personalizar nuestra presentación, incluyendo algunos efectos en las


transiciones entre diapositivas. Además, es posible establecer que durante la presentación el
contenido de las diapositivas vaya apareciendo poco a poco hasta componer la diapositiva,
pudiéndose añadir algunos efectos especiales en la aparición de dichos contenidos.

5.1.- Agregar transiciones

Una transición es un efecto especial usado para visualizar una nueva diapositiva
durante la presentación. Por ejemplo, puedes hacer aparecer la diapositiva con un efecto de
persiana, con un desvanecimiento en negro, etc. Cada diapositiva puede tener una
transición diferente.

1º.- Selecciona la diapositiva nº 1

2º.- Abre el menú Presentación y haz clic en la


línea Transición de diapositiva...

3º.- En la ventana Transición de diapositiva abre


la lista desplegable que se encuentra dentro
del marco Efecto.

4º.- Selecciona la opción Cuadros bicolores


hacia abajo.

5º.- Activa el botón de opción Lenta, para disminuir la velocidad de la transición.

6º.- Abre la lista desplegable Sonido y elige Aplauso.

7º.- Por último, haz clic en el botón Aceptar y comprueba los resultados lanzando la
presentación pulsando la tecla F5.

8º.- Repite los pasos anteriores para establecer la transición que desees al resto de
diapositivas.

5.2.- Animar texto y objetos

Se pueden aplicar efectos de progresión al texto, gráficos u otros objetos que pueden
estar en la diapositiva de forma individual, para llamar la atención de la audiencia. Por
ejemplo, que cada viñeta principal aparezca con independencia de las demás o que el texto
aparezca con palabras o letra a letra.

1º.- Selecciona la diapositiva nº 5


(Retorno a Florencia).

2º.- Abre el menú Presentación y


haz clic en la línea
Personalizar animación...

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 12


Seminario de trabajo – Creación y diseño de blogs educativos

3º.- En la ventana Personalizar animación muestra la ficha Efectos.

4º.- El cuadro que aparece debajo del texto Animar objetos en la diapositiva:, nos
muestra los objetos que componen la misma.

5º.- Activa la casilla de verificación que aparece a la izquierda del objeto Título 1.

6º.- Abre la lista desplegable que aparece a la izquierda en el marco Animación y sonido
de entrada, y selecciona la opción Volar.

7º.- En la lista que encontramos a la derecha en dicho cuadro escoge la línea Desde la
derecha y arriba.

8º.- Abre la lista desplegable situada en el apartado Introducir texto y elige la opción Por
letra.

9º.- Haz clic en el botón Vista


previa para comprobar el
resultado de los efectos
introducidos.

10º.- A continuación activa la


casilla de verificación
situada a la izquierda del
objeto Texto 2.

11º.- Repite los pasos anteriores


para establecer las
siguientes opciones:
Arrastrar, Desde la derecha
y Todo de una vez.

12º.- Por último, activa la casilla de verificación Marco de imagen 3.

13º.- Establece el valor Espiral, en la lista situada a la izquierda del apartado Animación
y sonido de entrada.

14º.- Ahora muestra la ficha


Orden e intervalos, en la
cual podemos establecer el
orden en el que van a
aparecer los objetos en
pantalla.

15º.- En el cuadro Orden de


animación haz clic en la
línea Título 1.

16º.- En el apartado Iniciar


animación marca el botón

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 13


Seminario de trabajo – Creación y diseño de blogs educativos

de opción Automáticamente,

17º.- Como puedes observar, además se puede establecer el tiempo de transición de un


objeto al siguiente, en este caso dejaremos el valor por defecto, es decir, 0
segundos.

18º.- Repite el paso 16 con los dos objetos restantes.

19º.- Por último, haz clic en el botón Aceptar y comprueba los cambios efectuados
ejecutando la presentación.

20º.- Repite los pasos anteriores para animar el texto y las imágenes del resto de
diapositivas.

6.- Formatos de archivos para guardar presentaciones


A la hora de guardar cualquier presentación, PowerPoint ofrece varias posibilidades
que se resumen en la siguiente tabla:

Guardar como Extensión Utilice para guardar

Presentación .ppt Una presentación típica de PowerPoint

Metarchivo de Windows .wmf Una diapositiva como gráfico

Formato de intercambio de .gif Una diapositiva como gráfico para utilizar


gráficos GIF en páginas Web

Formato de intercambio de .jpg Una diapositiva como gráfico para utilizar


archivos JPEG en páginas Web

Formato de gráficos de red .png Una diapositiva como gráfico para utilizar
portátiles PNG en páginas Web

Esquema/RTF .rtf Un esquema de presentación como


presentación

Plantilla de diseño .pot Una presentación como plantilla

Presentación de PowerPoint .pps Una presentación que siempre se abra


como una presentación con diapositivas

Página Web .htm Una presentación que se abre en un


explorador de Web.

6.1.- Formato Presentación

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 14


Seminario de trabajo – Creación y diseño de blogs educativos

Cuando deseamos guardar una determinada presentación para posteriormente seguir


trabajando en la misma, añadiendo nuevas diapositivas, eliminar o modificar cualquiera de
las existentes, etc., se deberán emplear el formato Presentación con extensión ppt.

1º.- Abre el menú Archivo y


elige la opción Guardar
como...

2º.- En la lista desplegable


Guardar como tipo:
selecciona el formato
Presentación (*.ppt).

3º.- En la caja de texto Nombre


de archivo: escribe
Leonardo Da Vinci.

4º.- Selecciona la carpeta en la


cual deseas guardar la presentación.

5º.- Haz clic en el botón Guardar. En el caso de que ya existiera un archivo con el mismo
nombre, nos preguntarían si queremos reemplazarlo, en este caso la respuesta es Sí.

6.2.- Formato Presentación de PowerPoint

Mediante este formato se puede crear un archivo de presentación ejecutable que


podemos lanzar en cualquier ordenador que tenga instalado Microsoft Office, sin necesidad
de abrir dicho archivo mediante PowerPoint, bastaría con hacer doble clic sobre el mismo.
Otra ventaja sería la imposibilidad de modificar las presentaciones, guardadas mediante este
formato, por parte de cualquier usuario.

De esta manera nuestros trabajos pueden ser guardados en un disquete o CD-Rom y


ejecutados en cualquier ordenador, simplemente abriendo el Explorador de Windows,
localizando dicho archivo y haciendo doble clic en el mismo.

1º.- Selecciona la línea Guardar


como... en el menú
Archivo.

2º.- En la lista desplegable


Guardar como tipo:
escoge la opción
Presentación con
diapositivas de PowerPoint
(*.pps).

3º.- En al cuadro de texto


Nombre de archivo: escribe
Leonardo Da Vinci

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 15


Seminario de trabajo – Creación y diseño de blogs educativos

4º.- Selecciona al carpeta en la que deseas guardar el archivo.

5º.- Haz clic en el botón Guardar.

6º.- A continuación, abre el Explorador de Windows y localiza el archivo “Leonardo Da


Vinci.pps”. Por último haz doble clic sobre él.

6.3.- Formato de página Web

En el caso de que deseemos publicar nuestra presentación en Internet, se nos ofrece


la posibilidad de guardar la misma en Formato de Página Web (.htm).

1º.- Abre el menú Archivo y selecciona la opción Guardar como...

2º.- En la lista desplegable Guardar como tipo: elige la opción Página Web (*.htm;
*.html)

3º.- En el cuadro de texto Nombre de archivo escribe Leonardo Da Vinci

4º.- Haz clic en el botón Cambiar título...

5º.- Aparece una ventana en la que podemos cambiar el título de la página web. Escribe
como título Leonardo Da Vinci, Vida y obra. Haz clic en el botón Aceptar.

6º.- Selecciona la carpeta en la


cual vas a guardar el
archivo y haz clic en el
botón Guardar.

7º.- Abre el Explorador de


Windows, localiza el archivo
“Leonardo Da Vinci.htm” y
haz doble clic sobre él.
Podrás comprobar cómo se
ha creado una página Web
en la que es posible
navegar a través de las
diapositivas de la
presentación.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 16


Seminario de trabajo – Creación y diseño de blogs educativos

PhotoShop. Tratamiento de imágenes.


11..-- IInnttrroodduucccciióónn

La definición más común de Photoshop es la de aplicación de retoque fotográfico. Sin


embargo en muy pocas ocasiones haremos referencia a fotografías ya que en su lugar
utilizaremos al palabra imágenes. El motivo es que es ésta última la que hace referencia a
los sistemas digitales de tratamiento para los que está diseñada la herramienta.

1.1.- Tipos de imágenes

A la hora de representar el contenido de una imagen existen básicamente dos


métodos que a su vez nos sirve para dividir las imágenes en dos grandes grupos:

Mapa de bits: el contenido se representa mediante pequeños puntos rectangulares


denominados píxeles. Se debe tener en cuenta que un píxel es la unidad mínima a
partir de la cual se forma cualquier imagen. Para la representación de un píxel se
puede utilizar 1 bit, 2 bits, 4 bits... de información. Este valor determinará el número
de colores que puede representar dicho píxel.

Gráficos vectoriales: cada uno de los elementos que componen la imagen son
tratados como objetos y sus propiedades se definen mediante fórmulas matemáticas.

Photoshop es una aplicación especializada en el tratamiento de imágenes en mapa


de bits.

1.2.- Formatos de mapas de bits

Dentro del ámbito de las imágenes en formato mapa de bits, la descripción de los
formatos más utilizados sería la siguiente:

BMP: diseñado por Microsoft para ser utilizado en sus aplicaciones Paint y
PaintBrush.

TIFF: desarrollado por Aldus para homogeneizar los formatos de imágenes digitales.

TGA, PCX: también son modelos de mapa de bits, pero menos conocidos y utilizados
que los anteriores.

GIF: acrónimo de Graphics Interchange Format. Formato gráfico usado en Internet


debido a su alto grado de compresión, lo que permite mejorar la trasnferencia de
archivos. Destacamos algunas de sus características más importantes:

 Número máximo de colores: 256


 Permite definir determinados píxeles como transparentes

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 17


Seminario de trabajo – Creación y diseño de blogs educativos

 Ofrece la posibilidad de incluir varias imágenes dentro de un mismo archivo


permitiendo así la creación de animaciones.

JPEG: las siglas corresponden a Join Photographic Expert Group y sus principales
propiedades son las siguientes:

 Admite color de 24 bits, permitiendo representar fotografías e imágenes de gran


calidad.
 Se puede definir el grado de compresión que deseamos aplicar.
 No admite transparencias.

1.3.- Ventana de Photoshop

Con la idea de ir familiarizándonos con los distintos elementos que conforma el


entorno del programa, se muestra a continuación la ventana principal de Photoshop, en la
que se han señalado cada uno de los componentes que podemos encontrar en la misma:

Barra de menús Paleta de herramientas Ventana de trabajo Barra de opciones de herramienta

Barra de estado Paletas de propiedades

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 18


Seminario de trabajo – Creación y diseño de blogs educativos

P
PRRÁ
ÁCCTTIIC
CAAN
Nºº 11:: TTrraazzaaddoo ddee ttrriiáánngguullooss
1º.- Abre un documento nuevo con un tamaño de 300 x 300 píxeles.

2º.- En la barra vertical del lado izquierdo de tu pantalla


veras un icono como en la imagen. Si no lo tienes
presionando y sin soltar el botón del mouse, veras un
sub-menú. Arrastrando mueve el mouse hacia el icono de
la línea inclinada.

3º.- Presiona dando doble clic sobre la línea inclinada, y


veras una ventana como la de la imagen. Modifica tu
ventana con las misma opciones y presiona (Shape...).

4º.- Entonces veras esta ventana.


Sitúa en ella los mismos valores
que los mostrados.

5º.- Ahora, presionando la tecla (Shift) en tu área de trabajo dibuja


el triangulo pero sin la parte adicional de la cola. Para modificar
el triangulo modifica (Width y Length) dependiendo del tipo de triangulo o tamaño que
quieras.

A continuación utilizaremos la herramienta de borrado para eliminar parte de los


triángulos que hemos dibujado.

1º.- En la barra vertical del lado izquierdo de tu pantallas vera un icono como
el que se muestra en la imagen, Haz clic en el mismo
para seleccionarlo.

2º.- Abre la lista desplegable de pinceles y selecciona un


tamaño adecuado.

3º.- Ahora mantén presionado el botón del ratón mientras borras tu objeto

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 19


Seminario de trabajo – Creación y diseño de blogs educativos

PRÁCTICA Nº 2: Flechas y triángulos con Photoshop

1. Abrimos un nuevo documento donde trabajaremos las distintas formas de flechas que podemos utilizar

2. Hacemos clic en la herramienta Línea. Mostramos la ventana herramienta de Línea (hacemos doble clic sobre la
herramienta Línea). Colocamos los parámetros como se muestran en la imagen inferior.

3. Hacemos clic en el botón forma y aplicamos los parámetros que se observan en la imagen inferior.

4. Hacemos clic en ok y arrastramos el cursor sobre nuestro documento y ya tendremos creada la flecha. Si variamos los
parámetros de grosor, anchura, longitud y concavidad podremos conseguir todos los tipos de flechas que deseemos.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 20


Seminario de trabajo – Creación y diseño de blogs educativos

5. Si queremos podremos adornar estas flechas aplicándoles efectos de relieve.

6. Si lo que necesitamos es un triángulo y no una flecha procederemos de la siguiente forma. Seleccionando la punta de
flecha del tamaño que deseemos que sea nuestro triángulo, arrastraremos lo suficiente para que se dibuje la punta de
flecha pero no seguiremos arrastrando y de esta forma sólo dibujaremos un triángulo. Incluso podemos construirnos un
botón con forma triangular. Observa los resultados en la imagen inferior.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 21


Seminario de trabajo – Creación y diseño de blogs educativos

P
PRRÁ
ÁCCTTIIC
CAAN
Nºº 33:: D
Deeggrraaddaaddooss
Un degradado no es más que la aplicación de una serie de colores en un área
determinada de la imagen, siguiendo un dirección predefinida.

1º.- Abre un documento nuevo con un tamaño de 300 x 300 píxeles.

2º.- En la paleta de herramientas, selecciona el icono que permite


realizar degradados tal y como aparece en la imagen.

3º.- Para dibujar un degradado, basta con arrastrar el ratón,


manteniendo el botón izquierdo pulsado, desde un lugar a otro del
área de trabajo.

4º.- Experimenta con los distintos tipos de degradado que ofrece


Photoshop.

Lineal : Crea una degradación en forma lineal en el area de trabajo.

Radial : Crea una degradación en forma radial en el area de trabajo.

Angular : Crea una degradación en forma angular en el area de trabajo.

Reflectiva : Crea una degradación en reflectiva en el area de trabajo.

Diamante : Crea una degradación en forma de diamante en el area de trabajo.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 22


Seminario de trabajo – Creación y diseño de blogs educativos

PRÁCTICA Nº 4: creación de un botón con la herramienta


degradado

Crea una nueva área de trabajo


de acuerdo al tamaño que
desees tu botón y usando la
herramienta ( ) y manteniendo
presionada la tecla Shift
presionada crea un circulo

Selecciona los colores que


desees usar selecciona un tono
mas claro que el otro para un
mejor resultado ( ).

Usando la herramienta ( )
rellena la selección
diagonalmente de la parte
superior izquierda a la parte
inferior derecha

Reduce la selección por 3 pixeles


Select> Modify> Contract y
selecciona 3.

Crea una nueva capa Layer>


New> Layer

Usando la herramienta ( )
rellena la selección
diagonalmente de la parte inferior
derecha a la parte superior
izquierda

Elimina la selección Control + D

Por ultimo puedes agregarle


texto a tu botón.

Intenta realizar un botón con


forma rectangular

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 23


Seminario de trabajo – Creación y diseño de blogs educativos

PRÁCTICA Nº 5: Texto con bordes


Con frecuencia necesitaremos incluir pequeños fragmentos de texto en nuestros
proyectos de diseño. Para incluir cualquier palabra o frase dentro de una imagen, el única
método posible dentro de Photoshop es utilizar la herramienta Texto.

1º.- Abre un documento nuevo con un tamaño de 300 x 300


píxeles.

2º.- Crea cualquier texto que desees usando la herramienta ( )

3º.- Selecciona el texto manteniendo presionada la tecla Control mientras haces clic en la
Capa (Layer) de texto que acabas de crear.

4º.- Expande la selección, Select> Modify> Expand, usa 3


píxeles. Selecciona otro color que desees o puedes usar el
mismo ( ).

5º.- Crea una nueva capa (Layer) Layer > New > Layer, asignando el nombre Borde a la
misma.

6º.- Crea un borde de un pixel, Edit >


Stroke quita la selección Select >
Deselect.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 24


Seminario de trabajo – Creación y diseño de blogs educativos

PRÁCTICA Nº 6: La varita mágica


La Varita mágica es una herramienta imprescindible a la hora de realizar selecciones.
Su ventaja con respecto a las demás es la posibilidad de seleccionar áreas similares de
forma automática. La forma de trabajar con esta herramienta es bastante sencilla, basta con
seleccionarla y hacer clic sobre el color que se desea usar como base para la selección.

Podemos comparas las capas de Photoshop con finas películas de papel


transparente superpuestas en las que vamos dibujando y situando los distintos elementos
que componen la imagen. Se debe tener en cuenta que el orden de apilado de las distintas
capas resulta determinantes en el aspecto final de la imagen. Una capa es, a su vez, una
imagen con una serie de propiedades y características propias.

1º.- Abre la imagen Explorador.gif


2º.- Selecciona en la paleta de herramientas el elemento varita

mágica

3º.- En la caja de opciones de herramientas (si no la ve, haga


Ventana>>Mostrar opciones) introducimos un valor de
tolerancia de 32.La tolerancia, puede ser un valor entre 0 y
255. Introduzca un valor bajo para seleccionar colores muy
parecidos al del píxel en el que va a hacer clic o un valor
superior para seleccionar una gama de colores más extensa.
Cuanta mas tolerancia mas grande será la selección que se
produzca.

4º.- Teniendo seleccionada la herramienta varita mágica, haz clic


en el fondo de la imagen para seleccionarlo.

5º.- Si suprime (pulsando SUPR) en este momento el fondo


seleccionado se borrará en el color que tenga elegido como de fondo (blanco en el
ejemplo). Esto pasa siempre que se suprime algo en la capa de fondo. Como lo que
queremos es hacer desaparecer el fondo, esto es hacerlo transparente, debemos
antes transformar la capa de fondo en una capa normal.

6º.- Haga doble-clic en la capa de fondo (sobre la paleta de capas).


Obtendrás el dialogo de hacer capa. Simplemente pulsa OK. Con
esto la capa de fondo ya es una capa normal. Ahora si que ya
puedes pulsar SUPR. Finalmente nos deshacemos de la selección
Selección >>deseleccionar.

7º.- A continuación añadiremos un fondo que simula un muro de


ladrillos.

8º.- Abre la imagen Ladrillos.gif

9º.- Selecciona toda la imagen haciendo clic en Selección>>Todo


(CTRL+A).

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 25


Seminario de trabajo – Creación y diseño de blogs educativos

10º.- A continuación la definimos como un


motivo de relleno. Abre el menú Edición y
elige la opción Definir motivo...

11º.- Surge la ventana que nos permite dar un nombre al nuevo motivo. Asigna el
nombre Ladrillos y haz clic en el botón OK.

12º.- Ahora volvemos a la imagen del explorador. Creamos una nueva capa usando
el botón de la paleta de capas, asignándole el nombre Fondo.

13º.- En el panel Capas debes arrastrar la nueva


capa creada a la parte inferior del mismo, de manera
que la nueva capa Fondo se encuentre por detrás de
la imagen del explorador.

14º.- Finalmente abre el menú Edición y elige la


opción Rellenar...

15º.- Abre la lista deplegable Contenido y


selecciona la línea Motivo. Abre la lista desplegable
Motivo personalizado y elige el relleno que acabas de crear. Haz clic en el botó OK.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 26


Seminario de trabajo – Creación y diseño de blogs educativos

PRÁCTICA Nº 7: crear la textura de la madera


Un filtro permite aplicar diferentes variaciones sobre una imagen con el fin de
conseguir un efecto determinado, o del mismo modo, utilizar diferentes factores de
corrección sobre algún parámetro de la misma. Existen filtros para todos los gustos,
necesidades y situaciones.

Comenzamos con una imagen de 130x130


pixels y la rellenamos de color marrón.

A continuación vamos a
filtro/ruido/añadir ruido
filter/noise/add noise , y le
ponemos un valor de 50 con las
opciones gausiana y
monocromático seleccionadas

filtro/desenforcar/desenfoque de
movimiento filter/blur/motion blur, y le
ponemos un valor de 999.

Para darle un toque extra de realismo


añadimos un poco más de ruido,
filtro/ruido/añadir ruido filter/noise/add noise
con un valor de 8.
¡Madera digital, cuida la naturaleza, salvemos el
planeta!

PROPUESTA 1: crea varios nudos en la madera seleccionando


varias zonas de la imagen en forma de elipse y utilizando el filtro
......."Filtro / Distorsionar / Coordenadas Polares"

PROPUESTA 2: crea un motivo de relleno personalizado con la textura recién creada. Utiliza
dicho relleno para crear un texto que posea textura de madera.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 27


Seminario de trabajo – Creación y diseño de blogs educativos

PRÁCTICA Nº 8: esfera de madera

1 ESFERAS CON TEXTURAS


Para empezar hay que crear un documento nuevo en RGB. Lo primero
que necesitamos es una selección circular, por lo tanto, crea un nuevo
capa (o layer) en Capa / Nuevo / Capa... (Layer / New / Layer...) y
presionando ENTER o presionando el icono de nuevo layer ( ). Con la
selección circular y presionando SHIFT crea la selección...

2 Paso seguido deberás llenar esta selección con la textura que


quieras. Puedes hacer esto abriendo al archivo con la textura deseada.
Elige toda la imagen (CTRL+A) y defínela como un patrón (Edit / Define
Pattern). Ahora, haciendo click sobre el nuevo layer y con la selección
activada, presionar SHIFT+F5 y cambiar la opción Foreground Color
por Pattern. Debería quedar algo como la imagen de la izquierda.

3 Sin deseleccionar la imagen todavía, elige Filtro / Distorsionar /


Esfericar (Filter / Distort / Spherize) y aplícalo al 100% de cantidad y
que el modo sea Normal.

4 Siempre sin sacar la selección, creamos ahora una nueva capa,


haciendo click en el icono correspondiente. Elegimos los colores por
defecto de Photoshop (blanco y negro) presionando la tecla D y luego
los invertimos (tecla X )para que el color de frente sea blanco y el de
fondo sea negro.
Ahora, elegimos la herramienta de degradado, seleccionamos Radial
como el Tipo. Hacemos click en la parte superior izquierda y
arrastramos y soltamos hasta la parte inferior derecha de la selección.
Aparecerá una esfera como la del ejemplo sobre la esfera texturada

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 28


Seminario de trabajo – Creación y diseño de blogs educativos

5 Y ahora es dónde viene el truquito de todo esto. En la ventana de


Capas van a poder ver un pequeño menú desplegable que,
normalmente, debe estar diciendo Normal. Hacemos click en la
pequeña flechita para despliega el menú.
Lo que aparece es una lista de los modos de mezcla que tienen los
Capa. Elegimos Luz Intensa (Hard Light) para que la esfera texturada
se pueda ver a través de la esfera con gradiente.

6 ¡Y Listo! Ahora solo queda probar con diferentes texturas y modos


de mezcla, como Multiplicar, Sobreexponer, Direferencia,... (Multiply,
Overlay o Difference…)

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 29


Seminario de trabajo – Creación y diseño de blogs educativos

P R Á C TI C A N º 9 : m e z c l a r d os i m á ge ne s
El uso de máscaras amplía enormemente las posibilidades en el tratamiento de zonas
opacas y transparentes dentro de una capa. En general, se utilizan mucho en trabajos de
diseño para crear seductores efectos de transición y resultan esenciales en la composición
de imágenes.

Las máscaras son elementos asociados a las capas y por lo tanto, para su uso
deberemos recurrir a la paleta Capas. Al utilizar máscaras, únicamente necesitaremos
utilizar dos colores, el negro y el blanco. El primero para generar transparencias y el blanco
para crear opacidad.

1 El primer paso es abrir la primera imagen (Mezcla2.gif),


seleccionarla completamente (CTRL+A) y copiarla al Portapapeles
(CTRL+C).

2 Luego hay que abrir la segunda imagen (Mezcla1.gif). Es preferible


que por cuestiones de facilidad, ambas imágenes sean de igual
tamaño, aunque el truco funcione correctamente con imágenes de
distintos tamaños, siempre fundiendo la imagen más pequeña sobre la
más grande. .

3 Hacemos luego clic en el botón de Máscara Rápida, o presionamos


la Tecla Q. Elegimos los colores predeterminados (Tecla D) y luego
tomamos la herramienta de degradado y la aplicamos de izquierda a
derecha. Como estamos en el modo de máscara rápida, el color blanco
se verá transparente y el color negro se verá rojo. Mientras más roja se
vea la imagen, menos se verá la otra imagen a través de la primera.

4 Volvemos al modo normal, pulsando nuevamente la tecla q y


veremos un cuadro de selección que cubre aproximadamente la mitad
de la imagen. Ahora simplemente pegamos la primera imagen usando
Edición / Pegar dentro (Edit / Paste Into). Al hacer esto la primer
imagen se pega sobre la primera produciendo el efecto de transición
entre una y otra.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 30


Seminario de trabajo – Creación y diseño de blogs educativos

PRÁCTICA Nº 10: montar dos fotos

1º.- Abre la imagen “GrupoPersonas.gif”: Archivo / Abrir


(File> Open).
2º.- Ahora utilizando la varita mágica selecciona el fondo de
la foto. Manteniendo pulsada la tecla Mayúsculas (Shift)
y haciendo clic al mismo tiempo con la varita mágica
conseguirás que varias selecciones se mantengan
unidas).
3º.- Ahora ve a Selección > Invertir (Select> Inverse) para
invertir la selección y copialo Edición > Copiar Edit>
Copy.

4º.- Abre el fondo al que deseas agregarle esta foto, en este


caso el archivo “EntradaMetro.gif”, y pega la foto anterior,
Edición < Pegar (Edit > Paste).
5º.- Para posicionar la foto en el lugar que deseas utiliza la
herramienta Mover .

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 31


Seminario de trabajo – Creación y diseño de blogs educativos

PRÁCTICA Nº 11: texto de mercurio


Como ya sabemos, cada uno de los modos de color utiliza combinaciones de colores
básicos para generar el resto de tonalidades. Pensemos, por ejemplo, en el modo RVA
(RGB en inglés), que mezcla elrojo, el verde y el azul para componer el resto de colores.

Los canales permiten representar de forma asilada cada uno de los colores básicos
utilizados en cada modo de color. Cada canal es totalmente independiente a la hora de
aplicar cualquier tipo de transformación sobre él, y ésta se convierte en una de sus
cualidades principales.

1º.- Crea un nuevo documento Archivo > Nevo (File


> New) de aproximadamente de 300 x 300
píxeles.
2º.- Crea un nueva capa Capa > Nuevo > Capa...
(Layer> New> Layer).
3º.- Crea el Texto que desees de color gris #999999.
4º.- Abre el menú Selección y elige la opción Cargar
Selección... (Select > Load Selection...) y presiona OK,
en la ventana que aparece.
5º.- Ahora Selección > Salvar selección (Select> Save
Selection...) y presiona OK. Esto grabará la selección que
tienes hecha.

6º.- Ahora muestra el panel Canales haciendo clic en su solapa


(si no ves los Canales ve a Ventana > Mostrar Canales) y
selecciona el canal Alpha 1.
7º.- Abre el menú Filtro y en el apartado Desenfocar elige la
opción Desenfoque Gaussiano... (Filter> Blur> Gaussian
Blur...) aplícalo por 4 píxeles. Repite este paso con los
valores 3 y 2 píxeles.
8º.- Muestra el panel de Capas y selecciona la capa que
contiene el Texto. Ahora abre el menú Filtro y en el
apartado Interpretar elige la opción Efectos de
iluminación..., (Filter> Render> Lighting Effects) realiza
las modificaciones basándote en la imagen mostrada a
continuación y haz clic en el botón OK.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 32


Seminario de trabajo – Creación y diseño de blogs educativos

9º.- Veamos como quitar los bordes astillados. Abre


el menú Selección y en el apartado Modificar
elige la opción Contraer (Select> Modify>
Contract) y selecciona 1 pixel.
10º.- Abre el menú Selección y haz clic en
Invertir (Select> Inverse)
11º.- Ahora abre el menú Edición y elige la
opción Cortar (Edit > Clear). Presiona
Control + D para quitar la selección.

12º.- Abre el menú Imagen y en el apartado Ajustar


selecciona la opción Curvas y haz que se
parezca lo más posible a la imagen que muestra
la fila anterior.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 33


Seminario de trabajo – Creación y diseño de blogs educativos

TubeMaster: Descarga de vídeos


Se trata de un programa gratuito para descarga y conversión de videos.
Para conseguirlo se siguen los siguientes pasos:

www.google.com

Buscar TUBEMASTER

TubeMaster – Descargar
TubeMaster, descargar gratis. Descarga TubeMaster, análisis, imágenes, comparativa y
opiniones sobre TubeMaster.
tubemaster.softonic.com/ - 55k –

Pulsar en Descargar

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 34


Seminario de trabajo – Creación y diseño de blogs educativos

Se guarda como archivo comprimido, en el escritorio. Una vez guardado deberemos abrir
carpeta y extraer los archivos para que se ejecute correctamente.

Posteriormente, abriremos Tubemaster y podremos realizar una búsqueda de videos


para descargarlos y convertirlos en formato .avi, que es el recomendado.

Por ejemplo. Queremos buscar videos sobre los yacimientos de Atapuerca. Escribimos
Atapuerca y pulsamos la lupa para que el programa inicie la búsqueda.
Aparecerá un listado con los videos encontrados.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 35


Seminario de trabajo – Creación y diseño de blogs educativos

Entre ellos seleccionamos el que nos parezca para visualizarlo. Si nos gusta, pulsaremos
en el botón situado abajo a la derecha que dice visualización-descarga
Una vez concluida la descarga, procedemos a la conversión, pulsando en la solapa de
descarga y conversión de la parte superior izquierda.

Se abre otra pantalla como la de la siguiente página donde podemos pulsar el botón
inferior que indica convertir .
Nos pedirá entonces archivo de entrada, que es directamente el que hemos visto, y que
aparece escrito encima de las teclas en la parte inferior izquierda, y la carpeta de salida
que elegimos nosotros, ya sea en el disco duro o en unidades extraíbles.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 36


Seminario de trabajo – Creación y diseño de blogs educativos

Archivo de salida Pulsar para iniciar la conversión

Una vez realizada la conversión, podremos verificar que el video se ha descargado


correctamente, abriendo la carpeta en la cual lo guardamos.

Con esta operación podemos disponer de los documentos gráficos que nos interesan en
la clase, simplemente con un ordenador portátil y un cañón de vídeo.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 37


Seminario de trabajo – Creación y diseño de blogs educativos

VDOWNLOADER: Descarga de vídeos


También es un programa gratuito que nos podemos bajar buscando directamente en
www.google.es

VDownloader – Descargar

VDownloader, descargar gratis. Descarga VDownloader, análisis, imágenes,


comparativa y opiniones sobre VDownloader.
vdownloader.softonic.com/ - 73k - En caché - Páginas similares

Pulsamos en descargar y se nos abre otra pantalla donde seleccionamos descarga


gratuita.

Indicamos que nos guarde el archivo en el escritorio.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 38


Seminario de trabajo – Creación y diseño de blogs educativos

Y seguimos los pasos de instalación.

El icono aparece en el escritorio. Pinchamos y se nos abre la pantalla donde iremos


indicando los vídeos que queremos descargar.

Si estamos buscando en youtube, podemos copiar la dirección URL del video y pegarla.
En el formato de salida elegiremos AVI. Pulsamos descargar.
Nos pedirá el destino para guardarlos.

Aparecerán sucesivamente mensajes: encolado, convirtiendo video, finalizado.

Coordinación y ponencias: María José Morales Abad y Ricardo Rodríguez García 39

Anda mungkin juga menyukai