El Instituto Peruano de Evaluación, Acreditación y Certificación de la Calidad de la Educación Básica – IPEBA es el órgano operador del Sistema Nacional de Evaluación, Acreditación y Certificación de la Calidad Educativa - SINEACE encargado de definir los criterios, estándares e indicadores para garantizar, en las instituciones educativas de la Educación Básica y Técnico- Productiva, públicas y privadas, los niveles óptimos de calidad educativa, así como alentar las medidas requeridas para su mejoramiento. Esto nos obliga a establecer una constante comunicación en un afán de divulgar los diversos criterios de los análisis en materia de calidad educativa o puramente informativa, lo que resulta una gran cantidad de publicaciones tanto puntuales como periódicas emitidas desde las distintas áreas y subdirecciones de nuestro organismo. Hasta ahora no existían unos códigos propios y las únicas pautas que servían como marco de diseño – la imagen institucional del estado – se aplicaban de forma desigual. La finalidad de este manual es la de homogeneizar todas estas publicaciones dentro de un mismo estilo, identificable por el ciudadano, asumible por cualquier miembro de la organización e inscrito dentro de las normas básicas de la administración. Pretende ser una guía de diseño que ofrezca pautas claras y fáciles de interpretar por cualquiera que se enfrente a la realización de una publicación del organismo.
Códigos formales de diseño Los códigos básicos que hacen reconocible y aplicable una identidad gráfica dependen de la actuación sobretres apartados fundamentales:
• La estructura gráfica
sobre la que descansarán los elementos que conforman el diseño. • La tipografía elemento que da soporte a la información y que aporta personalidad a la identidad. • Los colores que ayudan a codificar y reforzar la identificación. La combinación y buen uso de estos elementos dan como resultado un universo gráfico reconocible y proyecta una imagen coherente del “ente emisor”. Esto ayuda a transmitir la comunicación de una forma más eficaz. La confianza que genera percibir una imagen sólida ayuda a que el receptor asimile mejor los mensajes proyectados.
1. La estructura gráfica Debido a la gran diversidad de publicaciones, nos encontraremos con la necesidad de utilizar distintos formatos. No obstante es conveniente unificarlos en unos tamaños estándar que favorecerán la identidad de la imagen.
1.1. Estructura gráfica de portadas La estructuctura base marca los lineamientos generales en todo diseño para la institución. Para ello se ha dispuesto tres grandes bloques geométricos que contendrán los elementos principales en toda publicacion: a. área de imágen o gráfica b. área de título c. área de logotipo
área de imagen
área de título
área de logotipo
Ejemplo final de una estructura de portada
Proporciรณn de la estructura Formatos habutuales File (23.5 X 33 cm) A4 (21 x 29.7 cm) A5 (21 x 14.85 cm)
La proporciรณn presentada se podrรก aplicar a cualquier formato de publicaciรณn siempre y cuando sea de orientaciรณn vertical.
< alto >
< ancho >
A = 1/10 de altura
1/8 A
A 1/8 A
A A 1/2A
La altura para el area de la imagen corresponde al resultado de la resta (Altura total) - (3A + 1/8 A + 1/8 A) recomendamos iniciar la estructura desde la base
Contracarรกtula
< alto >
< ancho >
A = 1/10 de altura
A
A
1/8 A
A
Detalle de la forma Las formas que definen las รกreas mantendrรกn un lado curvo tal como se aprecia en la siguente figura
1/3 B 1/3 B 1/3 B
B
Zona de imagen La zona de la imagen corresponde al area mas amplia del diseño, esta expondrá de manera conceptual una idea que sugiera el tema a tratar, pudiendo ser trabajada en cualquiera de los distintos estilos, fotográfico, gráfico o vectorial, 3d, etc.
Zona de Título La zona de la imagen corresponde al area intermedia del diseño, en ella se colocará el título correspondiente de la publicación utilizando la tipografía en las dimensiones que acontinuación detallamos.
Títulos: Myriad Bold Italic ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz !"§$%&/()=?*'<>|;²³~@`´©«»¤¼×{}
La proporción de la tipografía dependerá de la amplitud del título tratando de dejar areas libres a los contornos Del mismo modo se incorporará el ícono del logotipo IPEBA en el extemo derecho de la figura
Tipografía corporativa La tipografía es una herramienta fundamental en el diseño de las publicaciones. Su buen uso facilita la interpretación de la información transmitida en los distintos soportes publicados. Asímismo, la elección de la familia tipográfica es importante, pues ésta aporta a la identidad sus atributos particulares, los cuales tienen que estar en línea con los de la Organización.
Títulos: Castle T Bold (18 pt) ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz !"§$%&/()=?*'<>|;²³~@`´©«»¤¼×{} Cuerpo de Texto: Castle T Light (11 pt) ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz !"§$%&/()=?*'<>|;²³~@`´©«»¤¼×{} Texto Llamada: Castle T Bold (11 pt) ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz !"§$%&/()=?*'<>|;²³~@`´©«»¤¼×{} Texto Referencia cuadros e imágenes: Castle T Light (8 pt) ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz !"§$%&/()=?*'<>|;²³~@`´©«»¤¼×{}
Colores La linea de diseño en general es bastante clara en cuanto a estructura, de manera que el critero para la utilización de colores gira en torno de la amplia gama de tonalidades siempre y cuando estos mantengan un impacto de contraste, es decir, gamas de colores vivos y brillantes que contrasten con la imagen trabajada en la portada. Las áreas para la aplicación de colores se encuentran en la zona de título
Gama de Colores A continuaci贸n detallamos los c贸digos de colores combinables seg煤n contraste con la zona de imagen
C M Y K
0 100 100 0
C M Y K
0 0 100 0
C M Y K
100 0 0 0
C M Y K
0 100 0 0
C M Y K
20 0 100 0
C M Y K
30 100 0 0
C M Y K
0 45 100 0
C M Y K
60 0 100 0
C M Y K
100 50 0 0
C M Y K
75 0 30 0
C M Y K
0 90 100 0
C M Y K
30 75 0 0
C M Y K
60 0 50 0
C M Y K
50 20 0 0
C M Y K
75 0 75 0
C M Y K
0 100 70 0
C M Y K
0 0 70 0
C M Y K
0 0 100 25
DIAGRAMACIÓN
Reticula base Cuando nos enfrentamos a la composición de las páginas de una publicación, tenemos una serie de elementos que debemos distribuir de una forma equilibrada y estética. Una buena composición de estos elementos (textos, imágenes, gráficos…) hará más fácil su comprensión. El primer requisito indispensable para la administración de estos elementos es disponer de una estructura previa de la página o retícula base. Dada la heterogeneidad de las publicaciones que se pueden abordar recomendamos esta composición pues puede acoger distintos anchos de columna. No obstante el diseñador puede basarse en otra composición si ésta no es idónea para el contenido que se quiera plasmar. Mostramos ahora unas diagramaciones para los formatos más comunes.
MAQUETA PARA FORMATO A4
2 cm 4 cm
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec suscipit ultrices lorem non ullamcorper. Quisque ultricies varius erat, porttitor pretium neque ultricies eget. Suspendisse nunc lectus, ullamcorper ut fermentum a, euismod et neque. Mauris vitae turpis lectus. Donec et est aliquam tellus pellentesque sagittis quis quis risus. In hac habitasse platea dictumst. Nullam id mollis tellus. Cras fermentum mattis est id bibendum. Nullam sollicitudin molestie rhoncus. Duis et diam ac libero consectetur mattis. Donec convallis est sit amet odio mattis non hendrerit eros bibendum. Pellentesque tempor ullamcorper luctus. Suspendisse nec nunc mauris. Ut sed dolor sed odio lobortis euismod. sectetur adipiscing elit. Donec suscipit ultrices lorem non ullamcorper. Quisque ultricies varius erat, porttitor pretium neque ultricies eget. Suspendisse nunc lectus, ullamcorper ut fermentum a, euismod et neque. Mauris vitae turpis lectus. Donec et est aliquam tellus pellentesque sagittis quis quis risus. In hac habitasse platea dictumst. Nullam id mollis tellus. Cras fermentum mattis est id bibendum. Nullam sollicitudin molestie rhoncus. Duis et diam ac libero consectetur mattis. Donec convallis est sit amet odio mattis non hendrerit eros bibendum. Pellentesque tempor ullamcorper luctus. Suspendisse nec nunc mauris. Ut sed dolor sed odio lobortis euismod. sectetur adipiscing elit. Donec suscipit ultrices
lorem non ullamcorper. Quisque ultricies varius erat, porttitor pretium neque ultricies eget. Suspendisse nunc lectus, ullamcorper ut fermentum a, euismod et neque. Mauris vitae turpis lectus. Donec et est aliquam tellus pellentesque sagittis quis quis risus. In hac habitasse platea dictumst. Nullam id mollis tellus. Cras fermentum mattis est id bibendum. Nullam sollicitudin molestie rhoncus. Duis et diam ac libero consectetur mattis. Donec convallis est sit amet odio mattis non hendrerit eros bibendum. Pellentesque tempor ullamcorper luctus. Suspendisse nec nunc mauris. Ut sed dolor sed odio lobortis euismod. dictumst. Nullam id mollis tellus. Cras fermentum mattis est id bibendum. Nullam sollicitudin molestie rhoncus. Duis et diam ac libero consectetur mattis. Donec convallis est sit amet odio mattis non hendrerit eros bibendum. Pellentesque tempor ullamcorper luctus. Suspendisse nec nunc mauris. Ut sed dolor sed odio lobortis euismod. dictumst. Nullam id mollis tellus. Cras fermentum mattis est id bibendum. Nullam sollicitudin molestie rhoncus. Duis et diam ac libero consectetur mattis. Donec convallis est sit amet odio mattis non hendrerit eros bibendum. Pellentesque tempor ullamcorper luctus. Suspendisse nec nunc mauris. Ut sed dolor sed odio lobortis euismod. dictumst. Nullam id mollis tellus. Cras 1 cm fermentum mattis est id bibendum. Nullam sollicitudin molestie
ZONA DE TEXTO
2 cm
0.649 cm
6.2119 cm
6.2119 cm
4 cm
ZONA DE LLAMADA
TĂtulo Phasellus ac aliquam enim
MAQUETA PARA FORMATO A5 En este formato la maquetación está indicada a una columna ya que la columna resultante de la maquetación a dos es demasiado estrecha para la composición de textos.
Las imágenes y gráficos deben distribuirse de manera equilibrada. Han de evitar la monotonía del texto y pueden romper la retícula e incluso salir a sangre por los laterales. Hay que ser cuidadoso en la elección de los visuales y gráficos pues condicionan mucho la comprensión y el atractivo del resultado final
2 cm
1 cm
Las imágenes
2.5 cm
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec suscipit ultrices lorem non ullamcorper. Quisque ultricies varius e rat, p orttitor pretium neque ultricies eget. Suspendisse nunc l ectus, ullamcorper u t fermentum a , euismod e t neque. Mauris v itae t urpis lectus. D onec e t est aliquam tellus pellentesque sagittis q uis quis r isus. In hac habitasse p latea dictumst. Nullam id m ollis t ellus. Cras f ermentum m attis e st i d bibendum. Nullam sollicitudin molestie rhoncus. Duis et diam ac libero consectetur mattis. Donec c onvallis e st s it a met odio mattis non hendrerit eros b ibendum. Pellentesque t empor u llamcorper l uctus. Suspendisse nec nunc m auris. U t sed dolor sed odio lobortis euismod. sectetur adipiscing e lit. D onec suscipit ultrices l orem non u llamcorper. Q uisque u ltricies varius e rat, p orttitor pretium neque ultricies eget. Suspendisse nunc l ectus, u llamcorper u t fermentum a, euismod et neque. Mauris vitae turpis lectus. Donec e t est aliquam t ellus pellentesque sagittis quis risus. In hac habitasse platea dictumst. Nullam ndrerit eros bibendum. Pellentesque tempor ullamcorper luctus. Suspendisse nec nunc mauris. Ut sed dolor sed odio lobortis euismod. dictumst. Nullam id mollis tellus. Cras fermentum mattis est id bibendum. Nullam sollicitudin molestie rhoncus. Duis et diam ac libattis est id bibendum. Nullam sollicitudin molestie r honcus. D uis et d iam ac libero consectetur mattis. Donec convallis est sit amet odio mattis non hendrerit eros b ibendum. Pellentesque tempor ullamcorper luctus. Suspendisse nec nunc mauris. Ut sed dolor sed odio lobortis euismod.
ZONA DE LLAMADA
Título Phasellus ac aliquam enim
ZONA DE TEXTO
1 cm
9.228 cm
1 cm
COMPOSICIÓN Si bien el formato de la maqueta contempla 1 a 2 columnas no es necesaria que toda la edición mantenga la misma disposición y de acuerdo al diseño que se encuentre diagramando se podrá combinar 1, 2 o 3 columnas, manteniendo la armonía en la composición y permita una fácil lectura. A continuación unos ejemplos:
PAPELERIA BASICA
Papelería Básica • Hoja membretada A4 • Tarjeta de presentación • Sobre carta • Hoja membretada A4
Ministerio de Educación
3
0.7
1.5
6.32
SINEACE
1.6
2.373
Dirección Callenombre 123 Las Casas - San Borja / Teléfonos 123-1223 / 123-1223 / www.ipeba.org.pe / mailto@ipeba.org.pe 1
0.5
• Tarjeta de presentación (9 x 5,5 cm)
1.5
Nombre Apellido Paterno Inicial
CASTLE T (8 pt)
CASTLE T LIGH (7 pt)
Cargo
CASTLE T LIGHT (7 pt)
Dirección Callenombre 123 Las Casas - San Borja Teléfonos 123-1223 / 123-1223 www.ipeba.org.pe / mailto@ipeba.org.pe
• Sobre membretado
Ministerio de Educación
3
0.7
1.5
6.32
SINEACE
1.6
2.373
Dirección Callenombre 123 Las Casas - San Borja / Teléfonos 123-1223 / 123-1223 / www.ipeba.org.pe / mailto@ipeba.org.pe 1
OTRAS PIEZAS
Banner El banner de formato vertical tendrá una variación en la composición de la estructura que anteriormente hemos revisado. Esta variación responde a la visibilidad que esta debe tener dentro o fuera de un recinto, permitiendo distinguir con claridad el nombre de la institución. Del mismo modo el área de la gráfica podrá componerse por diferentes elementos siempre y cuando mantenga la famililaridad constructiva.
WEB SITE El WEBSITE Ipeba, es de caracter informativo, y es a través de este medio el manejo de la información asi como artículos a fines de la gestión institucional. La diagramación o distribución de los elementos que componen el web site, responde al critero de una rápida navegación, lo que permite al usuario encontrar con facilidad la infomacion requerida. El web site consta de la siguiente estructura: a. Cabecera (logotipo Ipeba) b. Área de acceso al usuario c. Banner princpal (zona animada de imagenes) d. Menú de busqueda c. Banner de artículos con scroll bar d. Zona de banners de auspiciadores
1 2
En linea | 2 invitados
Usuario
3
01
4
02
03
5
6
Contraseña
Recordarme
?
Formato del Web Site El web site mantendrรก una area de 800 pixeles de ancho por 800 pixeles de alto (el alto puede variar en caso se realicen adiciones al home site). El fondo de la pรกgina serรก: #333333 (codigo de color web)
Presentaicones Power point Ipeba deberá realizar sus exposiciones a través del manejo del presentador power point, el mismo que deberá estar ajustado al estilo gráfico ateriormente propuesto