Z DevZen Solutions
Documento institucional
v1.0 · ratificable
Design constitution · 2026

Design
constitution.

Tu empresa no es plantilla.
Tu software tampoco.

Versión
v1.0 · Mayo 2026
Ratifican
Kike Vázquez · Eduardo Nepote
Vigencia
Hasta enmienda formal (ver § X)
DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 01
Design constitution · v1.0
Índice
Sumario

Lo que vive aquí dentro.

Este documento consolida el sistema operativo de DevZen Solutions v2.1 — manifiesto, voz, vocabulario, paleta, tipografía y reglas de aplicación — en una sola pieza ratificable. No inventa nada; pone bajo el mismo techo lo que ya quedó aprobado.

§ I
ManifestoPara quién · contra qué · qué somos · 5 promesas · el anchor.
P. 03
§ II
Los principios operativosLas 5 promesas convertidas en pruebas de decisión accionables.
P. 05
§ III
Voice & ToneCuatro adjetivos · interna vs cliente-facing · DOs/DON'Ts · antes/después.
P. 07
§ IV
VocabularioLo que decimos. Lo que no. Cómo nombramos al cliente y a nosotros.
P. 10
§ V
Sistema dual-modeUniforme de local (Tech) y uniforme de visitante (Editorial), lado a lado.
P. 12
§ VI
Paleta12 tokens canónicos. HEX exactos. Uso y nunca-uso.
P. 14
§ VII
TipografíaInstrument Serif + Geist + Geist Mono. Especimen y escala.
P. 16
§ VIII
Layout, motion, iconografíaGrid 4px · spacing · radii · borders · sombras · easing · Lucide.
P. 18
§ IX
Guardrails & Taglines lockedMaster + Campaign · sub-positioning · palabras prohibidas.
P. 20
§ X
RatificaciónPágina firmable. Vigencia. Referencia a GOVERNANCE.md.
P. 22
DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 02
§ I — Manifesto
Anchor + 5 promesas
§ I

ManifiestoQué somos, contra qué, para quién.

DevZen Solutions es una software house premium. Filial técnica de Nümia Group. Construimos plataformas, sistemas y automatizaciones a la medida — con la disciplina de un equipo de Silicon Valley y la sensibilidad de operación de quien ha levantado un negocio en LATAM. No vendemos horas. Vendemos resultados que se quedan.

Para quién

Para fundadores, COOs y directores de tecnología en LATAM que dejaron de querer "una agencia más" — quieren un equipo que entienda su negocio, proponga, y construya software que aguante el crecimiento.

Contra qué

Contra el outsourcing barato que entrega código que nadie puede mantener. Contra los freelancers que desaparecen al go-live. Contra las consultorías grandes que cobran enterprise y entregan PowerPoint. Contra el "ya quedó" sin pruebas, sin documentación, sin handoff.


El anchor

Tu empresa no es plantilla.
Tu software tampoco.

Si todo lo anterior se redujera a una frase tatuada en la puerta del estudio, sería esa. Cada cliente entra con una operación distinta, un equipo distinto, márgenes distintos y una historia distinta. Lo que entregamos refleja eso — o no lo entregamos.

DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 03
§ I — Manifesto · cont.
Cinco promesas ratificadas
Qué prometemos

Las cinco promesas. En este orden, no es casual.

1
Superioridad técnica.

La calidad del código no se negocia. Lo que entregamos es lo que nosotros usaríamos en producción.

2
AI-first.

Automatizamos lo que se pueda automatizar. El equipo humano se enfoca en lo que solo un humano debe decidir.

3
Sensibilidad de negocio.

Cada decisión técnica se justifica en margen, tiempo, riesgo o flujo. Hablamos de ROI, no de stack.

4
Estrategia, no ejecución ciega.

Si la idea inicial del cliente no es la correcta, lo decimos antes, no después.

5
Llevarlo al siguiente nivel.

El cliente sale de un proyecto DevZen más grande, más eficiente y más automatizado de lo que entró.

El negocio que sale de un proyecto con DevZen no es el mismo que entró. Promesa completa · cierre de manifiesto
DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 04
§ II — Los principios operativos
Pruebas de decisión · 1—3
§ II

Los principios operativosCómo se aplican las promesas a un mockup, un copy, un spec.

Las cinco promesas, traducidas a una pregunta concreta que se le hace a cada entregable antes de salir. Si la prueba falla, el entregable se reescribe. Si pasa, se firma.

01
Lo que entregamos es lo que correríamos en producción mañana.

Cada repo lleva tests, documentación y un runbook antes de cerrarse. El demo no es un atajo: es una vista parcial de algo que ya está hecho bien.

Prueba de decisión ¿Lo dejaría correr este sábado a las 3 a.m. con un cliente real cargando datos? Si la respuesta es "depende", todavía no se entrega.
Destilado de Promesa 1 — Superioridad técnica
02
La parte aburrida la hace la máquina; la parte que importa la decide la persona.

Pipelines, generación, QA y reportes se automatizan por default. El criterio humano se reserva para diseño de producto, riesgo, ética y trato con el cliente.

Prueba de decisión ¿Esta tarea la hago yo o la hace un agente con supervisión? Si la respuesta honesta es "agente", levantar el ticket de automatización antes de hacerla a mano una segunda vez.
Destilado de Promesa 2 — AI-first
03
Cada decisión técnica se justifica en margen, tiempo, riesgo o flujo.

No defendemos un stack por gusto. Defendemos un stack porque ahorra n horas/semana, recorta x% de costo de hosting, o reduce un riesgo identificado a un riesgo manejable.

Prueba de decisión ¿Puedo cerrar esta recomendación con la frase "Recomendamos X porque Y" donde Y contiene un número? Si no, el caso de negocio todavía no está.
Destilado de Promesa 3 — Sensibilidad de negocio
DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 05
§ II — Los principios operativos · cont.
Pruebas de decisión · 4—5
04
Si la idea no es la correcta, lo decimos antes, no después.

No firmamos un alcance que sabemos que no va a sobrevivir al primer cambio del mercado. Antes de cotizar, validamos. Si hay que reescribir el brief, se reescribe.

Prueba de decisión Si el cliente nos pregunta en seis meses "¿por qué no me dijeron esto antes?", ¿qué le respondemos? Si no tenemos respuesta hoy, hay un desacuerdo sin levantar.
Destilado de Promesa 4 — Estrategia, no ejecución ciega
05
El negocio sale más grande del que entró.

El último entregable no es un repo: es un cliente con más eficiencia, más automatización y más capacidad operativa que cuando empezamos. Si no podemos demostrar eso con datos, no firmamos el cierre.

Prueba de decisión ¿Qué métrica del cliente se movió, y en cuánto? Si la única métrica es "entregamos lo cotizado", falta el cierre real del proyecto.
Destilado de Promesa 5 — Llevarlo al siguiente nivel

Recomendamos X porque Y. Frase firma DevZen · estructura de toda recomendación
Lo que entregamos hoy es lo que usaríamos en producción mañana. Frase firma DevZen · cierre de propuesta

Las cinco pruebas se corren en orden: superioridad técnica primero (¿está bien hecho?), automatización (¿estamos haciendo a mano lo que la máquina puede hacer?), negocio (¿se justifica?), estrategia (¿es lo correcto?) y siguiente nivel (¿movimos al cliente?). Saltar pasos es la causa raíz de la mayoría de los entregables que no firmaríamos.

DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 06
§ III — Voice & Tone
Adjetivos guía · interna vs cliente
§ III

Voice & ToneComo un consultor senior que también programa.

Específico, calmado, con evidencia. No corporativo, no hype, no cute. La voz no cambia entre cotización, contrato y manual del cliente — lo que cambia es el formato, no la postura.

Cuatro adjetivos guía
01
Directo.
Verbos primero. Claims con números. La conclusión arriba, el detalle abajo.
02
Estratégico.
Marcamos siempre el por qué, no solo el qué. ROI antes que stack.
03
Confiable bajo presión.
Reconocemos riesgo de frente. Comprometemos un plan, un dueño y una fecha.
04
Bilingüe-fluente.
Español primero. Inglés técnico cuando aclara — nunca cuando presume.
Voz interna vs voz cliente-facing
EjeInterna (Slack, runbooks, decks de equipo)Cliente-facing (cotizaciones, contratos, manuales)
Pronombretú / nosotrosusted por default — bajamos a si el cliente lo hace primero
Casingsentence case + abreviaciones técnicassentence case, sin abreviaciones
Emojisí, con criteriono — excepto markers neutros en plantillas internas
Tonoinformal pero precisoformal pero humano
Jergalibre (PR, deploy, SLA, runbook)inglés solo si no hay buen equivalente; siempre se define la primera vez
Largobrevebreve, con secciones claras y resumen ejecutivo
DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 07
§ III — Voice & Tone · cont.
DOs · DON'Ts
Lo que sí · lo que no

Disciplina de redacción. No es preferencia; es contrato.

Hacemos (DOs)

  • Decir el costo, el plazo y el riesgo en la primera página.
  • Usar números: 12 horas/semana ahorradas, ~14 días hábiles, 35% menos en hosting.
  • Empezar oraciones con verbos: "Construimos…", "Recomendamos…", "Identificamos…".
  • Cerrar todo correo o documento con un siguiente paso explícito.
  • Definir un acrónimo la primera vez que aparece — SLA (Service Level Agreement, acuerdo de nivel de servicio).
  • Ser explícitos sobre lo que no hace el alcance — la línea final del scope dice "fuera de alcance: …".
  • Diferenciar opinión ("Recomendamos…") de hecho ("El sistema procesa 1,200 facturas/día.").

No hacemos (DON'Ts)

  • "Estamos súper emocionados / felices / encantados…" — vacío. Borrar.
  • "Lo más rápido posible", "muy pronto", "súper fácil" — impreciso. Usar fechas.
  • "Solución integral 360°", "llave en mano", "transformación digital" — corporate slop.
  • Franglish-cute: "developear", "releasear", "mergear" → construir, publicar, integrar.
  • "Disculpe la molestia" — no nos disculpamos preventivamente.
  • Title Case en títulos: Manual Del Usuario → Manual del usuario.
  • Exclamaciones en cliente-facing.
  • Hipérbole técnica: "el mejor stack del mercado", "la app más rápida".
  • Emoji en propuestas, contratos, hoja membretada.

Frases firma DevZen
Recomendamos X porque Y.Estructura de toda recomendación
Fuera de alcance: …Línea de cierre de cualquier scope
Riesgo identificado · Mitigación · Owner.Cómo se reporta un riesgo
Lo que entregamos hoy es lo que usaríamos en producción mañana.Cierre de propuesta
DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 08
§ III — Voice & Tone · cont.
Antes / Después
Muestras concretas

La voz, en cinco superficies que escriben los equipos cada semana.

01 · Cold outreach
Borrar

"Hola, ¿cómo estás? Te quería compartir lo que hacemos en DevZen, somos una agencia de software que puede ayudarte con todo lo que necesites. ¿Agendamos una llamada?"

Reescribir

"Buen día, Sr. Reyes. Vimos que Punto Dental abrió tres clínicas en seis meses. A ese ritmo el cuello de botella deja de ser ventas y pasa a ser administración. Construimos sistemas que automatizan agenda, cobranza y reporte clínico para clínicas que escalan. ¿Le agendo 20 minutos esta semana?"

02 · Status update de sprint
Borrar

"Vamos avanzando bien con el proyecto, casi está listo, en breve les compartimos."

Reescribir

"Sprint 4 cierra este viernes con: módulo de cotización en producción, integración con SAT en staging (queda regression de 1 día), y dos tickets de UI menores en QA. Riesgo abierto: el endpoint de SAT respondió con timeout intermitente; mitigamos con retry + queue. Sin impacto en fecha."

03 · Email de cierre de proyecto
Borrar

"¡Listo! Esperamos que disfruten su nueva plataforma. Cualquier cosa nos avisan."

Reescribir

"Sr. Reyes, queda entregada la plataforma. Documentación en /docs, runbook de incidentes en el repo (RUNBOOK.md), y los accesos administrativos en el documento adjunto. La garantía técnica corre 90 días desde hoy; cualquier issue se atiende vía kike@numia.group. Próximo paso recomendado: agendar revisión a 30 días para evaluar adopción y oportunidades de optimización."

04 · Slide title
Borrar

Increíbles Resultados

Reescribir

Resultados — Q3 2026

05 · Botón / CTA
Borrar

Solicitar mi cotización ahora

Reescribir

Solicitar cotización · Agendar llamada

DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 09
§ IV — Vocabulario
Lo que decimos · lo que no
§ IV

Vocabulario propioLas palabras importan tanto como el código.

Una marca consistente usa las mismas palabras dos años seguidos. La tabla siguiente es la fuente única para propuestas, decks, web y manuales del cliente.

Cómo nombramos lo que hacemos
DecimosNo decimosPor qué
Construimos / desarrollamos / entregamosHacemos / armamos"Construir" implica método.
Plataforma · sistema · automatizaciónAplicación / app (excepto cuando es móvil)"Sistema" comunica activo; "app" lo pequeña.
SoluciónProducto (excepto producto propio)Vendemos solución; el producto es interno.
Software a la medidaSoftware personalizado / customizadoEl término correcto en español de negocios.
Ingeniero · equipo de ingenieríaProgramador / coder / dev (cliente-facing)"Dev" es interno; con el cliente, ingeniero.
Estrategia técnicaAsesoría tecnológica"Estrategia" tiene peso; "asesoría" suena timorato.
Cotización · propuesta comercialQuoteEn español formal con el cliente.
Acta de kickoffReunión inicial"Acta" formaliza; "reunión" desjerarquiza.
Sprint · backlog · ticketLista de pendientes / tareasTerminología ágil, ya extendida en LATAM.
Cómo nos nombramos

DevZen — no Devzen, no DEVZEN. DZ solo como monograma visual. DevZen Solutions en contratos, facturación y pie legal. Filial de Nümia Group siempre que ayude a contexto — nunca "subsidiaria", nunca "parte de Nümia".

Cómo nombramos al cliente

Sr. / Sra. + apellido en primer contacto. "Su equipo", "su operación", "su negocio". Cuando es marca, la marca con artículo si aplica: "trabajamos con Punto Dental", "implementamos para Grupo Reyes".

DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 10
§ IV — Vocabulario · cont.
Guardrail · palabras prohibidas
Palabras prohibidas

Si aparecen en un documento que va a salir, hay que reescribir.

Son señal de borrador-sin-revisar. No las usamos en cliente-facing — ni en propuesta, ni en contrato, ni en deck, ni en manual. La excepción única: "llave en mano" en contratos legales si la contraparte lo exige explícitamente.

  • Solución integral 360°
  • Llave en mano
  • Transformación digital
  • Sinergia
  • Disrupción · disruptivo
  • Best in class
  • De clase mundial
  • Súper / mega / ultra [cualquier cosa]
  • Lo más rápido posible
  • Estamos emocionados
  • Cualquier cosa nos avisa
  • Developear · releasear · mergear (cliente)

Sustituciones rápidas
ApareceReescribir como
Lo más rápido posibleFecha concreta — "viernes 6 de junio".
Estamos emocionados de…Borrar la frase. Empezar por el verbo de acción.
Cualquier cosa nos avisa.Cerrar con siguiente paso explícito.
Solución integral 360°Listar exactamente qué entra y qué no en el alcance.
Transformación digitalDecir qué proceso cambia, cómo, y qué métrica se mueve.
Las palabras prohibidas no son tabú — son señal. Donde aparecen, falta un número, una fecha o una decisión. Regla operativa de redacción
DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 11
§ V — Sistema dual-mode
Concepto
§ V

Sistema dual-modeDos superficies. Una identidad. Como un uniforme de fútbol.

DevZen aplica el mismo sistema cromático y tipográfico en dos modos. Tech es el uniforme de local — fondo ink, acentos cyan y morado, gradient permitido. Editorial es el uniforme de visitante — fondo bone, tinta ink, restraint. Mismos hex codes, mismas reglas. Lo que cambia es la superficie y el peso con que se aplica el color.

Modo Tech — uniforme de local

Dónde vive. Web (devzen.numia.group), pitch deck, social, propuestas digitales, dashboards, mockups en vivo.

Cómo se ve. Surface Ink #0A1128. Tipo blanca y slate. Eyebrows cyan. Una palabra en gradient cyan→morado por pantalla, máximo. Sombras profundas, posible glow sutil en focus.

Por qué. En pantalla, el ink hace contraste con luz emitida — el cyan se percibe vibrante, el gradient lee como dispositivo identitario.

Modo Editorial — uniforme de visitante

Dónde vive. Hoja membretada, contratos, NDAs, manuales del cliente, casos de estudio impresos, propuestas en PDF para archivar.

Cómo se ve. Surface Bone #F5F2EB. Tinta Ink #0A1128. Stone-200 hairlines. Cyan-deep #058891 reservado a eyebrows, enlaces y border-left de pull-quotes. Sin gradient. Sin sombras dramáticas.

Por qué. El papel no emite luz. El cyan saturado destrumbra; el cyan-deep mantiene el contraste AA sobre bone sin sobreactuar.


La regla maestra: ningún hex code es exclusivo de un modo. Lo que es exclusivo es la jerarquía de aplicación. En Tech, los acentos se permiten en superficie (fondos, fills). En Editorial, los mismos acentos se permiten en filo (líneas, eyebrows, enlaces). Es la misma paleta, dos disciplinas.

DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 12
§ V — Sistema dual-mode · cont.
Demo · mismo bloque, dos uniformes
Side by side

El mismo bloque de contenido, renderizado en cada modo.

Una promesa del manifiesto, una nota de soporte y un CTA. Mismo texto, misma jerarquía, misma escala tipográfica. Lo que cambia es la superficie y el peso del color.

Promesa 02 · AI-first
Automatizamos lo que se pueda automatizar. El equipo humano se enfoca en lo que solo un humano debe decidir.

Pipelines, generación y QA por default. Criterio humano reservado a diseño de producto, riesgo y trato con el cliente. Ver runbook completo.

Agendar diagnóstico
Tech mode · web · deck · social · propuesta digital
Promesa 02 · AI-first
Automatizamos lo que se pueda automatizar. El equipo humano se enfoca en lo que solo un humano debe decidir.

Pipelines, generación y QA por default. Criterio humano reservado a diseño de producto, riesgo y trato con el cliente. Ver runbook completo.

Agendar diagnóstico
Editorial mode · membretada · contrato · NDA · manual · caso PDF
Tech — lo que está pasando

Surface ink (#0A1128). Eyebrow en cyan (#06C4D0). Una palabra — automatizar — recibe el gradient signature (regla: máximo una por pantalla). CTA en fill cyan con texto ink: alto contraste, peso de acción.

Editorial — lo que está pasando

Surface bone (#F5F2EB). Tinta ink. Eyebrow en cyan-deep (#058891) para preservar AA sobre bone. Sin gradient. CTA outline en cyan-deep — invitación, no fill.

Two surfaces, one identity. Like a football kit. Concepto operativo · sistema dual-mode
DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 13
§ VI — Paleta
12 tokens canónicos
§ VI

PaletaDoce tokens. Cero ambigüedad.

Toda la marca cabe en doce hex codes. Cada uno tiene un rol específico, un caso de uso, y un caso de nunca-uso. Si un diseño necesita un color que no está en esta tabla, no es DevZen — es otro proyecto.

Ink
#0A1128
Surface base Tech · texto sobre bone en Editorial.
Nunca: fondo de doc Editorial.
Ink-2
#0E1633
Card surface alt en Tech.
Nunca: outline, hairline.
Ink-3
#141C3D
Nested card · popover Tech.
Nunca: texto sobre bone.
Cyan
#06C4D0
CTA primario · enlaces Tech · brand markers · gradient start.
Nunca: link en bone (no AA).
Cyan-deep
#058891
Link, eyebrow, border-left en superficie bone.
Nunca: fill de CTA en Tech.
Morado
#8B5CF6
Acento secundario · gradient end.
Nunca: como primario.
Morado-deep
#6D3DD9
Pressed · link hover en bone.
Nunca: fondo de bloque.
Bone
#F5F2EB
Surface base Editorial — el papel.
Nunca: fondo Tech.
Paper
#FAF8F3
Card sobre bone, más cálido.
Nunca: surface base de página.
Stone-200
#D6D1C4
Hairlines · separadores Editorial.
Nunca: texto.
Stone-500
#6C6A5C
Texto secundario · meta · captions Editorial.
Nunca: heading principal.
Stone-700
#38362F
Texto enfático sobre bone · body color.
Nunca: heading display (se usa ink).
DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 14
§ VI — Paleta · cont.
Signature gradient
Signature gradient

El gradient cyan → morado. Máximo uno por pantalla.

linear-gradient(90deg, #06C4D0 0%, #8B5CF6 100%)

Sí se usa para
  • Una palabra clave dentro de un hero serif (ej. "tampoco", "automatizar").
  • Un CTA hero — máximo uno en la pieza.
  • Un badge de eyebrow en posiciones premium (cover de propuesta, hero del sitio).
No se usa para
  • Backgrounds completos de pantalla.
  • Modo Editorial (membretadas, contratos, NDAs, manuales).
  • Detrás del logo (canibaliza la marca-Z).
  • Dos veces en la misma pantalla.

Semánticos · iguales en ambos modos
Success
#2EB57A
Warn
#F0A04B
Error
#EF5360
Info
#4D8AF0

Info es un canal distinto del cyan brand — no se confunden. El brand cyan se usa para identidad; el info se usa para estados de UI.

DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 15
§ VII — Tipografía
Especimen · tres familias
§ VII

TipografíaUna serif editorial. Una sans neutral. Una mono estructural.

Inter es el default que usa todo el mundo. Söhne es de pago. Geist + Instrument Serif son free, premium, raras en LATAM software — comunican gusto sin costo. La mono está reservada a estructura: eyebrows, meta, números, code.

Instrument Serif Display · hero · pull-quotes · headlines editoriales
Software a la medida.
ABCDEFGHIJKLMNÑOPQRSTUVWXYZ abcdefghijklmnñopqrstuvwxyz 0123456789 — itálica disponible
Regular (400) · Italic (400)
Geist Body · UI · navigation · párrafos
Recomendamos X porque Y.
ABCDEFGHIJKLMNÑOPQRSTUVWXYZ abcdefghijklmnñopqrstuvwxyz 0123456789
Light 300 · Regular 400 · Medium 500 · Semibold 600 · Bold 700
Geist Mono Eyebrows · meta · code · números · labels
SLA · 99.95% · RUNBOOK.md
ABCDEFGHIJ · 0123456789 · { } [ ] / + - = → ←
Regular 400 · Medium 500 · Semibold 600
DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 16
§ VII — Tipografía · cont.
Escala completa
Escala tipográfica

Once tamaños. Cada uno con un rol.

D1 — Serif
Hero principal.
96px max · clamp · –0.02em
line 1.04
D2 — Serif
Section opener.
64px max · clamp · –0.02em
line 1.08
D3 — Serif
Sub-section.
44px max · clamp · –0.01em
line 1.18
H1 — Sans
Bloque de página.
40px · 600 · –0.01em
line 1.18
H2 — Sans
Encabezado de bloque.
28px · 600
line 1.18
H3 — Sans
Sub-encabezado.
22px · 600
line 1.18
H4 — Sans
Card title.
18px · 500
line 1.18
Body
Body por default — donde vive la mayor parte del texto.
16px · 400
line 1.55
Caption
Caption, notas al pie, meta secundaria.
13px · 400
stone-500
Micro
Micro — legales, atribuciones, créditos.
11px · 400
stone-500
Eyebrow
Eyebrow · estructural
12px mono · 500
tracking 0.18em
DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 17
§ VIII — Layout, motion, iconografía
Grid · spacing · radii
§ VIII

Layout, motion, iconografíaEl sistema que sostiene la página.

Grid base 4px. Documentos respiran a 56px de margen exterior mínimo. Web respira a 80px en desktop. Cero fluffy shadows. Cero glassmorphism. Curva única de easing.

Grid & spacing

Base 4px. Spacing scale: 2, 4, 8, 12, 16, 20, 24, 32, 40, 56, 80, 120. Documentos: 56px outer margin mínimo (letter-size). Web: 80px gutters mínimo en desktop.

space-1
2 px
space-2
4 px
space-3
8 px
space-5
16 px
space-7
24 px
space-8
32 px
space-10
56 px
space-11
80 px
space-12
120 px
Radii

UI default 4px. Cards 8px. Hero 16px. Nunca 9999px excepto tag chips.

r-0
r-1
r-2
r-3
r-4
Borders

Hairline 1px stone-200. Focus ring 1.5px cyan.

Sombras editoriales
SHADOW · SM
Hairline + 1px y. Cards en flujo.
SHADOW · MD
4px y · 12% ink. Elevación moderada.

Sin glow, sin glassmorphism. Las sombras son funcionales — comunican capa, no estilo.

DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 18
§ VIII — Layout, motion, iconografía · cont.
Easing · Lucide
Motion

Una sola curva. Cuatro duraciones.

cubic-bezier(0.2, 0.8, 0.2, 1)

Curva única para todo: hover, page transition, modal, scroll-revealed. Una marca tiene un feel coherente porque sus animaciones aceleran y desaceleran igual.

Duraciones: 120ms (hover, micro) · 200ms (default) · 320ms (page) · 600ms (hero).


Iconografía

Lucide icons — biblioteca MIT, stroke 1.5px, vía CDN. Tamaños canónicos 14 · 16 · 20 · 24 · 32. Color = currentColor — el ícono adopta el color del contexto. Excepción única: logos de stack tech (AWS, Postgres, etc.) mantienen su color de marca.

<script src="https://unpkg.com/lucide@latest/dist/umd/lucide.min.js"></script>
<script>lucide.createIcons();</script>
Reglas duras
  • Cero emoji en cliente-facing.
  • Cero íconos decorativos. Cada ícono significa algo.
  • Si Lucide no lo tiene, no se inventa — se nombra en texto.
  • Nunca dos colores en un ícono (excepto logos de stack).

Fondos

El fondo por default es Bone #F5F2EB en Editorial e Ink #0A1128 en Tech. Nunca #FFFFFF puro en documentos — el blanco puro es display-only (UI elevada, popovers).

DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 19
§ IX — Guardrails & Taglines locked
Master · Campaign
§ IX

Guardrails & Taglines lockedLo que está cerrado. Lo que no se reabre sin Kike Vázquez.

Los dos anchors verbales de DevZen están fijos. Cualquier propuesta de cambio requiere aprobación explícita del CEO. El changelog vive en GOVERNANCE.md.

★ Master tagline — LOCKED · 2026-05-09
Tu empresa no es plantilla. Tu software tampoco.
Aplicación obligatoria: hero del sitio · portada del pitch deck · banner LinkedIn · firma de email institucional · página About · cierre de propuestas comerciales.

Reglas de uso: no abreviar — la tensión vive en las dos frases juntas · punto final dentro de la oración (plantilla. y tampoco.) · al romperse a dos líneas, el corte va entre las dos oraciones, nunca a media frase · en Tech, "plantilla" o "tampoco" puede recibir el gradient — una sola palabra, no las dos · en Editorial, sin gradient.
★ Campaign tagline — LOCKED · uso rotativo
Diseñamos dentro de tu negocio, no fuera.
Aplicación: ads (Google, LinkedIn, Meta) · social campañas · landings de servicio individual (plataformas, automatización, apps) · casos de estudio como eyebrow de portada · pitch a inversores y partnerships.

Variantes contextuales permitidas: plataformas → "Construimos dentro de tu negocio, no fuera" · auditorías → "Auditamos dentro de tu negocio, no fuera".

Regla dura: nunca se usa simultáneamente con el master tagline en la misma pieza.
Sub-positioning permitido

Estas frases viven en cuerpo de copy. No reemplazan los taglines lockeados.

  • Calidad Silicon Valley. Sensibilidad LATAM. — descriptor de posicionamiento.
  • Software que sube de nivel tu negocio. — audiencia PYME no técnica.
  • El negocio que sale de un proyecto con DevZen no es el mismo que entró. — cierre de manifiesto.
DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 20
§ IX — Guardrails · cont.
Compilado · vista de un golpe
Guardrail compilado

Una sola página para imprimir y dejar en el escritorio.

No usar — Visual
  • · #FFFFFF puro como fondo de página
  • · Gradient cyan→morado en backgrounds completos
  • · Gradient detrás del logo
  • · Más de un gradient por pantalla
  • · Glow, glassmorphism, blur fluffy
  • · Paleta jade v2.0 (deprecated)
  • · Radii pill (9999px) fuera de tag chips
  • · Emoji en cliente-facing
  • · Title Case en cualquier encabezado
No usar — Verbal
  • · "Solución integral 360°"
  • · "Llave en mano"
  • · "Transformación digital"
  • · "Sinergia"
  • · "Disrupción · disruptivo"
  • · "Best in class" · "De clase mundial"
  • · "Súper / mega / ultra [cualquier cosa]"
  • · "Lo más rápido posible"
  • · "Estamos emocionados"
  • · "Cualquier cosa nos avisa"
  • · "Developear · releasear · mergear" (cliente)
  • · Exclamaciones cliente-facing
  • · Pluralizar el equipo más allá de lo real
Sí usar — Disciplina
  • · Sentence case en todos los títulos
  • · Pronombre usted en cliente-facing
  • · Bone #F5F2EB como fondo Editorial
  • · Ink #0A1128 como fondo Tech
  • · Stroke 1.5px en focus rings
  • · Hairlines 1px en stone-200
  • · Eyebrow Geist Mono 12px / 0.18em
  • · Verbos primero en oraciones
  • · Números, fechas, owners en propuestas
  • · "Recomendamos X porque Y."

En caso de conflicto entre archivos: el colors_and_type.css v2.1 es la fuente operativa. El README.md describe v2.0 jade y quedó huérfano de la actualización — se actualizará por separado. Esta constitución toma como verdad la v2.1.

DevZen Solutions · Filial de Nümia Group LTD · kike@numia.group · +52 981 123-6415 · devzen.numia.group 21
§ X — Ratificación
Vigencia · firma
§ X

RatificaciónLo anterior se firma. Lo posterior se enmienda.

Las partes abajo firmantes ratifican el presente documento como el sistema de marca y diseño operativo de DevZen Solutions a partir de la fecha indicada. Toda enmienda futura sigue el procedimiento establecido en GOVERNANCE.md — propuesta escrita, revisión técnica, aprobación de los firmantes, versión incrementada y changelog público.

Documento ratificable · v1.0

Tu empresa no es plantilla. Tu software tampoco.

Kike Vázquez
CEO / CTO · Co-Founder

Custodio del manifiesto, voz, taglines y palette v2.1. Toda enmienda al master o campaign tagline requiere su aprobación explícita.

Eduardo Nepote
COO / CFO · Co-Founder

Custodio de la disciplina operativa, vocabulario cliente-facing y aplicación del sistema en piezas comerciales.


Versión
v1.0
Fecha de ratificación
22 de mayo de 2026
Vigencia
Hasta enmienda formal — sin fecha de caducidad.
Fuente operativa
colors_and_type.css v2.1 (manda sobre cualquier conflicto con README.md v2.0)
Enmiendas
Procedimiento en GOVERNANCE.md · changelog público en el mismo archivo
Próximo entregable
Prompt 2 — Design Tokens + Aplicaciones operativas (cotización, hoja membretada extendida, propuesta comercial, email signature, brand kit 1-page)