Communitygithub.com

vmitsaras/revisión-de-distintividad-de-sitio-web

Revisa un sitio web existente, un concepto de página, un mockup o una dirección creativa para determinar si se siente como propiedad única de la marca en lugar de ser genérico, basado en plantillas o por defecto de IA. Úsalo cuando el usuario pregunte si un diseño destaca, es memorable, atrae a la audiencia adecuada, repele a la audiencia incorrecta, expresa una personalidad de marca específica o pertenece sin duda a un solo negocio.

¿Qué es revisión-de-distintividad-de-sitio-web?

Este skill realiza una revisión de distintividad de sitios web, evaluando si un diseño o dirección propuesta se siente única, apropiable e intencionada, perteneciendo inequívocamente a una sola marca y audiencia. No juzga la novedad por sí misma, sino que prueba si el diseño traduce características reales de la marca en señales visuales, verbales, estructurales y experienciales reconocibles, en lugar de depender de clichés de categoría, tratamientos superficiales de moda, plantillas predeterminadas o resultados de IA no dirigidos. El skill está diseñado para usarse en plataformas de agentes de IA como Claude Code, Cursor o Codex. Su funcionamiento se basa en una serie de lentes de revisión (como la propiedad de la marca, la especificidad de la audiencia, la polaridad emocional y la continuidad del mundo de la marca) y un flujo de trabajo estructurado de 11 pasos que incluye pruebas de sustitución, pruebas de atracción/repulsión de audiencia y pruebas de reacción de cinco segundos. El resultado es un veredicto de distintividad (Apropiable, Emergente, Intercambiable, Desalineado o Evidencia Insuficiente) y un conjunto de intervenciones recomendadas (Preservar, Afilar, Reemplazar, Introducir), junto con sugerencias para habilidades de seguimiento especializadas.

Compatible con~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/vmitsaras/Agent-Skills/tree/HEAD/skills/ui-ux-polish/website-distinctiveness-review

Preguntar en tu IA favorita

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

Documentación

Revisión de Distintividad de Sitio Web

Propósito

Revisar si un sitio web o una dirección de diseño propuesta se siente lo suficientemente específica, apropiable e intencionada como para pertenecer sin duda a un solo negocio y a una sola audiencia.

Esta habilidad no juzga la novedad por la novedad misma. Prueba si el diseño traduce características reales de la marca en señales visuales, verbales, estructurales y experienciales reconocibles, en lugar de depender de clichés de categoría, tratamientos superficiales de moda, valores predeterminados de plantillas o resultados de IA no dirigidos.

La revisión debe ayudar a afilar una dirección existente. No debe codificar la interfaz ni reemplazar una estrategia de marca más amplia.

Cuándo usar esta habilidad

Usa esta habilidad cuando:

  • El usuario pregunta si un sitio web destaca o se siente genérico.
  • Un diseño se ve pulido pero podría pertenecer plausiblemente a varios competidores.
  • El usuario sospecha que un diseño se siente liderado por plantillas, tendencias o generado por IA.
  • Un equipo quiere que el sitio atraiga a una audiencia específica en lugar de apelar vagamente a todos.
  • La personalidad de la marca es conocida, pero el sitio web no la expresa con fuerza.
  • Un concepto necesita una posición emocional más clara antes del refinamiento visual.
  • Existen múltiples puntos de contacto y el sitio web debe sentirse parte del mismo mundo de marca.
  • Un rediseño corre el riesgo de eliminar las características que hacían reconocible el original.

No uses esta habilidad cuando:

  • El problema principal es un propósito, audiencia, contenido o requisitos poco claros; usa primero design-problem-framer.
  • El usuario necesita varias opciones de diseño estructural nuevas; usa layout-direction-explorer.
  • La tarea es principalmente jerarquía, equilibrio, alineación, espaciado o composición; usa layout-principles-review.
  • El usuario necesita comparar direcciones de diseño terminadas y elegir una; usa design-direction-decision.
  • El objetivo principal es la arquitectura de conversión, la estrategia de CTA, el manejo de objeciones o el diseño detallado de confianza; usa conversion-creative-director.
  • El usuario quiere territorios de concepto radicales antes del diseño de la interfaz; usa provocative-concept-director.
  • La solicitud es implementar, codificar o recrear la interfaz.

Entradas a inspeccionar

Inspecciona el conjunto más pequeño útil de entradas disponibles:

  • URL del sitio web, capturas de pantalla, maquetas, wireframes o prototipos
  • Brief de marca, declaración de posicionamiento, valores o identidad verbal
  • Descripción del producto o servicio
  • Audiencia prevista, segmentos de clientes o personas de usuario
  • Referencias de competidores o categorías
  • Identidad visual existente, campañas, empaques, contenido social o material editorial
  • Copia, titulares, afirmaciones, testimonios, casos de estudio o activos de prueba
  • Justificación del diseño o notas de dirección creativa
  • Indicaciones de IA o activos generados cuando la uniformidad sea una preocupación

Si falta contexto importante, identifica la brecha y haz suposiciones acotadas. No inventes una estrategia de marca detallada a partir de una sola captura de pantalla.

Pregunta central de revisión

Pregunta:

Si el logotipo, el nombre de la empresa y el nombre del producto desaparecieran, ¿qué evidencia haría que este diseño siguiera perteneciendo a esta marca y atrayendo a esta audiencia?

Un resultado fuerte debe tener varias respuestas que se refuercen mutuamente. Un resultado débil depende principalmente del logotipo, la copia genérica, el estilo de moda o las imágenes estándar de la categoría.

Lentes de revisión

1. Propiedad de la marca

Determina si el diseño contiene señales reconocibles arraigadas en el negocio en lugar de tomadas prestadas de la categoría.

Inspecciona:

  • Punto de vista distintivo
  • Lenguaje e imágenes específicos del negocio
  • Dispositivos visuales reconocibles
  • Símbolos, materiales, metáforas o comportamientos significativos
  • Interacciones o estructuras de contenido distintivas
  • Elementos que los competidores no podrían copiar sin parecer derivados

No confundas decoración inusual con propiedad. Un degradado extraño no es una idea de marca.

2. Especificidad de la audiencia

Determina si el diseño está claramente moldeado para una audiencia particular.

Inspecciona:

  • Lo que la audiencia prevista valora, teme, rechaza o aspira
  • Referencias culturales y de categoría que la audiencia reconocerá
  • Expectativas de tono, densidad, ritmo e interacción
  • Señales de nivel de precio, seriedad, energía, experiencia o pertenencia
  • Si el diseño intenta complacer a audiencias incompatibles simultáneamente

El objetivo no es la hostilidad hacia todos los demás. El objetivo es la relevancia segura.

3. Polaridad emocional

Determina si el diseño crea una reacción inmediata y apropiada en lugar de una aceptación neutral.

Inspecciona:

  • La impresión probable de los primeros cinco segundos
  • Temperatura emocional
  • Confianza versus precaución
  • Familiaridad versus sorpresa
  • Moderación versus exuberancia
  • Si la reacción respalda la marca y la tarea

Un diseño fuerte puede no atraer a todos, pero su audiencia prevista debe entender por qué existe.

4. Continuidad del mundo de la marca

Determina si el sitio web se siente como una parte de una experiencia coherente más amplia en lugar de una página de aterrizaje aislada.

Inspecciona:

  • Continuidad con puntos de contacto sociales, editoriales, de campaña, de producto, de empaque o en persona
  • Reglas visuales y verbales reutilizables
  • Si el sitio web puede absorber contenido futuro sin perder su identidad
  • Si cada página se siente como el mismo mundo con una intensidad diferente
  • Si la marca permanece reconocible en superficies grandes y pequeñas

No exijas que cada canal se vea idéntico. Busca una lógica compartida, no una consistencia de copiar y pegar.

5. Evidencia y autenticidad

Revisa si las afirmaciones principales están respaldadas por material creíble y concreto.

Inspecciona:

  • Muestras de trabajo, demostraciones, evidencia de antes y después, o visibilidad del proceso
  • Resultados específicos en lugar de elogios vagos
  • Voces, rostros, artefactos, entornos o lenguaje del cliente reales
  • Fuentes de terceros o verificables de forma independiente cuando corresponda
  • Proximidad entre una afirmación y la evidencia que la respalda

Mantén este lente al nivel de la distintividad y la credibilidad. Enruta una auditoría completa de persuasión o conversión a conversion-creative-director.

6. Señales de sistema intencional

Determina si la tipografía, el espaciado, la composición, las imágenes y el movimiento parecen gobernados por un sistema deliberado.

Inspecciona:

  • Roles tipográficos coherentes y relaciones de escala
  • Lógica de espaciado y diseño repetible
  • Jerarquía visual clara
  • Tratamiento de imagen coherente
  • Gramática de movimiento o interacción recurrente
  • Excepciones intencionadas que crean énfasis

No realices una auditoría de diseño completa aquí. Registra las preocupaciones a nivel de sistema y deriva los problemas de composición detallados a layout-principles-review.

7. Autoría humana versus uniformidad predeterminada de IA

Determina si la IA o las plantillas parecen haber amplificado un punto de vista o haberlo reemplazado.

Las señales comunes de IA predeterminada incluyen:

  • Composición de héroe genérica con copia intercambiable
  • Objetos 3D abstractos no relacionados con el negocio
  • Imágenes pulidas pero sin contexto
  • Degradados seguros, tarjetas de vidrio, píldoras flotantes y motivos de panel vacío
  • Ritmos de sección repetidos sin razón narrativa
  • Afirmaciones amplias no respaldadas por evidencia específica
  • Un estilo visual elegido porque está de moda en lugar de ser significativo

No rechaces el material generado por IA simplemente porque se usó IA. Juzga si el resultado ha sido seleccionado, editado, combinado y dirigido a través de una perspectiva humana específica.

Flujo de trabajo

  1. Establecer el objetivo de revisión

    • Identifica la página, el concepto, el prototipo o la dirección que se está revisando.
    • Indica si la evidencia es suficiente para una revisión completa o solo una provisional.
  2. Resumir la identidad prevista

    • Describe el negocio, la audiencia, la oferta y la impresión deseada en un párrafo compacto.
    • Separa los hechos confirmados de las características inferidas.
  3. Mapear el valor predeterminado de la categoría

    • Identifica los patrones visuales, verbales y estructurales familiares utilizados por los competidores o productos comparables.
    • Marca qué valores predeterminados son convenciones útiles y cuáles crean uniformidad.
  4. Realizar la prueba de sustitución

    • Elimina o reemplaza mentalmente el logotipo, el nombre de la marca, el nombre del producto y el titular.
    • Pregunta si un competidor podría adoptar el diseño con cambios mínimos.
    • Registra los elementos exactos que sobreviven a la sustitución y aquellos que se derrumban.
  5. Realizar la prueba de atracción y repulsión de la audiencia

    • Indica qué debería atraer fuertemente a la audiencia prevista.
    • Indica qué podría señalar apropiadamente "no para mí" a una audiencia no coincidente.
    • Señala la repulsión accidental causada por confusión, inaccesibilidad, exclusión o mala usabilidad. No etiquetes erróneamente estos fallos como posicionamiento audaz.
  6. Realizar la prueba de reacción de cinco segundos

    • Registra los descriptores inmediatos probables que un visitante usaría.
    • Compáralos con los descriptores previstos.
    • Identifica señales neutrales, contradictorias o engañosas.
  7. Revisar el mundo de la marca

    • Verifica si las señales visuales, verbales, de contenido, de prueba y de interacción se refuerzan mutuamente.
    • Verifica si la lógica puede extenderse a través de páginas y puntos de contacto adyacentes.
    • Identifica efectos aislados que no pertenecen al sistema más amplio.
  8. Identificar señales apropiables

    • Preserva las señales fuertes existentes.
    • Selecciona de tres a cinco señales que puedan convertirse en un sistema reconocible.
    • Cada señal debe tener una razón conectada a la marca o la audiencia.
  9. Localizar señales genéricas o prestadas

    • Identifica clichés de categoría, tendencias inexplicadas, patrones de IA predeterminados y elecciones similares a las de la competencia.
    • Explica qué hace que cada señal sea genérica en este contexto.
    • No recomiendes eliminar convenciones que apoyen la comprensión a menos que se defina un mejor reemplazo.
  10. Proponer niveles de intervención

    • Preservar: elementos fuertes y apropiables que deben permanecer.
    • Afilar: elementos prometedores que necesitan mayor coherencia, contraste, especificidad o repetición.
    • Reemplazar: elementos genéricos o contradictorios que debilitan la dirección.
    • Introducir: señales faltantes necesarias para completar el mundo de la marca.
  11. Derivar seguimiento especializado

    • Nombra solo el conjunto más pequeño de habilidades relacionadas necesarias a continuación.
    • Explica la pregunta no resuelta que cada habilidad seleccionada debe responder.

Veredicto de distintividad

Usa un veredicto:

  • Apropiable — El diseño tiene un punto de vista claro, ajuste de audiencia y varias señales que se refuerzan mutuamente y que permanecerían reconocibles sin el logotipo.
  • Emergente — La dirección contiene ideas específicas, pero los patrones genéricos aún dominan o las señales aún no se repiten de manera consistente.
  • Intercambiable — El diseño es competente pero podría pertenecer a muchos negocios con cambios menores de copia y activos.
  • Desalineado — El diseño es distintivo, pero sus señales más fuertes entran en conflicto con la audiencia, la oferta o la posición de la marca previstas.
  • Evidencia insuficiente — El material proporcionado no respalda un veredicto responsable.

No promedies las contradicciones. Un diseño pulido pero desalineado no es "mayormente bueno".

Formato de salida

Devuelve:

## Veredicto de distintividad

**Veredicto:** Apropiable | Emergente | Intercambiable | Desalineado | Evidencia insuficiente

Explicación de un párrafo basada en el diseño proporcionado.

## Identidad prevista

- Negocio o producto:
- Audiencia prevista:
- Impresión prevista:
- Entradas confirmadas:
- Suposiciones:

## Reacción de cinco segundos

**Reacción probable:** ...

**Reacción prevista:** ...

**Brecha:** ...

## Hallazgos de la revisión

| Lente | Calificación | Evidencia | Por qué es importante |
|---|---|---|---|
| Propiedad de la marca | Fuerte / Parcial / Débil / Desconocida | ... | ... |
| Especificidad de la audiencia | Fuerte / Parcial / Débil / Desconocida | ... | ... |
| Polaridad emocional | Fuerte / Parcial / Débil / Desconocida | ... | ... |
| Continuidad del mundo de la marca | Fuerte / Parcial / Débil / Desconocida | ... | ... |
| Evidencia y autenticidad | Fuerte / Parcial / Débil / Desconocida | ... | ... |
| Señales de sistema intencional | Fuerte / Parcial / Débil / Desconocida | ... | ... |
| Autoría humana | Fuerte / Parcial / Débil / Desconocida | ... | ... |

## Prueba de sustitución

- Elementos que permanecen reconocibles sin el logotipo:
- Elementos que un competidor podría reutilizar sin cambios:
- Resultado general:

## Atracción y repulsión de la audiencia

### Atrae a la audiencia prevista

- ...

### Filtra adecuadamente a las audiencias no coincidentes

- ...

### Fricción o exclusión accidental

- ...

## Sistema de señales apropiables

| Señal | Justificación de la marca o audiencia | Estado actual | Uso recomendado |
|---|---|---|---|
| ... | ... | Preservar / Afilar / Introducir | ... |

## Señales genéricas a eliminar o transformar

| Señal | Por qué se siente genérica aquí | Mejor dirección |
|---|---|---|
| ... | ... | ... |

## Intervenciones recomendadas

### Preservar

- ...

### Afilar

- ...

### Reemplazar

- ...

### Introducir

- ...

## Siguiente habilidad recomendada

- `skill-name` — pregunta no resuelta que debe responder.

No llenes cada sección con consejos genéricos. Omite filas vacías y menciona cuando la evidencia no esté disponible.

Estándar de calidad

La tarea está completa solo cuando:

  • El veredicto se basa en evidencia visible o proporcionada.
  • La revisión distingue la distintividad de la decoración.
  • La atracción de la audiencia se separa de los problemas de usabilidad o accesibilidad accidentales.
  • La prueba de sustitución identifica elementos intercambiables concretos.
  • Las recomendaciones preservan las convenciones útiles mientras reemplazan la expresión genérica.
  • Cada señal distintiva propuesta tiene una justificación de marca o audiencia.
  • La revisión reconoce las fortalezas existentes en lugar de rediseñar todo por reflejo.
  • El uso de IA se juzga por dirección y edición, no por ideología.
  • La salida no se desvía hacia código o detalles de implementación.
  • El seguimiento especializado se limita al conjunto más pequeño útil de habilidades relacionadas.

Casos límite

  • No existe una estrategia de marca: Produce una revisión provisional, enumera las decisiones faltantes y deriva a design-problem-framer.
  • La marca utiliza intencionalmente convenciones de categoría: Verifica si la copia, la prueba, el contenido, el comportamiento o el modelo de servicio proporcionan la distintividad en lugar de exigir novedad visual.
  • Un producto de utilidad debe sentirse neutral: Revisa la claridad, el tono, el comportamiento de interacción y la prueba de propiedad; no fuerces un estilo teatral.
  • Un sitio regulado o de alta confianza debe sentirse autorizado sin parecer genérico: Prueba si el lenguaje, la disposición de la información, los elementos de prueba y el comportamiento de interacción crean una seguridad reconocible que un imitador no igualaría.
  • Un sitio existente con marca establecida pero diseño desactualizado: Distingue los activos de marca que aún funcionan de las convenciones de la interfaz de usuario desgastadas.
  • El diseño se siente distintivo pero extraño o abrasivo: Prueba si la rareza cumple un propósito o es solo idiosincrasia. Si cumple un propósito, verifica que el extrañamiento apropiado llegue a la audiencia correcta.
  • El usuario solo ha compartido una URL sin contexto: Revisa la superficie disponible e indica limitaciones; no extraigas marca de las imágenes de stock.
  • El diseño está dirigido a una audiencia global: Determina si las señales clave viajan a través de culturas sin perder su significado.
  • El diseño se esfuerza por ser "auténtico" pero se siente escenificado: Prueba ejemplos reales de trabajo, testimonios genuinos o evidencias de una comunidad activa frente a imágenes de archivo y afirmaciones de clientes genéricas.

Individual skills in this repo

This repo contains 3 individual skills — each has its own dedicated page.

Skills relacionados