Logos responsive, la nueva tendencia en branding
Actualizado 17/08/2021
Logos responsive o logos ‘adaptativos’ es la nueva tendencia en las grandes marcas. El uso de diferentes dispositivos con tamaños de pantalla variables crea la necesidad de diseñar logos que se adapten a escenarios diversos.
_
Las variantes de un logo en composición forma o tamaño no son nuevas. En los manuales de identidad corporativa siempre ha existido el apartado donde aparecía la marca en una especie de test de reducción y podíamos probar que la marca funcionaba perfectamente en tamaños pequeños. Incluso en ocasiones se hacía una variante, eliminando elementos superfluos de la marca para cuando ésta se tuviera que utilizar en espacios muy exiguos.
Actualmente esto último ha tomado mayor importancia ya que en el escenario actual, un logo tiene que poder mantener su personalidad e identificación en tamaños muy diversos. Al igual que las webs adaptan y modifican su composición en función del ancho de las pantallas de los dispositivos, las marcas está mutando en el mismo sentido.
Como vemos en el estudio de Joe Harrison, especialista en diseño digital e interactivo, marcas como Coca-Cola, Chanel, Nike o Disney ya tienen variantes de marca que se adaptan y modifican en función del escenario. Marcas que en su expresión completa tienen muchos elementos que poco a poco se van simplificando o eliminando hasta llegar a expresiones mínimas pero igualmente identificativas. Esto también es posible gracias al uso de formatos .SVG que permiten visualizar formas vectoriales con gran calidad a tamaños muy pequeños (ver ‘Formatos .SVG‘).
Logos responsive de Joe Harrison.
En logos como el de Disney se puede observar cómo se pasa de un logo con castillo a una simple ‘D’. En Coca-Cola resulta curioso que la versión mínima acabe cambiando el nombre y pase a ser simplemente Coke. Joe Harrison avisa que esto no es un estudio realizado en colaboración con las marcas, sino que ha sido la visualización en webs y en situaciones interactivas lo que le ha llevado a observar que las marcas han solucionado de este modo su presencia en espacios responsive. Puedes verlo en acción en: ResponsiveLogos.co.uk
Esto abre la puerta a que ahora no solo basta con diseñar una bonita marca y comprobar que funciona bien en diferentes escenarios, sino que también es necesario plantear en el desarrollo del logo variantes de composición y variantes responsive de la marca. Digamos que diferentes momentos de la marca según el tamaño de la ventana o del espacio. ¿Abrirá esto una puerta revisionista que llevará a las marcas a crear todas las variantes que ahora no tienen?
→ Responsive Logos
→ CSS Responsive Images
+ Artículos
Comentarios 43
Deja una respuesta
La NFL permite el uso del número 0 en las camisetas, y Pepsi lo aprovecha al máximo
En un giro sorprendente para la industria del deporte y el patrocinio, la National Football League (NFL) ha decidido permitir...
Leer
Tema para diseñadores web, a un diseñador gráfico le resulta poco importante o nana nuevo, porque a mi parecer, conocen muy poco el funcionamiento de los sitios web responsivos.
Bullshit de la grande.
¡la ignorancia de quien publica y de quien lo ve como algo fantástico es brutal!
Lo último no son logos, son símbolos.
Cuando tenemos tipografía sola, son logotipos.
Cuando tenemos tipografía + símbolo, tenemos un imagotipo.
esto es sumamente absurdo y tendencioso, más de las patéticas modas que realmente contenido de fondo, promoverlo es irresponsable, y pensar que esto es realmente algo innovador es ser un ignorante.
toda marca gráfica debe ser realizada para identificar y distinguir, y podrá tener versiones de aplicación, incluyendo obviamente los medios electrónicos, es todo, es simplemente usar versiones para ser identificadas, pero de manera pensada y conceptualizada, no sólo tomando elementos al azar como aquí se presenta, ¡absurdo!
Estoy en desacuerdo. Se retomaron los elementos más trascendentales para hacer las abstracciones correspondientes. Sobre todo en el mundo digital esto tiene una vigencia y es necesario. La abstracción de estos símbolos gráficos no es nada novedoso pero obedece a patrones de consumo.
¿patrones del consumo?, no te dejes llevar por esas cosas tendenciosas, esto es más de las patrañas del ‘branding’ y su desconocimiento, podrás estar de acuerdo o en desacuerdo, eso es irrelevante, recuerda, soy the inquisitor.
¿Eres quién? ¿Y eso en que contribuye? Cuál es la tésis para criticarlo. No veo ninguna, simplemente pragmatismo forzado y berrinches.
estás chavo, ¡ya aprenderás!
¡Seguro! Pero nada de ti. De ti no me llevo nada.
eso se llama, ¡ingratitud!
Cuando aportes algo a cualquier postura te agradezco, si es de lo que pides tu limosna.
Yo ahí lo único que veo es que cogen la forma gráfica más reconocible e identificativa del logo y la cascan para visualizaciones a pequeño tamaño.
Y a baja resolución
Pero esto es algo muy antiguo. Acordaos del logotipo de Alcobendas. Un escudo en el desaparecía el contenido interior. Sin embargo era percibido como un escudo, por mucho que redujéramos el tamaño o que las condiciones de impresión fueran malas.
Si el logotipo está bien pensado y posicionado frente a la competencia, poco importarán los detalles: por ejemplo, el corte inglés, tiene una letra ilegible cuando reducimos su tamaño. Pero el triángulo verde horizontal es claramente identificable en cualquier circunstancia, y claramente diferenciada de resto de las marcas de la competencia.
Antes de pensar en distintas versiones, deberíamos pensar en un elemento que podamos percibir exactamente igual en distintas circunstancias. Mirad, la letra de coca cola es tan característica, que aunque veamos la mitad de un letrero de coca cola, sabemos que se trata de dicha marca.
El problema es que los encargados del diseño se dejan llevar por su talento con el lápiz, ordenador…. En lugar de hacer trabajar la capacidad analítica.
Claramente modificar el logotipo de esa manera para adaptarse a los medios es un lujo que sólo pueden darse las marcas extremadamente conocidas, pero también es algo que jamás tendrá que hacerse sobre un logo bien diseñado.
Hasta que veo que alguien aporta algo. Se refiere al pago de derecho ante propiedad industrial? Entiendo cada versión debería tener un registro propio, ¿cierto? En el caso de aplicaciones diminutas, ¿tampoco le parece valida la selección realizada? Los favicons por ejemplo.
Pues yo creo que ya sea satisfaciendo o creando necesidades como esta, seguiremos teniendo trabajo chicos, este sector nuestro cambia cuando uno de nosotros tiene una buena idea y los demás le seguimos, le mejoramos o le criticamos. Así que creo que está fuera de la discusión la parte técnica de los cambios que ha hecho, en realidad yo lo veo mas como una oportunidad de cobrar un nuevo servicio a nuestros clientes, no os parece?
Convertir CocaCola en Coke, quitarle el texto a Levi’s o el apaño de Chanel son chapuzas imperdonables que ninguna marca, ni siquiera una tienda de ropa choni de barrio, aceptaría ni para atrás.
El concepto es interesante, y útil, a veces limitarse a redimensionar la imagen para dispositivos móviles no es suficiente, pero esos apaños cutres están lejos de ser buen ejemplo.
Todo sea por la promoción, ¿no?
la última de Levi’s la asocio más con Batman que con nada más
POR DIOS QUÉ BUEN ARTÍCULO :^) Necesito ponerme a trabajar ASAP para construir una máquina del tiempo y viajar a 1950 donde será relevante e innovador :–DDD
Responsive Design… el tamaño si importa. ;)
no el tamaño, sino que las proporciones como 16:9, 4:3 o 1:1
logotipo e isotipo y su funcionalidad por separado. No veo nada nuevo
YA ESTÁ EL TÍPICO PEDANTE. CLARO QUE EL CONCEPTO NO ES ALGO NUEVO, SIMPLEMENTE ES UN ARTÍCULO SOBRE SU USO EN WEB, AL CAMBIAR AUTOMATICAMENTE ENTRE DISTINTAS VERSIONES DEL IMAGOTIPO, O EN OCASIONES ISOTIPO O LOGOTIPO, EN FUNCIÓN DEL TAMAÑO DE LA PANTALLA CON AL QUE VISUALIZAS. EL CONCEPTO DE VERSIONES YA LO TENEMOS CLARO, PERO LOGOS RESPONSIVE MO SON MUY HABITUALES EN LA WEB. PEDANTE
Take it easy my friend
Y escribir con mayúsculas significa que gritas, si ya lo sabes no es pa tanto, y si no, ya te vale. ; p
Vaya tontería de articulo, parece que ahora a cualquier chorrada lo acompañas del termino “user experience” o “responsive” y su valor se multiplica por 100. Por favor no caigamos en el uso de término-tendencia que se pierde seriedad como colectivo. Que sera lo siguiente identidades storytelling? suena mejor? pero es lo que son.
Son versiones de la marca de toda la vida no?
Desde que el uso de webfonts es aceptado por la mayoría de los navegadores, algunos diseñadores web optamos por crear una webfont con las diferentes aplicaciones del logo. De este modo, mejoramos la carga y podemos utilizarlo a cualquier tamaño sin pérdida de calidad y sin aumentar los tiempos de carga.
Además de poder manejar propiedades, como el color, desde CSS.
Todo cambia muy rápido, aunque quien lleva mucho tiempo dedicándose a estas labores hemos podido ver que poco a poco se ha llegado a esta situación.
Usar webfont para logotipo es un hack.
No se deberia hacer porque es una barrera a nivel de la accesibilidad. Un lector de pantalla no intepretara de forma correcta el logotipo si le pones en el dom que es por ejemplo una “a”
Gracias por el apunte.
pero todo depende de como se utilice. Sería el mismo problema que la utilización de un sprite de imágenes.
Mediante CSS añades una imagen de fondo o un caracter de una webfont. Esto no está presente en el DOM, aquí lo que tienes es el texto que identifica a este elemento.
quizás tu le puedas encontrar algún problema a este planteamiento en cuanto a accesibilidad, se agradecen comentarios.
El método correcto es utilizar la imagen tal cual. No como sprites de background. Esto hace dos años era una difícil decisión, ya que se había evitado por el hecho de que no se sabía si reemplazaba al H1 en SEO. Pero ya ha sido zanjado hace tiempo.
Quizás no es solo cuestión de tamaño, ¿convendrá definir una aplicación del logo para cada dispositivo?
Cuantas chorradas…
Sr Calvo, usted dedíquese al pintxo pote y deje trabajar a los diseñadores
A ver que lo que ha hecho este diseñador es básicamente un muy buen trabajo de autopublicidad, nada más.
Si os fijáis en esas marcas que comenta, Disney ya usa la D, Nike la pipa, Levis el logo con el nombre, a pesar de ser tan pequeño mantiene las letras ergo no querrá quitarlas porque se habrá dado cuenta de que no le identifican en pequeño sin ellas, que su buena pasta habrán gastado en identidad, Channel igual, y Cocacola por supuesto que no va a cortar su nombre, así que han optado por usar un círculo rojo con la archiconocida silueta de su botella de cocacola.
Solo hay que mirar los favicons, que desde mucho antes del “responsive” ya se hacían las versiones de los logos para que se identificasen en tamaño muy pequeño 16×16 px. Eso sí, no a todos se pueden hacer algo bueno me imagino el de Unilever en pequeño, pues una U de hecho no tienen favicon, y a parte cuando te llega el cliente pelado de pasta o que directamente no quiere pagar mucho, te vas a poner a pensarle toda la identidad y a diseñar algo para que se vea bien en todos los dispositivos…
Otro igual! que la novedad es que se modifique sólo en función del dispositivo.Está claro que para un cliente sin dinero no lo vas a a hacer, pero es un articulo sobre el concepto, nadie dice que se lo hagas a un cliente que apenas tiene fondos, que estupidez
tranquilo, no me vas a enseñar (ni Joe Harrison) lo que es la evolución de los snnippets a @media y los SVG, pero veo que para ti sí es novedad, enhorabuena por aprender algo nuevo.
Pero Nike deja de tener el swoosh sin letras y Coca-Cola nunca dejará de usar su logo completo. Me parece que no está del todo correcto este artículo
Entra en la web oficial de Nike (solo aparece sin letras su logo). O a la página oficial de Coca-cola (aparece el circulo con la botella en su interior). Si hay casos en los que se utilizan estas aplicaciones y en sitios tan importantes como es la página web oficial incluso para su versión de navegador. En mi opinión el hecho de que sean crecientes las conexiones a internet a través de dispositivos móviles de menor tamaño está marcando esta tendencia.
¿Es una nueva tendencia que un logo tenga que adptarse a diferentes medidas? Vaya yo creía que eso era lo normal enuna marca bien diseñada…
Yo lo veo de la siguiente manera: si bien una marca debe contar con sus versiones completa y sintética, esas versiones son las que se aplicarían en esto que llaman “tendencia”. Se dice que es “tendencia” por todo este movimiento web que cada día crece más: cada vez hay más gente con acceso a internet y el porcentaje de consumidores de redes sociales, web y e-commerce es mayor, por lo que un diseñador debe adaptarse a esas plataformas. Es aquí cuando se pone a prueba la versatilidad de una marca y, a su vez, la calidad de la misma.