codigo0/docs/MEDIOS_AUDIOVISUALES_FALTANTES.md

# 📸 Lista de Medios Audiovisuales Faltantes

**Fecha:** 2026-01-15  
**Objetivo:** Inventario completo de medios faltantes, ubicaciones y proceso de sustitución

---

## 📊 ESTADO ACTUAL

- **Imágenes existentes:** ~48 imágenes en `public/assets/infografias/`
- **Capítulos con imágenes:** ~10/93 (11%)
- **Capítulos sin imágenes:** ~83/93 (89%)
- **Medios críticos faltantes:** 25+ medios visuales

---

## 🔴 PRIORIDAD CRÍTICA - Medios Faltantes

### BLOQUE 1: FUNDAMENTOS

#### 1. Tabla Visual de Rangos Normales (Constantes Vitales)
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-0-fundamentos/tabla_rangos_normales_constantes_vitales.png`
- **Archivo Markdown:** `public/manual/BLOQUE_01_1_CONSTANTES_VITALES.md`
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Tabla visual con rangos normales de TA, FC, FR, SatO2, temperatura por edad
- **Cómo sustituir:**
  1. Crear imagen: `tabla_rangos_normales_constantes_vitales.png`
  2. Colocar en: `public/assets/infografias/bloque-0-fundamentos/`
  3. Añadir a `image-registry.ts`:
     ```typescript
     'tabla-rangos-normales': {
       id: 'tabla-rangos-normales',
       path: '/assets/infografias/bloque-0-fundamentos/tabla_rangos_normales_constantes_vitales.png',
       alt: 'Tabla de rangos normales de constantes vitales por edad',
       caption: 'Rangos normales de TA, FC, FR, SatO2 y temperatura',
       block: 'bloque-0-fundamentos',
       tags: ['constantes-vitales', 'rangos', 'normal', 'tabla']
     },
     ```
  4. Añadir referencia en Markdown:
     ```markdown
     ![Tabla de rangos normales]/assets/infografias/bloque-0-fundamentos/tabla_rangos_normales_constantes_vitales.png)
     ```

#### 2. Diagrama de Flujo ABCDE Paso a Paso (Completo)
- **Estado:** ❌ FALTANTE (existe algoritmo básico, falta versión detallada)
- **Ubicación:** `public/assets/infografias/bloque-0-fundamentos/diagrama_abcde_paso_a_paso_completo.svg`
- **Archivo Markdown:** `public/manual/BLOQUE_01_2_ABCDE_OPERATIVO.md`
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Diagrama de flujo detallado con cada paso del ABCDE, decisiones y ramificaciones
- **Cómo sustituir:**
  1. Crear imagen: `diagrama_abcde_paso_a_paso_completo.svg` (preferible SVG para escalabilidad)
  2. Colocar en: `public/assets/infografias/bloque-0-fundamentos/`
  3. Añadir a `image-registry.ts`:
     ```typescript
     'abcde-diagrama-paso-a-paso': {
       id: 'abcde-diagrama-paso-a-paso',
       path: '/assets/infografias/bloque-0-fundamentos/diagrama_abcde_paso_a_paso_completo.svg',
       alt: 'Diagrama de flujo ABCDE paso a paso completo',
       caption: 'Flujo detallado del algoritmo ABCDE con decisiones y ramificaciones',
       block: 'bloque-0-fundamentos',
       tags: ['abcde', 'diagrama', 'flujo', 'paso-a-paso']
     },
     ```
  4. Añadir referencia en Markdown después de la sección de introducción

#### 3. Tabla Visual de Escala Glasgow
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-0-fundamentos/tabla_escala_glasgow.png`
- **Archivo Markdown:** `public/manual/BLOQUE_01_3_GLASGOW_OPERATIVO.md` (si existe)
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Tabla visual con escala Glasgow completa (ojo, verbal, motor) con puntuaciones
- **Cómo sustituir:**
  1. Crear imagen: `tabla_escala_glasgow.png`
  2. Colocar en: `public/assets/infografias/bloque-0-fundamentos/`
  3. Añadir a `image-registry.ts`
  4. Añadir referencia en Markdown del capítulo Glasgow

#### 4. Diagrama de Flujo START Completo
- **Estado:** ⚠️ PARCIAL (existe resumen visual, falta versión detallada)
- **Ubicación:** `public/assets/infografias/bloque-0-fundamentos/diagrama_start_completo.svg`
- **Archivo Markdown:** `public/manual/BLOQUE_01_4_TRIAGE_START.md`
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Diagrama de flujo START completo con todas las decisiones y categorías
- **Cómo sustituir:** Similar a ABCDE paso a paso

---

### BLOQUE 2: MATERIAL E INMOVILIZACIÓN

#### 5. Guía Visual de Inmovilización Manual
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-2-inmovilizacion/guia_inmovilizacion_manual.png`
- **Archivo Markdown:** Capítulos de inmovilización manual
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Secuencia fotográfica o infografía paso a paso de inmovilización manual cervical
- **Cómo sustituir:**
  1. Crear imagen: `guia_inmovilizacion_manual.png`
  2. Colocar en: `public/assets/infografias/bloque-2-inmovilizacion/`
  3. Añadir a `image-registry.ts`
  4. Añadir referencia en capítulos de inmovilización manual

#### 6. Diagrama de Uso de Tablero Espinal
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-2-inmovilizacion/diagrama_uso_tablero_espinal.png`
- **Archivo Markdown:** Capítulos sobre tablero espinal
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Infografía paso a paso del uso correcto del tablero espinal
- **Cómo sustituir:** Similar a guía de inmovilización manual

#### 7. Infografía de Transferencias Seguras
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-2-inmovilizacion/infografia_transferencias_seguras.png`
- **Archivo Markdown:** Capítulos sobre transferencias de pacientes
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Secuencia visual de transferencias seguras (cama-camilla, suelo-camilla, etc.)
- **Cómo sustituir:** Similar a anteriores

---

### BLOQUE 3: MATERIAL SANITARIO Y OXIGENOTERAPIA

#### 8. Guía Visual de Aspiración
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-3-material-sanitario/guia_aspiracion.png`
- **Archivo Markdown:** Capítulos sobre aspiración
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Infografía paso a paso de técnica de aspiración (orofaríngea, nasofaríngea)
- **Cómo sustituir:**
  1. Crear imagen: `guia_aspiracion.png`
  2. Colocar en: `public/assets/infografias/bloque-3-material-sanitario/`
  3. Añadir a `image-registry.ts`
  4. Añadir referencia en capítulos de aspiración

#### 9. Infografía de Organización de Maletín
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-3-material-sanitario/organizacion_maletin.png`
- **Archivo Markdown:** Capítulos sobre organización de material
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Diagrama visual de organización estándar de maletín TES
- **Cómo sustituir:** Similar a anteriores

---

### BLOQUE 4: SOPORTE VITAL BÁSICO Y RCP

#### 10. RCP Paso a Paso Visual - ADULTOS ⚠️ CRÍTICO
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-4-rcp/rcp_adulto_paso_a_paso.png`
- **Archivo Markdown:** `public/manual/BLOQUE_04_1_RCP_ADULTOS.md`
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Infografía paso a paso de RCP en adultos (30:2, posiciones, profundidad, frecuencia)
- **Cómo sustituir:**
  1. Crear imagen: `rcp_adulto_paso_a_paso.png`
  2. Colocar en: `public/assets/infografias/bloque-4-rcp/` (crear directorio si no existe)
  3. Añadir a `image-registry.ts`:
     ```typescript
     'rcp-adulto-paso-a-paso': {
       id: 'rcp-adulto-paso-a-paso',
       path: '/assets/infografias/bloque-4-rcp/rcp_adulto_paso_a_paso.png',
       alt: 'RCP Adulto paso a paso - Infografía visual',
       caption: 'Secuencia completa de RCP en adultos con posiciones, profundidad y frecuencia',
       block: 'bloque-4-rcp',
       tags: ['rcp', 'adulto', 'paso-a-paso', 'infografia', 'critico']
     },
     ```
  4. Añadir referencia en `BLOQUE_04_1_RCP_ADULTOS.md`:
     ```markdown
     ## Secuencia de RCP
     
     ![RCP Adulto paso a paso]/assets/infografias/bloque-4-rcp/rcp_adulto_paso_a_paso.png)
     ```

#### 11. RCP Paso a Paso Visual - PEDIATRÍA ⚠️ CRÍTICO
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-4-rcp/rcp_pediatrica_paso_a_paso.png`
- **Archivo Markdown:** `public/manual/BLOQUE_04_2_RCP_PEDIATRIA.md`
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Infografía paso a paso de RCP pediátrica (15:2, posiciones, profundidad, frecuencia)
- **Cómo sustituir:** Similar a RCP adultos, adaptar para pediatría

#### 12. RCP Paso a Paso Visual - LACTANTES ⚠️ CRÍTICO
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-4-rcp/rcp_lactantes_paso_a_paso.png`
- **Archivo Markdown:** `public/manual/BLOQUE_04_3_RCP_LACTANTES.md`
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Infografía paso a paso de RCP en lactantes (15:2, posiciones, profundidad, frecuencia)
- **Cómo sustituir:** Similar a RCP adultos, adaptar para lactantes

#### 13. Diagrama de Uso de DESA
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-4-rcp/diagrama_uso_desa.png`
- **Archivo Markdown:** Capítulos sobre DESA
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Infografía paso a paso del uso correcto de DESA (colocación de electrodos, secuencia)
- **Cómo sustituir:**
  1. Crear imagen: `diagrama_uso_desa.png`
  2. Colocar en: `public/assets/infografias/bloque-4-rcp/`
  3. Añadir a `image-registry.ts`
  4. Añadir referencia en capítulos de DESA

#### 14. Infografía de OVACE - ADULTOS
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-4-rcp/ovace_adulto.png`
- **Archivo Markdown:** Capítulos sobre OVACE adultos
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Infografía de maniobra de Heimlich en adultos (posición, técnica, secuencia)
- **Cómo sustituir:**
  1. Crear imagen: `ovace_adulto.png`
  2. Colocar en: `public/assets/infografias/bloque-4-rcp/`
  3. Añadir a `image-registry.ts`
  4. Añadir referencia en capítulos de OVACE adultos

#### 15. Infografía de OVACE - PEDIATRÍA
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-4-rcp/ovace_pediatrica.png`
- **Archivo Markdown:** Capítulos sobre OVACE pediatría
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Infografía de OVACE en pediatría (maniobra de Heimlich adaptada)
- **Cómo sustituir:** Similar a OVACE adultos

#### 16. Infografía de OVACE - LACTANTES
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-4-rcp/ovace_lactantes.png`
- **Archivo Markdown:** Capítulos sobre OVACE lactantes
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Infografía de OVACE en lactantes (golpes en espalda + compresiones torácicas)
- **Cómo sustituir:** Similar a OVACE adultos

---

### BLOQUE 5: PROTOCOLOS TRANSTELEFÓNICOS

#### 17-21. Diagramas de Flujo para Protocolos Transtelefónicos
- **Estado:** ❌ FALTANTE (existen algunos básicos, falta versión detallada)
- **Protocolos:**
  - RCP Adulto Transtelefónico
  - RCP Pediátrico Transtelefónico
  - DESA Transtelefónico
  - OVACE Transtelefónico
  - SCA Transtelefónico
  - Ictus Transtelefónico
- **Ubicación:** `public/assets/infografias/bloque-5-protocolos-transtelefonicos/`
- **Archivo Markdown:** Capítulos de protocolos transtelefónicos
- **Referencia en código:** `src/data/image-registry.ts` (añadir entradas)
- **Descripción:** Diagramas de flujo detallados para cada protocolo transtelefónico
- **Cómo sustituir:**
  1. Crear directorio: `public/assets/infografias/bloque-5-protocolos-transtelefonicos/`
  2. Crear imágenes para cada protocolo: `flujo_rcp_adulto_telefono.svg`, etc.
  3. Añadir a `image-registry.ts`
  4. Añadir referencias en capítulos correspondientes

---

### BLOQUE 6: FARMACOLOGÍA

#### 22. Farmacología Básica Visual ⚠️ CRÍTICO
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-6-farmacologia/farmacologia_basica_visual.png`
- **Archivo Markdown:** Capítulos de farmacología básica
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Referencia en app:** `src/pages/Farmacos.tsx` (puede usarse como imagen de referencia)
- **Descripción:** Infografía con fármacos críticos, dosis, vías de administración, indicaciones
- **Cómo sustituir:**
  1. Crear directorio: `public/assets/infografias/bloque-6-farmacologia/`
  2. Crear imagen: `farmacologia_basica_visual.png`
  3. Añadir a `image-registry.ts`
  4. Añadir referencia en capítulos de farmacología

#### 23. Tabla Visual de Dosis Pediátricas
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-6-farmacologia/tabla_dosis_pediatricas.png`
- **Archivo Markdown:** Capítulos de farmacología pediátrica
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Referencia en app:** `src/pages/Farmacos.tsx` (puede usarse como referencia visual)
- **Descripción:** Tabla visual con dosis pediátricas por peso/edad para fármacos críticos
- **Cómo sustituir:** Similar a farmacología básica

#### 24. Infografía de Vías de Administración
- **Estado:** ❌ FALTANTE
- **Ubicación:** `public/assets/infografias/bloque-6-farmacologia/vias_administracion.png`
- **Archivo Markdown:** Capítulos sobre vías de administración
- **Referencia en código:** `src/data/image-registry.ts` (añadir entrada)
- **Descripción:** Infografía visual de vías de administración (IV, IO, IM, sublingual, etc.)
- **Cómo sustituir:** Similar a anteriores

---

## 🟡 PRIORIDAD MEDIA - Capítulos sin Imágenes

### BLOQUE 7: CONDUCCIÓN Y SEGURIDAD VIAL
- **Estado:** ❌ Todos los capítulos sin imágenes
- **Capítulos afectados:** ~5-10 capítulos
- **Sugerencias de medios:**
  - Diagramas de seguridad vial
  - Infografías de conducción segura
  - Tablas de distancias de frenado
- **Cómo añadir:** Similar proceso, crear directorio `bloque-7-conduccion/` si no existe

### BLOQUE 8: GESTIÓN OPERATIVA Y DOCUMENTACIÓN
- **Estado:** ❌ Todos los capítulos sin imágenes
- **Capítulos afectados:** ~5-10 capítulos
- **Sugerencias de medios:**
  - Diagramas de flujo de documentación
  - Infografías de organización operativa
- **Cómo añadir:** Similar proceso

### BLOQUE 9-14: Otros Bloques
- **Estado:** ❌ Mayoría sin imágenes
- **Capítulos afectados:** ~60+ capítulos
- **Prioridad:** Baja (añadir progresivamente)

---

## 📝 PROCESO ESTÁNDAR DE SUSTITUCIÓN

### Paso 1: Crear el Medio Visual
1. Crear la imagen/vídeo según especificaciones
2. Nombrar el archivo siguiendo convención: `tema_descripcion.png` o `.svg`
3. Optimizar el tamaño (recomendado: <500KB para imágenes, preferible SVG cuando sea posible)

### Paso 2: Colocar en Ubicación Correcta
1. Identificar el bloque temático
2. Colocar en: `public/assets/infografias/bloque-X-nombre/archivo.png <!-- PLACEHOLDER: No requiere creación -->`
3. Si el directorio no existe, crearlo

### Paso 3: Registrar en image-registry.ts
1. Abrir `src/data/image-registry.ts`
2. Añadir entrada en el bloque correspondiente:
   ```typescript
   'id-unico': {
     id: 'id-unico',
     path: '/assets/infografias/bloque-X-nombre/archivo.png',
     alt: 'Texto alternativo descriptivo',
     caption: 'Caption opcional que aparece debajo',
     block: 'bloque-X-nombre',
     tags: ['tag1', 'tag2', 'tag3']
   },
   ```

### Paso 4: Añadir Referencia en Markdown
1. Abrir el archivo `.md` correspondiente en `public/manual/`
2. Añadir referencia en la sección apropiada:
   ```markdown
   ![Descripción de la imagen]/assets/infografias/bloque-X-nombre/archivo.png)
   ```
3. O usar alias si está en el registry (requiere modificar MarkdownViewer):
   ```markdown
   ![id-unico]
   ```

### Paso 5: Verificar
1. Ejecutar la app: `npm run dev`
2. Navegar al capítulo correspondiente
3. Verificar que la imagen se carga correctamente
4. Verificar que aparece en la galería de imágenes (`/galeria-imagenes`)

---

## 🔍 VERIFICACIÓN DE MEDIOS EXISTENTES

Para verificar qué medios ya existen:

```bash
# Listar todas las imágenes
find public/assets/infografias -type f -name "*.png" -o -name "*.svg" -o -name "*.jpg"

# Contar por bloque
find public/assets/infografias -type d -mindepth 1 -maxdepth 1 | while read dir; do
  echo "$(basename "$dir"): $(find "$dir" -type f | wc -l) imágenes"
done
```

---

## 📊 RESUMEN POR PRIORIDAD

| Prioridad | Cantidad | Esfuerzo Estimado | Estado |
|-----------|----------|-------------------|--------|
| 🔴 **CRÍTICA** | 25 medios | 40-60 horas | ❌ 0% completado |
| 🟡 **MEDIA** | 60+ capítulos | 200+ horas | ❌ 0% completado |
| 🟢 **BAJA** | Resto | Variable | ❌ 0% completado |

---

## ✅ CHECKLIST DE COMPLETACIÓN

Para cada medio visual:

- [ ] Medio creado y optimizado
- [ ] Colocado en ubicación correcta
- [ ] Registrado en `image-registry.ts`
- [ ] Referencia añadida en Markdown
- [ ] Verificado en la app
- [ ] Aparece en galería de imágenes
- [ ] Texto alternativo (alt) descriptivo
- [ ] Tags apropiados para búsqueda

---

**Última actualización:** 2026-01-15  
**Próxima revisión:** Según creación de medios visuales