🔬 CienciaLab

Aplicación web interactiva de Química, Ciencias Naturales y Física para estudiantes de secundaria, pensada para usar en clase.

Hecha por Avila del Cali Jose.

Módulos

Módulo	Tema	Qué hacen los estudiantes
🔄 ¿Físico o químico?	Transformaciones de la materia	Clasifican situaciones cotidianas en rondas de 10, con explicación de cada respuesta y un repaso final de los errores.
🧪 Laboratorio virtual	Reacciones químicas	Mezclan dos reactivos, observan la reacción animada (burbujas, color, precipitado, espuma, luz y temperatura), deciden si fue un cambio físico o químico y ven la ecuación, el tipo de reacción y las evidencias. Un cuaderno registra los 22 experimentos por descubrir.
⚖️ Balanceo de ecuaciones	Ecuaciones químicas / Ley de Lavoisier	Ajustan coeficientes con una balanza visual y una tabla de conteo de átomos. Tiene 3 niveles y pistas.
🧩 Tabla periódica	Tabla periódica	Exploran los 118 elementos coloreados por familia, por tipo (metal/no metal) o por estado. Cada ficha muestra protones, neutrones, configuración electrónica y modelo de Bohr (hasta Z = 20). Incluye un desafío de 10 preguntas con récord.
⚛️ Átomos y moléculas	Estructura de la materia	Arman átomos con protones, neutrones y electrones (hasta Z = 20) y ven qué elemento, isótopo o ion formaron, si el núcleo es estable y su notación con número másico y atómico. Luego unen átomos (H, C, N, O, S, Cl) con enlaces simples, dobles o triples respetando cuántos enlaces forma cada uno. Ambos modos tienen misiones.
🥣 Mezclas homogéneas y heterogéneas	Sistemas materiales	Al microscopio: 15 mezclas (agua con sal, aire, bronce, agua y aceite, granito, ensalada de frutas…) vistas a simple vista y con una lupa que muestra sus partículas, con fases, componentes y método de separación. ¿Homogénea o heterogénea?: clasifican mezclas y la lupa revela cómo son por dentro. ¿Cómo la separo?: eligen entre filtración, decantación, imantación, tamización, tría, evaporación y destilación.
🧊 Estados de la materia	Cambios de estado	Calentar y enfriar: un recipiente con moléculas de agua que vibran, se deslizan o vuelan según la temperatura, con termómetro y curva de calentamiento (mesetas de fusión y ebullición). Los cambios de estado: mapa con los seis cambios y si absorben o liberan calor. ¿Qué cambio es?: situaciones cotidianas.
📝 Quiz de Ciencias	Evaluación (1.º y 2.º año)	Los alumnos entran por link, sin cuenta, con su escuela, año (1.º a 6.º), división (1.ª a 4.ª) y nombre. Responden preguntas al azar (de las activas) con las opciones mezcladas y cronómetro; al final ven correctas, tiempo y un repaso de errores con explicaciones, y su puesto en la tabla de posiciones (filtrable por escuela y por curso). Cada pregunta tiene una ilustración: la propia (campo imagen) o la de su tema. Temas: normas de seguridad y material de laboratorio, estados de la materia, sistemas materiales, materia y energía, cuerpos y materiales, propiedades intensivas y extensivas, alimentación saludable, sistemas de la nutrición y la célula (110 preguntas). El panel docente (#docente) permite elegir qué temas le aparecen a cada año, activar o desactivar preguntas y temas, elegir cuántas preguntas tiene cada intento y borrar resultados.
🔭 Niveles de organización	La materia y la vida	Viaje con zoom: acercan una lupa desde la biosfera hasta las partículas subatómicas, siguiendo a un carpincho de los Esteros del Iberá, con el tamaño de cada nivel y si tiene vida o no. Ordenar: acomodan los niveles del más pequeño al más grande (6 o los 14). ¿Qué nivel es?: reconocen a qué nivel pertenecen ejemplos cotidianos.
🌍 Efecto invernadero	Cambio climático	Suben o bajan el CO₂ (con un deslizador, momentos históricos o acciones humanas) y ven la radiación solar y el calor en la atmósfera, la temperatura media año a año en un gráfico y sus consecuencias. Modelo simplificado: +3 °C por cada duplicación del CO₂. Además: metano (con sus fuentes), efecto albedo (el hielo refleja la luz y al derretirse la Tierra se calienta más) y erupciones volcánicas que enfrían unos años, con el aporte de cada efecto a la temperatura. También: matriz energética (fósil/renovable, con emisiones por año, molinos, paneles y humo de la fábrica), escenarios hasta 2100 (emisiones altas, medias, cero neto o un plan propio) con un termómetro de impactos (nivel del mar, glaciares, especies) y tiempo y clima (hora del día con día y noche, y estaciones).
🔬 Explorador de la célula	La célula	Tocan los orgánulos de una célula animal o vegetal para acercarse y ver su función y una analogía; comparan ambas con una tabla, juegan a "¿Dónde está?" y siguen rutas en la célula (la insulina desde el núcleo hasta afuera, la glucosa hasta la mitocondria, una bacteria hasta el lisosoma, la energía del Sol y el agua hasta la vacuola).
♻️ Ciclos de la naturaleza	Ciclos del agua, carbono y nitrógeno	Exploran un paisaje ilustrado donde gotas, vapor, copos y moléculas recorren cada proceso, siguen el viaje de una gota o un átomo eligiendo qué proceso ocurre en cada lugar, y ordenan las etapas.
🧬 Biomoléculas	Química de la vida (5.º año)	Armar: polisacáridos con α/β-glucosa y ramificaciones α(1→6) (amilosa, amilopectina, glucógeno, celulosa), proteínas con estructura primaria, hélice α y terciaria (núcleo hidrofóbico, puentes disulfuro y salinos), triglicéridos con ácidos grasos reales (16:0, 18:1 cis/trans, 18:2), fosfolípidos y saponificación, y ADN antiparalelo con %GC y temperatura de fusión. Del gen a la proteína: transcripción, traducción con el código genético y mutaciones. Enzimas: efecto de la temperatura, el pH, el sustrato y un inhibidor, con gráfico de mediciones. Laboratorio: Lugol, Benedict, Biuret y Sudán, con hidrólisis previa y muestra incógnita. Clasificar moléculas por función o alimentos, y unir cada función de las proteínas con su descripción y un ejemplo.
🥗 Alimentación saludable	Nutrición	Exploran la pirámide nutricional (EE. UU., 1992), el óvalo nutricional (Argentina, 2000) y el plato de la Gráfica de la Alimentación Diaria (Guías Alimentarias para la Población Argentina, 2016): nutrientes y función de cada grupo y los 10 mensajes de las Guías. Comparan los tres modelos, arman un día de comidas y reciben una devolución, y clasifican alimentos en los grupos del plato.
🩸 Glucemia y diabetes	Homeostasis	Simulador de la glucemia después de comer: eligen una persona (sin diabetes, tipo 1 o tipo 2) y un alimento, y ven en una escena animada la absorción, la insulina, el glucagón, el glucógeno del hígado, la captación por las células y la glucosuria. Comparan hasta 3 curvas, estiman el índice glucémico por el área bajo la curva, aplican insulina o hacen ejercicio. Un diario explica cada paso y enlaza a fichas teóricas (hormonas, valores de referencia, IG, glucogénesis/glucogenólisis/gluconeogénesis y tipos de diabetes). Armar el plato: eligen una base y le suman fibra, proteína, grasa, acidez o una gaseosa (y el orden en que se come) para ver cuánto se aplana la curva. Desafío del día: deciden la dosis de insulina de Sofi, que tiene diabetes tipo 1, en cada comida (1 u cada 15 g de carbohidratos), resuelven el ejercicio y las hipoglucemias, y ganan estrellas según el tiempo en rango.
🫀 Sistemas de la nutrición	Cuerpo humano (2.º año)	Explorar el cuerpo: tocan cada sistema (digestivo, respiratorio, circulatorio y excretor) y la célula para ver sus órganos, qué recibe, qué entrega y una analogía. Seguí el viaje: acompañan a la glucosa, el oxígeno, el dióxido de carbono, la urea y la fibra eligiendo por qué sistema pasa cada una. ¿Qué pasa si…?: desconectan un sistema y miran cómo cambian los nutrientes, el oxígeno, los desechos y la energía de las células. Completar el esquema: ubican los rótulos del esquema de la clase (en el nivel 2, también los sistemas) y después escriben un texto con conectores. Las islas SIN: a partir del texto «El archipiélago de las islas SIN», unen cada parte del modelo análogo con el modelo científico (archipiélago y organismo, islas y órganos/tejidos, isla Huerta y sistema respiratorio, isla Granja y digestivo, isla de reciclaje y excretor, vías marinas y sistema circulatorio, casas y células, productos y nutrientes y oxígeno, materiales inservibles y desechos metabólicos) y resuelven situaciones.
📏 Mediciones: área y volumen	Física · Magnitudes y unidades	Calculan el área total y el volumen de cajas ilustradas (caja de cartón, pecera, contenedor, pileta, dado, libro…) con medidas en m, cm y mm. Tres niveles: misma unidad, unidades distintas y resultado en otra unidad (m², m³, dm³ o litros). Pistas paso a paso, fórmulas y equivalencias, y la resolución completa al comprobar.
🚗 Movimiento rectilíneo uniforme	Física · Cinemática	Simulador: eligen velocidad y posición inicial de uno o dos autos y ven el recorrido (con banderitas cada segundo), los gráficos posición-tiempo y velocidad-tiempo en vivo y el punto de encuentro. Problemas: calculan posición, tiempo, velocidad, distancia con km/h y encuentros, y luego ven la simulación. ¿Qué gráfico es?: eligen el gráfico x-t que corresponde a cada descripción.
💡 Electricidad: circuitos	Física · Circuitos eléctricos	Armar circuitos: ponen pilas, cables, lamparitas, interruptores y timbres en un tablero; la corriente se calcula de verdad (serie, paralelo, dos pilas, cortocircuito) y se ven los electrones moverse. Siete desafíos. ¿Conduce o no?: predicen si un objeto es conductor o aislante y lo prueban en el circuito.

Cómo usarla

No necesita instalación ni internet: basta con abrir index.html en cualquier navegador (Chrome, Firefox, Edge).

Para compartirla con los estudiantes por un enlace, se puede publicar gratis con GitHub Pages: Settings → Pages → Deploy from a branch.

• El botón 📽️ (modo proyector) agranda los textos para proyectar en el aula.
• El botón 🌙/☀️ cambia entre modo claro y oscuro (por defecto sigue la configuración del dispositivo).
• En las actividades con preguntas, cada ronda trae preguntas distintas y no se repiten las de la ronda anterior.
• Cada módulo tiene su propio enlace: index.html#transformaciones, #laboratorio, #balanceo, #tabla, #atomos, #mezclas, #estados, #niveles, #invernadero, #celula, #ciclos, #biomoleculas, #alimentacion, #glucemia, #nutricion, #mediciones, #mru, #electricidad, #quiz o #docente (panel del docente).
• El progreso (cuaderno del laboratorio, ecuaciones resueltas, récord del desafío) se guarda en el navegador de cada dispositivo.

Estructura

index.html            Página principal e inicio
css/styles.css        Estilos
js/util.js            Utilidades compartidas
js/arte.js            Piezas de ilustración compartidas (animales, árboles, fábrica)
js/datos/elementos.js Datos de los 118 elementos
js/transformaciones.js
js/laboratorio.js     Reactivos y reacciones (fáciles de ampliar)
js/balanceo.js        Lista de ecuaciones por nivel
js/tabla.js
js/atomos.js          Átomos y moléculas (misiones y moléculas conocidas)
js/mezclas.js         Mezclas homogéneas y heterogéneas
js/estados.js         Estados de la materia y cambios de estado
js/niveles.js         Niveles de organización de la materia
js/invernadero.js     Simulación del efecto invernadero
js/celula.js          Orgánulos de las células animal y vegetal
js/ciclos.js          Lugares, procesos y etapas de cada ciclo
js/biomoleculas.js    Monómeros, reactivos de laboratorio y alimentos
js/alimentacion.js    Guías alimentarias, alimentos ilustrados y actividades
js/glucemia.js        Simulador de glucemia: insulina, glucagón, índice glucémico y diabetes
js/glucemia-extra.js  Glucemia: armar el plato y desafío del día
js/nutricion.js      Sistemas de la nutrición: cuerpo, viajes y sistemas desconectados
js/nutricion-extra.js  Sistemas de la nutrición: esquema para completar y las islas SIN
js/mediciones.js      Física: área y volumen de cajas con distintas unidades
js/mru.js             Física: movimiento rectilíneo uniforme
js/electricidad.js    Física: circuitos eléctricos, conductores y aislantes
js/quiz.js            Quiz para alumnos y panel docente
js/quiz-dibujos.js    Ilustraciones de las preguntas del quiz
js/firebase-config.js Datos del proyecto de Firebase para el quiz
preguntas.json        Banco de preguntas del quiz
firestore.rules       Reglas de seguridad de Firestore para el quiz
js/app.js             Navegación

Para agregar contenido, edita las listas al principio de cada archivo: CASOS en transformaciones, REACTIVOS y REACCIONES en el laboratorio, y ECUACIONES en balanceo.

Quiz: banco de preguntas y Firebase

Las preguntas están en preguntas.json. Cada una tiene esta forma:

{
  "id": "lab-01",
  "tema": "Normas de seguridad y material de laboratorio",
  "enunciado": "¿Para qué se usa la probeta?",
  "opciones": ["Para medir volúmenes de líquidos", "Para moler sólidos", "Para medir la temperatura", "Para calentar sólidos"],
  "correcta": 0,
  "explicacion": "La probeta es un cilindro graduado que sirve para medir volúmenes de líquidos."
}

• imagen (opcional) elige uno de los dibujos de js/quiz-dibujos.js (por ejemplo "probeta" o "agua-aceite"). Si no está, se muestra la escena del tema.
• correcta es la posición de la opción correcta, contando desde 0 (la primera es 0, la segunda es 1…). El quiz mezcla las opciones al mostrarlas.
• El id tiene que ser único y no conviene cambiarlo: el panel docente lo usa para recordar qué preguntas están apagadas. Las preguntas nuevas aparecen activas.
• Para un tema nuevo, alcanza con usar un tema nuevo en las preguntas (y agregarlo a la lista temas del principio para elegir su orden).

La configuración (preguntas apagadas y cantidad por intento) y los resultados se guardan en Firestore. Los datos del proyecto van en js/firebase-config.js y las reglas de seguridad están en firestore.rules. Mientras js/firebase-config.js esté vacío, el quiz funciona en modo de prueba y guarda todo solo en el navegador.