Facultad de Ciencias Fsico Matemticas

Manual Grfico del Sitio Web

Manual Grfico del Sitio Web

Benemrita Universidad Autnoma de Puebla
Facultad de Ciencias Fsico Matemticas

El diseo de Logotipo, seleccin de colores y Fuente tipogrfica del sitio web de la Facultad de Ciencias
Fsico Matemticas de la Benemrita Universidad Autnoma de Puebla, fue realizada por el D.G. Jorge Miguel
Martnez Cano a cargo de el Lic. Vctor Manuel Vallejo Crdoba y la M.I. Mnica Macas Prez, por orden del
Dr. Arrazola Ramrez Jos Ramn Enrique y el Dr. Ernesto Pino Mota en el verano de 2014.

Director
Dr. Arrazola Ramrez Jos Ramn Enrique
arrazola@fcfm.buap.mx
Secretario Acadmico
Dr. Ernesto Pino Mota
secretaria.academica@fcfm.buap.mx
Responsables
Lic. Vctor Manuel Vallejo Crdoba
vvallejo@fcfm.buap.mx

M.I. Mnica Macas Prez

monica@fcfm.buap.mx

Diseador
D.G. Jorge Miguel Martnez Cano
www.migue.co
ldg.migue@gmail.com

ndice

Introduccin
Misin y Visin de la FCFM
Identidad de la FCFM
Identidad Grfica con aplicacin al sitio web
Estructura del logotipo
Logotipo con fondo
Usos de logotipo incorrectos
Colores del logotipo
Colores del sitio
Implementacin de colores en el sitio
Fuente tipogrfica

7
8
9
10
11
12
13
14
15
16
17

Manual Tcnico del Sitio Web

ndice de imgenes

Identidad Grfica con aplicacin al sitio web

10

Estructura del logotipo

11

Figura 001 Proceso de construccin de logotipo.

11

Figura 002 Estructura preliminar de logotipo.

11

Figura 003 Estructura final de logotipo.

11

Logotipo con fondo

12

Figura 004 Aplicaciones del logotipo sobre fondos de color.

12

Usos de logotipo incorrectos

13

Figura 005 Aplicaciones incorrectas del logotipo.

13

Colores del logotipo

14

Figura 006 Color primario A.

14

Figura 008 Logotipo con implementacin de color.

14

Figura 006 Color primario B.

14

Colores del sitio

15

Figura 009 Colores usados en el diseo del sitio con su valor hexadecimal.

15

Implementacin de colores en el sitio

16

Figura 010 Implementacin de colores en el diseo del sitio (Inicio).

16

Figura 011 Implementacin de colores en el diseo del sitio (Docencia).

16

Figura 012 Implementacin de colores en el diseo del sitio (Servicios).

16

Fuente tipogrfica

17

Figura 013 Caracteres de la fuente tipogrfica Open Sans.

17

Figura 014 Pesos tipogrficos de la fuente Open Sans.

17

Manual Tcnico del Sitio Web

Introduccin

Identidad Institucional

Se entiende por Identidad Corporativa a la representacin o imagen de una institucin, organizacin o

empresa, la cual abarca aspectos como: smbolo o logotipo, tipografas, colores, as como la misin, visin de
sta.
Por tal razn, el presente Manual Grfico del Sitio Web de la Facultad de Ciencias Fsico Matemticas
(FCFM), argumenta las necesidades grficas de la institucin y recopila los elementos grficos que construyen el sitio web de la FCFM; con el fin de guiar en la aplicacin adecuada de stos dentro del sitio,
mediante la descripcin e ilustraciones de los mismos.

Manual Tcnico del Sitio Web

Misin y Visin de la FCFM

Manual Tcnico del Sitio Web

Identidad de la FCFM

Misin

La FCFM est dedicada a la formacin de recursos humanos y a la investigacin de alta calidad y con alto
prestigio, con niveles bsicos de licenciatura y posgrado en fsica y en matemticas, bsicas y aplicadas, y en
reas interdisciplinarias. Sus estudiantes reciben una formacin integral y sus egresados tienen habilidades y
competencias para desarrollar con un alto nivel actividades de docencia, investigacin y desarrollo tecnolgico, as como procesos productivos, administrativos o de gestin. La formacin de estos profesionistas se
hace bajo los principios ticos y filosficos del humanismo crtico, de bsqueda de la verdad y del beneficio
de la humanidad y su entorno natural.

Visin

Constituimos una Facultad con programas educativos de licenciatura y posgrado acreditados, lder a nivel
nacional, con reconocimiento internacional. Contamos con una planta acadmica consolidada y una infraestructura adecuada y actualizada, dando como resultado la formacin de recursos humanos altamente capacitados y una alta produccin cientfica de nivel internacional en fsica, matemticas y reas interdisciplinarias.
Mantenemos vnculos en el entorno con los sectores social, productivo y de servicios.

Manual Tcnico del Sitio Web

Identidad Grfica con

aplicacin al sitio web
Manual Tcnico del Sitio Web

Estructura del logotipo

1)

4)

2)

5)

3)

6)

Figura 001 Proceso de construccin de logotipo.

Figura 002 Estructura preliminar de logotipo.

Figura 003 Estructura final de logotipo.

Manual Tcnico del Sitio Web

11

Para el diseo del logotipo se tomaron como base los conceptos

de las reas de la ciencia que en la FCFM se estudian. Por un lado, la
fsica como ciencia natural que estudia el comportamiento y propiedades de la energa y la materia, as como la interaccin que tienen en
tiempo y espacio; por otro lado las matemticas como la ciencia formal
que se rige por el razonamiento lgico, estudia las propiedades y relaciones entre entidades abstractas con nmeros, figuras geomtricas o
smbolos.
Es por ello que en combinacin de los conceptos antes mencionados se genera (ver figura 001) el diseo del logotipo para la FCFM,
tomando como base las siglas del nombre de la institucin y dando
como resultado una estructura que representa ambas academias y a su
vez a la institucin como un organismo solido y constituido, como se
muestra en la figura 003.

Logotipo con fondo

Manual Tcnico del Sitio Web

12

Es imprescindible que el uso del logotipo con fondos de color slo

sea como se presenta en la figura 004, para generar una consistencia
en la imagen de la marca.

Figura 004 Aplicaciones del logotipo sobre fondos de color.

Usos de logotipo incorrectos

Manual Tcnico del Sitio Web

13

En la figura 005 se muestran algunos posibles usos de manera

INCORRECTA en los que se pueda llegar a usar el logotipo, por lo
que se pide evitar las aplicaciones presentadas, u otras que puedan
afectar la composicin, proporcin, estructura o elementos del logotipo.

Figura 005 Aplicaciones incorrectas del logotipo.

Colores del logotipo

Manual Tcnico del Sitio Web

14

Los colores utilizados en el logotipo constituyen un componente

fundamental dentro de la identidad visual, por ello deben ser consistentes para reforzar los valores y la filosofa de la misma marca.
El color usado para el logotipo es el Aguamarina o Azul Verdoso
en dos tonalidades principales (ver figuras 006 y 007), ste al ser
un color formado en combinacin del azul y el verde se le atribuyen
caractersticas de ambos, por un lado el azul es asociado a la seriedad,
al carcter analtico, la honestidad, el conocimiento, la pureza, la salud y
tranquilidad, y por otro lado el verde que es asociado a el equilibrio, el
crecimiento, la renovacin, la estabilidad, la seguridad, la salud y el medio
ambiente y evoca la razn y la lgica.
La aplicacin de colores se ve reflejada en la figura 008.

Figura 006 Color primario A.

Figura 006 Color primario B.

Cuyos cdigos de color en Red, Green, Blue (RGB) color implementado para medios digitales y Cyan, Magenta, Yellow, Key (CMYK) que es
implementado para medios impresos, son los siguientes:
Color primario A
RGB
67, 227, 227
CMYK
63, 0, 25, 0
Hexadecimal
43E3E3
Color primario A
RGB
3, 135, 139
CMYK
86, 33, 49, 0
Hexadecimal
03878B

Figura 008 Logotipo con implementacin de color.

Colores del sitio

Manual Tcnico del Sitio Web

15

Los colores implementados en el diseo del sitio como se muestra

las figuras 010, 011, 012, son en base a los colores del logotipo de
la FCFM, en combinacin del azul marino cuyo color forma parte de
imagen institucional de la BUAP, as como una tonalidad de color gris
oscuro, gris claro y blanco, como se muestra en la figura 009.
Cuyos valores hexadecimal son los siguientes
Azul oscuro
#002d4a
Azul medio
#1c425b
Azul claro
#4e6c80
Aguamarina oscuro
#00abb7
Aguamarina medio
#43e3e3
Aguamarina claro
#7ecdcf
Gris oscuro
#b3c0c9
Gris claro
#edf3ff
Blanco
#ffffff

Figura 009 Colores usados en el diseo del sitio con su valor hexadecimal.

Implementacin de colores en el sitio

Manual Tcnico del Sitio Web

16

Figura 011 Implementacin de colores en el diseo del sitio (Docencia).

Figura 010 Implementacin de colores en el diseo del sitio (Inicio).

Figura 012 Implementacin de colores en el diseo del sitio (Servicios).

Fuente tipogrfica

Manual Tcnico del Sitio Web

17

La fuente tipogrfica seleccionada para la construccin del sitio es

Open Sans (ver figura 013), por sus excelentes caractersticas de legibilidad adems de estar optimizada para impresin, su uso en web, as
como para aplicaciones mviles, es una fuente de estilo humanista y
diseada por Steve Matteson para Google.
Los pesos de fuente aplicados en el sitio son (ver figura 014):
300 Light
600 Semi-Bold
800 Extra-Bold

La fuente cuenta con una licencia tipo Apache 2.0, y se encuentra
disponible en el servicio de Google fonts, lo cual hace su fcil obtencin
e implementacin dentro del sitio.
Figura 013 Caracteres de la fuente tipogrfica Open Sans.

Para hacer uso y saber ms acerca de la fuente Open Sans revisar el

siguiente enlace: https://www.google.com/fonts/specimen/Open+Sans

Figura 014 Pesos tipogrficos de la fuente Open Sans.

Facultad de Ciencias Fsico Matemticas