TALLER: SISTEM@S
PERIODO: 1ro. GRADOS: (5째, 6째01, 10째, 11째)
@ GUÍA DE APRENDIZAJE No.
ÁREA DE TECNOLOGÍA E INFORMÁTICA –[Grado]: 5º Colegio Comfacesar “Rodolfo Campo Soto”
Nombre del Estudiante:
Curso:
Asignatura/Taller: Período: Taller -Sistemas Primero Tema: CONSTRUYO MI PÁGINA WEB
ESTRATEGIAS DE APRENDIZAJE INDICADOR DE AUTONOMIA
DD MM
Proceso
2011
Rotación
Administrador (es) de Programa: Ing. Ricardo Martínez Maestre
Esquema , Relación de Información Pensamiento Creativo
META DE APRENDIZAJE
INDICADORES DE DESEMPEÑO o
Identifica habilidades e intereses que le permiten elegir con criterio el taller de la especialización. o Realiza un sitio Web, utilizando herramientas de Word, cómo imágenes, auto formas, fondos e hipervínculos para fortalecer las habilidades en el manejo automático de la información y la creatividad. o Asume con responsabilidad y empeño las actividades propuestas para cumplir con sus compromisos académicos DURACIÓN: (7) unidades de clase RECURSOS: Guía, (Para legajar en carpeta y todas las guías que se entreguen durante el año), computador, video-beam, pizarra digital, Internet, cuaderno. Comenta con tus Compañeros. 1.1 1.2 1.3 Tiempo: 1 Unidad
1.4
1.5
¿Conoces una página Web? ¿Qué clase de información se presenta en una página Web? Complementa esta información buscando en www.google.com, ¿Qué es una página Web? Observa la página “www.oneclickidea.com” y escribe en el cuaderno tus apreciaciones acerca de esta página. Realiza la siguiente lectura:
La página Web es un mecanismo, proveedor de información electrónica para usuarios conectados a Internet. Este sistema permite a los usuarios el acceso a una gran cantidad de información: leer publicaciones periódicas, buscar referencias en bibliotecas, realizar paseos virtuales, compras electrónicas o audiciones de conciertos, buscar trabajo y otras muchas funciones. Gracias a la forma en que están organizadas las páginas Web que se identifican como (WWW), los usuarios pueden saltar de un recurso a otro con facilidad. Las conexiones entre los servidores que contienen la información se hacen de forma automática y transparente para el usuario, pues el medio admite las funciones de hipertexto e hipermedia. El explorador (como Mozilla Firefox, Netscape, Chrome o Internet Explorer de Microsoft), muestra en la pantalla una página con el texto, las imágenes, los sonidos y las animaciones relativas al tema que previamente ha sido seleccionado. El usuario puede entonces interactuar con el sistema señalando con el mouse (ratón) aquellos elementos que desea estudiar en profundidad, pues, si la página lo permite, dichos objetos estarán vinculados a otras páginas Web de ese servidor u otros que aportan información relacionada. Existen múltiples enlaces Web por todo el mundo, que forman una base de información a gran escala en multimedia, aunque todavía los contenidos se encuentran en su mayoría en inglés. Cada vez más compañías implantan redes corporativas, conocidas con el nombre de intranets, que están basadas en esta tecnología pero a menor escala.
Después de leer el texto y la información que encontraste en Internet, resuelve las siguientes preguntas: 1.6 ¿Para qué sirve una página Web?
1.7 ¿Cómo se identifica una página Web?
1.8 ¿Qué es un servidor?
1.9 ¿Qué es hipertexto?
1.10 ¿Qué es hipermedia?
1.11 ¿Qué es el Internet Explorer?
1.12 ¿Que es Internet?
1.13 ¿Qué es Intranet?
Tiempo: 3 unidades
Ahora empezarás a crear una página Web utilizando como herramienta el programa Word. 2.1 Primero debes crear una carpeta con el nombre “Ejercicio” en el escritorio de Windows, (allí se deben grabar todos los archivos que se generarán para la creación de tu página Web).
2.2 Ahora debemos organizar la información que se publicará en la página Web. Tema: LOS MEDIOS DE COMUNICACIÓN
Diseño y conexiones: HOJA 1 PÁGINA INICIAL
Regresar a la Página Principal
HOJA 2
HOJA 3
2.3 Ahora con la ayuda de tu profesor empezarás la creación de la PÁGINA INICIAL, esta debe quedar tal como se muestra en la guía. Debes utilizar las siguientes herramientas de Word (color de fondo, bordes para la página, cuadro de texto, estilo de línea para el cuadro y color de relleno, imágenes prediseñadas, autoformas y wordart) 2.4 Entra al programa Word abrir documento en blanco:
un
2.5 Realiza el diseño 2.6 Graba el archivo con el nombre PÁGINA INICIAL y en la opción Guardar como Tipo, selecciona la opción página Web en la carpeta Ejercicio
2.7 Cierra el archivo y abre uno nuevo en blanco.
2.8 Crea los archivos HOJA1, HOJA2, HOJA3 y grábalos en la carpeta ejercicio seleccionando como Tipo página Web. Nota: Cada hoja debe ser un archivo independiente. 2.9 Ahora debes tener todos los archivos cerrados, tu profesora te indicará cómo verificar que los archivos hayan quedado dentro de la carpeta. 2.10 Ahora empezaremos a crear los hipervínculos: 2.11 Abrir el archivo PÁGINA INICIAL, tu profesor te indicará cómo crear los hipervínculos:
2.12 Por último tu profesor te indicará cómo ver la página Web desde el Internet Explorer.
Tiempo: 1 Unidad
3.1 Read the following text:
A web page or webpage is a resource of information that is suitable for the World Wide Web and can be accessed through a web browser. This information is usually in HTML or XHTML format, and may provide navigation to other web pages via hypertext links
3.2 Answer the following questions a. b. c.
Which is the meaning of WWW? Word Wide Web Wide World32-*20 World Wide Web
a. b. c.
How can we access it? navigation web browser web page
a. b. c.
What is the format of the webpage? JPG GIF HTML XHTML
a. b. c.
What is the hypertext link? the format Information Navigation to other webpage
What is the webpage? _____________________________________________________________________ _____________________________________________________________________ _____________________________________________________________________ _____________________________________________________________________ ____________________________
3.2 Draw the parts of the computer.
Keyboard
Monitor
C.P.U
Mouse
Printer
Tiempo: 2 Unidades.
4.1 Por binas (dos estudiantes) realicen un sitio Web, (compuesto por cuatro páginas), de la empresa de máscaras “Mascarada”. La información de la empresa es la siguiente:
Nuestra misión es elaborar máscaras novedosas de diferentes precios, y para todas las edades, con el más estricto control de calidad y los mejores materiales.
Ubicación: Cll53 No.45-54, Tel: 2345678
Horario: lunes a viernes de 8:00am a 5:00pm.
Correo electrónico: Máscarada@net.co
Por favor incluir en nuestro sitio web mucho color y letra novedosa, comentarios de interés acerca de la historia de las máscaras, y una sección divertida.
Para la creación de esta página web, realicen los siguientes pasos. 1. Abrir un correo en gmail. 2. En la opción sites, Crear un nuevo sitio. 3. Buscar un nombre disponible para el sitio web, que se relacione con el contenido. 4. Escucha atentamente a tu profesor, el proceso de creación de las cuatro páginas en google sites.
5.1 AUTOEVALUACIÓN Responde: 5.1.1 ¿Qué es una página Web?:
5.1.2 Consulta 3 páginas Web y escribe el tema principal.
5.1.3 ¿Por qué son importantes las páginas Web?
5.2 COEVALUACIÓN 5.2.1 Cada grupo socializará su sitio Web al resto del grupo, después de escucharlas completa el siguiente cuadro. Pregunta o actividad
¿Cuál sitio Web te gusto más? ¿Por qué?
o
Felicita al grupo que lo realizó
¿Cuál sitio Web necesita mejoras? ¿Por qué?
o
Cuéntale al grupo que lo realizó, las mejoras que podrían hacer.
Respuesta
¿Cuáles sitios Web están incompletos? ¿Por qué?
o
Comenta a tus compañeros cómo podrían completar el sitio Web.
Completa el siguiente cuadro en compañía de tu profesor. DESEMPEÑO
SI
NO
CON DIFICULTAD
Maneja el concepto de Página Web y su función. Organiza la información antes de hacer una página Web. Maneja las herramientas del programa Word y de google sites, para crear páginas Web con sus elementos básicos Cumple con todas las actividades propuestas en la guía.
6. REFERENCIAS BIBLIOGRAFICAS CHAVERRA de Ayala Doris Maria. María Rita Buitrago. Tecnología constructiva. Editorial Susaeta. 2003. Páginas 13 a 23 INTERNET www.oneclickidea.com, www.google.com, www.gmail.com
FECHA
OBSERVACIONES Y/O NOTAS DEL DOCENTE
SUGERENCIAS
@ GUÍA DE APRENDIZAJE No. 1
ÁREA DE TECNOLOGÍA E INFORMÁTICA –[Grado]: 6º Colegio
Nombre del Estudiante:
Curso:
Asignatura/Taller: Período: Taller -Sistemas Primero Tema: Sistema Computacional - El Hardware y Software -
Proceso Rotación Administrador (es) de Programa: Ing. WILBER MEJIA NAVARRO
ESTRATEGIAS DE APRENDIZAJE INDICADOR DE AUTONOMIA
DD
MM
2011
Lluvia de Ideas , Relación de Información Analizar y representar información
META DE APRENDIZAJE
« Escribe aquí tu meta »
INDICADORES DE DESEMPEÑO o
Analiza el impacto de artefactos, procesos y sistemas tecnológicos en la solución de problemas y satisfacción de necesidades, para elegir con criterio el taller de especialización. o Asume con responsabilidad y empeño las actividades propuestas para cumplir con sus compromisos académicos. DURACIÓN: (3) unidades de clase RECURSOS: Cuaderno, hojas cuadriculadas, computador y portafolio (esta guía debe estar legajada en el portafolio), Internet, video. 1 INDUCCIÓN Ó INTRODUCCIÓN: 1.1 Introducción
Observa el video con juicio
1.2 Activación de saberes previos.
¿Qué conoces acerca de la información? _______________________________________________________________ _______________________________________________________________ _____________
¿Qué es la informática? _______________________________________________________________ _______________________________________________________________ ______________
¿Qué podemos tocar y ver de un computador? _______________________________________________________________ _______________________________________________________________ ______________
¿Qué utilizas en un computador para realizar una carta ó un dibujo? _______________________________________________________________ _______________________________________________________________ _____________
Encierra en un circulo la figura que represente un hardware
1.3 Información Una computadora es una máquina electrónica usada para procesar la información. Sin embargo, podemos hacer un trabajo más amplio con las computadoras que apenas calcular números o imprimir datos. Podemos dibujar cuadros, escribimos notas, informes, e incluso nos comunicamos con otros usuarios de computadoras alrededor del mundo. Hay dos partes básicas y fundamentales para entender la computadora; estas partes son: el hardware y el software. El hardware es un término genérico para todos los componentes físicos de la computadora. El software es un término genérico para los programas que funcionan en una computadora. Por ejemplo, el programa de Paint, se puede considerar como un software que le da vida a su Hardware. Sin embargo es Windows el sistema operativo o programa de funcionamiento el que realmente viene a darle la vida a su computadora, es así como usted puede ver luego este otro programa. Al iniciar el siglo XX, muchos inventores avanzaron en la máquina planteada por Babbage y a partir de ese momento, se inicia la carrera tecnológica, con respecto al computador y son esas eras, las que se han denominado generaciones, pues marcaron una pauta y diferencias significativas con respecto a su evolución. CARACTERISTICAS
GENERACIÓN PRIMERA
TUBOS AL VACIO
SEGUNDA
TRANSISTORES
TERCERA
CIRCUITOS INTEGRADOS - CHIPS-
CUARTA
MICROPROCESADOR
QUINTA
PROCESADORES PARALELOS E INTELIGENCIA ARTIFICIAL
SEXTA
PROCESADORES n NUCLEOS Y NANOTECNOLOGIA
Memoria principal de tambor magnético, almacén primario basado en tarjetas perforadas, alto consumo de energía. Memoria principal mejorada con núcleos magnéticos, Lenguaje de programación FORTRAN y COBOL, discos magnéticos removibles como medio de almacenaje. Reunión de centenares de elementos en una placa de silicio o (chip), menor consumo, Multiprogramación, Minicomputadora. Chips con alto nivel de integración, memoria RAM de semiconductores, desarrollo de Sistemas Administradores de Bases de Datos, Microcomputadora. Sistemas expertos, Robótica, Holografía, tecnología laser, internet, programación orientada a objetos, BD distribuidas, aplicaciones cliente-servidor. Internet (web 2.0 y 3.0), Cibernética, Domótica, Tecnología móvil y 3D, miniaturización de elementos, nanoelectrónica, computadora molecular.
Por tanto, un sistema computacional est谩 formado por el hardware que es la parte tangible (lo que se ve) y por el software, parte l贸gica (no se ve a simple vista), que se encuentra en los medios de almacenamiento, como los diskettes, discos duros, CDs, DVDs, USB, entre otros.
PARTES DEL COMPUTADOR - Esquema - HARDWARE
CLASIFICACIÒN DEL SOFTWARE SISTEMA OPERATIVO: Este software está relacionado con el manejo y control del hardware, informa errores y facilita actividades con el manejo de archivos, carpetas y memorias secundarias. Ejemplo: Linux,
LENGUAJES: Es la forma como un usuario de computadora, se comunica con la máquina escribiéndole instrucciones, que pueden ser en inglés (lenguaje de alto nivel) o en unos o ceros (lenguaje de bajo nivel). Ejemplo: 100 11
hello
Lenguaje C, Pascal
COMUNICACIÓN: Es el programa encargado de conectar varios computadores entre sí, formando redes. Ejemplo: Skype,
MULTIMEDIA: Software simultáneamente.
que
combina
sonido,
Ejemplos: Flash,
animación,
texto
y
vídeo
APLICACIONES: Programas que ya vienen desarrollados para que una persona los maneje y obtenga trabajos en forma rápida y efectiva. Por ejemplo:
Word, que sirve para ________________________________________________ Paint, que sirve para ________________________________________________ Power Point, que sirve para ___________________________________________ Corel Draw, que sirve para ____________________________________________ Excel, que sirve para ________________________________________________ Flash, que sirve para ________________________________________________ Internet Explorer, que sirve para ________________________________________
2 APRENDIZAJE INDIVIDUAL 2.1 En tu cuaderno, organiza y realiza un mapa mental del sistema computacional. 2.2 Clasifica las siguientes figuras según su generación correspondiente:
Transistores Microprocesador e-Book (Libro electrónico)
6ª.Generación Circuito integrado
Válvulas de vacío
Iphone Robótica
2.3 Realiza un glosario de definiciones con diez (10) palabras vistas en este tema; escríbelo en el cuaderno. Utiliza Internet para buscar dichos conceptos.
3 APRENDIZAJE EN GRUPO En grupo de dos ó tres estudiantes, realiza la siguiente actividad: Realiza una pequeña presentación en Power Point, con la siguiente estructura: Diapositiva 1 Preliminar (Presentación) Diapositiva 2 Sistema Computacional Diapositiva 3 Generaciones Diapositiva 4 Periféricos y Procesador Diapositiva 5 Software y Clases de Software Diapositiva 6 Conclusiones
Socializa la presentación a tus compañeros Responde y realiza en tu cuaderno: - Si comparamos el Sistema Computacional con el humano, ¿qué partes son Hardware (periféricos y procesador) y cuáles Software? Dibújenlos.
4 SAY IT IN ENGLISH The software is the computer’s logical part. It can’t be seen easily because it needs the Hardware. The software is in storage peripherals. a.
Where is the software? _________________________________
b. The Hardware needs the Software. c. The software is a program. d. The Hardware is a logical part.
F
T
F
T
F
T
5 EVALUACIÓN Coevalúa la guía de aprendizaje bajo las siguientes rúbricas y retroalimenten los productos. Cada rúbrica se valora de 1 a 5, siendo la valoración mínima 1 y la máxima 5. No. 1. 2. 3. 4. 5.
RÚBRICAS ¿Qué importancia tiene para ti el tema de la Unidad de Aprendizaje? ¿La guía de aprendizaje te hizo reflexionar acerca de cómo utilizas el computador, su uso y estructura? ¿Participaste activa y respetuosamente en las actividades propuestas? ¿Realizaste aportes significativos a los puntos de discusión del trabajo grupal? ¿Encuentras útil la información acá presentada planeando utilizarla cuando trabajes en el computador?
VALORACIÓN
SUGERENCIAS
@ GUÍA DE APRENDIZAJE No. 2
ÁREA DE TECNOLOGÍA E INFORMÁTICA –[Grado]: 6º Colegio
Nombre del Estudiante:
Curso:
Asignatura/Taller: Período: Taller -Sistemas Primero Tema: PRESENTADOR MULTIMEDIA DE DIAPOSITIVAS Y TICs
Proceso Rotación Administrador (es) de Programa: Ing. WILBER MEJIA NAVARRO
ESTRATEGIAS DE APRENDIZAJE INDICADOR DE AUTONOMIA
META DE APRENDIZAJE
DD
MM
2011
Lluvia de Ideas , Relación de Información Analizar y representar información
« Escribe aquí tu meta »
INDICADORES DE DESEMPEÑO o
Analiza el impacto de artefactos, procesos y sistemas tecnológicos en la solución de problemas y satisfacción de necesidades, para elegir con criterio el taller de especialización. o Asume con responsabilidad y empeño las actividades propuestas para cumplir con sus compromisos académicos. DURACIÓN: (4) unidades de clase RECURSOS: Guía de Aprendizaje Nº1 de este taller (Para legajar en carpeta y todas las guías que se entreguen durante el año), computador, cuaderno, lápiz, internet, video, Ipod ó memoria USB. TIEMPO: 2 UNIDADES
1
INDUCCIÓN
1.1 Activación de saberes previos. ¿Qué son los software de Aplicación?. De tres ejemplos. __________________________________________________________________ __________________________________________________________________ Ejemplos: ______________ _________________ _____________
¿Qué crees tú hace referencia el término multimedia? __________________________________________________________________ __________________________________________________________________ Menciona tres elementos que consideres clasifiquen como multimedia. ___________________ ___________________________ ________________
¿Qué es una presentación? _____________________________________________________________________ _____________________________________________________________________ 1.2 Información Tal como se describió en las clases de software, dentro de los programas de aplicación, se encuentra el presentador de diapositivas, que se utiliza mucho para hacer exposiciones, conferencias y seminarios, por parte de la persona que va a exponer un tema. Power Point es un programa multimedia creado por Microsoft Corp., contenido en el paquete de Office, que se encarga de realizar presentaciones con diapositivas (*.ppt) que se pueden preparar y ejecutar fácilmente para una exposición, muestra, resumen, comunicación, etc. Para más facilidad power point permite crear, además del archivo .ppt (presentación de power point), un archivo de presentación con diapositivas .pps; este último guardará la presentación de modo que al abrir se genera la vista presentación, sin abrir Power Point.
Para ingresar al programa, hacemos cualquiera de los dos procedimientos: Presionamos el menú Inicio, elegimos Todos los programas; luego, hacemos clic en Microsoft Office y ubicamos el icono de Power Point. Clic. Presionamos el menú Inicio y nos ubicamos en el cuadro de texto Iniciar búsqueda; escribimos Power Point y luego, de la lista que se genera hacemos clic en Microsoft Office Power Point.
Familiaricémonos con el entorno: Botón Office
Barra de acceso rápido
Barra de titulo Cinta de Opciones Grupo de Comandos
Área de Trabajo (Diapositivas) Área de Esquemas
Área de Notas
Barra de Estado Vistas
2 APRENDIZAJE INDIVIDUAL Al iniciar este programa, tengan en cuenta que:
Deben elegir presentación en blanco. El tema a exponer debe ser de la lista Nº1. No se acepta demasiado texto en la diapositiva, pues al realizar las viñetas, estas indican pautas de exposición, como guía del expositor. Al exponer, estas pautas no deben ser leídas, ni el texto escrito. Pueden utilizar Encarta, Wikipedia u otros medios para complementar la exposición.
Lista Nº1: Temas para la exposición 1. 2. 3. 4. 5. 6.
HOLOGRAFIA WEB 2.0 Y 3.0 REDES SOCIALES TECNOLOGIA DEL FUTURO USO DE BLOGS Y WIKIS TIC EN LA EDUACIÓN
Graben esta actividad en la carpeta Mis documentos, subcarpeta PRESENTADOR con el nombre del grado y curso al cual pertenece. (P.ej.: SEPTIMO 01). Guarde la presentación como .ppt y pps. Número de computador asignado: _______
Número del tema seleccionado: ___________
El proyecto se llama: ______________________________________________________________
Diapositiva 1 Diseño: Inicio/ Diapositivas/Diapositiva de título Presentará el título de la exposición y el nombre de los integrantes
Inicio/Nueva Diapositiva Diapositiva 2 Diseño: Inicio/Diapositivas/Diseño/Titulo y Objetos Titulo: Word Art inclinado a la izquierda de la ventana. Para el organigrama: Insertar/ Ilustraciones/Smart Art y elegir uno de los organigramas que se presentan. Esta se hace con el fin desglosar y presentar los temas que se van a desarrollar.
Inicio/Nueva Diapositiva Diapositiva 3 Diseño: Inicio/Diapositivas/Diseño/Dos objetos Titulo: Word Art inclinado a la derecha de la ventana. Ingresar a Imágenes prediseñadas (Insertar/Imagen prediseñada/ Organizar clips/ Colecciones de Office/ Todas) y elegir las que se ajusten al tema. Las viñetas (Clic derecho/Viñetas/Definir nueva viñeta/Simbolo/Webdings y eligen la que quieran) deben ser diferentes a rombos, puntos, cuadrados o chulos y deben estar en color diferente al texto. Inicio/Nueva Diapositiva Diapositiva 4 Diseño: Inicio/Diapositivas/Diseño/Dos objetos Titulo: Word Art en el centro de la ventana. Ingresar las imágenes traídas por ustedes, sobre el tema que se va a exponer. Las viñetas (Clic derecho/Viñetas/Definir nueva viñeta/Simbolo/Webdings y eligen la que quieran) deben ser diferentes a rombos, puntos, cuadrados o chulos y deben estar en color diferente al texto.
Inicio/Nueva Diapositiva Diapositiva 5 Diseño: Inicio/Diapositivas/Diseños/En blanco Titulo: No tendrá Dejar volar la creatividad, con solo figuras de forma (Insertar/Ilustraciones/Formas), dando una imagen referente al tema a exponer.
3 APRENDIZAJE EN GRUPO En grupo de dos estudiantes realiza la siguiente actividad. Consigna los resultados en esta guía. 3.1 Abre una nueva presentación; presiona la tecla ALT solamente un lapso corto de tiempo. Observa lo que sucede en la pantalla y responde: A) ¿Qué sucede en la ventana de Power Point? _____________________________________________________________________ _____________________________________________________________________ _____________________________________________________________________ __________________ B) ¿Qué indican? _____________________________________________________________________ _____________________________________________________________________ ____________ 3.2 Explora un poco el entorno. Indica los pasos que hay que seguir para insertar un video y un sonido en una diapositiva: Insertar un video a una diapositiva:
Insertar un sonido a una diapositiva:
3.3 Utiliza la ayuda de Power Point (F1). A) ¿Cómo agrego animaciones a mis objetos en una diapositiva?. __________________________________________________________________ __________________________________________________________________ __________________________________________________________________ __________________________________________________________________ ____________________________
B) Realicen una sencilla presentación, con una diapositiva, donde a un objeto (imagen, figura, texto, etc.) le asignen una animación de entrada y otra de salida.
TEMA: TECNOLOGIAS DE LA INFORMACIÓN Y LA COMUNICACIÓN TIEMPO: 2 UNIDADES
4 INDUCCIÓN 4.1 Introducción
Las tecnologías de la información y la comunicación (TIC o NTIC para Nuevas Tecnologías de la Información y de la Comunicación) agrupan los elementos y las técnicas utilizadas en el tratamiento y la transmisión de las informaciones, principalmente de informática, Internet y telecomunicaciones
4.2 Activación de saberes previos.
¿Qué es la información? ¿A que se refiere el término informática? __________________________________________________________________ __________________________________________________________________ __________________________________________________________________ __________________________________________________________________ ___________________________.
¿Qué es la comunicación? __________________________________________________________________ __________________________________________________________________ __________________________________________________________________ ____________________.
Cuando hablamos de telecomunicaciones, ¿A qué se hace referencia? __________________________________________________________________ __________________________________________________________________
__________________________________________________________________ ____________________.
Encierra en un círculo ó subraya, cuáles de las siguientes opciones según tu parecer, hace referencia a las TIC: POWER POINT NEVERAS
BOLIGRAFO BLUETOOTH
PIZARRA DIGITAL
COREL DRAW
TV LCD
VIDEO-CONFERENCIA
HORNO MICROONDAS ERGONOMIA
BLACKBERRY PS3
PAGOS CON TARJETA
IPOD E-Book WiFi
4.3 Información A nadie sorprende estar informado minuto a minuto, comunicarse con gente del otro lado del planeta, ver el video de una canción o trabajar en equipo sin estar en un mismo sitio. Con una rapidez impensada las Tecnologías de la información y comunicación son cada vez más, parte importante de nuestras vidas. Este concepto que también se llama Sociedad de la información, se debe principalmente a un invento que empezó a formarse hace unas cuatro décadas: Internet. Se crearon los correos electrónicos, los servicios de mensajería y las páginas web. Sin embargo, es hasta mediados de la década de los noventa cuando se da la verdadera explosión de Internet, y a su alrededor todo lo que conocemos como Tecnologías de la información y Las TIC conforman el comunicación. conjunto de recursos necesarios El desarrollo de Internet ha significado que la información esté para manipular la información y ahora en muchos sitios; se han roto las barreras y con Internet particularmente los ordenadores, programas informáticos y redes necesarias para convertirla, almacenarla, administrarla, transmitirla y encontrarla.
hay más acceso a la
información (el principal problema, es la calidad de esta información). También se ha agilizado el contacto entre personas, no hace falta moverse para cerrar negocios en diferentes ciudades del mundo o para realizar transacciones en cualquier lugar con un sencillo clic. Hasta muchos políticos, artistas, periodistas y profesionales tienen su blog o twitter, vídeos en YouTube, dejando claro que las TIC han modificado todos los aspectos de la vida.
Las nuevas tecnologías suponen la aparición y especialización progresiva de los contenidos. El advenimiento de Internet y principalmente de la Web como medio de comunicación de las masas y el éxito de los blogs, de wikis o de tecnologías Peer-topeer confiere a las TIC una dimensión social.
Las TICs se pueden reagrupar según las redes, terminales y servicios. REDES
TERMINALES
Ipod, Iphone, MP4, HTPC (Home Theater Personal Computer), Banda Ancha Consolas, televisores con tecnología plasma y de cristal Telefonía Móvil líquido, iTV de Apple (permite Redes de televisión descargar películas de Internet y verlas Redes de Hogar (WiFi, al instante en el televisor mediante una conexión WI-FI), netbook, bluetooth, etc.) BlackBerry, etc. Telefonía Fija
SERVICIOS Correo electrónicos, Búsqueda de información, Banca Online, TV y Cine, Audio y música, Comercio electrónico, Educación, videojuegos, SMS y MMS (mensajes cortos y multimedia), Peer to Peer ó P2P (eMule, Kazaa, Ares, etc.), Blogs, comunidades virtuales y redes sociales.
Router con WiFi
5 APRENDIZAJE INDIVIDUAL 5.1 En tu cuaderno, responde las siguientes preguntas: ¿Qué son las TIC? a) Haz un cuadro con las ventajas y desventajas que veas en las TIC. b) Realiza un glosario de términos con las palabras resaltadas con c) negrita en información.
5.2 Clasifica las siguientes imágenes según la agrupación de las TIC:
Compras x Internet
e-Book Kindle
PC Crestron tps 6x
Unidad móvil de TV, Japón gPhone
Redes
Reloj Celular M800
Avatars Habbo
Terminales
Servicios
5.3 Responde según el video visto en clases sobre las telecomunicaciones: ¿Qué impresiones te deja el video? __________________________________________________________________ __________________________________________________________________ __________________________________________________________________ __________________________________________________________________ ___________________________
¿Crees que estas tecnologías existen en la realidad ó hacen parte de la ficción? ¿POR QUÉ?_______________________________ SI
Realidad
NO
_______________________________________________________ Ficción _______________________________________________________
_______________________________________________________ ________________________________________________________________________
6 APRENDIZAJE EN GRUPO
Junto a tu profesor y en grupo de tres estudiantes, realiza la siguiente actividad en el salón de clases, aprovechando los recursos disponibles en ella tales como la pizarra digital, internet, proyector, entre otros.
Ingresa a la siguiente dirección web: http://vozme.com Ingresamos un texto. El texto a introducir son las respuestas a los ítems a) y b), del punto 2.1 del aprendizaje individual. Generamos un archivo mp3 de dicho texto. Descargamos, con la voz (género) que elijamos, el archivo de voz al Ipod ó memoria USB disponible. Escuchamos y socializamos la experiencia.
Indica y responde en tu cuaderno: a) ¿Qué tal te pareció la actividad? b) ¿En qué aspectos de tu vida académica podrías aplicar dicha utilidad? c) ¿Para qué te podría servir en tu vida profesional?
7 SAY IT IN ENGLISH Translates as follows, (www.google.com.co):
using
the
Translator
Search Telecommunications Computing Cybernetics DOMÓTICA
tool
Home automation Web Pages News Digit Magazine e-Book e-Commerce Online Shopping Flashcards Headphones Attach Send Download Upload Password 8 EVALUACIÓN Coevalúa la guía de aprendizaje bajo las siguientes rúbricas y retroalimenten los productos. Cada rúbrica se valora de 1 a 5, siendo la valoración mínima 1 y la máxima 5.
No.
RÚBRICAS
VALORACIÓN
1.
¿Qué importancia tiene para ti el tema de la Unidad de Aprendizaje?
2.
¿La guía de aprendizaje te hizo reflexionar acerca de cómo utilizas el computador, su uso y estructura?
3.
¿Participaste activa respetuosamente en actividades propuestas?
4.
¿Realizaste aportes significativos a los puntos de discusión del trabajo grupal?
5.
¿Encuentras útil la información acá presentada planeando utilizarla cuando trabajes en el computador?
y las
SUGERENCIAS
@ GUÍA DE APRENDIZAJE No. 1
ÁREA DE TECNOLOGÍA E INFORMÁTICA –[Grado]: 10º Colegio
INDICADORES DE DESEMPEÑO o Conoce el funcionamiento y herramientas básicas de los programas CorelDRAW, PhotoPaint y Photoshop, así como su aplicación y conocimientos puntuales del retoque digital y edición Gráfica. o Asume con responsabilidad y empeño las actividades propuestas para cumplir con sus compromisos académicos. DURACIÓN: Siete (7) unidades de clase de 90 minutos c/u. RECURSOS: Guía cátedra inaugural (Para legajar en carpeta y todas las guías que se entreguen durante el año), computador, software CorelDRAW, PhotoPaint, PhotoShop. 1 INDUCCIÓN Ó INTRODUCCIÓN: 1.1 Introducción Cada día existen mejores utilidades para visualizar una imagen o que nos revelen las características de aquella imagen. Con un solo clic nos solucionan un efecto en la fotografía, un filtro que nos pueden aportar otra tonalidad a la imagen mejorando su aspecto, etc.
La edición digital de imágenes se ocupa de la edición apoyada en computadores de imágenes digitales, comúnmente un gráfico rasterizado, en la mayoría de los casos fotos o documentos escaneados. Estas imágenes son modificadas para optimizarlas, manipularlas, retocarlas, etc. con el fin de alcanzar la meta deseada. 1.2 Activación de saberes previos. ¿Qué es una imagen?
______________________________________ ______________________________________ ______________________________________ ______________________________________
¿A qué hace referencia el término imagen digital? _______________________________________________________________ _______________________________________________________________ ______________ ¿Has manejado alguna herramienta de retoque digital? SI NO ¿Cuál?_________________________________________________________ _______________________________________________________________ ______________ De la siguiente lista, selecciona los términos que identifiquen un formato de imagen:
Selecciona las páginas de retoque digital online en las cuales has navegado ó escuchado hablar a tus compañeros:
1.3 Información La Edición Gráfica es el conjunto de estrategias para la planificación, producción y puesta en escena de la imagen; en la edición gráfica se ponen en contacto los textos y las imágenes. La edición gráfica tiene como base la función de planificar los contenidos visuales, a causa de la fuerza de la imagen, y su relación con la calidad. La edición gráfica tiene que otorgar un uso consciente de las imágenes. El diseño gráfico es una profesión cuya actividad es la acción de concebir, programar, proyectar y realizar comunicaciones visuales, producidas en general por medios industriales y destinados a transmitir mensajes específicos a grupos sociales determinados. Esta es la actividad que posibilita comunicar gráficamente ideas, hechos y valores procesados y sintetizados en términos de forma y comunicación, factores sociales, culturales, económicos, estéticos y tecnológicos. Algunas clasificaciones difundidas del diseño gráfico son: el diseño gráfico publicitario, el diseño editorial, el diseño de identidad corporativa, el diseño web, el diseño de envase, el diseño tipográfico, la cartelería, la señalética y el llamado diseño multimedia, entre otros. Mientras que los lápices y rotuladores se utilizan para bosquejar las ideas iniciales, hoy en día se utilizan computadoras para las etapas posteriores del proceso de diseño gráfico. Algunas herramientas de retoque digital más reconocidas son: Adobe Photoshop CS, CorelDRAW, Corel Photopaint, Photo Pos PRO, etc. El auge de Internet ha hecho que la edición gráfica se traslade a entornos online, donde solamente cargas una foto y realizas todo un proceso de edición con un solo clic; agregas marcos y efectos, retoques, generas fotomontajes, etc. Entre estas tenemos: www.writeonit.org/es/ www.fotoefectos.com/ www.picnik.com pixenate.com/ www.photofunia.com/ www.lunapic.com/ Edición gráfica con CorelDRAW Antes de empezar a utilizar CorelDRAW, le conviene familiarizarse con los términos siguientes:
Ventana de aplicación de CorelDRAW Al iniciar CorelDRAW se abre la ventana de aplicación, que contiene una ventana de dibujo. El rectángulo del centro de la ventana de dibujo es la página de dibujo, donde se crea el dibujo. Aunque es posible abrir más de una ventana de dibujo, los comandos sólo pueden aplicarse a la ventana de dibujo activa. A continuación se ilustra la ventana de aplicación de CorelDRAW. Conozcamos el entorno de CorelDRAW:
El tipo de archivo que crea CorelDraw es *.CDR
La Caja de Herramientas
[Caja de Herramientas]
Aunque puedes guardar el archivo Corel en cualquier formato de imagen.
A la aplicación con la cual se realiza la edición digital de imágenes se le llama editor de imágenes, el cual ofrece numerosas funciones en un menú o en una ventana de herramientas. Algunas de estas funciones son:
Oscurecer y aclarar: Por medio de estos algoritmos digitales se pueden imitar los logros de una virtual prolongación o disminución del tiempo de exposición de una virtual foto.
Selección: Algunas regiones de la imagen pueden ser seleccionadas por medio de círculos, rectángulos, lazos, polígonos, rangos de coloraciones, etc. Cada selección puede ser la inicial, agregarse a la ya existente o sustraerse de la ya existente. Después la selección puede ser tratada en forma aparte del resto de la imagen.
Correcciones automáticas: Para neófitos, algunos editores de imágenes ofrecen procedimientos automáticos de corrección. Estos modifican automáticamente el color, el tono, el contraste y otros factores de la imagen sin intervención del principiante. Sus resultados pueden no satisfacer a un profesional.
Almacenar: Este nombre genérico incluye por lo menos tres posibilidades: Almacenar la imagen en el formato actual, convertir el formato actual a algún otro y luego almacenar la imagen en ese nuevo formato ó almacenar en el formato actual pero bajo un nuevo nombre.
Rotar: Por medio de la rotación de una imagen pueden ser corregidas leves fallas al hacer la imagen, ya sea al fotografiar, escanear ó al crearla por medio del editor de imágenes. También pueden ser logrados algunos efectos deseados en la imagen.
Planos: Planos son folios virtuales que contienen algunos elementos de la imagen que el usuario desea mantener separados del resto. Estos elementos se pueden estar distribuidos por sobre toda la imagen. Planos pueden ser marcados visibles o invisibles, pueden ser antepuestos o postergados en relación a otros planos. Ver Técnica de planos.
Color: El color juega en la edición de imágenes un rol importante. Las cualidades del color de la imagen pueden ser cambiadas con estas herramientas, como el tono, el matiz, valor o luminosidad, contraste simultáneo, la saturación, el modelo de color (RGB, CMYK, HSV)
Modelo de color y profundidad del color: Una imagen puede ser llevada al modelo de color deseado y posible: Bitmap, tonos grises, colores indexados, dúplex, RGB, Lab y CMYK. Según el modelo de color se obtiene una diferente profundidad de color. Se distingue según la profundidad de color entre color verdadero, Color de alta resolución, color indexado, pero también entre tonos gises, blancos y negros.
Filtro: Las imágenes pueden ser modificadas por medio de filtros. Estos pueden dar a la imagen un aspecto más amarillento par envejecer la imagen, más brillante, pueden crear un relieve sobre la imagen o hacer aparecer una fuente de luz o disminuor la nitidez de la imagen.
Efectos: Se le puede dar a la imagen un efecto especial, como movimiento, vista tras un vidrio con gotas de lluvia, tipo mosaico, etc.
Fotomontaje: En el Fotomontaje varias imágenes son añadidas en una especie de composición.
Retirar: Regiones innecesarias de una imagen son retiradas para utilizar solo los objetos con que se quiere trabajar o resaltar. Es decir es un proceso que es posterior a la Selección y anterior al Collage, Fotomontaje u otros.
Histograma: Con un Histograma de una imagen se pueden corregir fallas en la distribución de los colores de la imagen. Es muy importante en la corrección de fallas en los tonos.
Invertir: Con la inversión del color se cambia el color de un píxel por el opuesto en el modelo de color RGB substrayendo para cada color, R, G, B, el valor del color del máximo (255).
Lazo: Con el lazo el usuario puede seleccionar una región con una línea trazada a pulso.
Pintar: Una de las funciones más básicas de un editor de imágenes es la función pintar. Para ello se pueden utilizar diferentes herramientas como lápiz, spray, etc.) para simular diferentes técnicas de pintura. Se debe diferenciar "pintar" de "dibujar"; Al pintar se cambian las características de cada pixel, uno por uno. Al dibujar se definen lugares geométricos por medio de definiciones matemáticas (vectores o senderos) como círculos, elipses, curvas, etc. Más tarde esas figuras geométricas son convertidas en pixel, pero hasta entonces son objetos geométricos.
Enmascarar: Al enmascarar se selecciona determinadas regiones de la imagen para sustraerlas de la elaboración que viene. Se puede ampliar con un pincel o reducir con el borrador. De esta manera se puede trabajar sin dañar otras regiones.
Dibujar: Con vectores o senderos se pueden dibujar elementos geométricos sencillos. Para dibujar vectores más complejos debe usarse un programa para Scalable Vector Graphics.
Pipeta: La pipeta sirve para captar desde la imagen el color de un pixel determinado para copiarlo en otras regiones.
Borrador: Con él se eliminan las informaciones guardadas en un pixel determinado. Sus propiedades, tamaño y transparencia, pueden ajustarse a las necesidades.
Nitidez: Reducir o aumentar la nitidez de la imagen para por ejemplo esconder algún trasfondo indeseado.
Texto: Permite escribir texto sobre la imagen, con elección de tipo, tamaño, color, dirección de la escritura.
Varita mágica: Herramienta para seleccionar todos los píxeles que tengan un color dentro de un rango determinado.
Zoom: Para muchos trabajo a realizar es necesario una visión más detallada de la región, por ejemplo para corregir errores. Esto se obtiene con la herramienta zoom que aumenta o disminuye el acercamiento virtual de la imagen. Las imágenes modificadas por el editor de imágenes digitales se utilizan posteriormente en publicaciones: revistas, catálogos, libros y otros medios impresos y electrónicos. Rostros sin arrugas, piel inmaculada, paisajes perfectos y otras características son una consecuencia de la elaboración digital, lo cual borra cada día más las fronteras de la realidad. Por ello, la edición de imágenes digitales se puede utilizar intencionalmente para la manipulación de imágenes. Sin embargo, no podemos dejar sin considerar el factor Arte.
2 APRENDIZAJE INDIVIDUAL 2.1 Responde en tu cuaderno: ¿Qué es el diseño gráfico? ¿Cuáles son las clases de diseño que existen? Busca en internet y define cada una de las clases de diseño. ¿Conoces otras páginas de edición gráfica Online? SI NO ¿Cuáles? _________________________________________________________________ __________________________________________________________________ __________________________________________________________________ _____________ 2.2 Utiliza una foto sencilla. Abre el navegador de Internet y escribe la siguiente dirección: www.writeonit.org/es/. Carga la foto y aplica algunos efectos; guarda el archivo. Si lo deseas, abre otro enlace de edición gráfica y aplica más efectos.
2.3 Ubica el nombre de cada propiedad de la caja de herramientas de Corel Draw
2.4 Trabajemos nuestro primer archivo de Corel (*.CDR): escritorio.
WallPaper ó fondo de
Resolución: 1024x768 pixeles. Fondo: Color y diseño creativo. Imagen: Tu grupo de amigos (5 estudiantes)
3 APRENDIZAJE EN GRUPO En grupo de tres estudiantes, y en una hoja en blanco, realiza la siguiente actividad: Escoge uno de tus compañeros del grupo (al azar), e intenta dibujar su proporción anatómica facial.
NOTA: ANEXA EL DIBUJO A ESTA GUÍA DE APRENDIZAJE Y LUEGO LEGAJAR.
4 SAY IT IN ENGLISH
DRAW GRAPHICS TEXT TABLE FILE EDIT VIEW EFFECTS BITMAPS HELP
5 INFOTAREA
Entra al blog del Área de Tecnología e Informática, y sigue los pasos que allí se muestran para elaborar un logotipo con CorelDRAW.
http://tecnocomfacesar.blogspot.com Guía práctica para Décimo
TEMA: RETOQUE DIGITAL TIEMPO: DOS (2) UNIDADES DE CLASE
6
INDUCCIÓN
El retoque fotográfico ó digital es una técnica que permite obtener otra imagen modificada, ya sea para lograr una mejor calidad o más realismo, o para obtener una composición totalmente diferente que distorsione la realidad. Para llevar a cabo dicho proceso, se utilizan mayoritariamente programas informáticos.
Utilizando distintas técnicas de retoque fotográfico es bastante simple mejorar la calidad de las imágenes originales procesadas, consiguiendo así un resultado notablemente superior en calidad con respecto a la imagen original. Además también pueden conseguirse efectos impactantes o simplemente corregir diversos errores en las imágenes originales. Antes de la existencia de la fotografía en color era muy frecuente emplear acuarelas líquidas u otros pigmentos para ofrecer la imagen coloreada. Las técnicas de retoque fotográfico digital son hoy en día muy utilizadas como método de postproducción, sobre todo en ámbitos donde la imagen es lo que vende.
7 APRENDIZAJE INDIVIDUAL Realiza el siguiente procedimiento: a) Abre CorelDraw. b) Cambia ó establece las unidades a centímetros. c) Importa (ó copia y pega) la imagen al area de trabajo. d) Selecciona la imagen y haz clic en Editar mapa de Bits… e) Notarás que se abre la aplicación de Corel PhotoPaint; elige la herramienta zoom y amplia el área a retocar. f) Selecciona la herramienta Clonar; define tamaño, trasparencia y degradado (fundido). Ten en cuenta que el fundido y la trasparencia este entre 90 y 100. g) Haz clic derecho sobre el área cercana a la parte afectada, y luego clic sobre el área a corregir. h) Al terminar, presiona F4; clic en la herramienta selección, copia la imagen y pégala en CorelDRAW. Analiza el antes y el después. 8
APRENDIZAJE EN GRUPO
En pequeños grupos de tres estudiantes, realiza el siguiente procedimiento: Paso 1: Para empezar ejecutamos Adobe Photoshop y abrimos la imagen especificada.
Paso 2: Lo siguiente a realizar es alizar la piel de la modelo, lo vamos a hacer creando una Mascara Rápida, para hacerlo debemos pasar al Modo Mascara Rápida presionando la letra Q o en su correspondiente botón en la Barra de Herramientas, estando en ese modo, con la Herramienta Pincel y desbloqueada la capa Fondo o Background, pintamos la parte a corregir, que vendría a ser el rostro (omitiendo los ojos, boca, orificios de la nariz y el pelo). Una vez pintado todo el rostro, salimos del Modo Mascara Rápida de la misma forma que cuando la activamos. De esa forma nos quedara seleccionado el rostro, luego de esto, vamos a Selección-> Invertir. Aclaración: para los rostros que tengan imperfecciones, las podemos corregir utilizando la Herramienta Pincel Corrector multiplicando la capa Fondo o Background.
Paso 3: Ahora, teniendo el rostro seleccionado, debemos ir a Capa-> Nueva-> Capa vía Copiar, luego vamos a darle un Desenfoque Gaussiano, para ello vamos a Filtro-> Desenfocar-> Desenfoque Gaussiano y configuramos con muestro en la imagen de abajo, ahora a la capa le bajamos la Opacidad a 52%, después vamos a Filtro-> Ruido-> Añadir Ruido y configuramos como muestro en la siguiente imagen (Ver figura 1).
Figura 1.
Paso 4: Teniendo la piel lista, procederemos a empezar con el maquillaje. Primero tenemos que delinear los ojos de la modelo, haciendo esto daremos más profundidad a los ojos. Para realizarlo debemos usar la Herramienta Pluma, en este stock deberemos delinear el borde superior e inferior del ojo. Lo que haremos primero es delinear el borde inferior creando una línea gruesa con la Herramienta Pluma como se muestra en la figura 2. Luego de tener la línea creada, creamos una nueva capa y hacemos clic derecho, luego nos vamos a Rellenar trazado… y en Usar elegimos la opción Color…, en la ventana que sale tenemos que
elegir Color Negro (#000000) y apretamos en OK en las dos ventanas para que se cree el relleno, luego apretamos la tecla Escape para que desaparezca el trazado que hicimos con la pluma. Teniendo la línea creada, con la Herramienta Borrador, difuminamos un poco los bordes del trazado para darle más realismo al delineado, luego a la capa le bajamos la Opacidad a 50%. A las capas creadas en este último paso, que vendrían a ser cuatro, las juntamos en un grupo llamado Delineado. Volvemos a hacer todo el paso en el borde superior, luego hacemos lo mismo en el otro ojo.
Paso 5: Ahora procederemos a colocar la sombra a los ojos de la modelo. Esto lo haremos con la Herramienta Pincel con un color que combine, yo he utilizado de color un tono similar al del cabello de la modelo, es un colorado oscuro (#ac3301), teniendo el color seleccionado, creamos un nuevo grupo sobre el grupo llamado Delineado, y lo nombramos Sombra, dentro, creamos una nueva capa, en esta ya podemos ir pasando unas pinceladas con un pincel circular con la dureza al 0% por el parpado de ambos ojos como muestro en la imagen de abajo. Luego a la capa, le cambiamos el Modo de Fusión a Luz Suave. Creamos una nueva capa y cambiamos el color por uno más claro pero siempre teniendo el mismo tono, en mi caso #d0521e y damos pinceladas de la misma forma un poco más arriba que la anterior, después vamos a Filtro-> Desenfocar-> Desenfoque Gaussiano y le damos un valor en Radio de 8,5 pixeles. Finalizado eso, le cambiamos el Modo de Fusión a Luz Suave. Si buscamos más realismo, a la capa anterior le podemos también dar un Gaussiano de 3,8 pixeles. Con la Herramienta Borrador, eliminamos las imperfecciones, como superposiciones con los ojos o con las cejas. Luego, debemos realizar el mismo procedimiento en una nueva capa pero esta vez rodeando el ojo entero y con un pincel más chico. Volvemos a cambiarle el Modo de Fusión a Luz Suave a las capas.
Figura 2.
Paso 6: En el paso anterior ya terminamos con lo que sería el maquillaje en la zona de los ojos, ahora debemos continuar con lo que resta de la cara, en este caso vamos por la boca. En la boca lo primero que debemos corregir son sus dientes. Para corregir sus dientes, es decir, crear el efecto Dentadura Brillante. Este efecto es muy sencillo y si se realiza correctamente obtendremos un resultado excelente que ni se notara el retoque en la dentadura de la modelo. Para poder realizarlo, lo primero que debemos hacer es seleccionar nuestro Pincel Redondeado con un valor de 17px. (aprox.) y procedemos a rellenar con pintura blanca cada uno de sus dientes. Le bajamos la opacidad a la capa de la pintura blanca, dándole un valor de 60% de Opacidad, quedándonos como
resultado lo que observamos en la imagen. Una vez realizado eso, para que nos quede un poco mas prolijo nuestro trabajo debemos utilizar la herramienta Borrador y cuidadosamente ir borrando los restos de pintura blanca que quedan en la dentadura de la modelo, quedando así terminado este paso y una dentadura brillante para la modelo.
9 EVALUACIÓN Evalúa tu desempeño en las actividades propuestas: Aspectos
Valoración
Para Mejorar mi desempeño puedo:
Participe en las actividades Presente con calidad los trabajos Alcance el objetivo Cumplí con la presentación de trabajos
10 REFERENCIAS BIBLIOGRÁFICAS
http://es.wikipedia.org/wiki/Diseño_gráfico
Guía del usuario de CorelDRAW Graphics Suite X3
ESPACIO RESERVADO PARA EL DOCENTE FECHA
OBSERVACIONES Y/O NOTAS
SUGERENCIAS
@ GUÍA DE APRENDIZAJE No.1
ÁREA DE TECNOLOGÍA E INFORMÁTICA –[Grado]: 11º Colegio
Nombre del Estudiante: Asignatura/Taller: Tecnología e Informática Tema:
Curso: Período: Primero
Introducción a la programación orientada a eventos
DD MM
2011
Media Vocacional Administrador (es) de Programa: Ing. WILBER MEJIA NAVARRO Proceso
Visual Basic: Elementos básicos. ESTRATEGIAS DE APRENDIZAJE INDICADOR DE AUTONOMIA
META DE APRENDIZAJE
Lluvia de Ideas , Relación de Información Solución de Problemas
« Escribe aquí tu meta »
INDICADORES DE DESEMPEÑO o Diferencia funciones y procesos informáticos sobre la parte básica de programas, por medio de la presentación de aplicaciones orientados a eventos. o Asume con responsabilidad y empeño las actividades propuestas para cumplir con sus compromisos académicos y la presentación del trabajo de aplicación. DURACIÓN: Siete (7) unidades de clase RECURSOS: Guía cátedra inaugural (Para legajar en carpeta y todas las guías que se entreguen durante el año), Computador, Software VB 6.0, cuaderno y portafolio. 1
INDUCCIÓN: Visual Basic es un lenguaje de programación orientado a eventos, desarrollado por el alemán Alan Cooper para Microsoft. Este lenguaje de programación es un dialecto de BASIC, con importantes agregados. Su primera versión fue presentada en 1991, con la intención de simplificar la programación utilizando un ambiente de desarrollo completamente gráfico que facilitara la creación de interfaces gráficas y, en cierta medida, también la programación misma. La palabra "Visual" hace referencia al método que se utiliza para crear la interfaz gráfica de usuario. En lugar de escribir numerosas líneas de código para describir la apariencia y la ubicación de los elementos de la interfaz, simplemente podemos agregar objetos prefabricados en su lugar dentro de la pantalla, que ahorran mucho tiempo de programación.
1.1 Activación de saberes previos. ¿Qué es un programa? __________________________________________________________________ __________________________________________________________________ _____________ ¿Qué es programación? __________________________________________________________________ __________________________________________________________________ _____________ ¿Qué es un evento? __________________________________________________________________ __________________________________________________________________ _____________ ¿Qué es una interfaz? __________________________________________________________________ __________________________________________________________________ _____________ 1.2 Información Una de las ciencias que se han desarrollado con mayor velocidad ha sido la informática; ésta se apoya en el hardware y el software para procesar de manera automática la información. Pero antes de hablar de un proceso de programación, se ha preguntado ¿qué es programación?, ¿quién es el programador y cuáles son sus funciones?, o ¿para qué sirve un lenguaje de programación?, pues bien: Un programa es una lista de instrucciones que el computador ejecuta de manera lógica y ordenada para proporcionar respuestas de interactividad con el usuario. En él intervienen los datos (información suministrada por el usuario al sistema), los procesos (transformación de los datos) y los datos de salida (resultados de la aplicación). Puede hacerse una analogía entre programa de computador y cualquier actividad que realiza el ser humano ya que éste lleva una secuencia de acciones (intuitivas) para satisfacer sus deseos, por ejemplo para realizar un trabajo de investigación, define el tema por consultar, busca los medios (libros, impresos, videos, etc) donde posiblemente se encuentra la información, la extrae, la sintetiza y hace conclusiones. El programador es la persona que se encarga de escribir el código de instrucciones en cierto lenguaje de programación, que satisface a través de una aplicación, las necesidades del usuario. La labor que desempeña el programador es de gran importancia puesto que la mayor parte del éxito de un software depende de la creatividad de éste. Entre las funciones de un programador se encuentran: Crear una interfaz gráfica agradable y útil
para el usuario Maximizar el rendimiento del sistema Adaptar la aplicación a diferentes plataformas operativas. Establecer el lenguaje de programación más favorable para el desarrollo de la aplicación. Crear un manual del programador como guía de procesos, procedimientos y datos, que le permita a otros programadores entender rápida y fácilmente la función del código fuente de la aplicación. Verificar que la aplicación se ejecute correctamente, con las alternativas que muestra. Solucionar errores de compilación e implantación del programa. Velar por el mantenimiento y actualización de la aplicación, según se vaya requiriendo la necesidad. La herramienta utilizada por los programadores para indicarle al computador lo que debe hacer para atender una solicitud del usuario son los lenguajes de programación.
LA INTERFAZ. Visual Basic es un lenguaje de programación que permite realizar programas relacionado con la automatización de procesos. La programación que se realiza en el ambiente Windows está orientada a objetos y manejada por eventos, lo que significa que el código de los programas se divide en bloques, los cuales están asociados a botones o iconos que permiten manejar eventos específicos, como digitar una tecla o hacer clic a algún botón del ratón. Si se da cuenta, nota que la interfaz de V.B., es similar a las ventanas de Microsoft, aunque este es un lenguaje que pertenece a la suite de Macromedia.
CREAR UNA APLICACIÓN EN VISUAL BASIC Hay tres pasos principales para crear una aplicación en Visual Basic:
Ojo, TECNOTÍZATE. Ten en cuenta estos pasos. Oe!
Crear la interfaz. Establecer propiedades. Escribir el código.
Crear la interfaz. Los formularios (en palabras sencillas son los “pantallazos”) son la base para crear la interfaz de una aplicación. El primer paso para generar una aplicación de Visual Basic consiste en crear los formularios que van a ser la base de la interfaz de su aplicación. Después dibuje los objetos que van a componer la interfaz en los formularios que ha creado. Establecer propiedades. Una vez conocidos los formularios que se van a desarrollar o a tener en cuenta, se procede a establecer, las propiedades que tendrán los
botones dentro de cada formulario, donde se ubicara el texto, los objetos y que evento ejecutara cada uno de los botones puestos. Escribir el código. La ventana Editor de código es el lugar donde escribe el código de VB para su aplicación. El código consta de instrucciones del lenguaje, constantes y declaraciones. Mediante la ventana Editor de código puede ver y modificar rápidamente el código de su aplicación. Crear procedimientos de evento. El código en una aplicación de VB se divide en bloques menores llamados procedimientos. Un procedimiento de evento, como los que creará aquí, contiene código que se ejecuta cuando se produce un evento (como cuando un usuario hace clic en un botón). Por ejemplo, si quiere que un botón de comando llamado Command1 invoque un procedimiento de evento cuando se haga clic en él, utilice el procedimiento Command1_Click.
2 APRENDIZAJE INDIVIDUAL Analiza la interfaz que te muestra el programa de Visual Basic. Especifica sus partes en el siguiente esquema:
3 APRENDIZAJE EN GRUPO En pequeños grupos de tres estudiantes realicen la siguiente actividad: a) Realicen un mapa conceptual sobre lo que implica programar, los pasos para crear una aplicación. b) En el cuaderno consignen las respectivas partes de la interface de Visual Basic. c) ¿En que se diferencia esta interfaz con respecto a las otras ventanas de Microsoft ó programas de Office? _______________________________________________________________________ _____________________________________________________________________ _____________________________________________________________________ _____________________ d) Ingresen a Visual Basic (Inicio\Programas\Visual Studio\Visual Basic 6.0\) e) Ubicados en el Form1, noten que pertenece a un proyecto, que es un conjunto de formularios. El trabajo siempre se hace sobre el formulario Form y este será el pantallazo en la ejecución. Más adelante se le darán propiedades al formulario. f) El texto que se va a escribir en el formulario, se define también desde este sitio, ubicado en la barra de herramientas, eligiendo los botones respectivos, que darán propiedades de color y tamaño. Observe las propiedades que tiene el siguiente botón, que al colocarlo en el formulario, es para escribir un texto, entonces que propiedad se deben tener en cuenta para: Escribir el texto: _______________________ Darle color a ese texto: _____________________ Darle un tipo de fuente y tamaño diferente: ____________________ Ocultar/Mostrar el texto inicialmente: ____________________ Para darle color al fondo: _________________________ g) Ahora observe las propiedades de este botón, que se utiliza para el ingreso de datos ya sea numérico o de carácter, escriba entonces las propiedades básicas que tiene para: Escribir el texto dentro del cuadro: _______________________ Darle color a ese texto: _____________________ Darle un tipo de fuente y tamaño diferente: ____________________ Para darle color al fondo: _________________________ Ocultar /Mostrar el texto inicialmente:_____________________________ h) Ahora observe las propiedades de este botón, que se utiliza para ejecutar un evento, escriba entonces las propiedades básicas que tiene para: Escribir el texto dentro del cuadro: _______________________ Darle un tipo de fuente y tamaño diferente: ____________________
Colóquenle el texto ocultar/mostrar a este botón.
Los tres botones antes mencionados, debe aparecer en un formulario con características diferentes en color, texto, fondo y fuente.
i) En la caja de herramientas hay un Objeto llamado CommandButton, que significa que al accionarlo, se deberá ejecutar un evento. Ubiquen sobre el formulario, tres botones de estos, que aparecerán numerados. Cámbienle el nombre a estos botones por: Mostrar, Borrar, Salir y en cada uno, una vez seleccionados: Propiedades\Caption les dan el titulo correspondiente. Ahora, ubicados en el botón de Mostrar, le presionan doble clic y aparece la ventana de código; digiten las siguientes instrucciones: (Lo que está en negrilla es la que aparece por defecto):
Private Sub Command1_Click() Print "Colegio Comfacesar Rodolfo Campo Soto -TECNOTIZATE" End Sub Ingresen nuevamente a visualizar objeto (Formulario) y allí, doble clic, al botón de comando Borrar y aparece la ventana de código, digite lo siguiente: Private Sub Command2_Click() Cls End Sub
Ingresen nuevamente a visualizar objeto (Formulario) y allí, doble clic sobre el botón Salir e ingresen a la ventana de codificación, digiten las siguientes instrucciones:
Private Sub Command3_Click() End End Sub
j)
Una vez colocados los objetos con su respectiva programación, se ejecuta el programa y se valida (si hay errores para corregir). Se puede Ejecutar por los botones de la barra de Herramientas: Ejecutar, Detener y dar Pausa.
O por la barra de Menú Ejecutar.
k) Al botón de Command Button, que tiene el letrero ocultar/mostrar, se desea que cuando se le haga clic, oculte/muestre los dos botones de texto que se hicieron inicialmente. l)
Utilizando el mismo procedimiento, creen otro formulario (Menú Proyecto\ Agregar Formulario). Simulen la portada de un proyecto, con el título, los integrantes, el año y la ciudad. Realizar los botones que muestren los datos, los borre y salga del programa.
m) Creen otro formulario y realicen la misma portada, pero sin utilizar botones de comando únicamente botones Label; utilizar solo un botón de comando que sea el de Salir. 4 INFOTAREA
En un documento de Microsoft Word, responda las siguientes preguntas. Adjunte el archivo y envíelo al correo electrónico del área de tecnología e informática (areatecno.colcomfacesar@gmail.com). a) ¿Qué es un programa? b) ¿Qué es un programador? c) Enuncie 5 funciones de un programador d) De las funciones del programador mencionadas, ¿Cuáles has hecho? e) ¿Qué es un evento? f) ¿Qué es un objeto? g) ¿Qué es programación orientada a objetos? h) ¿Qué es un procedimiento? i) ¿Qué es una propiedad” j) Busca en Internet, interfaz de usuario (imágenes) y ubica la que más te llame la atención. Pégala en el documento.
TEMA: Programación con VB –Elementos básicos TIEMPO: Cinco (5) Unidades 5 INDUCCIÓN 5.1 Activación de saberes previos
De la siguiente gráfica (cuadro de herramientas), especifica con una línea los controles: LABEL, FRAME, TEXTBOX, COMBOBOX, TIMER, IMAGE, PICTUREBOX, OPTIONBUTTON, COMMANDBUTTON.
timer
Abre Visual Basic y desarrolla el siguiente programa: Ejemplo 1: Sencillo programa de colores y posiciones En la Figura 1 se muestra el formulario y los controles de un ejemplo muy sencillo que permite mover una caja de texto por la pantalla, permitiendo a su vez representarla con cuatro colores diferentes. En la Tabla 1 se describen los controles utilizados, así como algunas de sus propiedades más importantes (sobre todo las que se separan de los valores por defecto). Los archivos de este proyecto se llamarán Colores.vbp (proyecto) y FrmColores.frm (formulario).
Frame1: fraColores
Text1: txtCaja
Frame2: fraPosicion
A continuación se muestra el código correspondiente a los procedimientos de este ejemplo. Private Sub Form_Load() txtCaja.Top = 0 End Sub Private Sub optArriba_Click() txtCaja.Top = 0 End Sub Private Sub optAbajo_Click() txtCaja.Top = frmColores0.ScaleHeight - txtCaja.Height End Sub
Private Sub optAzul_Click() txtCaja.BackColor = vbBlue End Sub Private Sub optRojo_Click() txtCaja.BackColor = vbRed End Sub Private Sub optVerde_Click() txtCaja.BackColor = vbGreen End Sub Private Sub optAmarillo_Click() txtCaja.BackColor = vbYellow End Sub 5.2 Información Un lenguaje de programación permite realizar sus propios procedimientos y programas sobre los cuales tendrá control directo el programador y se podrá determinar desde su funcionamiento interno hasta la estructura de la presentación del programa.
Ciclo de desarrollo de una aplicación en Visual Basic Planeación
Diseño Gráfico de la Interfaz
Programación de eventos
La primera etapa debe superarse al iniciar la tarea de programar es la planeación; consiste en entender la situación y preparar una lista de pasos para solucionarlo. Esa lista ordenada de pasos se llama algoritmo.
La fase del diseño de la interfaz consiste en crear pantallas mediante las cuales interactuará el usuario con la aplicación: En términos de V.B., es insertar en el formulario los controles necesarios y adecuados para introducir o visualizar la información. Para crear una interfaz gráfica, tenga en cuenta: Objetivo el programa A quien va dirigido Aspecto deseado Finalmente, la etapa de programación de eventos consiste en asociar las instrucciones, en la ventana de código, que se ejecutarán como resultado de una acción sobre determinado objeto (hacer clic, abrir una formulario, escribir texto, etc.)
Constantes
Las constantes son elementos (números, fechas, cadenas de caracteres y expresiones) que mantienen un valor fijo durante la ejecución de la aplicación. Las constantes tienen gran importancia en la programación, permitiendo estandarizar valores inmodificables que son decisivos para el buen desempeño de la aplicación. V.B. Declaración de constantes El nombre del identificador de esa constante (nombre de la constante que debe comenzar por letra, poseer un nombre único para todo el procedimiento, debe tratar de ser mnemotécnico (que su contenido coincida con el nombre), no puede exceder de 255 caracteres de longitud y no puede tener espacios en blanco y el valor es el dato fijo que tomará la constante durante toda la ejecución del programa; puede ser un número, un carácter, una cadena de caracteres, una fecha, una combinación de letras y números, etc. Ejemplos Const Pi As Double = 3,14,16 Private Const año=2008 Public Const Titulo = “Bienvenido al Primer programa de Visual” Variables Son elementos de programación usados para almacenar valores que pueden cambiar su contenido durante la ejecución del programa. Ejemplos Dim nombre [As tipo] Donde: Dim los valores declarados permanecen durante la ejecución del programa o módulo. Nombre es la palabra que identifica el nombre de la variable y tiene las mismas características de nombre de las constantes. Tipo es la clase de dato que determina la información. (Ver ejemplos) Ejemplos Dim mipaís as String
Dim numeroprimo as Integer Dim Hora_inicial as Date Dim num1,num2 as Integer, nota1,nota2 as Double, nombre as string Operadores Aritméticos Son símbolos utilizados para ejecutar cálculos con expresiones numéricas. Las expresiones numéricas son aquellas que permiten ser evaluadas como números, pueden incluir palabras reservadas, constantes, variables y operadores que generen como respuesta un número. Símbolo
Uso
Sentencia
Descripción
=
a=b
a=b
Asigna el valor de b a a
+
a+b
a=a+b
Suma a+b y lo asigna a a (acumulador)
-
a -b
a=c-b
Resta c-b y lo asigna a a
*
a *b
a=a*b
Multiplica a*b y lo asigna a a
/
a /b
d=a/b
Divide a/b y lo asigna a d
a Mod b
res=a mod b Residuo de la división a/b y lo asigna a res
a ^b
a=b^c
Mod ^
Eleva b a la c y lo asigna a
Operadores relacionales Se emplean para comparar dos expresiones y generar un resultado Booleano (verdadero o falso). Operador
6
Significado
Ejemplo
=
Igual a
a =b
<>
Diferente a
a <> b
>
Mayor que
a>b
<
Menor que
a<b
>=
Mayor o igual que
a >=b
<=
Menor o igual que
a<=b
APRENDIZAJE EN GRUPO
En el cuaderno escriba el siguiente cuestionario: ¿Qué comentarios puedes hacer acerca del programa de colores y posiciones? ¿Cuáles son los pasos para realizar un programa?. Explique cada uno ¿Qué es un resultado Booleano?
¿Qué es un operador aritmético?, construya dos expresiones con estos operadores, incluyendo paréntesis y en el otro, coloque los mismos números pero cambie la ubicación de los paréntesis, dé los dos resultados ¿fueron los mismos?. ¿Qué es un operador relacional?, construya dos expresiones con estos operadores, utilizando variables y constantes y dé la respuesta booleana. Se debe imprimir el nombre, la edad, el número de identificación, el teléfono de una persona, si gana más que el salario mínimo que está en $515.000. ¿Qué tipo de variables se deben declarar para imprimir esta información? Resuelva las siguientes expresiones Si los identificadores a y b, toman durante el programa diferentes valores, cuáles serían los resultados para las siguientes expresiones y deduzca que tipo de variables son a y b. a
a=b
b a
2
1
1
2
0
1
1
3
3
1
2
3
3
2
b
a =a+b
a=a-b
a=a*b
a=a/b
a
a
a
a
b
b
b
b
Realice las siguientes expresiones y coloque su resultado. qué expresiones son iguales? 1. A= (5+7)*(5+4)/2 R: A= 7. B=(8*6)+(4/2)*(6*2) R: B= 2. A= 5+7*(5+4)/2
R: A=
8. B=(8*6+4)/2*(6*2)
R: B=
3. A= (5+7)*5+4/2
R: A=
9. B=(8*6)+(4/2*6*2)
R: B=
4. A= 5+7*5+4/2
R: A=
10. B=(8*6)+4/(2*6*2)
R: B=
5. A= (5+7*5+4)/2
R: A=
11. B= 8*6+4/(2*6*2)
R: B=
6. A= (5+7*5)+4/2
R: A=
12. B= 8*(6+4)/2*6*2
R: B=
7
APRENDIZAJE EN GRUPO
Realicen y ejecuten una aplicación en V.B, donde se pidan dos números e imprima las cinco operaciones básicas entre ellos (suma, resta, multiplicación, división y potencia). Realicen y ejecuten una aplicación en donde se pida un número por teclado y se imprima su respectiva tabla de multiplicar hasta 10.
8
SAY IT IN ENGLISH
Macth TEXTBOX
CUADRO COMBINADO
LABEL
CONTENEDOR
COMMANDBUTTON
CAJA DE TEXTO
OPTIONBUTTON
BOTON DE OPCIÓN
CHECKBOX
CUADRO DE LISTA
FRAME
IMAGEN
TIMER
CUADRO DE COMANDO
COMBOBOX
CASILLA DE VERIFICACIÓN
LISTBOX
RELOJ
IMAGE
ETIQUETA
9
EVALUACIÓN
Realiza y ejecuta una aplicación en donde se pida un número por teclado y se imprima su respectiva tabla de multiplicar hasta 10. Agrega propiedades como fondo, títulos, imágenes, etc. Puedes incluso, hacer un diseño con CorelDRAW e insertarlo como fondo de tu formulario. Evalúa tu desempeño en las actividades propuestas: Aspectos Participe en las actividades Presente con calidad los trabajos Alcance el objetivo Cumplí con la presentación de trabajos
Valoración
Para Mejorar mi desempeño puedo: