Communitygithub.com

cylqwe7855-alt/build-professional-workbench

Skill de construcción ultrarrápida de estaciones de trabajo multidisciplinarias: Web pura offline, persistencia local, paneles complejos y casos docentes completos.

¿Qué es build-professional-workbench?

Este skill permite construir un producto operativo centrado en un rol profesional, no un simple contenedor con nombre cambiado. Está diseñado para agentes como Claude Code, Cursor o Codex, y funciona en modo completamente offline, sin depender de CDNs ni servidores. El skill guía al agente a través de un proceso estructurado: clasificar la petición (nueva construcción, extensión, rediseño o auditoría), inferir el contexto del usuario y su profesión, y leer solo las referencias necesarias (perfiles de profesión, arquitectura, catálogo de paneles, persistencia local). Una vez definido el modelo de la profesión (objetos principales, ciclo de vida, decisiones, riesgos), el agente construye páginas completas con dashboards únicos que responden a diferentes preguntas de negocio, usando tipos de gráficos variados (tendencias, barras, mapas de calor, Sankey, Gantt, etc.). Todo el contenido se guarda localmente mediante localStorage o IndexedDB, garantizando persistencia automática y recuperación tras recarga. El skill incluye un template de referencia que proporciona 56 entradas de módulo, 22 familias de gráficos, tablas editables, navegación multizona, y un diseño visual "Quiet Luxury A" (ivory, verde tinta, acentos sage, tipografía serif). Finalmente, el skill aplica guardas de seguridad: no inferir autoridad para escrituras externas, no presentar datos simulados como reales, no usar CDNs en entregables offline, y mantener el flag `production_ready` falso hasta que se superen todas las validaciones. El resultado es una estación de trabajo profesional completamente funcional, offline, personalizable y con dashboards analíticos coherentes.

Compatible con~Claude Code~Codex CLI✓Cursor
npx skills add cylqwe7855-alt/build-professional-workbench

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

Skill de construcción ultrarrápida de estaciones de trabajo multidisciplinarias

Construye un producto operativo centrado en un rol, no un simple contenedor con nombre cambiado. Conserva una arquitectura existente cuando esté presente. Para una nueva construcción puramente web, comienza desde assets/reference-workbench-template/, luego reemplaza completamente su dominio de referencia educativo.

Inicio

  1. Clasifica la solicitud como nueva construcción, extensión, rediseño o auditoría.
  2. Infiere la profesión, organización, rol, usuarios, objetos de trabajo, ciclo de vida, decisiones, riesgos, aprobaciones, límite de privacidad y modo de despliegue. Pregunta solo cuando una opción faltante cambie materialmente el producto.
  3. Lee solo las referencias necesarias:
  4. Para un nuevo proyecto offline, ejecuta:
python3 scripts/scaffold_professional_workbench.py <target> --profile <profile> --profession "..." --organization-name "..." --role-name "..." --user-name "..." --deployment-mode local-offline
  1. Trata el andamiaje como un punto de partida. No entregues hasta que cada ruta, registro, flujo de trabajo, gráfico, control, ruta de persistencia y verificación de restos de dominio pase.

Modelar la profesión

  • Define los sustantivos principales del rol: casos, clientes, pacientes, proyectos, candidatos, cuentas, contenido, activos, experimentos, pedidos, incidentes u objetos equivalentes.
  • Define estados del ciclo de vida, responsables, traspasos, fechas límite, decisiones, condiciones de excepción, evidencia y aprobaciones.
  • Separa trabajo personal, operaciones de equipo, recursos compartidos, análisis y administración/cumplimiento.
  • Mantén visibles el contexto de organización, rol, período, territorio, equipo o portafolio.
  • Usa etiquetas de texto explícitas en chino en la navegación; los íconos solo refuerzan el significado.
  • Selecciona un perfil de profession-profiles.md, o combina perfiles para roles híbridos. Conserva solo las responsabilidades que admite el rol real.

Construir páginas completas

  • Dale a cada elemento de navegación una página completa con título, contexto, acciones, registros densos, estados y un panel analítico distinto.
  • Evita marcadores de posición, tablas de tres filas, tarjetas renombradas repetidas, gráficos decorativos y botones no soportados.
  • Usa registros de demostración deterministas y coherentes y etiquétalos como datos simulados.
  • Incluye estados normales, vacíos, de carga, advertencia, error, deshabilitados, vencidos, conflicto, aprobación y confirmación apropiados.
  • Haz que las páginas con muchos registros sean buscables, filtrables, ordenables y limitadas por paginación o desplazamiento controlado.
  • Haz que los registros principales sean directamente editables. Las operaciones de crear, actualizar y eliminar deben alimentar la misma fuente que usan la tabla, los detalles, la exportación y los paneles.
  • Haz que los controles de fecha, rango, filtro y segmento operen sobre registros reales. Los controles solo visuales son defectos.
  • Exporta los registros filtrados actuales con cabeceras estables. Valida las importaciones en cuanto a formato, forma de fila, límites e intención de fusión/reemplazo; previsualiza primero y mantén los datos actuales sin cambios en caso de fallo.
  • Traza el objeto de trabajo principal a través de las páginas de lista, detalle, flujo de trabajo y panel.

Asignar paneles distintos

  • Dale a cada página una pregunta de negocio, conjunto de KPIs, combinación de gráficos, diagnóstico, interacción y variante de color diferentes.
  • Usa tendencias para tiempo, barras para categorías, mapas de calor para densidad, Sankey para flujo, redes para relaciones, radar o coordenadas paralelas para perfiles, Gantt para cronogramas e histogramas o diagramas de caja para distribuciones.
  • Compone cada panel con un gráfico dominante, 3 o 4 KPIs, un diagnóstico secundario, una vista clasificada o segmentada, controles de rango, tooltips y una interpretación concisa.
  • Vincula los gráficos a los mismos registros visibles y proporciona resúmenes de texto accesibles.
  • Trata la salida financiera, médica, legal, de seguridad y de cumplimiento como apoyo a la decisión, nunca como juicio profesional autónomo.

Aplicar Quiet Luxury A

  • Usa el css/premium-minimal.css incluido como la capa de cascada final a menos que el usuario seleccione otra dirección visual.
  • Mantén un fondo marfil cálido, tipografía verde tinta, acentos sage desaturados, títulos display con serifa, sans-serif del sistema para controles, reglas finas y amplio espacio en blanco.
  • Prefiere jerarquía editorial y alineación sobre tarjetas redondeadas anidadas y sombras pesadas.
  • Mantén el shell tranquilo y etiquetado con texto. Usa paneles analíticos claros; reserva el grafito oscuro para el héroe espacial o el lienzo infinito.
  • Mantén los mapas de calor densos pero silenciosos, con cinco niveles de celda cuadrada.
  • Usa inspección al pasar el ratón, enfoque, selección, profundización, cajones de detalle, modales, panorámica/zoom y revelación progresiva donde aclaren el estado.
  • Mantén el movimiento corto, interrumpible y deshabilitado bajo prefers-reduced-motion.
  • Conserva el acceso por teclado, el enfoque visible, los controles semánticos, los diseños táctiles y las vistas de impresión/informe.
  • Adapta --workbench-folio, los selectores de contexto y el lenguaje del héroe a la nueva organización y profesión.
  • La imagen de héroe de referencia está incrustada como texto en js/hero-media.js para que el Skill siga siendo compatible con Red Skill y el sitio generado permanezca completamente offline.

Requerir persistencia local primero

  • Guarda automáticamente los cambios de creación, edición, eliminación, reordenación, anotación, borrador, preferencia y diseño en el ordenador actual después de la validación.
  • Restaura el estado guardado antes del primer renderizado significativo. Un toast de guardado sin una escritura exitosa es un defecto.
  • Usa js/local-persistence.js incluido para registros JSON pequeños y borradores. Usa IndexedDB para archivos adjuntos, colecciones grandes y colas offline.
  • Espacio de nombres para cada estación de trabajo, versiona los registros almacenados y añade migraciones cuando cambien los esquemas.
  • Muestra estados de guardado, guardado, fallo y cuota. Nunca descartes silenciosamente una escritura fallida.
  • Proporciona exportación JSON versionada, importación atómica validada con semántica de fusión/reemplazo, gestión de archivos adjuntos y borrado confirmado. Revierte cualquier importación aplicada parcialmente.
  • Mantén las semillas de demostración separadas de los registros personales. No almacenes secretos ni afirmes que el almacenamiento del navegador está encriptado.
  • Para local-offline, divulga los límites de un solo dispositivo y un solo navegador. Para team-server o enterprise, usa APIs autenticadas y una base de datos de servidor como sistema de registro; consulta deployment-modes.md.

Usar la implementación incluida

La plantilla de referencia proporciona HTML/CSS/JavaScript puro sin CDN, navegación textual multizona, 56 entradas de módulo, registros densos, Quiet Luxury A, un héroe espacial, lienzo infinito, mapa de calor de actividad, cursor personalizado, movimiento de ruta, 22 familias de gráficos, tablas editables, localStorage con espacio de nombres, autoguardado, copia de seguridad/importación versionada, diálogos, formularios, comportamiento responsivo y estilos de impresión.

Reemplaza todos los nombres de dominio de referencia, navegación, registros, flujos de trabajo, KPIs, identidades simuladas y redacción del héroe. Nunca envíes una estación de trabajo no educativa cambiando solo su título.

Validar

  1. Ejecuta python3 scripts/validate_redskill_package.py . al preparar este Skill para subirlo a Red Skill.
  2. Ejecuta python3 scripts/validate_professional_workbench.py <project-path> para la estación de trabajo generada.
  3. Ejecuta comprobaciones de sintaxis nativa o de construcción.
  4. Verifica que cada entrada de navegación resuelva a una página completa y reciba un panel distinto.
  5. Verifica la densidad de registros, coherencia entre páginas, filtros operativos, formularios, detalles, estados de flujo de trabajo y acceso por teclado.
  6. Verifica los activos locales y el comportamiento file:// para la entrega offline.
  7. Verifica añadir → recargar, editar → recargar, eliminar → recargar, exportar → limpiar → importar, rechazo de importación malformada y notificación de fallo de almacenamiento.
  8. Ejecuta node scripts/test_local_persistence.js <project-path> cuando Node.js esté disponible.
  9. Para perfiles no educativos, exige cero restos del dominio educativo.
  10. Realiza QA visual y de interacción cuando haya una superficie de navegador disponible; nunca equipares la existencia de archivos o el éxito de sintaxis con la aceptación visual.
  11. Informa sobre la ruta, modo de despliegue, profesión, rol, cobertura de módulos y paneles, resultados de CRUD/filtro/importación/exportación, resultados de persistencia, validación y límites restantes.

Guardas

  • No infieras autoridad para escrituras externas, aprobaciones, mensajes, transacciones o publicaciones.
  • No presentes registros simulados como datos reales ni expongas identificadores sensibles.
  • No automatices decisiones de alto riesgo sin revisión profesional.
  • No uses CDNs externas para entregables offline.
  • Mantén production_ready como falso hasta que la arquitectura, seguridad y puertas de aceptación del modo de despliegue seleccionado se superen.
  • No publiques ni despliegues a menos que el usuario lo solicite o las instrucciones activas de construcción del sitio requieran alojamiento.

Skills relacionados