1. Tema 7 – Aplicaciones multimedia Informática 4ºESO
Colexio Nosa Señora de Lourdes
ACTIVIDADES TEMA 7: APLICACIONES MULTIMEDIA
CREACIÓN DE BOTONES E INSIGNIAS O BADGE CON INKSCAPE
1. Creación de un botón con brillo. Vamos a crear el botón
que aparece en el margen con Inkscape. Para ello abre el
programa y sigue los siguiente pasos:
- Dibuja un rectángulo de 100x30 píxeles sin borde y de
color verde oliva como relleno.
- Redondea sus esquinas pulsando sobre el control de forma circular que aparece
en el perímetro del rectángulo.
- Selecciona el rectángulo y duplícalo.
- Pulsa F1 para seleccionar el recuadro duplicado y reduce
sus dimensiones y coloréalo de blanco.
- Selecciona el recuadro blanco y en el menú Relleno y
borde selecciona en la pestaña relleno gradiente lineal.
- Añade un texto en negro en medio del botón. Duplícalo y cambia el color del texto
duplicado a blanco. Desplaza ligeramente el texto en blanco diagonalmente para
crear efecto de relieve.
- Exporta el botón como mapa de bits.
2. Creación de una insignia o badge. Vamos a crear la insignia que
aparece en el margen derecho (primera imagen)
- Dibuja en Inkscape y dibuja una estrella de 20 puntas, longitud de
radio de 0.8, redondez de 0.2 y color azul Navy.
- Duplícala y desplázala fuera. Sobre la segunda estrella dibuja una elipse
y colócala como en la segunda imagen.
- Selecciona el conjunto de elipse y estrella y pulsa [Ctrl][*] para obtener
la intersección de ambas figuras. Colorea dicha intersección de blanco
con opacidad 40% y superponla a la estrella inicial.
- Selecciona la estrella y rellénala con Gradiente lineal. Pulsa [Ctrl][F1]
y ajusta los controles de degradado como ves en la figura. De esta
forma lo que haces es indicar en qué dirección quieres que se
degrade el relleno de la figura.
- Añade un texto en negro en medio del botón. Duplícalo y cambia el color del texto
duplicado a blanco. Desplaza ligeramente el texto en blanco diagonalmente para
crear efecto de relieve.
- Exporta el botón como mapa de bits.
2. Tema 7 – Aplicaciones multimedia Informática 4ºESO
Colexio Nosa Señora de Lourdes
3. Ahora hazlo tú mismo. Intenta crear los siguientes botones e insignias para
insertarlas en una posible página web.
CREAR BOTONES Y CABECERAS CON GIMP
4. En el programa GIMP en la barra de menús de la ventana principal (donde
aparecen las herramientas) aparece el menú Exts (extensiones) que presenta un
menú desplegable desde el cual se pueden crear diferentes botones (redondos y
simples biselados) y logotipos. Prueba con las diferentes opciones disponibles e
intenta obtener los siguientes botones y logotipos.
5. También se pueden crear un conjunto de elementos de apariencia similar para
poderlos usar en la misma web. Para ello hay que hacer al Exts/Temas de páginas
web y nos da tres temas diferentes entre los que podemos elegir y, con ellos crear
diversos elementos web como botones, cabeceras, flechas, puntos y reglas
horizontales, pudiendo luego modificar los colores o el patrón, textos, etc.
Experimenta e intenta obtener los siguientes elementos:
CREACIÓN DE FONDOS DE PANTALLA CON GIMP
6. Con GIMP se pueden crear fondos de pantalla de forma automática desde
exts/patrones. Se pueden elegir entre diversos tipos de patrones en los que
podemos modificar los parámetros deseados para obtener el resultado adecuado.
Experimenta e intenta obtener los siguientes fondos de pantalla.
3. Tema 7 – Aplicaciones multimedia Informática 4ºESO
Colexio Nosa Señora de Lourdes
CREACIÓN DE ICONOS PARA PERSONALIZAR UN DOCUMENTO CON GIMP
7. Crea en GIMP un icono cuadrado de tamaño 48x48 píxeles de la
cabeza de un halcón (usa la imagen del CD llamada halcón.tif) y
guárdala con extensión .ico que indica que se trata de un icono (se
puede llevar a cabo con cualquier imagen de tipo mapa de bits).
CREACIÓN GIF ANIMADO CON GIMP
8. GIMP también permite crear GIFs animados con diversas imágenes y texto. Por
ejemplo vamos a hacer un GIF animado con diversas expresiones faciales. Para
ello primero busca en Internet fotos con diferentes expresiones faciales
(preferiblemente de la misma persona). Crea en GIMP una imagen nueva de
70X90 píxeles y de fondo azul. inserta en capas sucesivas las diferentes fotografías
seleccionados (escaladas de forma que sean algo inferiores al fondo, todas del
mismo tamaño final y perfectamente superpuestas). Cuando hayas terminado
guárdalo con extensión .gif y selecciona Guardar como animación con un retardo
entre cuadros de 300ms (marcar bucle infinito y usar retardo arriba definido para
todos los fotogramas). Para ver el resultado ábrelo con el navegador de Internet.
9. También se pueden crear GIF animados a partir de una única foto. Para ello abre
con GIMP la imagen que desees (si quieres puedes usar alguna de las que están en
el CD) y en el menú filtros>animación aparecen una serie de efectos (fundir, globo
giratorio, ondas,…) Prueba alguno de ellos, dejando los parámetros que están por
defecto. Para poder visualizarlos solo tienes que acceder a
filtros>animación>reproducción. Guarde el que te guste como GIF animado.
INVESTIGA
10. Se pueden crear elementos web de forma on-line gratuitamente y descargarlos
posteriormente. Buscando en internet los términos botones web 2.0 on-line,
4. Tema 7 – Aplicaciones multimedia Informática 4ºESO
Colexio Nosa Señora de Lourdes
iconos web 2.0 on-line, web 2.0 on-line o loader web 2.0 on-line aparecerán
multiples programas gratuitos. Por si acaso, puedes encontrar algunos de estos
recursos en las siguientes direcciones:
Insignias: www.e-sm.net/inf4eso17
Botones: www.e-sm.net/inf4eso18
Barras de carga: www.e-sm.net/inf4eso19
Generador de cabeceras web tipo Flash: www.e-sm.net/inf4eso20
Obtén alguno de ellos de forma on-line, por ej. una cabecera web tipo Flash.