Pacheche/unslop-anything

Deslopificar Cualquier Cosa

El slop de IA es aquello que nadie decidió. El modelo eligió la respuesta más común, por lo que el resultado se parece a otros mil: el degradado violeta, el emoji en cada etiqueta, el titular de bienvenida, la frase "no solo X, es Y". Incluso los buenos patrones se convierten en slop cuando todos los envían por defecto.

Así que deslopificar tiene dos mitades, y necesitas ambas:

1. Elimina los valores por defecto. Encuentra cada señal nombrada, arréglala con un valor concreto o una frase concreta.
2. Añade una decisión. Un resultado limpio que podría pertenecer a cualquier producto es la siguiente plantilla. El trabajo terminado debe incluir al menos una cosa que solo este producto, marca o escritor tendría.

Tú haces el trabajo tú mismo: lee los archivos, edítalos, renderiza, compara. Pregunta al usuario solo por lo que el material no pueda decirte.

Cómo usar este skill

Las rutas son relativas a la carpeta de este skill. Carga las referencias bajo demanda, nunca todas a la vez.

1. Enrutamiento. Decide qué estás deslopificando y abre solo sus referencias.

Medio	Leer
Aplicación web, dashboard, landing page, cualquier UI HTML/CSS/React/Vue/Svelte	references/ui-signs.md, references/ui-passes.md, references/direction.md
Pantalla de aplicación móvil (iOS, Android, React Native, Flutter, SwiftUI)	Los archivos de UI anteriores más references/mobile.md
Imagen, ilustración, conjunto de iconos, póster, gráfico social, diapositiva, logo	references/visual-design.md, references/direction.md
Escritura: publicación, hilo, artículo, correo electrónico, documentación, README, texto de UI	references/writing.md
Una UI cuyo texto también es slop	haz primero la UI, luego la pasada de texto con references/writing.md

Cuando el usuario pida un overlay o componente específico y el nombre sea vago ("haz un popup"), revisa references/component-vocabulary.md antes de construir.

2. Elige el trabajo.

   • Detectar. El usuario pregunta "¿esto es slop?", quiere una auditoría, o dice que no cambies nada. Carga solo el archivo de señales para el medio (ui-signs.md, visual-design.md o writing.md). No edites. Responde en esta forma:

     Nivel de slop: N% (pesado | ligero | ninguno)
     <Categoría>
     - <señal>: <dónde: archivo:línea, región de pantalla o "frase citada"> -> <solución en pocas palabras>
     Afirmaciones por confirmar: <afirmaciones no verificables, o ninguna>
     No revisado: <lo que no pudiste ver, o ninguna>
     ¿Quieres que lo arregle?
     

   • Arreglar (por defecto). Ejecuta el flujo de trabajo a continuación.

3. Ten el material frente a ti.

   • Código: encuentra los archivos que renderizan la pantalla. Si puedes ejecutarlo, renderiza y toma una captura de pantalla. Juzga lo que la gente ve, no solo el código.
   • Una URL sin código: ábrela en una herramienta de navegador, captúrala y guarda el HTML como una copia local para trabajar. El resultado es un archivo rediseñado que el usuario puede entregar a quien sea dueño del sitio. Dilo.
   • Solo una captura de pantalla: reconstruye como un archivo HTML estático que coincida estrechamente, trata eso como el original, y dilo.
   • Sin navegador o herramienta de renderizado, o la aplicación no arranca: extrae la pantalla en un archivo HTML estático y renderiza si puedes; de lo contrario, trabaja desde el código y lista cada verificación visual bajo No revisado:.
   • Escritura: pide el borrador si no está pegado. Si la audiencia no está clara, haz una pregunta: ¿quién lee esto y dónde?

Flujo de trabajo

1. Escanear. Para archivos de código o texto, ejecuta el escáner. Encuentra candidatos, no veredictos:

   python3 <carpeta del skill>/scripts/slop_scan.py <archivos o carpetas>
   python3 <carpeta del skill>/scripts/slop_scan.py --text draft.md      # reglas de escritura en cualquier archivo
   

   En Windows usa py en lugar de python3. Solo necesita Python 3. Salida 0 significa sin candidatos, 1 candidatos, 2 nada escaneado. Escanea solo el objetivo: los archivos de la pantalla y los componentes y estilos compartidos que usa, no todo el repositorio, a menos que el usuario haya pedido una auditoría de todo el repo. Para una auditoría de todo el repo, usa --json y agrupa los aciertos por regla antes de leerlos. Confirma cada acierto leyéndolo. Elimina los falsos positivos y explica por qué en el informe.
2. Auditar. Recorre el archivo de señales para el medio. Una línea por señal: qué, dónde (archivo:línea, región de pantalla o frase citada), solución. Añade señales que el escáner no pueda ver: jerarquía, ritmo, composición, significado.
3. Calificar. Cuenta las categorías del archivo de señales (no las categorías del escáner) que tengan al menos una señal. Archiva cada señal en solo una categoría, la primera que la enumere. Ese conteo multiplicado por 10 es el nivel de slop. En UI, la última categoría (Aspecto de plantilla) cuenta solo cuando las otras nueve están vacías. Luego elige el modo:
   • Pesado (50% o más): proceso completo, dirección primero.
   • Ligero (10-40%): modo de pulido. Arregla solo lo que encontró la auditoría. Mantén la paleta, tipografía, diseño, voz y marca. Las ideas más grandes van en el informe como sugerencias.
   • Ninguno (0%): dilo claramente. Ofrece dos o tres refinamientos con valores exactos y aplícalos solo si el usuario acepta. Nunca cambies buen trabajo solo para hacerlo diferente.
4. Dirección (solo UI pesada y diseño visual). Sigue references/direction.md: frase de producto, personaje, mundo, momentos, firma, y para nuevos looks tres direcciones candidatas antes de comprometerte con una. Muestra la auditoría y la dirección, luego detente y espera la respuesta del usuario, porque cambiar de dirección después significa rehacerlo todo. Omite la espera solo cuando el usuario ya dijo "solo hazlo"; entonces aún pon las tres candidatas (una línea cada una) y por qué elegiste una en el informe.
5. Arreglar por pasadas. UI: el orden de pasadas en references/ui-passes.md. Diseño visual: el orden en references/visual-design.md. Escritura: el flujo de trabajo en references/writing.md. Termina una pasada en toda la pieza antes de comenzar la siguiente.
6. Verificar. Renderiza de nuevo (como máximo tres renders por ejecución) y mira el render a tamaño completo, región por región: columnas que chocan, texto recortado o superpuesto y bordes desalineados solo se ven allí. Verifica contra la lista de auditoría y la lista de verificación de la referencia que usaste. Ejecuta el escáner de nuevo. Cualquier cosa que aún esté en la lista se arregla o se justifica explícitamente.
7. Informar. Nivel de slop antes y después, la dirección, unas líneas por pasada sobre qué cambió, falsos positivos que descartaste, cualquier cosa que no pudiste verificar (No revisado:), y afirmaciones que necesitas que el usuario confirme.

Reglas que no se doblan

• Mantén el producto, cambia el oficio. Las características, el contenido, los datos, el orden de las secciones y el nombre del producto se quedan. No añadas secciones.
• Los datos simulados solo reemplazan marcadores de posición. Cuando el original muestra valores de marcador de posición ($123.456, Lorem, Juan Pérez, un gráfico falso), puedes reemplazarlos con valores simulados plausibles. Enumera cada valor simulado en el informe bajo Datos simulados por reemplazar. Los datos reales nunca se cambian.
• Nunca inventes. Sin nuevas características, estadísticas, testimonios, fuentes, logotipos o citas. Afirmaciones como "Confiado por más de 10.000 equipos" o "10 veces más rápido" se confirman con el usuario o se eliminan. Enumérelas en el informe.
• La decoración eliminada no se reemplaza con nueva decoración. Cambiar degradados violetas por glassmorfismo, grano, neón, cuadrículas bento o iconos de vidrio 3D es el mismo slop en una nueva tendencia.
• Tranquilo no es tenue. Despojar todo el color hasta que nada se lea también es un fracaso. El color se queda donde tiene significado: la acción principal, una selección, un estado, una serie de datos, el momento único.
• El color y las etiquetas dicen la verdad. Una etiqueta coincide con su número ("recuperación del 64%" no es "Excelente" a menos que la escala lo diga). Rojo significa un problema. Verde significa bueno.
• Trabaja a través del sistema de diseño. Si el proyecto tiene tokens de tema o variables CSS, cambia sus valores o cómo se usan; nunca los evites con valores codificados.
• Mantén la voz del escritor y la marca real. Un logotipo, color o tipografía real se queda. Un degradado violeta a azul, un brillo o resplandor en un logotipo no es marca a menos que el usuario lo diga. La escritura mantiene el vocabulario, la franqueza y el humor del escritor.
• Copiar una aplicación famosa no es deslopificar. Estudia de 3 a 5 referencias para estructura y números, nunca pegues el aspecto de un producto en otro.
• Sin suposiciones de detector. En modo detectar, nombra patrones con evidencia. Nunca afirmes que algo "fue escrito por IA".

Excusa	Realidad
"Se ve limpio ahora"	Limpio es la plantilla. Haz la prueba de la plantilla: intercambia el nombre de un competidor. Si aún encaja, empuja la dirección.
"El usuario solo quiere que sea más bonito"	Más bonito y diferente no son lo mismo. Diez aplicaciones de IA bonitas una al lado de la otra son una sola aplicación.
"Quitar color lo arregla"	Quitar color sin una rampa, un acento y un significado da una plantilla gris.
"El escáner no encontró nada"	Cero aciertos significa cero señales buscables. La jerarquía, el ritmo y el significado aún necesitan tus ojos.
"Saltaré el render, el código está bien"	El slop vive en lo que la gente ve. Texto recortado, espacios desiguales y jerarquía débil solo se muestran al renderizar.

Prueba de plantilla (ejecutar al final, cada vez)

Reemplaza el nombre del producto, o el nombre del escritor, con el de un competidor. Si la pantalla, imagen o texto aún encaja sin ediciones, no está terminado. Empuja la dirección más fuerte en el texto, el momento visual y el detalle de la firma.