Coding Giants
Inscripciones

Introducción

Los conceptos básicos de programación se implementan en el lenguaje Scratch. Es un lenguaje educativo, creado como una herramienta para enseñar a los niños los conceptos básicos de la codificación. Permite la creación sencilla de historias, animaciones o juegos interactivos. La programación se realiza de manera visual: los elementos del lenguaje tienen forma de rompecabezas, que dispuestos de manera adecuada crean un programa o juego de trabajo. Durante la primera mitad del curso también aprendemos sobre el uso de objetos de bloque. En la segunda parte del curso se introducen otros lenguajes y plataformas que nos llevarán al mundo de los juegos 3D. También intentaremos transferir juegos al mundo real con la ayuda de Makey Makey. ¡Emociones garantizadas!

Programa del curso

1Mi primer sitio web
Los alumnos aprenden qué son las matrices (listas) en MakeCode y cómo almacenar muchos valores bajo un mismo nombre. Durante la clase, crearán el juego «The Games - Parte 2», en el que el jugador recibe equipamiento de una matriz y se enfrenta a oleadas de monstruos invocados. El resultado final es una arena funcional con distribución automática de equipamiento y aparición de enemigos.
2Páginas de estilo
El objetivo de la lección es aprender sobre CSS: los alumnos descubrirán qué es una hoja de estilo en cascada, cómo incorporarla directamente en una página HTML y cómo utilizar selectores de etiquetas, identificadores y clases para aplicar estilos a elementos concretos. El resultado final será una página de blog sencilla compuesta por un encabezado, un banner y una sección con entradas con un estilo similar al de las publicaciones de Facebook.
3Publicación de páginas y modelo de caja.
Los alumnos aprenderán sobre el modelo de caja de CSS (margen, borde y relleno) y las etiquetas de sección de HTML. Durante la clase, crearán una ficha de jugador con las secciones: biografía, equipamiento y logros, utilizando el modelo de caja para aplicar estilos a cada bloque. Esto les ayudará a comprender cómo calcula el navegador el tamano de los elementos y cómo crear disenos de página claros.
4Estándares de diseno de diseno e interacciones simples.
Los alumnos aprenderán las etapas de la creación de un producto web y los estándares para el diseno de maquetaciones de páginas. Durante la clase, crearán una página sencilla en HTML5 con una maquetación semántica que incluya navegación, un encabezado, secciones de contenido y un pie de página. Al finalizar la clase, cada alumno tendrá una página funcional con navegación desplazable y una estructura clara.
5Colores y formas
La clase introduce a los alumnos al mundo del color y las formas en CSS: desde los modelos de color y las formas de definir los colores, pasando por los bordes redondeados y las sombras, hasta los degradados. Los participantes crean una postal con un paisaje compuesto exclusivamente por elementos HTML y CSS, experimentando con las propiedades visuales. Al final de la sesión, cada alumno publica la postal terminada en GitHub Pages.
6Posicionamiento y capacidad de respuesta.
En esta sesión, crearemos una galería de fotos usando HTML y CSS, aprendiendo a controlar el diseno y el flujo de los elementos en una página web. Exploraremos métodos para lograr la responsividad, de modo que la galería se vea correctamente en distintos tamanos de pantalla. Al final de la sesión, cada participante tendrá una página web funcional y responsive con una galería formada por secciones semánticas de HTML5.
7Animaciones y transformaciones
En esta lección, los estudiantes aprenderán tres métodos para animar páginas web: transformaciones, transiciones y animaciones en CSS. Paso a paso, construirán una escena interactiva con una ambulancia, en la que la sirena parpadea al pasar el cursor, las ruedas giran continuamente y un cartel se agranda suavemente. El resultado final será una página animada completa que cada estudiante podrá seguir desarrollando y presentar como su propio proyecto.
8Proyecto: Ranking de teléfonos
Los participantes reforzarán los principios de la responsividad y repasarán el modelo de caja, los degradados, los colores y el HTML5 semántico. Durante la sesión, disenarán y construirán de forma independiente un proyecto responsive de ranking de teléfonos, organizando tarjetas en una cuadrícula flexible que se vea bien en distintas pantallas. También usarán IA para generar contenido actualizado del ranking y gráficos de modelos de teléfonos.