Manual de identidad visual de Olvidos

Estilo general

La web de Olvidos recupera el concepto de la revista física que se publicó en Granada en los años ochenta. De esta manera, la identidad visual de la web intentará connotar diversos aspectos del medio impreso.

Realizamos una apuesta por una web fundamentada sobre todo en el texto. Limpia de imágenes exceptuando las estrictamente necesarias, sobre todo las relativas a determinados artículos y reportajes. De esta manera los elementos gráficos serán fundamentalmente tipográficos


Logotipo

El logotipo de la asociación Olvidos y, por extensión, de la revista online es el siguiente:

Apostamos por la sencillez, que se puede ver por la fuente elegida (Libre Franklin), simple, geométrica y sin serifas, lo que le da un aspecto de modernidad y el elemento gráfico del corchete, un signo de puntuación que nos retrotrae a los signos del alfabeto, o sea, a la escritura, base del concepto de la revista. El corchete se utiliza de la misma forma que los paréntesis, se utilizan para hacer incisos dentro de un texto. Por medio de estos incisos, el autor puede realizar acotaciones, aclarar y/o añadir más información.
De esta forma, el corchete nos connota una especie de parón del texto para ampliar o definir algún aspecto relevante.Esto es una buena metáfora de las intenciones de la revista, habilitar un espacio en donde se acote nueva información a acontecimientos culturales de todo tipo.


Colores

El color principal del logotipo y de la web es un rojo un poco desaturado. A partir del mismo creamos variaciones para su uso en distintos elementos:

RGB (sRGB): 255, 98, 97
Hexadecimal: #ff6261
CMYK (Coated FOGRA39): 0 74% 51% 0
PANTONE: 805C


RGB (sRGB): 255, 98, 97
Hexadecimal: #ff6261
CMYK (Coated FOGRA39): 0 74% 51% 0
PANTONE: 805C


RGB (sRGB): 255, 98, 97
Hexadecimal: #ff6261
CMYK (Coated FOGRA39): 0 74% 51% 0
PANTONE: 805C


En línea con lo indicado como concepto general de la identidad visual, en lo respectivo a connotar ciertos rasgos de la revista impresa, los elementos no indicados para presentarse en rojo utilizarán un tipo de azul oscuro para así crea un contraste cálido-frio con el rojo corporativo. Presentamos también sus variaciones destinadas a elementos secundarios, como los Meta, algunos Hover, etc, que se indicarán más adelante:

RGB (sRGB): 1, 53, 89
Hexadecimal: #013559
CMYK (Coated FOGRA39): 100% 77% 40%, 36%
PANTONE: 540C


RGB (sRGB): 161, 182, 196
Hexadecimal: #a1b6c4
CMYK (Coated FOGRA39): 68% 40% 34% 17%
PANTONE: 5405C


RGB (sRGB): 255, 98, 97
Hexadecimal: #ff6261
CMYK (Coated FOGRA39): 44% 18% 18% 1%
PANTONE: 550C



Fuentes

Libre Franklin.

Tipografía del logotipo. La utilizaremos en el cuerpo de la web, para los títulos y subtítulos, asimismo en los enlaces principales, con sus diversos estilos de grosor.

abcdefghyjklmnñopqrstuwyz 1234567890
ABCDEFGHYJKLMNÑOPKRSTUWYZ 1234567890

Crimson Text.

Texto del cuerpo y elementos secundarios.

abcdefghyjklmnñopqrstuwyz 1234567890
ABCDEFGHYJKLMNÑOPKRSTUWYZ 1234567890


Elementos gráficos

Botón Volver arriba.

Utilizamos el signo ortográfico acento circunflejo. Se ha elegido por su similitud con una flecha, para indicar así, la vuelta hacia el comienzo de una página. Naturalmente el estilo de la fuente para crear este símbolo es la fuente corporativa Libre Franklin.

Corchete

Utilizaremos el corchete que trae el logotipo para incorporarlo a algunos elementos dentro de la web y así destacarlos:

Enlaces a las categorías.

Entradillas y citas de párrafo:

Adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

Paréntesis

Siguiendo con la dinámica de los signos tipográficos, para mostrar las etiquetas de una entrada utilizamos estos: