Communitygithub.com

VXerys/brand-from-codebase

Úsalo cuando un video de marketing, banner o publicación social deba usar la marca real y las afirmaciones reales de un producto, al crear o actualizar un brand.md en D:\Projects\marketing-videos, al capturar UI real (sitio web, capturas de pantalla de la app Flutter) para un video, o cuando un storyboard necesite una referencia fuente para cada afirmación.

¿Qué es brand-from-codebase?

Esta habilidad extrae y mantiene un kit de marca oficial directamente desde el repositorio de código del producto, garantizando que cualquier material de marketing (videos, banners, publicaciones sociales) refleje fielmente la identidad visual y las afirmaciones reales del producto. Su núcleo es un archivo `brand.md` ubicado en `marketing-videos/<brand>/brand.md`, donde cada valor (colores, tipografía, logotipos, afirmaciones permitidas y prohibidas) incluye la referencia exacta al archivo y línea de código de origen. El sistema implementa un contrato de 9 secciones obligatorias, una lista de verificación de extracción que busca en archivos típicos (CSS, configuración de Tailwind, constantes de Dart, archivos de contenido) y soporta tanto repositorios Git como no Git. Incluye puertas de control (G1 y G2) que verifican la vigencia del kit mediante la comparación de commits (Git) o fechas de modificación (no Git), y que validan cada afirmación contra las citas textuales en `brand.md`, rechazando cualquier afirmación sin fuente. También define cómo capturar UI real (sitio web en vivo, servidor local, app Flutter) y cómo reconstruir elementos animados pequeños usando los tokens de marca. La habilidad es compatible con cualquier agente que pueda leer y escribir archivos Markdown y ejecutar comandos Git, como Claude Code, Cursor o Codex, ideal para equipos de marketing que necesitan precisión de marca y transparencia en sus activos promocionales.

Compatible con~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/VXerys/claude-code-hq/tree/main/.claude/skills/brand-from-codebase

Preguntar en tu IA favorita

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

Documentación

Marca desde el código base

Resumen

El repositorio del producto es la única fuente de verdad de la marca. Un kit de marca se extrae una vez en marketing-videos/<brand>/brand.md, cada valor lleva su fuente archivo:línea, y el archivo registra el commit del repositorio en el que se leyó para que se pueda actualizar en lugar de volver a leer.

Contrato de brand.md

Escribe estas secciones, en este orden. Cada valor termina con su fuente como (ruta:línea).

  1. Fuentes: rutas del repositorio, rama, git rev-parse --short HEAD por repositorio, fecha de extracción, y un bloque legible por máquina por repositorio que la puerta de control G1 lee para detectar un kit desactualizado:
    ```refresh
    repo: <repositorio-producto>
    ref: HEAD
    commit: c8fb26e
    paths: src/data/content.ts src/app/globals.css public/brand
    ```
    
    repo es el nombre de la carpeta bajo D:\Projects. Un repositorio que no es git usa mtime: <fecha ISO> en lugar de ref y commit.
  2. Identidad: nombre, posicionamiento en una línea, eslogan, tono (cita el archivo de copia, no parafrasees).
  3. Tokens de color: primero los tokens de marca semánticos (--color-brand-*, primary, AppColors.primary), luego los tokens de soporte. Una tabla por superficie cuando difieren: landing vs app.
  4. Tipografía: por superficie. Las fuentes de landing a menudo difieren de las de la app; verifica tanto el diseño raíz como cualquier fonts.ts a nivel de sección.
  5. Logotipos e imágenes: rutas de archivo, cuáles son renders reales del producto frente a fotos de stock (el stock nunca debe presentarse como usuarios reales), y su archivo de licencia o crédito.
  6. Afirmaciones permitidas: características, modos, precios, etiquetas de CTA, URLs, contacto. Cada una una cita directa con fuente. Marca los datos de muestra como SAMPLE (renders con números falsos) para que un video los etiquete como "Contoh".
  7. Afirmaciones prohibidas: cualquier cosa que suene plausible pero no tenga fuente: recuentos de usuarios, ingresos, valoraciones, testimonios, logotipos de socios, "terpercaya", "#1".
  8. Objetivos de captura: URLs de producción y staging, rutas que vale la pena capturar, carpetas de capturas de pantalla de la app, URL de Play Store.
  9. Ambigüedades: tokens duplicados o conflictivos, copia que difiere entre el sitio y la app, valores que un brief en otro lugar usa pero que el código contradice. Enumérelos para el usuario; nunca los resuelvas en silencio.

Lista de verificación de extracción

BuscarLugares típicos
Copia, CTAs, preciossrc/data/content.ts, src/content/*.ts, componentes de sección de landing, RELEASE_NOTES.md, docs/features/
Tokens webglobals.css @theme / :root, tailwind.config.*, palette.ts
Tokens Flutterlib/core/constants/app_colors.dart, app_text_styles.dart, pubspec.yaml fonts
Fuentesapp/layout.tsx (next/font), sección fonts.ts, pubspec.yaml
Logotipospublic/brand/, docs/brand/, assets/icons/brand/
URLsgrep -rn "https://<dominio-marca>" en src/, metadataBase, site.ts, páginas de términos

Busca un valor antes de declararlo como faltante: haz grep del dominio, el texto de la CTA y el nombre del token en todo src/.

Omite .env*, .mcp.json, google-services.json, keystores y cualquier clave o token. Nunca copies sus valores en brand.md.

Cuando el repositorio fuente no está clonado (sesiones en la nube)

La puerta de control G1 reporta brand_repo_absent como información y G2 verifica cada afirmación contra las citas exactas en brand.md en lugar del repositorio (claim_verified_brand_kit). Eso solo funciona cuando brand.md cita la copia textualmente con ruta:línea, así que extrae las citas de forma literal, nunca parafraseadas. Actualizar brand.md necesita el repositorio: hazlo en la laptop, o agrega el repositorio del producto a la sesión en la nube y apunta MV_PROJECTS_ROOT a su carpeta padre.

Regla de actualización

La puerta de control G1 ejecuta git -C <repositorio> log --oneline <commit>..<ref> -- <paths> para cada bloque de actualización y falla con brand_stale cuando algo cambió. Para solucionarlo, vuelve a leer solo los archivos modificados, actualiza sus filas y aumenta commit en el bloque. Los repositorios no git se comparan por la fecha de modificación del archivo contra mtime.

Captura de UI real

Superficie del productoMétodo
Sitio web en vivoCaptura de sitio web HyperFrames desde la URL de producción (la ruta product-launch-video hace esto); staging solo cuando el usuario dice que la característica no está publicada
Servidor de desarrollo localSolo cuando el usuario solicita una pantalla no publicada; etiquétala como no publicada en el brief
App FlutterCapturas de pantalla reales existentes (sitio screens/, assets de Play Store) o capturas de pantalla del emulador, colocadas en un marco de dispositivo
Elementos animados pequeños (botón CTA, tarjeta de estadística)Reconstruidos como HTML con los tokens de brand.md; nunca inventes una pantalla que no exista

Referencias de afirmaciones del storyboard

Cada afirmación en pantalla en STORYBOARD.md lleva su fuente de brand.md, por ejemplo "Biaya layanan 2%" (<repositorio-producto>/src/data/content.ts:212). Una afirmación sin fuente se elimina del storyboard, no se suaviza.

Errores comunes

  • Elegir el primer azul marino encontrado (--navy-main) en lugar del token de marca semántico (--color-brand-navy). Prefiere nombres semánticos y enumera el otro como una ambigüedad.
  • Usar fuentes de la app para un video de landing page, o al revés.
  • Declarar una URL "no encontrada" después de revisar un solo archivo.
  • Mostrar fotos de stock como si fueran clientes.

Individual skills in this repo

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

Skills relacionados