Manual de Identidad Visual para AmexIHC: Asociación Mexicana para la Interacción Humano-Computadora

  • 141 views
Uploaded on

Manual de Identidad Visual para AmexIHC, la Asociación Mexicana para la Interacción Humano-Computadora

Manual de Identidad Visual para AmexIHC, la Asociación Mexicana para la Interacción Humano-Computadora

More in: Design
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
141
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
5
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Guía de estilo visual para manejo de marca
  • 2. El objetivo de AMexIHC es el de promover la investigación científica y el desarrollo tecnológico en Interacción Humano Computadora en la Republica Mexicana. Nuestro evento marco es el Congreso Mexicano de Interacción Humano Computadora (MexIHC), el cual se realiza de bi-anualmente en diferentes estados de la republica Mexicana. En el 2012, MexIHC se realizará en el Instituto Tecnológico Autónomo de México (ITAM) durante el mes de Octubre. AMexIHC se encuentra ligada al Grupo de Interés Especial en Interacción Humano Computadora (SIGCHI, por sus siglas en inglés) - Capítulo México – de la ACM y la Red Temática de CONACyT en Tecnologías de la Información y Comunicaciones.
  • 3. Planteamiento de la marca ¿Qué representa la marca o logotipo de la AMexIHC? Su diseño está inspirado en las siguientes ideas: * Imagina una motherboard. Visualiza cómo se van entrelazando los circuitos impresos como caminos de un planeta lejano. Imagina cómo sería si pudieras navegar dentro de un microchip. * ¿Qué pasa si tomas un cable de bus de datos o un clip y lo vas doblando? ¿De qué le darías forma? Estás creando. Además, en esta creación, encuentras un simbolismo de union y continuidad. * En lo frío del mundo tecnológico hay algo mucho más importante: el humano. La escritura fluida y con minúsculas es un buen referente. Si te imaginas planas y planas de texto, puedes percibir esa sensación de una persona dedicada que con esmero va escribiendo y dejando así su conocimiento.
  • 4. Esta versión la debes usar cuando “introduzcas” la AMexIHC ante personas que no sepan qué significan las siglas. Esto puede ser en el inicio del sitio web, tarjetas de presentación, hojas membretadas o cualquier otra aplicación que consideres formal. Marca completa
  • 5. En ocasiones donde la gente ya sabe qué significa AMexIHC, como por ejemplo en un congreso, usa preferentemente esta versión. Imagínala como una especie de “sello”, el cual puedes usar en uniformes, promocionales, impresos, etc. Marca simple
  • 6. b Observa que la composición de la marca maneja ciertos espacios en blanco. La separación entre la palabra AMexIHC y el nombre extendido depende de la altura denominada ‘a’ pero la separación entre los renglones de dicho nombre depende de la altura denominada ‘b’. Además, trata de respetar el margen señalado cuando coloques la marca completa en algún lugar. Lo anterior también aplica para la marca simple. Composición a a b a a
  • 7. Cuando necesites indicar áreas de interés específicos, como en los espacios asignados durante un congreso, puedes crear sub-marcas a partir de la composición de arriba. Claramente debes procurar que la sub-marca trate de tener el margen igual que la marca completa. Adecuaciones a a a/10 a a a Área temática a Visualización de Información Interfaces Multimodales Teoría de HCI Métodos de Diseño y Evaluación
  • 8. Colores Tono al 100% 80% 50% 30% Azul AMexIHC * El color de la palabra AMexIHC * Si solo dispones de una tinta, usa preferentemente este color y no el gris. * Si tienes que usar un color de fondo, usa preferentemente este color y al menos la palabra AMexIHC en completo blanco para lograr un contraste. C: 95 M: 65 Y: 45 K: 30 R: 13 G: 72 B: 93 Hex: #0D485D C: 50 M: 40 Y: 40 K: 20 R: 117 G: 120 B: 121 Hex: #757875 Gris AMexIHC * El color del nombre completo de la Asociación. * Si no puedes usar el color azul, el siguiente en la lista es este gris. * La barra de las sub-marcas es de este color. Puedes incluso, si el método de reproducción te lo permite, bajarle a un 50% al tono.
  • 9. Siempre utiliza estas versiones de preferencia. Si puedes imprimir a dos tintas, y el fondo es de color, pon el gris está a un 30%. Si fuera una tinta y el fondo es gris, pone el color del texto al 30% también.
  • 10. Si el método de reproducción te lo permite, coloca el color de la barra al 50%. Métodos de Diseño En otros casos, como en la serigrafía, tendriás que poner los dos tonos al 100%. Métodos de Diseño Si estás restringido a uno color, procura usar esta versión de azul AMexIHC sobre blanco. El equivalente sobre fondo azul es poner la barra con el azul AMexIHC al 30%. Lo mismo harías con el gris. Métodos de Diseño Si el fondo es gris y el método de reproducción te lo permite, puedes poner la barra en gris AMexIHC al 50%, mientras que el texto lo pones al 30%. Métodos de Diseño Métodos de Diseño Estas son las reglas para el manejo de color. Sin embargo, puedes romperlas mientras mantengas la consistencia y sabor de la marca.
  • 11. Como has observado en esta guía, los textos para la marca completa y las sub-marcas tienen el mismo tipo de letra. De hecho, toda esta guía maneja una familia tipográfica por lo que los rasgos de la letra son parecidos de una u otra forma. Entonces, lo más recomendable es que continúes con el manejo de esta familia tipográfica. Si cuidas este detalle, proyectarás una imagen seria para la Asociación. Fedra Sans Std Light ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !”#$%&/()@¨*{}^ Fedra Sans Std Book ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !”#$%&/()@¨*{}^` Fedra Sans Std Normal ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !”#$%&/()@¨*{}^` Fedra Sans Std Medium ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !”#$%&/()@¨*{}^` Fedra Sans Std Bold ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !”#$%&/()@¨*{}^` Fedra Sans Std Light Italic ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !”#$%&/()@¨*{}^ Fedra Sans Std Book Italic ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !”#$%&/()@¨*{}^` Fedra Sans Std Normal Italic ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !”#$%&/()@¨*{}^` Fedra Sans Std Medium Italic ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !”#$%&/()@¨*{}^` Fedra Sans Std Bold ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 !”#$%&/()@¨*{}^` Tipografía
  • 12. Para diseñar aplicaciones gráficas de la marca, puedes hacer encuadres de las curvas de la palabra AMexIHC y de ahí hacer cambios en el porcentaje de los colores oficiales, recortes fotográficos o aplicar texturas. Elementos decorativos
  • 13. Ejemplo de aplicación gráfica
  • 14. Asociación Mexicana de Interacción Humano-Computadora A.C.  2012. Todos los Derechos Reservados