deepwhy/deepwhy-skill

Cadena de Conocimiento DeepWhy

Crea una experiencia de exploración del conocimiento, no un artículo extenso con una tabla de contenidos. La superficie principal es una cadena compacta e interactiva de 3 a 6 ideas que progresa desde un fenómeno familiar hacia un mecanismo, principio, teoría, frontera actual o límite conocido.

La experiencia de aprendizaje debe ayudar al alumno a comprender, no solo a recibir una explicación bien fundamentada. Organiza cada idea central en torno a una escena familiar y una metáfora utilizable. Muestra esa metáfora en movimiento cuando el cambio o la causalidad sean el punto central, luego tradúcela de vuelta al mecanismo real en lenguaje sencillo. El video es una segunda explicación o confirmación del mundo real para el mismo nodo, nunca una conferencia genérica utilizada para llenar una cuota.

Prefiere una metáfora ancla a nivel de cadena. Reutilízala y profundízala en nodos adyacentes siempre que siga explicando la nueva pregunta; cambia solo cuando el modelo antiguo haya alcanzado un límite real. El alumno debe acumular un modelo mental en evolución, no coleccionar ejemplos no relacionados de tarjeta a tarjeta.

El entregable por defecto es un único archivo HTML independiente. Debe preservar una experiencia local útil sin un paso de compilación: selección de nodos, navegación anterior/siguiente, ramas, pestañas de detalle, filtrado de línea de tiempo, retroalimentación de evaluación, dosieres de antecedentes y exportación JSON, todo utiliza CSS y JavaScript incrustados. Los documentos externos, videos, imágenes y el propio DeepWhy aún requieren red.

Las imágenes que transmiten conocimiento deben mantenerse legibles: ninguna ilustración, diagrama, animación o superposición puede cubrir texto, anotaciones, controles, leyendas o marcas críticas. Cuando una relación sea naturalmente temporal o causal, prefiere una animación intencionada sobre una instantánea estática.

Lee solo lo que la tarea necesita

• Antes de investigar, lee references/research-playbook.md.
• Antes de planificar la cadena, lee references/knowledge-chain.md.
• Antes de diseñar metáforas, animaciones o emparejamientos de video, lee references/teaching-progression.md.
• Antes de elegir Manim, lee references/manim-animation.md.
• Antes de redactar un laboratorio a nivel de nodo, lee references/interactive-labs.md.
• Antes de redactar JSON, lee references/content-contract.md y assets/content.schema.json.
• Antes de elegir o adaptar el sistema visual, lee references/visual-design-system.md y references/design-presets.md.
• Antes de componer la carcasa de la página, lee references/learning-layout.md y references/page-delivery.md.
• Antes del control de calidad final, lee references/evaluation-cases.md.

Comienza desde assets/template.html, no desde una página en blanco. Usa la plantilla y los scripts como contratos estructurales, no como fuentes de hechos.

Construye la experiencia de aprendizaje

1. Enmarca al alumno y la pregunta. Extrae el tema, la pregunta real, el conocimiento previo probable y la profundidad deseada. Conserva una premisa falsa en meta.premiseCheck, márcala como corrected, explícala de forma compacta y continúa con la pregunta corregida. No te detengas en la corrección.
2. Diseña la ruta de enseñanza antes de investigar los detalles. Para cada nodo central, identifica: escena reconocible → una metáfora → 2–4 mapeos explícitos → paso causal animado → regla en lenguaje sencillo → video relevante → verificación de transferencia → límite de la metáfora. Haz que el alumno reformule la idea con la metáfora. No pases a una definición técnica hasta que ese modelo mental sea visible. Usa una metáfora por nodo y llévala de manera consistente a través de la animación, los pasos y la verificación.
3. Planifica la cadena de conocimiento principal. Usa 4–6 nodos principales por defecto y solo 3 cuando el tema realmente no pueda soportar más. Selecciona los tipos de nodo en orden de profundidad no decreciente entre: fenómeno → mecanismo → principio → teoría → frontera → límite. El nodo inicial debe ser algo que el alumno pueda reconocer. Cada nodo hace una pregunta causal. Cada nodo la responde en una oración, normalmente de 20 a 60 caracteres, y sugiere como máximo tres ramas opcionales. El siguiente nodo debe responder la parte no respondida del nodo anterior, no reformularla.
4. Investiga cada nodo. Mantén un registro de evidencia mientras investigas. Prefiere documentos originales, páginas oficiales, estándares, libros de texto e informes institucionales. Registra las fechas de los eventos por separado de la publicación, prototipo, implementación operativa y adopción. Marca la evidencia faltante de manera honesta.
5. Enseña una idea nueva a la vez. Por defecto, usa meta.audience.explanationLevel = "child" a menos que la solicitud especifique una audiencia más profunda. Antes de introducir un término o fórmula, anclalo en una escena y metáfora familiar. Cada nodo debe incluir un puente, una analogía utilizable, un mapeo en lenguaje sencillo, pasos causales ordenados y una verificación de "predice, luego revela". Los nodos de mecanismo, principio, teoría y frontera requieren la analogía; un fenómeno puede usar su escena de apertura directamente, y un límite puede usar un contraejemplo.
6. Diseña operaciones de aprendizaje activo. Al menos una imagen de conocimiento en cada página debe invitar al alumno a hacer algo, y una página de 4 a 6 nodos normalmente debe incluir de 2 a 3 operaciones de este tipo. Elige entre predicción antes de revelar, manipulación de parámetros con una consecuencia en vivo, o un alternador que compare dos condiciones. Vincula cada interacción a la metáfora del nodo y actualiza la retroalimentación de inmediato; el alumno debe descubrir la relación actuando, no haciendo clic en un control decorativo. No agregues una interacción que simplemente repita la respuesta. Los nodos de mecanismo y principio requieren un laboratorio limitado e independiente; elige simulación, diagrama, código, juego, 3D espacial o práctica procedimental según el conocimiento. Los laboratorios adyacentes no deben usar la misma modalidad. Para la evaluación, genera previamente exactamente cinco preguntas de opción única para cada nodo principal. Genera cada opción correcta, respuesta modelo, explicación y lista de fuentes junto con la pregunta. Nunca dependas de un modelo en tiempo de ejecución para calificar. Seleccionar una opción debe revelar inmediatamente retroalimentación verde-correto o rojo-incorrecto más la explicación; no requieras una acción de envío o un botón de "verificar dominio" de toda la cadena. Después de la primera respuesta en un nodo, muestra una tarjeta de respuestas de cinco ranuras con estados verde-correto, rojo-incorrecto y neutral-no respondido; cada ranura salta de nuevo a esa pregunta. Oculta la acción Siguiente después de que la quinta pregunta haya sido respondida. También expón un cuestionario global que contenga todas las preguntas por nodo desde el conmutador de vista global superior.
7. Empareja animación y video en el punto de confusión. Anima la metáfora realizando el trabajo causal, luego estabilízate en un fotograma etiquetado. Cada nodo de conocimiento requiere exactamente cinco videos externos verificados. La pestaña Video presenta un reproductor principal seguido de cuatro tarjetas en miniatura para los videos restantes. Seleccionar una miniatura intercambia el reproductor principal. Todos los cinco clips demuestran el mismo nodo a través de fenómenos reales, experimentos o explicaciones visuales alternativas. Nunca inventes URL, miniaturas, métricas o soporte de incrustación para llegar a cinco. Diferentes nodos de conocimiento deben usar diferentes registros de video. Expón una vista de biblioteca de videos global desde el conmutador global superior, separada del conjunto de cinco videos de cada nodo. Mantén las brechas de plataforma o verificación de red en los metadatos de evidencia; no las presentes como advertencias visibles para el alumno en la pestaña Video. Usa SVG/SMIL en línea primero cuando explique el movimiento causal. Solo cuando Manim haga más clara una transformación, trayectoria, fuerza o metáfora matemática, debes planificar una escena Manim a nivel de nodo. Sonda el tiempo de ejecución solo en ese punto. Si se necesita configuración, ejecuta el comando de planificación, muestra sus comandos completos y la ubicación de caché aislada, y pide consentimiento explícito antes de ejecutar install --confirmed. Si se rechaza el consentimiento o falla la configuración, usa SVG para el resto de esta generación y no repitas la solicitud.
8. Coloca las explicaciones completas detrás de la divulgación. La tarjeta del nodo posee solo la pregunta y la respuesta de una oración. Un inspector lateral puede incluir una inmersión profunda corta, analogía, diagrama respaldado por fuentes, evidencia, video/recursos y una verificación a nivel de nodo. Coloca personas e instituciones con sus fuentes en Antecedentes de Investigación, y aplicaciones, eventos de línea de tiempo y estado de implementación de frontera con sus fuentes en Desarrollo de la Industria. Mantén ambas pestañas filtradas al conjunto de fuentes del nodo; nunca dupliques una CTA de antecedentes global en la finalización de la cadena o el área de encabezado. El inspector usa cinco pestañas: Comprender, Video, Antecedentes de Investigación, Desarrollo de la Industria y Verificar Comprensión. Las ramas permanecen colapsadas hasta que se abren explícitamente. La pestaña de video carga un reproductor principal verificado y cuatro opciones en miniatura; otros reproductores se cargan solo cuando se seleccionan. No renderices chips de fuente numéricos como S1, S2 o similares en los paneles de nodo visibles para el alumno. Conserva los ID de fuente en JSON para trazabilidad.
9. Crea el HTML completo. Coloca todos los datos en #deepwhy-data y renderízalos con la plantilla. Usa un SVG en línea revisado para un diagrama de mecanismo cuando sea posible. Nunca presentes una imagen de ambiente generada por IA como un mecanismo factual. Para movimiento, ejecución secuencial, cambio de estado, propagación, flujo o retroalimentación, usa animación SVG en línea siempre que el movimiento lleve la explicación; conserva un estado estable legible y un equivalente de texto estático. Muestra las imágenes del nodo completas: conserva la relación de aspecto intrínseca y usa un ajuste de tipo contener en lugar de recortar. Mantén las etiquetas esenciales fuera de las imágenes rasterizadas. Aumenta el viewBox, divide el visual o elimina detalles secundarios en lugar de permitir superposiciones. Mantén la prosa sustancial y las citas fuera del DOM escrito a mano. En escritorio, compón un banco de trabajo de aprendizaje de altura de ventana: un lienzo de grafo de nodos del 40-46% junto a un banco de lecciones dominante. El laboratorio seleccionado y la reflexión pertenecen al banco. En móvil, vuelve al flujo de documento normal y abre el banco como una hoja inferior. Si un nodo tiene manim, renderiza una animación silenciada, en bucle y con reproducción en línea sobre el laboratorio del nodo, con su póster, leyenda, transcripción, acción de repetición y respaldo SVG en línea. El modo de movimiento reducido debe mostrar el póster sin reproducción automática. El constructor incrusta activos WebM y WebP locales en el HTML final.
10. Elige la dirección visual. Usa deepwhy por defecto: el lenguaje de aula inspirado en OpenMAIC con un escenario punteado casi blanco, tinta neutra fría, acciones violetas moderadas, paneles redondeados flotantes y un banco de interacción dominante. atlas, chronicle y fieldnotes son alternativas explícitas, no coincidencias automáticas de tema. --style y DEEPWHY_PAGE_STYLE anulan la elección de contenido. Los preajustes pueden cambiar la tipografía, el color, los materiales y los detalles de diseño; no pueden cambiar la semántica de los datos o las interacciones. Antes de escribir HTML, registra el arquetipo, la idea central, el visual focal, la jerarquía y el ritmo de sección en presentation. Construye un punto focal visual dominante, luego varía la composición según el propósito del nodo. No recurras a una página de aterrizaje, panel de control, plantilla de artículo o cuadrícula de tarjetas repetida.
11. Valida la experiencia. Ejecuta la validación de contenido, pruebas unitarias y una prueba de Playwright cuando esté disponible. Confirma que la primera pantalla muestre la cadena, la idea clave, la posición actual y la siguiente acción; solo un detalle de nodo y un reproductor de video estén activos a la vez; las ramas permanezcan subordinadas a la ruta principal; y todo el material de antecedentes siga siendo accesible. Inspecciona cada diagrama en anchos de escritorio y móvil en busca de texto, controles, leyendas, marcas esenciales y contenido de imagen recortados o cubiertos. Verifica que el movimiento significativo esté presente donde ayude a explicar la idea, se establezca en un marco legible y respete las preferencias de movimiento reducido. Confirma que cada nodo central permita al alumno reformular la idea con su metáfora, transferirla una vez y reconocer dónde se rompe la metáfora. Comprueba que los videos vinculados respalden el nodo actual en lugar de servir como antecedentes no relacionados. Ejercita cada interacción y confirma que cambiar la entrada produzca una consecuencia visible y veraz. Revisa la composición completa y la versión móvil. Si se asemeja a una página SaaS genérica generada por IA, rediseñala antes de la entrega.

Cobertura de contenido

Los módulos educativos antiguos aún están cubiertos, pero ya no se asignan a 12 secciones largas de página:

• fenómeno, mecanismo, principio, teoría, frontera y límite se convierten en tipos de nodo de cadena;
• la escena familiar, la metáfora principal, el mapeo animado y la regla sencilla viven en el detalle del nodo;
• cada nodo de mecanismo y principio contiene un laboratorio práctico limitado seguido de una reformulación libre y una conclusión de referencia retrasada;
• los videos están vinculados al nodo exacto que ayudan a explicar;
• personas, instituciones, aplicaciones, línea de tiempo de evolución, última frontera e inventario de fuentes viven en el cajón de antecedentes, con enlaces de investigación coincidentes con fuentes dentro del nodo derecho relevante;
• las cinco verificaciones de opción única pre-redactadas de cada nodo viven en su pestaña Verificar Comprensión del inspector;
• las preguntas siguientes se convierten en ramas y sugerencias de seguimiento a nivel de cadena; cada recomendación es cliqueable y enlaza profundamente a https://deepwhy.cn/ con el tema actual y la pregunta recomendada en la URL;
• no se requiere cuenta ni API; el HTML sigue siendo útil de forma independiente mientras las preguntas recomendadas pueden abrir la plataforma DeepWhy.

El conmutador de vista global superior es una superficie de orientación prominente. Renderiza la línea de tiempo de desarrollo combinada y la etapa actual, personas relacionadas, la biblioteca de video completa

…

[truncado para la traducción]