279 lines
11 KiB
HTML
279 lines
11 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="es">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title data-meta-title>Manual de usuario de la aplicación</title>
|
||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
|
||
<link rel="stylesheet" href="manual.css" />
|
||
</head>
|
||
<body>
|
||
<!-- =========================================================
|
||
PORTADA
|
||
========================================================= -->
|
||
<section class="cover no-chrome" data-cover>
|
||
<div class="cover-inner">
|
||
<div class="cover-brand">
|
||
<div class="cover-logo" aria-label="Logo de Factor Pesca">Factor Pesca</div>
|
||
</div>
|
||
|
||
<div class="cover-title-block">
|
||
<p class="cover-eyebrow" data-meta-eyebrow>Manual de usuario</p>
|
||
<h1 class="cover-title" data-meta-title-display>Manual de la aplicación</h1>
|
||
<p class="cover-subtitle" data-meta-subtitle>Guía de procedimientos paso a paso para operadores.</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- =========================================================
|
||
ÍNDICE
|
||
========================================================= -->
|
||
<section class="toc-page" id="toc">
|
||
<h1 class="toc-title">Índice</h1>
|
||
<ol class="toc-list" data-toc-output></ol>
|
||
</section>
|
||
|
||
<!-- =========================================================
|
||
RESUMEN EJECUTIVO
|
||
========================================================= -->
|
||
<section class="summary-page">
|
||
<h1>Resumen ejecutivo</h1>
|
||
|
||
<article class="summary-block">
|
||
<h2>Objetivo</h2>
|
||
<p data-summary-objective>
|
||
Este manual describe los procedimientos operativos de la aplicación,
|
||
paso a paso, con capturas reales y anotaciones para que cualquier
|
||
operador pueda completar las tareas más frecuentes sin ambigüedad.
|
||
</p>
|
||
</article>
|
||
|
||
<article class="summary-block">
|
||
<h2>Audiencia</h2>
|
||
<p data-summary-audience>
|
||
Operadores de captura, supervisores de turno y administradores del sistema.
|
||
No se requieren conocimientos técnicos previos; sí se recomienda
|
||
familiaridad con la gestión de datos pesqueros.
|
||
</p>
|
||
</article>
|
||
|
||
<article class="summary-block">
|
||
<h2>Alcance</h2>
|
||
<p data-summary-scope>
|
||
Cubre los procesos de alta de capturas, consulta de histórico y
|
||
exportación de reportes. No cubre la configuración del servidor ni
|
||
los procedimientos de copia de seguridad.
|
||
</p>
|
||
</article>
|
||
</section>
|
||
|
||
<!-- =========================================================
|
||
REQUISITOS PREVIOS
|
||
========================================================= -->
|
||
<section class="prereq-page">
|
||
<h1>Requisitos previos</h1>
|
||
<p>Asegúrese de cumplir con los siguientes requisitos antes de iniciar.</p>
|
||
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th>Requisito</th>
|
||
<th>Detalle</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody data-prereq-body>
|
||
<tr>
|
||
<td>Navegador</td>
|
||
<td>Chromium 120+, Firefox 121+ o Safari 17+.</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Resolución</td>
|
||
<td>Mínimo 1280×800 px; recomendado 1440×900 px.</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Cuenta</td>
|
||
<td>Usuario activo con rol de Operador o superior.</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Conectividad</td>
|
||
<td>Acceso a la red corporativa o VPN configurada.</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</section>
|
||
|
||
<!-- =========================================================
|
||
CAPÍTULOS
|
||
========================================================= -->
|
||
<main data-chapters>
|
||
<!-- Plantilla de capítulo: duplicar este bloque por cada proceso -->
|
||
<section data-chapter>
|
||
<h1 data-chapter-title>Nombre del proceso</h1>
|
||
|
||
<aside class="callout callout-info">
|
||
<div class="callout-title">Objetivo del capítulo</div>
|
||
<p data-chapter-objective>
|
||
En este capítulo aprenderá a [verbo en infinitivo] [resultado esperado].
|
||
</p>
|
||
</aside>
|
||
|
||
<article class="step-block" data-step>
|
||
<div class="step-number" aria-hidden="true"></div>
|
||
<div class="step-content">
|
||
<h2 class="step-title" data-step-title>Primer paso del proceso</h2>
|
||
<p data-step-text>
|
||
Describa aquí la acción principal del paso. Sea concreto: indique
|
||
qué botón, campo o menú debe usar el operador.
|
||
</p>
|
||
<figure class="screenshot-frame">
|
||
<img src="artifacts/01-ejemplo.png" alt="Descripción accesible de la captura" />
|
||
<figcaption>Figura 1. Pie de figura descriptivo.</figcaption>
|
||
</figure>
|
||
</div>
|
||
</article>
|
||
|
||
<article class="step-block" data-step>
|
||
<div class="step-number" aria-hidden="true"></div>
|
||
<div class="step-content">
|
||
<h2 class="step-title" data-step-title>Segundo paso del proceso</h2>
|
||
<p data-step-text>
|
||
Continúe la descripción con la siguiente acción. Si el paso tiene
|
||
un resultado visible, agregue un callout <em>Resultado esperado</em>
|
||
debajo de la figura.
|
||
</p>
|
||
<figure class="screenshot-frame">
|
||
<img src="artifacts/02-ejemplo.png" alt="Descripción accesible de la captura" />
|
||
<figcaption>Figura 2. Pie de figura descriptivo.</figcaption>
|
||
</figure>
|
||
<aside class="callout callout-info callout-result">
|
||
<div class="callout-title">Resultado esperado</div>
|
||
<p>
|
||
Describa qué verá el operador en pantalla tras ejecutar la acción
|
||
correctamente.
|
||
</p>
|
||
</aside>
|
||
</div>
|
||
</article>
|
||
|
||
<article class="step-block" data-step>
|
||
<div class="step-number" aria-hidden="true"></div>
|
||
<div class="step-content">
|
||
<h2 class="step-title" data-step-title>Paso con acción irreversible</h2>
|
||
<p data-step-text>
|
||
Antes de cualquier acción irreversible, agregue un callout
|
||
<em>Advertencia</em> explicando las consecuencias.
|
||
</p>
|
||
<aside class="callout callout-warning">
|
||
<div class="callout-title">Advertencia</div>
|
||
<p>
|
||
Esta acción no se puede deshacer desde la interfaz. Describa
|
||
claramente las consecuencias y, si aplica, cómo solicitar la
|
||
reversión al administrador.
|
||
</p>
|
||
</aside>
|
||
<aside class="callout callout-info callout-result">
|
||
<div class="callout-title">Resultado esperado</div>
|
||
<p>
|
||
Describa el estado final tras la acción irreversible.
|
||
</p>
|
||
</aside>
|
||
</div>
|
||
</article>
|
||
|
||
<aside class="callout callout-tip callout-chapter-end">
|
||
<div class="callout-title">Resultado final</div>
|
||
<p>Resumen en una frase del estado en que queda el sistema al terminar el proceso.</p>
|
||
</aside>
|
||
</section>
|
||
<!-- /Plantilla de capítulo -->
|
||
</main>
|
||
|
||
<!-- =========================================================
|
||
SOLUCIÓN DE PROBLEMAS
|
||
========================================================= -->
|
||
<section class="troubleshooting-page" id="troubleshooting">
|
||
<h1>Solución de problemas</h1>
|
||
<p>
|
||
Si encuentra algún error durante los procedimientos descritos,
|
||
busque el síntoma en esta sección antes de contactar al soporte.
|
||
</p>
|
||
|
||
<article class="trouble">
|
||
<h3 class="trouble-symptom">El botón «Guardar» permanece deshabilitado</h3>
|
||
<p><strong>Causa probable:</strong> uno o más campos obligatorios están vacíos o tienen un formato no válido.</p>
|
||
<p><strong>Solución:</strong> revise los campos marcados en rojo y verifique que las fechas tengan el formato <code>DD/MM/AAAA</code>.</p>
|
||
</article>
|
||
|
||
<article class="trouble">
|
||
<h3 class="trouble-symptom">La aplicación muestra un error 500 al guardar</h3>
|
||
<p><strong>Causa probable:</strong> pérdida temporal de conectividad con el servicio de persistencia.</p>
|
||
<p><strong>Solución:</strong> espere treinta segundos y vuelva a intentarlo. Si el error persiste, contacte con soporte adjuntando la hora exacta del incidente.</p>
|
||
</article>
|
||
|
||
<article class="trouble">
|
||
<h3 class="trouble-symptom">No recibo notificaciones por correo</h3>
|
||
<p><strong>Causa probable:</strong> la dirección de notificación del usuario no está validada.</p>
|
||
<p><strong>Solución:</strong> acceda a «Mi perfil» y verifique la dirección de correo. Recibirá un mensaje de confirmación en menos de un minuto.</p>
|
||
</article>
|
||
</section>
|
||
|
||
<!-- =========================================================
|
||
GLOSARIO (opcional, eliminar si no aplica)
|
||
========================================================= -->
|
||
<section class="glossary-page">
|
||
<h1>Glosario</h1>
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr><th>Término</th><th>Definición</th></tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr><td>Captura</td><td>Registro individual de pesca asociado a un lote y una fecha.</td></tr>
|
||
<tr><td>Lote</td><td>Conjunto de capturas agrupadas bajo un mismo identificador.</td></tr>
|
||
<tr><td>Operador</td><td>Usuario con permisos de lectura y escritura sobre capturas propias.</td></tr>
|
||
<tr><td>Supervisor</td><td>Usuario con permisos de lectura y escritura sobre todas las capturas del área.</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</section>
|
||
|
||
<!-- =========================================================
|
||
AVISO DE PROPIEDAD Y CONFIDENCIALIDAD
|
||
========================================================= -->
|
||
<section class="copyright-page no-chrome" id="copyright">
|
||
<div class="copyright-inner">
|
||
<div class="copyright-mark" aria-hidden="true">©</div>
|
||
<p class="copyright-company">
|
||
<strong>Factor Pesca S.A. de C.V.</strong><br />
|
||
Todos los derechos reservados.
|
||
</p>
|
||
|
||
<h2 class="copyright-title">Aviso de propiedad y confidencialidad</h2>
|
||
|
||
<p>
|
||
Este documento y la totalidad de su contenido —textos, gráficos,
|
||
logotipos, iconos, imágenes, capturas de pantalla, marcas,
|
||
diseño de composición y selección de los materiales— son
|
||
<strong>propiedad exclusiva de Factor Pesca S.A. de C.V.</strong>
|
||
y están protegidos por las leyes nacionales e internacionales
|
||
en materia de propiedad intelectual, derechos de autor y
|
||
secretos industriales.
|
||
</p>
|
||
|
||
<p>
|
||
Queda <strong>estrictamente prohibida</strong> la reproducción
|
||
total o parcial, distribución, comunicación pública,
|
||
transformación, traducción, adaptación, compilación,
|
||
desensamblado o cualquier otra forma de explotación de este
|
||
documento, por cualquier medio y para cualquier finalidad, sin
|
||
el consentimiento previo, expreso y por escrito de Factor Pesca
|
||
S.A. de C.V. El uso no autorizado será perseguido y
|
||
sancionado conforme a la legislación civil, penal y mercantil
|
||
aplicable.
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<script src="manual.js"></script>
|
||
</body>
|
||
</html> |