JorgeSuarez.com.mx · Sistema de marca · propuesta 0.2JORGESUAREZ.COM.MX
PROPUESTA 0.2 / 01
11 octubre 2026 · Propuesta 0.2 · Revisión 2 · En progreso
1 / 10
Sistema de marca
JorgeSuarez.com.mx
Una base seria para construir.
Un lenguaje propio para explorar.
Versión 0.2 · En progreso
Guía de identidad, reglas visuales y componentes candidatos. Concilia los valores históricos, la base operativa y las decisiones recientes de marca; incorpora propuestas del artifact de Claude.
Moki, alter ego de Jorge
Referencia del personaje en una composición editorial. Retrato original sin alteraciones.
La guía sigue en progreso; la estructura y los textos del sitio principal se conservan.
Retrato: sitio personal de Jorge. Sin licencia abierta.
JORGESUAREZ.COM.MX
PROPUESTA 0.2 / 02
La identidad que permanece
11 octubre 2026 · Propuesta 0.2 · Revisión 2 · En progreso
2 / 10
Energía de builder, con humildad.
Jorge construye, aprende y comparte el proceso. Su experiencia en videojuegos convive con la IA, los negocios y la curiosidad por hacer cosas nuevas. La credibilidad viene de lo que puede mostrar y del trabajo de sus equipos.
Kaizen
Mejorar con lo aprendido. Mostrar decisiones, pruebas y errores útiles; explicar qué cambió y por qué.
Play
Explorar con intención. La energía lúdica abre posibilidades y da calidez, sin convertir toda experiencia en un juego.
En la práctica
Dar crédito a quienes construyen juntos. La generosidad describe un comportamiento; no añade un tercer valor canónico.
Tres reglas de voz
Nosotros para logros compartidos. Yo para experiencias, decisiones y aprendizajes propios.
Español primero, con términos de industria cuando ayuden a comprender.
Pruebas antes que adjetivos: verificar cifras, cargos y créditos antes de publicarlos.
Heredado: esencia y valores Kaizen & Play del PDF v1. La formulación de voz concilia v1 y v3 y continúa propuesta.
JORGESUAREZ.COM.MX
PROPUESTA 0.2 / 03
Oscuro por base, papel con propósito
11 octubre 2026 · Propuesta 0.2 · Revisión 2 · En progreso
3 / 10
La interfaz mantiene su claridad. La textura entra en la historia.
Fondo
#0A0A0A
Tarjeta
#161616
Naranja
#FF6B35
Ámbar
#FFA500
Texto
#FFFFFF
BASE OPERATIVA V3
Conservar Outfit/Inter y estos tokens. El PDF histórico usa #0A0A0C, #16161A y ámbar #F5B51D: son antecedentes, no una segunda paleta activa.
BEIGE COMPLEMENTARIO
Papel #F4E8D5 · kraft #B99168
Tinta #22211F
Complementa negro y naranja en ilustración, fichas y escenas. Dirección aprobada; los valores exactos siguen en revisión. Se conserva el fondo oscuro global.
Contorno naranja
Luz naranja que separa del negro. Piel natural y sombras coherentes, sin halos artificiales. El material artesanal pertenece al personaje, no a la piel humana.
Lectura: blanco o crema sobre oscuro; tinta oscura sobre naranja. #666666 solo para decoración, nunca para texto esencial.
JORGESUAREZ.COM.MX
PROPUESTA 0.2 / 04
La jerarquía hace el trabajo
11 octubre 2026 · Propuesta 0.2 · Revisión 2 · En progreso
4 / 10
Outfit
Titulares con carácter. Pesos 700–800.
Inter
Cuerpo cómodo, directo y legible.
Pesos 400–600. Frases cortas y aire suficiente.
MONO PARA DATOS
Uso puntual en etiquetas técnicas, versiones y cifras.
No imponer una tercera familia a toda la interfaz.
Escala web propuesta
H1 56 / 60 px · móvil 36 / 40
H2 40 / 46 px · móvil 28 / 34
H3 24 / 30 px
Cuerpo 18 / 28 px
UI 16 / 24 px
Notas 14 / 20 px
Base v3: espacio 8–96 px
Radios heredados: 6 · 12 · 20 px
Una acción principal por bloque. Foco visible. Texto real, nunca embebido en ilustraciones. Verificar contraste y lectura móvil antes de liberar.
Space Grotesk, Manrope y Space Mono figuran como sustitutos provisionales en v1. No se proponen como sustitución de Outfit e Inter.
JORGESUAREZ.COM.MX
PROPUESTA 0.2 / 05
Moki es Jorge explorando
11 octubre 2026 · Propuesta 0.2 · Revisión 2 · En progreso
5 / 10
“Moki soy yo.”
El alter ego lleva su curiosidad, sus equivocaciones, lo que aprende y lo que quiere dejar. Descubre y construye mundos con otros. Puede hablar de IA, negocios y videojuegos.
Rasgos que debemos conservar
Astronauta de cartón naranja. Casco crema con parche MOKI sobre la oreja derecha, visor oscuro, motas de tinta, botas negras y control genérico en el pecho. Recortes y pliegues; imperfección cuidada.
Cómo se relaciona con Jorge
Acompaña al retrato real y expresa la faceta exploradora. No reemplaza automáticamente el avatar ni la firma. Evitar el esquema de experto infalible y alumno torpe.
Nombre ratificado: Moki. Parche MOKI aprobado sobre la oreja derecha del casco. Disponibilidad marcaria y condiciones de uso: pendientes de revisión; no implican exclusividad.
JORGESUAREZ.COM.MX
PROPUESTA 0.2 / 06
Mundos que explican una idea
11 octubre 2026 · Propuesta 0.2 · Revisión 2 · En progreso
6 / 10
Recortar, ensamblar, descubrir
Papel con fibras, cartón corrugado, bordes imperfectos y sombras de contacto suaves. Cada pieza parece hecha y colocada por alguien. Una escena tiene un foco y suficiente espacio para leer.
La ilustración debe tener un trabajo
Un puente puede explicar una conexión; una pieza que encaja, una decisión. No usar mundos flotantes como decoración repetida. La metáfora ayuda al contenido y no altera su significado.
Movimiento breve y comprensible
Propuesta: entradas de 180–320 ms; un ensamblaje narrativo de 600–900 ms solo cuando aporte. Sin flotación permanente ni capas de glow. Respetar movimiento reducido: versión estática, mismo contenido.
Referencias de criterio: explicar con recursos visuales como Vox; priorizar jerarquía como Impeccable. Inspiración, sin afirmar implementación de sus sistemas.
JORGESUAREZ.COM.MX
PROPUESTA 0.2 / 07
Una misma voz en cada formato
11 octubre 2026 · Propuesta 0.2 · Revisión 2 · En progreso
7 / 10
Narración cercana, con evidencia
Contar qué intenté, qué ocurrió y qué aprendí. Dar crédito cuando el resultado es de un equipo. Usar humor cuando nazca del proceso, sin exagerar resultados ni forzar lenguaje gamer.
MUESTRA SOCIAL · NO COPY WEB
Ideas que se
convierten en mundos
Exploro, construyo y comparto
lo que aprendo.
jorgesuarez.com.mx
Web
Mantener navegación, estructura, copy y CTAs actuales. Incorporar Moki solo en espacios aprobados; nunca cubrir pruebas, proyectos o contacto.
Social y LCA
Un aprendizaje por pieza. En LCA: problema, proceso, aprendizaje y siguiente paso. Visual útil, firma y revisión antes de publicar; sin gamificación obligatoria.
Audio
La voz de Jorge es la referencia. Narración natural, pausas humanas y subtítulos. Incorporar recursos de audio cuando estén validados sus usos y calidad.
Otras frases aprobadas para social
“Construir también es explorar.”
“Ideas, proyectos y aprendizajes de un camino en construcción.”
JORGESUAREZ.COM.MX
PROPUESTA 0.2 / 08
Componentes candidatos
11 octubre 2026 · Propuesta 0.2 · Revisión 2 · En progreso
8 / 10
PROPUESTO · CATÁLOGO ADAPTADO DEL ARTIFACT DE CLAUDE
Un vocabulario común; la implementación se valida por contexto.
Button
Primario naranja con texto oscuro; secundario con borde. Etiqueta que explica la acción. Estados: normal, hover, foco, presionado, carga y deshabilitado.
Chip
Etiqueta informativa o filtro, con roles distintos. Si selecciona: estado seleccionado y teclado. El color nunca es la única señal.
Card
Título, resumen y enlace explícito. Mantener orden de lectura; no anidar botones dentro de un enlace. Foco visible y destino identificable.
Timeline
Secuencia legible como lista ordenada. Fechas y hechos con fuente. La línea gráfica es decorativa; no animar cifras para sugerir autoridad.
Wordmark
JorgeSuarez.com.mx como texto en Outfit. No recrear el logotipo de Amber ni sustituir el avatar existente sin aprobación.
Catálogo por implementar
Especificar variantes, estados y comportamiento; comprobar cada componente antes de uso productivo.
JORGESUAREZ.COM.MX
PROPUESTA 0.2 / 09
Tokens candidatos y accesibilidad
11 octubre 2026 · Propuesta 0.2 · Revisión 2 · En progreso
9 / 10
PROPUESTO · AMPLIACIÓN, NO SUSTITUCIÓN AUTOMÁTICA
Ritmo y geometría
Espacio: 4 · 8 · 12 · 16 · 24 · 32
48 · 64 · 96 · 128 px
Radios: 6 · 12 · 18 · 24 px · pill
Contenedor candidato: máximo 1200 px
La escala de Claude amplía la base v3. Los radios 18/24 conviven como candidatos con el 20 heredado hasta decidir una escala única. No mezclarlos sin criterio.
Validar antes de liberar
Texto normal: contraste mínimo 4.5:1.
Texto grande y controles: revisar 3:1 según su función.
Navegación completa con teclado. Foco visible, nombres accesibles, orden lógico y contenido que no dependa del hover.
Comprobar móvil, zoom, estados de error y carga; preservar contenido con movimiento reducido.
Un contraste fallido no se convierte en token recomendado.
Claude señala que fg3 #7C7C87 sobre surface queda por debajo de 4.5:1. No se adopta esa pareja para texto esencial. Medir cada combinación real, incluidos hover, foco y deshabilitado.
JORGESUAREZ.COM.MX
PROPUESTA 0.2 / 10
Fuentes y cierre de la siguiente revisión
11 octubre 2026 · Propuesta 0.2 · Revisión 2 · En progreso
10 / 10
Una conciliación explícita
PDF v1: esencia y Kaizen & Play. Guía operativa v3: Outfit/Inter y base oscura. Decisiones del 11 de octubre: Moki, parche derecho, beige complementario y contorno naranja. Claude: catálogo y escalas candidatos.
Cómo se usa el artifact de Claude
Reconstrucción visual sin acceso al CSS original. Sus fuentes y colores alternativos no reemplazan los operativos. La recreación React, cifras, cargos y testimonios requieren comprobación independiente. Se incorpora el retrato original del sitio personal por indicación de Jorge. Su presencia no concede una licencia abierta; las marcas visibles conservan su titularidad.
Para cerrar el sistema
Priorizar audiencia y usos. Resolver tokens semánticos y estados. Probar componentes y aplicaciones reales. Registrar la aprobación del conjunto antes de llamarlo versión final.
Fuentes consultadas
Historia: el PDF v1 conserva su papel como antecedente. Esta edición 0.2, revisión 2, recupera el retrato original y continúa la propuesta 0.1; no equivale a un Brandbook 2.0 aprobado. Brandbook: relato. Guidelines: reglas. Design system: componentes y estados, todavía en construcción.