Guías generales
Los íconos de SURA se encuentran construidos y unificados en relación a la identidad gráfica de la marca. Para construir la iconografía, se tomó como base una constante en la tipografía del logotipo de SURA, que se encuentra en la mayoría de las letras que lo conforman, la cual consiste en una terminación curva.
Todos los íconos deberán contar con dicha terminación en alguna parte de su estructura y será el distintivo rector de los íconos. Todas las demás esquinas y terminaciones deberán ser rectas.
Descarga los archivos editables de los iconos
Estilos
Los íconos puede tener los siguientes estilos:
Construcción
Los íconos de SURA se construyeron tomando como base una retícula de 10 x 10 cuadros.
En contorno
La terminación curva se determina a partir de una circunferencia que se obtiene tomando un 20% de “y” (la medida “y” es el ancho o altura de la retícula). El grosor se encuentra determinado por el 4% de “y”.
Con envolvente
El envolvente surge de la misma retícula de 10 x 10 cuadros, respetando un margen de 1 cuadro por cada lado, el ícono se debe situar dentro de los 9 x 9 cuadros restantes. El envolvente cuenta con una curvatura en la esquina inferior derecha que representa el 23% de “y”, el grosor se encuentra determinado por el 4% de “y”.
En línea con sombra
La sombra se usa sólo en los íconos en línea. Ésta es completamente sólida sin detalles del ícono y con el mismo color de la línea al 20%. La sombra se debe desplazar hacia la parte inferior derecha.
Versiones de color
A continuación se muestran las versiones de color permitidas para la aplicación de los iconos.
Sobre fondo blanco
Sobre fondo blanco los íconos pueden aplicarse en los colores corporativos.
Sobre fondo de color
Los íconos se pueden aplicar sobre fondos de los colores corporativos. Por lo general el ícono se usa en color blanco o amarillo o un color de los permitidos con el que se logre el contraste suficientoe sobre el fondo.
Sobre fondo fotográfico
Cuando se ubiquen íconos sobre imágenes, los colores variarán en función de la imagen y en todo momento debe tomarse en cuenta la legibilidad del ícono para elegir la versión adecuada.
Caso especial
Los iconos pueden usar colores distintos a los de la paleta de color corporativa, prestaciones o unidades de negocio, únicamente en aquellos casos que, por norma o reglamentación, se requiere el uso de colores específicos. Cuando sea posible, se debe tratar de utilizar colores de la paleta secundaria, ya sean tenues o vibrantes, que se acerquen lo más posible al color requerido por la norma.
A continuación, se presenta el caso de iconos para identificar las categorías de desperdicios y reciclaje usando los colores requeridos por normas internacionales.
Usos incorrectos
A continuación se describen algunos de los usos incorrectos de los íconos de SURA.
Los íconos no deben:
- Usar un color ajeno a la paleta de SURA.
- Utilizarse en dos o más tonos, aún cuando sean parte de la paleta de la marca.
- Presentar cambios en la relación de su proporción.
- Reproducirse de forma distorsionada.
- Ser aplicado con efectos visuales.
- Reproducirse con línea de contorno.
- Presentar un cambio de orientación.
- Utilizarse como textura.
- Incluirle una sombra distinta a la señalada.
- Reproducirse con variaciones en el grosor del trazo.
- Reproducirse con el envolvente en contorno.
- Reproducirse sin respetar el área delimitada en el envolvente.
- Utilizar transparencias en los elementos de los íconos.
- Reproducirse con los elementos incompletos o sin el total de los mismos.
Fondos no permitidos
A continuación se presenta una lista de diversos fondos sobre los cuales los íconos no deben ser aplicados:
- Fondos de colores distintos a los especificados.
- Fondos de color que presenten poco contraste.
- Fotografías con numerosos detalles.
- Imágenes texturizadas o con patrones complejos.
Aplicación
A continuación se muestra la forma correcta de aplicar los íconos:
Utilizarlos en un área que facilite la legibilidad del ícono, siempre fuera de la ventana de texto.
Los íconos pueden ubicarse dentro de los destacadosde información.
Al usarse sobre un fondo fotográfico, hacerlo en espacios con pocos elementos y evitar zonas fundamentales con el fin de no obstaculizar la comunicación y facilitar la legibilidad.
Los íconos con sombra es preferible usarlos sobre fondos claros para que sean legibles.
Otros íconos
Íconos para aplicaciones web
El siguiente set de íconos se creó para su uso dentro de una interfaz web. Por ello, no siguen las reglas generales de construcción para los iconos de SURA. En cambio, fueron construidos de tal manera que permitan una perfecta legiblidad e identificación dentro de formatos sumamente reducidos en aplicaciones web o móviles.
Descarga los archivos editables de los iconos de interfaz
Íconos de sostenibilidad
A continuación se muestran ejemplos de íconos de la librería creada para representar temas relacionados con la sostenibilidad dentro de tres categorías: económica, social y ambiental. Para visualizar la librería completa, haz click en el botón amarillo.
Descarga los archivos editables de los iconos de sostenibilidad
'