Flujo de trabajo
Logotipos adaptativos: qué composición usar en cada aplicación
Una identidad adaptativa ofrece opciones controladas; no autoriza a recortar, reorganizar o simplificar el logotipo sobre la marcha.
La respuesta breve
Elige la composición aprobada que aporte más información y conserve reconocimiento y legibilidad en la aplicación real. Comprueba anchura, altura, fondo y elementos cercanos antes de definir cuándo cambiarla. Utiliza el símbolo por separado únicamente cuando el sistema de identidad lo permita.
1. Empieza por las aplicaciones, no por una escala de tamaños
Reúne los usos difíciles antes de dibujar más versiones: una cabecera web estrecha, un avatar cuadrado, una franja de patrocinadores, una etiqueta vertical y un objeto pequeño. Anota la forma disponible, el contenido próximo y las condiciones de observación. Una cabecera ancha y baja plantea problemas distintos a un panel alto, aunque ambos se describan como pequeños.
Prepara una lámina de aplicaciones con las restricciones reales. Muestra el logotipo al tamaño visible previsto, junto a la navegación, las otras marcas o la información del producto. Una presentación de identidad perfectamente despejada puede ocultar problemas que aparecen enseguida en una interfaz llena de contenido. Comprueba el contexto que utilizará el destinatario.
Este trabajo es distinto de exportar PNG más grandes. Añadir píxeles no arregla una composición cuyo nombre resulta ilegible al tamaño de visualización. Un vector conserva la geometría al escalarse, pero no garantiza que se reconozca la marca. Aquí la decisión es qué composición aprobada corresponde al espacio disponible.
2. Define una familia pequeña de composiciones aprobadas
Enumera las versiones que realmente necesita la identidad: quizá una firma horizontal, otra apilada y un símbolo independiente. Una identidad basada únicamente en letras puede no disponer de símbolo. No lo fabriques recortando una inicial solo para completar una plantilla habitual de presentación.
Decide qué elementos son obligatorios. Una denominación legal, un descriptor institucional, el respaldo de la marca matriz o el nombre del producto pueden ser esenciales, aunque el lema sea opcional. Si una versión compacta elimina información, documenta dónde está permitido y cómo la aplicación aporta la identificación que falta.
El sistema publicado de UCLA Health distingue versiones horizontales y apiladas y recomienda estas últimas en espacios verticales o reducidos. Es un ejemplo útil de una regla explícita, no una norma para todas las marcas. Tu sistema debe respetar sus propias composiciones aprobadas y su jerarquía.
Más información: UCLA Health: variantes y uso del logotipo
3. Explica cuándo corresponde cambiar de composición
Utiliza esta tabla como hoja de revisión. La alternativa no consiste siempre en reducir el logotipo: puede requerir cambiar la distribución, reservar más espacio o solicitar otro recurso aprobado. Conserva las proporciones; no comprimas la marca para aparentar que cumple una especificación.
| Restricción | Primera opción | Si no funciona |
|---|---|---|
| Cabecera ancha y baja | Firma horizontal aprobada | Ajustar la cabecera o usar una opción compacta autorizada |
| Panel estrecho y alto | Firma apilada aprobada | Reorganizar el panel antes de reducir más |
| Avatar cuadrado con el nombre cerca | Símbolo independiente aprobado | Solicitar un recurso específico si no existe símbolo autorizado |
| Marca poco conocida entre patrocinadores | Firma que incluya el nombre | Ampliar su espacio antes de perder identificación |
| Área de producción muy pequeña | Marca simplificada aprobada | Confirmar la viabilidad con el proveedor |
4. Prueba los cambios dentro del componente
No impongas un punto de cambio universal como «todos los logotipos cambian a 768 píxeles». El espacio disponible puede depender de la navegación, una etiqueta traducida más larga o una barra lateral, no de la anchura total del navegador. Identifica con desarrollo la restricción que realmente provoca el fallo.
Redimensiona gradualmente la composición real y registra el último estado cómodo de cada alternativa. Prueba también la transición: observa si cambia bruscamente el peso visual o la alineación. Conserva la identidad prevista del enlace o control cuando cambie la imagen. Sustituir un recurso no debería producir dos logotipos interactivos que compitan entre sí.
Documenta las condiciones comprobadas en lugar de prometer que funcionará siempre: dimensiones del componente, variante aprobada, fondo y distribuciones excepcionales. Repite la revisión cuando cambien la navegación, el idioma o el contenido cercano. Un punto de cambio válido en la maqueta original no demuestra que la distribución nueva funcione.
5. Distingue adaptación de edición no autorizada
Entrega composiciones completas, no piezas que inviten a improvisar. Deben conservarse las relaciones entre elementos, los espacios y las letras. Si existe una construcción compacta oficial, proporciona ese original en vez de indicar al desarrollador que oculte determinados trazados de un SVG complejo.
Los manuales muestran por qué importa la autorización. Las directrices publicadas de Hexure especifican un logotipo horizontal y limitan el uso independiente del símbolo a ciertos contextos. Recomendar todas las composiciones imaginables contradiría esa identidad. Tener más variantes no significa disponer de un sistema mejor.
Aplica las especificaciones existentes de tamaño mínimo y área de protección, pero evalúa también el reconocimiento y el contexto. Un símbolo puede caber técnicamente sin identificar al emisor ante una audiencia nueva. Cuando el nombre sea necesario, modifica la distribución en vez de dar por supuesto que todos conocen la marca.
Más información: Directrices de Hexure: logotipo horizontal y uso del símbolo
6. Entrega las reglas junto con los recursos
Asigna nombres estables a las composiciones aprobadas e incluye ejemplos de aplicaciones adecuadas e inadecuadas. Identifica la versión predeterminada, las condiciones para elegir otra y quién aprueba las excepciones. Facilita las mismas reglas a diseño y desarrollo para que la web no se convierta en una identidad paralela no oficial.
Una vez aprobados los originales y los nombres, puedes usar logopack.app para preparar un paquete organizado y comprobarlo frente a la lista de entrega. Una cuenta gratuita permite exportar la demostración incluida sin modificar su SVG; exportar tus propios diseños requiere un plan de pago. Organizar archivos no aprueba variantes nuevas ni corrige el diseño.
Más información: Abrir el generador · Consultar los planes
Lista de comprobación del sistema adaptativo
- Las pruebas muestran proporciones y contextos reales.
- Todas las variantes están aprobadas; ninguna es un recorte improvisado.
- La identificación obligatoria se conserva en cada cambio permitido.
- La aplicación más pequeña sigue siendo reconocible.
- Las transiciones se probaron en el componente real.
- La entrega explica opciones predeterminadas, alternativas y excepciones.
- Los cambios de contenido o distribución requieren otra revisión.
PONLO EN PRÁCTICA
¿Todo listo para preparar tu paquete?
logopack.app convierte tus diseños SVG en un paquete de logotipos organizado. Previsualiza los archivos, elige entre las opciones de exportación disponibles y revisa el resultado antes de entregarlo.
Empieza con el generador de paquetes de logotipos, explora el ZIP de ejemplo o compara los planes actuales.
Abrir generador