Está en la página 1de 4

GUÍA DE PRÁCTICAS

Formato
FR-FAC-PAC-GLB-010 Versión: 01 Fecha:

FACULTAD DE CIENCIAS DE LA INGENIERÍA E INDUSTRIAS

INGENIERÍA INFORMÁTICA Y CIENCIAS DE LA COMPUTACIÓN

ASIGNATURA: SISTEMAS MULTIMEDIA Nivel: 6TO.

TEMA: CANVAS: IMAGEN Y VIDEO Práctica Nº: 2

1. INTRODUCCIÓN:

En html5 el objeto canvas permite contener diferentes objetos, incluyendo imágenes y


videos, lo que permite aplicar varios procedimientos para transformarlos.

2. OBJETIVO GENERAL:

Desarrollar una página web que utilizando un objeto canvas permita la manipulación
de imágenes y videos.

2.1. OBJETIVOS ESPECÍFICOS Nivel*


Cargar imágenes y videos en un objeto canvas Alto
Transformar imágenes y videos mediante funciones Alto
desarrolladas en javascript
Almacenar los objetos modificados Alto
*Alto(A), Medio (M), Bajo (B)

3. DEFINICIONES: No aplica

4. BASE CONCEPTUAL:

Transformaciones de intensidad en imágenes


JavaScript

5. ACTIVIDADES PREVIAS

¿Cómo cargar imágenes y videos desde archivo o desde una URL en el canvas?
¿Qué características de la imagen podemos cambiar utilizando JavaScript?

1
GUÍA DE PRÁCTICAS
Formato
FR-FAC-PAC-GLB-010 Versión: 01 Fecha:

6. MÉTODO/PROCEDIMIENTO

 Diseñar la página.- tema de la página HTML5.- transformación de imágenes y video en


un canvas.
 Levantar servidor web.
 Elaborar archivos HTML y CSS.
 Elaborar el archivo js para dar funcionalidad a la página web.
 Probar el funcionamiento.

7. EQUIPOS Y MATERIALES:

 Laboratorio de informática con una computadora personal por estudiante.


 Software específico para la materia: servidor web, editor para html, css3, javascript
 Internet.
 Email.
 Plataforma virtual

8. CONDICIONES DE SEGURIDAD:

 Laboratorio de computación con instalaciones que cumplen las normas de seguridad


para eliminar riesgos de cortocircuitos e incendio.
 Equipos de computación funcionando normalmente.
 Fácil accesibilidad a equipo contra incendios

9. CUESTIONARIO DE INVESTIGACIÓN:

Explique el código para carga de imagen y video.


Explique el código para rotar, cambio de tamaño, cambio de intensidad de una imagen o
video

10. EVALUACIÓN DEL APRENDIZAJE:

Resultados de Resultados de Resultados de Nivel del


aprendizaje de la aprendizaje de la aprendizaje de la aprendizaje de
carrera asignatura práctica la práctica
4. Aplica pensamiento 4.3 Utilizar Utilizar el Paó gina web con un
loó gico, fundamentos objeto canvas para canvas y funcionalidad Alto
matemaó ticos, principios realizar la manipulacioó n para realizar
algoríótmicos, teó cnicas y de objetos imagen y transformaciones
lenguajes de video geomeó tricas y de
programacioó n; en la intensidad en objetos
fundamentacioó n, disenñ o de audio y video.
y desarrollo de
programas
computacionales
*Alto(A), Medio (M), Bajo (B)
2
GUÍA DE PRÁCTICAS
Formato
FR-FAC-PAC-GLB-010 Versión: 01 Fecha:

11. EVALUACIÓN DE RESULTADOS OBTENIDOS:

Resultados obtenidos SI NO Observaciones


Diseño de pagina
Visualización elementos de imagen y video
en un objeto canvas

Transformación geométrica y de intensidad


de elementos de imagen y video en un
canvas

Almacenar los objetos modificados

12.- BIBLIOGRAFÍA:

Meloni, Julie C. Sams. TEACH YOURSELF HTML, CSS AND JAVASCRIPT ALL IN ONE,
2012

13.- RUBRICA DE EVALUACIÓN DE PRÁCTICA

PUNTUACIÓN
0 1 2
CARACTERÍSTICA OBSERVACIÓN
No Cumple Cumple
cumple parcialmente Totalmente
Actividades previas
Cuestionario de
Investigación
Resultados y
Discusión
Desarrollo de la
aplicación
Conclusiones y
Recomendaciones
Total

3
GUÍA DE PRÁCTICAS
Formato
FR-FAC-PAC-GLB-010 Versión: 01 Fecha:

Elaborado por: Revisado por: Aprobado por:

____________________ _______________________ ________________________


_ Ing. Víctor Hugo Gálvez, Mg. _
Ing. Gabriel Pazmiño, Mg. RESPONSABLE DE ÁREA Ing. Oswaldo Moscoso, Mg.
DOCENTE COORDINADOR DE
CARRERA
Fecha: 09 /04 / 2018 Fecha: 09 /04 / 2018 Fecha: 09 /04 / 2018