logo

Logotipo

Diseña un logotipo que identifique en lugar de explicar: una idea clara, construida en SVG limpio, probada a 16 px y en un solo color, entregada como archivos que un desarrollador y un impresor puedan usar. El resultado es una marca recomendada más la evidencia de que funciona.

Cuándo usarlo

• Un nuevo logotipo, isotipo, letra marca, monograma, símbolo o emblema para una empresa, producto o proyecto.
• Un icono de app, favicon o avatar social, nuevo o a partir de una marca existente.
• Una crítica, comparación o actualización de un logotipo existente ("se ve mal cuando es pequeño", "se siente anticuado").
• Variantes de entrega y una breve guía de uso para una marca que ya existe.

Cuándo no usarlo

• Colores, fuentes, tokens, voz de marca, DESIGN.md, "muéstrame looks para el sitio": lll:design-system.
• Pantallas, componentes, ilustraciones dentro de la UI del producto: lll:ui.
• Nombrar el negocio, posicionamiento, consejos de marca registrada: lll:business; una búsqueda de marca registrada necesita un profesional.
• Publicaciones en redes sociales, campañas, creatividades publicitarias: lll:marketing.
• Activos de marca en foto, video o 3D: fuera del alcance; indícalo.

Modos

Guía (por defecto). Brief, conceptos, crítica y consejos en el chat. Los SVG conceptuales se dibujan en una carpeta temporal fuera del repositorio, se renderizan, se miran y se muestran (SVG pegado o una imagen); no se escribe nada en el proyecto. Sin subagentes. Detente en el punto de control de conceptos.

Completo. Solo después de que el propietario elija una dirección y solicite el kit (o pida una ejecución de punta a punta). Escribe los archivos finales en la carpeta de marca del proyecto (brand/logo/, o la carpeta que el proyecto ya use): maestros, variantes, conjuntos de favicon e iconos de app, hoja de pruebas, mini guía. Lista de entrega y nombres de archivo: references/delivery.md. Los subagentes son opcionales; como máximo un brief amplio para tareas de renderizado y exportación (../../shared/agents.md).

Tareas

Tarea	Disparador	Leer
diseñar	nuevo logotipo	references/brief.md, references/mark-types.md, references/concepts.md
construir	convertir un concepto en SVG	references/svg-construction.md, references/optical-refinement.md
criticar	comentarios sobre un logotipo existente	references/critique-redesign.md, references/testing.md
rediseñar	modernizar o reemplazar	references/critique-redesign.md, luego diseñar
activos	variantes, favicon, iconos de app	references/delivery.md, references/app-icons.md
presentar	mostrar conceptos, escribir una guía	references/presentation-guide.md

Reglas estrictas

1. Un logotipo es un identificador, no una explicación. Una idea, que se pueda decir en una frase. Una frase que podría describir el logotipo de un competidor no es un concepto.
2. Aprende antes de dibujar: la ortografía exacta del nombre, qué hace el negocio, para quién, de tres a cinco adjetivos, competidores, restricciones. El patrimonio existente (colores, formas que la gente conoce) se respeta a menos que el propietario diga lo contrario.
3. Construye primero en negro. El color viene después de que la forma funcione. Sin degradados, sombras ni efectos para rescatar una forma débil.
4. Mira tu trabajo. Dibujar SVG a ciegas es la principal fuente de malas marcas. Renderiza y revisa cada iteración.
5. Nunca traces, imites ni "actualices" una marca existente reconocible. Si se siente familiar y no es del cliente, es de otra persona.
6. Los finales son vectoriales: texto convertido a contornos, trazos expandidos, sin ráster, sin filtros, sin scripts.
7. Nunca reclames autorización de marca registrada o cobertura de licencia de fuente. Di qué fuentes asumiste y que el propietario debe limpiar la marca con una búsqueda profesional.
8. Detente en el punto de control de conceptos. Muestra tres conceptos y una recomendación, luego espera. Construye el kit completo solo para la dirección elegida. Omite la pausa solo cuando el propietario diga que no es necesario comprobar.
9. Las pruebas son resultados, no intenciones: informa qué pasó, qué cambiaste y qué queda pendiente para el propietario.
10. Escribe solo contenido genérico. Nunca pongas nombres o marcas de otros clientes en un entregable.

Pasos

1. Conoce el proyecto. Lee los conceptos básicos de ../../shared/stack-detect.md, luego busca logotipos existentes (public/, assets/, brand/, *.svg, conjuntos de iconos de app, manifest.json), DESIGN.md, README y texto de la página de inicio. Anota el nombre exacto, plataformas (web, iOS, Android, desktop), colores ya en uso.
2. Brief. Completa el brief (references/brief.md): nombre, oferta, audiencia, adjetivos y antiadjetivos, competidores, restricciones, dónde debe funcionar la marca. Vía rápida: como máximo cinco preguntas en un mensaje, o establece suposiciones y continúa. Los adjetivos son la entrada más valiosa.
3. Escanea la categoría. Enumera los clichés (fintech: escudos y flechas hacia arriba; café: granos y vapor; IA: destellos y cerebros). Trátalos como prohibidos a menos que les des una forma fresca. Mira las marcas de los competidores con las herramientas del navegador cuando esté permitido, solo lectura.
4. Conceptos. Escribe de 8 a 12 conceptos de una frase en al menos dos tipos de marca (references/mark-types.md, references/concepts.md). Califícalos en claridad de idea, distinción, simplicidad, relevancia y solidez a tamaño pequeño. Conserva los tres más fuertes y más diferentes. Baratos de escribir, caros de construir: construye solo tres.
5. Construye SVG primero en negro para cada uno de los tres (references/svg-construction.md). Describe la construcción en palabras (primitivas, radios, ángulos, unidad de cuadrícula), luego escribe el SVG. Guarda cada iteración (a-v1.svg, a-v2.svg).
6. Revisa y refina, al menos dos ciclos.
   • node scripts/svg-check.mjs check a.svg informa estructura, colores, trazos, ángulos casi fallidos y centrado.
   • node scripts/svg-check.mjs sheet a.svg -o sheet-a.html construye una hoja de pruebas: escalera de tamaños, 16 px y 32 px, un solo color, invertido, fondos, entrecerrar ojos, espejo, pestaña de favicon, mosaico de app, recorte de avatar.
   • Abre la hoja con una herramienta del navegador y mira. Corrige lo que falle (references/testing.md, references/optical-refinement.md). Repite.
7. Punto de control. Muestra los tres conceptos lado a lado en escala de grises a tamaños grandes y pequeños, una línea cada uno, una recomendación con un riesgo honesto por concepto (references/presentation-guide.md). Ofrece el kit. Espera la respuesta. Si quieren cambios, regresa al paso 5.
8. Kit (Modo completo, después de la aprobación). Geometría final y corte a tamaño pequeño; color (uno o dos colores, versiones de un solo color e invertido, references/colour-type.md); tipografía y bloqueos (horizontal, apilado, solo símbolo, solo isotipo); archivos de entrega (references/delivery.md); iconos de app (references/app-icons.md); mini guía (references/presentation-guide.md). Haz copias en negro, blanco y monocromo con node scripts/svg-check.mjs variants logo.svg, lienzos de iconos de app con node scripts/svg-check.mjs icon logo.svg --kind ios -o ios.svg, y empaqueta tamaños de favicon con node scripts/svg-check.mjs ico 16.png 32.png 48.png -o favicon.ico.
9. Cierre. Ejecuta la lista de verificación final (references/testing.md). Enumera los elementos abiertos para el propietario: búsqueda de marca registrada, licencia de fuente, prueba de impresión, coincidencia de color.

Qué tipo de marca, en una tabla

Tipo	Elegir cuando	Cuidado
Logotipo verbal	nombre distintivo, visto mayormente en texto	débil a 16 px; necesita un acompañante compacto
Letra marca / monograma	nombre largo, iniciales conocidas o cortas	genérico a menos que la letra esté personalizada
Símbolo pictórico	un objeto simple y propio encaja con la idea	literalidad, clichés
Marca abstracta	oferta amplia o intangible	necesita significado construido con el tiempo
Emblema / insignia	herencia, artesanía, instituciones	los detalles finos mueren al ser pequeños
Combinación	la mayoría de las marcas nuevas; símbolo más logotipo en bloqueos	deben funcionar separados y juntos
Dinámico / sistema	muchos puntos de contacto o productos	necesita un núcleo rígido; no para marcas pequeñas

Guía de razonamiento y decisión: references/mark-types.md.

Salida

• Guía: brief y suposiciones, tres conceptos (imagen renderizada o SVG pegado, una línea cada uno), recomendación, resultados de pruebas hasta ahora, elementos abiertos. Nada escrito en el repositorio.
• Completo: carpeta de archivos finales con un manifiesto, la hoja de pruebas, la mini guía, la salida real de svg-check para cada maestro, y la lista de lo que el propietario aún debe hacer.
• Di lo que no se ejecutó: sin renderizado, sin prueba en dispositivo, sin prueba de impresión, sin búsqueda de marca registrada.
• Próximos pasos: de dos a cuatro viñetas (elegir una dirección, realizar una búsqueda de marca registrada, aplicar la marca en el sitio y la app con lll:ui, establecer colores de marca con lll:design-system).