EVALUACION HERRAMIENTAS DIGITALES 

 VALIDACIONES  PRIMARIA  SEXTO  SEPTIMO

Actividad Noveno 20 Marzo 2025                         Crear presentación con Canva

En Colombia hay muchos problemas ambientales que afectan a las comunidades y al  planeta ?

Temas:

Deforestacion.

Contaminación del agua

Contaminación del aire

Mineria ilegal

Cambio climático 

Perdida de biodiversidad

Erosión del suelo

Desastres naturales

Casa furtiva y tráfico de especies

Destrucción de paramos

Entregar el tema de una problemática  para que elaboren una presentación  o cartelera, la expongan y la expliquen de la mejor manera.

https://padlet.com/estudiantesnorsupam/en-colombia-hay-muchos-problemas-ambientales-que-afectan-a-l-unblr1ex5n6de2u

SUBE TU TRABAJO AL  TABLERO

CREAR UN JUEGO Q*BERT

CONSOLA https://codepen.io/alexandrix/pen/oQOvYp

Este código HTML y CSS está diseñado para representar una versión pixelada de Q*bert y su pirámide en un estilo basado en sombras y colores en CSS. Vamos a desglosarlo:

1.               Explicación del HTML

<div id="game">

  <div id="qbert"></div>

  <div id="pyramid"></div>

</div>

• <div id="game"> → Contenedor principal del juego.

• <div id="qbert"> → Representa al personaje Q*bert.

• <div id="pyramid"> → Representa la pirámide sobre la que se mueve Q*bert.

2.               Explicación del CSS

El código CSS usa variables (aunque @ indica que está escrito en un preprocesador como LESS o SASS) para definir los colores de distintos elementos del juego.

1.               Variables de color

@top: #dde345;   /* Color de la parte superior de los cubos */

@left: #56a993;  /* Color del lado izquierdo */

@right: #314840; /* Color del lado derecho */

@path: #5a45ec;  /* Color del camino */

@bod: #fc6b19;   /* Color del cuerpo de Q*bert */

@bodsh: #c9401a; /* Sombra del cuerpo */

@boddk: #222; /* Color oscuro del cuerpo */

@bodlt: #fff; /* Color claro (resaltado) */

2.               1. Estilos generales

body {

  background: #2c2c2c; /* Fondo oscuro */

}

#game {

  margin: 30px auto;

  position: relative;

  width: 50px;

}

• Se establece un fondo oscuro para resaltar el juego.

• #game se centra horizontalmente y se mantiene relativamente pequeño.

3.               2. Estilos de Q*bert (#qbert)

#qbert {

  background: @bod; /* Color del cuerpo */

  height: 5px;

  position: absolute;

  width: 5px;

  top: 36px;

  left: 51px;

  z-index: 50;

  animation: hop .75s infinite;

}

• Se usa un div muy pequeño (5px x 5px) como punto de referencia para el personaje.

• Se coloca en una posición inicial (top: 36px, left: 51px).

• z-index: 50; lo coloca sobre otros elementos.

• Se aplica una animación llamada hop para simular el salto.

1.               Efecto pixelado de Q*bert con box-shadow

box-shadow:

  5px 0 0 @bod,

  10px 0 0 @bod,

  -5px 0 0 @bod,

  0 5px 0 @bod,

  5px 5px 0 @bodsh,

  10px 5px 0 @bodsh,

  15px 5px 0 @bodsh,

  ...

• En lugar de usar una imagen, se crea a Q*bert con sombras en CSS (box-shadow), colocando pequeños "píxeles" en distintas posiciones.

• Se usan las variables de color para darle volumen y efecto de sombra.

2.               Boca y expresión de Q*bert

#qbert:before {

  content: '\0020';

  border: solid 14px transparent;

  border-left: 0;

  border-right-color: @bodlt;

  position: absolute;

  top: -12px;

  left: 46px;

  transform: rotate(-30deg);

}

• Se usa :before para crear la trompa de Q*bert con bordes triangulares.

#qbert:after {

  content: 'S@#%$!';

  background: @bodlt;

  font-size: 20px;

  font-weight: bold;

  font-family: Arial, sans-serif;

  padding: 15px 20px;

  position: absolute;

  left: 50px;

  top: -30px;

  border-radius: 50%;

}

• Se usa :after para mostrar un globo de texto con la clásica censura que Q*bert decía al recibir daño (S@#%$!).

4.               3. La Pirámide (#pyramid)

#pyramid {

  height: 50px;

  width: 50px;

  background: @top;

  transform: rotate(45deg);

}

• Se crea un cuadrado rotado 45° para representar la pirámide.

1.               Sombreado y efecto 3D

box-shadow:

  30px 80px 0 @top,

  80px 30px 0 @path,

  60px 160px 0 @path,

  160px 60px 0 @path,

  110px 110px 0 @path,

 ...

• Se usa box-shadow para colocar cubos adicionales y crear la pirámide.

2.               Sombras laterales con :before y :after

#pyramid:before {

  content: '';

  height: 50px;

  width: 30px;

  background: @right;

  position: absolute;

  top: 15px;

  left: 50px;

  transform: skew(0deg, 45deg);

}

• Se usa :before para añadir el lado derecho de los cubos con un efecto de sesgado (skew).

#pyramid:after {

  content: '';

  height: 30px;

  width: 50px;

  background: @left;

  position: absolute;

  top: 50px;

  left: 15px;

  transform: skew(45deg, 0deg);

}

• :after crea el lado izquierdo de los cubos.

5.               4. Animación de salto (@keyframes hop)

@keyframes hop {

  from {top:36px;}

  to {top:20px;}

}

• Se crea un efecto de "salto" moviendo a Q*bert de top: 36px a top: 20px en 0.75s.

• Se aplica a #qbert con animation: hop .75s infinite;.

Encuesta Estudiantes Manual de Convivencia 2024 https://forms.gle/vqR1MaoZTRHoGAg16 

Encuesta Padres de Familia Manual de Convivencia 2024 https://forms.gle/c79k1dNoK2FtdG2y5 

Encuesta para estudiantes Evaluación Docente https://forms.gle/JfcKXdAWUJii6prq9

CONTENIDO

• Algoritmo

• PseudoCodigo

• SCRACH 

• Entorno de trabajo 

• Algoritmos 

• Manejo de coordenadas 

• Técnicas de digitación

• Practica con qué dedo y de que mano se de presionar cada tecla 

• Microbit

• Arduino

• LEGO WeDo 2.0

LOGROS

• Reconocer el ambiente que maneja el programa SCRACH. 

• Utilizar las herramientas para dibujar, colorear, animar textos y objetos. 

• Desarrollar un tema dirigido a los estudiantes de grados inferiores utilizando el tema visto.  

ACTIVIDADES PEDAGOGICAS

• Realización de prácticas en el ambiente que maneja el Programa de bloques( Scratch, Microbit, Lego)

• Desarrolla prácticas utilizando  las herramientas para dibujar, colorear, animar textos y objetos. 

• Realiza un proyecto de un tema  dirigido a los estudiantes de grados inferiores utilizando el programa SCRACH 

COMPETENCIA

Manejar conceptos referentes a la programación de computadores así como representar a través de algoritmos y diagramas de flujo soluciones a problemas planteados.

DESEMPEÑOS 

Cognitivo

- Maneja los conceptos de computadora, software, programas, programación, datos,  lenguajes, algoritmo, flujograma, seudocódigo, relacionados con la programación de computadores. 

- Identifica los elementos que hacen parte de las operaciones aritméticas y de las  expresiones lógicas y las jerarquías y reglas que se tienen en cuenta para resolverlas.

- Identifica los tipos de estructuras algorítmicas de acuerdo a sus características.

Procedimental

- Plantea y resuelve operaciones aritméticas y expresiones lógicas, teniendo en cuenta las normas establecidas y construye algoritmos y diagramas de flujo teniendo en cuenta secuencias lógicas para resolver los problemas planteados. 

- Construye algoritmos haciendo uso de las estructuras selectivas: si-entonces, si-entonces-sino, si anidadas, si múltiples.

- Construye algoritmos haciendo uso de las estructuras repetitivas: repetir, mientras, hacer - mientras.

Actitudinal

- Asiste regularmente a clases, participa en las prácticas en la sala de sistemas, cumple  con las actividades asignadas en el tiempo acordado y demuestra interés por superar sus dificultades. 

TEMAS

 - La computadora (Concepto de computadora, hardware, software, programas)

- Organización física de la computadora (dispositivos de entrada/salida, memoria principal, unidad central de procesos, memoria auxiliar)

- Lenguajes de programación (concepto, tipos de lenguaje)

- Algoritmo y diagrama de flujo (concepto de algoritmo, diagrama de flujo, seudocódigo, Scratch)

- Tipos de datos (datos simples, constantes y variables)

- Operaciones aritméticas (operadores, jerarquías, reglas para resolver expresiones 

aritméticas)

- Expresiones lógicas (operadores relacionales, operadores lógicos)

- Estructura y diseño de algoritmos y diagramas de flujo.

- Reglas para la construcción de diagramas de flujo

- Tipos de datos (datos simples, constantes y variables)

- Operaciones aritméticas (operadores, jerarquías, reglas para resolver expresiones 

aritméticas)

- Expresiones lógicas (operadores relacionales, operadores lógicos)

- Tipo de estructuras algorítmicas (Concepto de estructuras selectivas, repetitivas y 

arreglos)

- Estructuras  selectivas (si-entonces, si-entonces-sino, si anidadas, si múltiples)

- Estructuras repetitivas (repetir, mientras, hacer - mientras)

- Comprobar la funcionalidad de un algoritmo.

-  Elementos básicos del lenguaje Scratch 

- Operaciones básicas en Scratch 

- Estructura de un programa en Scratch 

- Estatuto If

- Estatuto If - else 

- If anidados

- Estatuto Switch

¿Qué es programación?

La programación informática es el arte del proceso por el cual se limpia, codifica, traza y protege el código fuente de programas computacionales, en otras palabras, es indicarle a la computadora lo que tiene que hacer. 

 
La programación informática es una de las habilidades esenciales que aprendes cuando estudias informática.
 

Detrás de todos los programas informáticos que conocemos y usamos de manera cotidiana para facilitarnos diversas actividades de nuestro día con día, existe todo un proceso para poderlos crear. Este proceso es conocido como programación, conozcamos un poco más sobre lo que conlleva este proceso.

Por medio de la programación se establecen los pasos a seguir para la creación del código fuente de los diversos programas informáticos.

Este código le indicara al programa informático que tiene que hacer y como realizarlo.

Gracias a una mujer, existe la programacion y estamos en  lo que vemos actualmente

Subir evidencias    https://forms.gle/RWpntB9famFQ2cec9

https://www.codemonkey.com/

https://www.minijuegos.com/juego/light-bot

Taller 2   SCRATCH 

Crea una obra literaria y recrea los personajes  con el uso de scratch.

En la obra literaria a tomar puede ser un cuento corto, mito o leyenda.

Requisitos:

·         Debe contar con mínimo 8 objetos que se programen y se muevan por nuestro escenario.

·         Se debe aplicar movimiento, cambio de apariencia, uso de sonidos, cambio de fondos, aplicación de decisiones.

·         Se aplicara las opciones para escribir mensajes como para preguntar al usuario.

·         Escribir una moraleja del contenido expuesto.

El programa se debe presentar ejecutándose y documento que describa cada elemento usado.

Aplique  fotogramas para explicar su historia.

Fecha para entrega del trabajo