Primeros pasos hacia la comunicación visual

Julia Socorro

 

 

2

“La profesión es la espina dorsal de la vida”.
Nietzche.

Juliettaschool.com  
 

 

 

3

Juliettaschool.com  
 

 

 

Introducción

Módulo 1: Introducción a la comunicación visual y Adobe Illustrator
Unidad didáctica 1: El taller virtual de Adobe Illustrator
1.1.- Taller virtual
1.2.- Interfaz
1.3.- Creando un archivo nuevo
1.3.1.- Nuevo documento
1.3.2.- Perfil
1.3.3.- Área de recorte
1.3.4.- Medidas y unidades
1.3.5.- Modo de color: RGB
1.3.6.- Efectos de rasterizado (Pantalla 72 ppp)
1.3.6.1.- Efectos de rasterizado
1.3.6.2.- Pantalla 72 ppp
1.4.- Resumen
Módulo 1: Introducción a la comunicación visual y Adobe Adobe Illustrator
Unidad Didáctica 2: Aplicación práctica. Logotipos y marcas
2.1.- Logotipos y marcas
2.2.- Imagen corporativa
2.3.- Manual de Identidad Corporativa
2.4.- Rediseño de la Imagen Corporativa
2.5.- Resumen
Módulo 1: Introducción a la comunicación visual y Adobe Adobe Illustrator
Unidad Didáctica 3: Aplicación práctica. Packaging
3.1.- Packaging
3.2.- Packaging en 2D y en 3D
3.3.- Packaging y las normativas
3.4.- Resumen
Módulo 1: Introducción a la comunicación visual y Adobe Adobe Illustrator
Unidad didáctica 4.- Técnicas para el diseño del cartel
4.1.- El número Phi
4.2.- Las formas simples
4.3.- El entrenamiento de la mente y las formas simples
4.4.- Organizar la construcción del mensaje que se debe expresar
4.5.- Introducción al cartel
4.6.- Resumen
Módulo 2 – Introducción a la comunicación visual y Adobe Adobe Photoshop

Juliettaschool.com  
 

4

 

 

Unidad didáctica 1: El taller virtual de pintura y retoque fotográfico
1.1.- El taller virtual
1.2.- la interfaz
1.3.- Archivo Nuevo
1.3.1.- Perfil de color
1.3.2. El píxel
1.3.3.- Paleta de Canales de Photoshop
1.3.4.- Mapa de bit
1.3.5.- Píxekes para video
1.4.- Resumen
Módulo 2 – Introducción a la comunicación visual y Adobe Adobe Photoshop
Unidad didáctica 2: Aplicación práctica. La fotografía digital.
2.1.- El sensor
2.2.- La resolución: Lpi, dpi y ppi (siglas en inglés)
2.3.- Resolución y medidas para imprimir una fotografía digital
2.4.- Resumen
Módulo 2 – Introducción a la comunicación visual y Adobe Adobe Photoshop
Unidad didáctica 3: Ayer negro y hoy blanco
3.1.- Escala de grises
3.2.- Luz y sombra
3.3.- Luces y sombras en la evolución de la pintura
3.3.1.- Quattrocento
3.3.2.- El barroco
3.3.2.1.- El barroco y el tenebrismo de Caravaggio
3.3.2.2.- El barroco y el claroscuro de Rembrandt
3.3.2.3.- El impresionismo y Monet
3.4.- Introducción al análisis de la escala de grises y de la
composición del lienzo
3.5.- La pintura y la fotografía en un mano a mano con la publicidad
3.6.- Resumen
Módulo 3: Introducción a la comunicación visual y Adobe InDesing
Unidad didáctica 1: El taller virtual de maquetación
1.1.- Taller virtual
1.2.- La interfaz
1.3.- Nuevo documento
1.3.1.- Calidad
1.3.2.- Tamaño de página
1.3.3.- Márgenes
1.3.4.- Sangría
1.4.- Resumen

Juliettaschool.com  
 

5

 

 

Módulo 3: Introducción a la comunicación visual y Adobe InDesing
Unidad didáctica 2: Aplicación práctica. La novela
2.1.- Tipografía
2.2.- Legibilidad
2.3.- Facilidad de lectura
2.4.- Resumen
Módulo 3 – Introducción a la comunicación visual y Adobe InDesing
Unidad didáctica 3: Aplicación práctica. Ebook
3.1.- Ebooks
3.2.- InDesing y el Ebooks profesional
3.3.- Resumen

6

Juliettaschool.com  
 

 

 

Primeros pasos hacia la comunicación visual

7

[1]

[2]

[3]

[1] Toulose-Lautrec, (1881-1897). “Le Chat Noir”. El cartelista francés, destacó en la ilustración de la vida nocturna
parisiense del siglo XIX. Movimiento el Postimpresionimo.
[2] Robert Capa, 1948. “Pablo Picasso, Francoise Gilot y Javier Vitató, sobrino de Picasso. Golfe-Juan. Costa Azul.
Fotógrafo de guerra.
[3]J.Mallorquí, 1946. “Canciones de la abuelita” libro-juguete-musical.

Juliettaschool.com  
 

 

 

Introducción
La formación que va a recibir de este curso, titulado: “Primeros pasos hacia
la comunicación visual” le va a servir para iniciarse en el diseño y lo haremos
también aprendido tres herramientas: Adobe Illustrator, Adobe Photoshop y
Adobe InDesing.
La formación está basada en el aprendizaje de las nuevas tecnologías ya que copa
el mercado laboral emergente gracias a la globalización e internet.

Dirigido a los adultos que deseen rediseñar su currilum vitae basándose en las
necesidades de los negocios web. Las unidades didácticas están pensadas para los
jóvenes y los mayores que deseen tener presencia en internet.

Siempre vas a aprender a realizar un producto final para un cliente porque
el cliente de nuestro alumno es nuestro objetivo. Por lo tanto, la formación se
basa en el microuniverso necesario tanto en diseño y en comunicación visual
para desarrollar algo útil.
La formación es muy práctica. Nos inciamos leyendo, comprendiendo y a través de la
práctica asimilando el aprendizaje. Así es como te habilitarás en necesidades reales
de los negocios web. Nuestra formación es muy abierta y flexible. Eres tú el que
decide la calidad de tu enseñanza-aprendizaje.

Juliettaschool.com  
 

8

 

 

Este Sr. es Pierre Bézier, es el
creador de la curvas y superficies
Bézier. Las desarrolló durante su
etapa laboral de 1933 a 1975 como
ingeniero en Renault.

Pierre Bézier

Las curvas Bézier constan de puntos de anclas y de puntos de control.
Observamos los puntos de ancla (0,1,2).
Los puntos de ancla los creamos haciendo clic en la pantalla con la

Juliettaschool.com  
 

9

 

 

herramienta pluma. Los puntos de control se activan sobre cada uno de los
puntos de ancla, una vez terminada la curva, haciendo clic sobre ellos (0,1,2).
Los puntos de control nos muestran un segmento de control. Este permite
modificar la curva, subiendo o bajando dichos puntos de control.
En Illustrator vectorizamos gracias al motor matemático que posee el
software. La gran ventaja de trabajar con vectores es que estos son escalables.
Ser escalable en Illustrator permite no perder nitidez, por ej.: si hemos
vectorizado un Sol, al estar vectorizado lo dibujas una sola vez y lo usas en un
posters, en un cartel o en una pantalla de cine. No pierde nitidez la imagen
escalada de menor a mayor.

Juliettaschool.com  
 

10

 

 

FOTOGRAFÍA QUÍMICA:
La introducción a este taller virtual de retoque fotográfico y pintura la
haremos hablando de la fotografía química.

La cámara réflex tradicional ha sido un buen ejemplo de captador de
fotografía.

Juliettaschool.com  
 

11

 

 

La fotografía tradicional se almacena en un carrete. Dicho carrete tiene una
película donde quedan impresas las fotografías. Las películas son de tipo
negativo o de tipo diapositiva.
La sección de dicha película está formada por varias capas y es la capa
emulsión la que contiene unos granos llamados haluros de plata. Estos granos
son la unidad mínima de la fotografía química.

Almacena(

Carrete de fotografía química

Película con al fotografía impresa

La descodificación la realizaremos en el laboratorio.

Juliettaschool.com  
 

12

 

 

13

[4] “La fotografía paso a paso un curso completo”, Michael Langford.

La fotografía química es escalable.

[5] “Historia de la fotografía”, Beaumont Newhall

La fotografía química es escalable porque la película donde queda impresa

Juliettaschool.com  
 

 

 

la imagen permite dar una buena nitidez en formatos de menor a mayor
tamaño, sin perdida de calidad.

FOTOGRAFÍA DIGITAL:
La fotografía digital se capta desde varios aparatos tecnológicos: como son
la tablet, el smartphone, el ordenadores o la cámara fotográfica compacta.

14

La fotografía digital se almacena en tarjetas y discos duros.

Juliettaschool.com  
 

 

 

La fotografía digital, tiene como producto final un archivo informático. Es en
el archivo donde la fotografía digital queda impresa. Lo informático es
electrónico, se alimenta de electricidad y se emplea un lenguaje máquina
conformado por códigos binarios, ósea: 0,1,0,1,0,1. Es este lenguaje binario el
que descodifica la fotografía digital.

Descodifica*

Lenguaje binario!
0 1 0 1 0

Los datos de color se almacenan en este lenguaje en forma de píxel. ¿Qué
entendemos por píxel?
Las cámaras fotográficas digitales y los ordenadores contienen la Matriz de
Bayer, que son sensores que reciben y emiten luz de forma ordenada
mediante filtros.

En las pantallas hay unos focos de luz que sumándose nos proporcionan
colores.

Juliettaschool.com  
 

15

 

 

El ordenador interpreta esta cadena y nos traduce una imagen en
cuadraditos y, estos cuadraditos llamados píxeles son la unidad mínima de la
fotografía digital.

[6] Apple II

La desventaja del píxel es que se necesita más cantidad de píxel cuanto
mayor nitidez se requiere.
Los romanos usaban la técnica de la suma de cuadritos para obtener una
imagen. Si la suma de cuadraditos permite al ojo humano unir las partes y
tener la percepción visual de conjunto, el píxel iba a ser la adaptación de esta
técnica romana, al mundo informático.

Juliettaschool.com  
 

16

 

 

[7] Mosaicos romanos

¿Qué vamos a aprender en el taller virtual de Photoshop en próximos cursos?
Analizaremos varios movimientos artísticos, fotográficos y de pintura. Luego,
aplicaremos las técnicas aprendidas al taller virtual de retoque fotográfico y
de pintura. Finalmente estudiaremos su aprovechamiento en publicidad o
internet.
Un ejemplo sería el de Andy Warhol un personaje, que se suma al
nacimiento de la técnica del Pop Art junto con otros artistas que enaltecieron
el mismo. Lo que haremos será estudiar este cambio social y cultural que se
ha posicionado. Investigaremos la técnica del pop-art, la aplicaremos al taller
de Photoshop y analizaremos el posicionamiento de la marca a través de la
buena comunicación visual, desarrollando un mensaje publicitario en un
tiempo y contexto. Previa investigación de impacto que buscará la marca.
En todo momento aprenderemos a utilizar los tratamientos fotográficos para
aprovechar los mismos en publicidad o internet para los productos que han de
competir en el mercado y para la marca de las empresas emprendedoras.

Juliettaschool.com  
 

17

 

 

18

[8] http://www.warhol.org
(debajo de la fotografía de Andy Warhol) Marilyn Monroe, serie serigrafiado en varios colores por Andy Warhol.
(A la izquierda de Andy Warhol) Ray Ban, campaña publicitaria de gafas. Serie con variedad de modelos y colores.
Fotógrafo: Tomas Ruch. Imágenes creadas por Sebastian Onufszak y Sakke Sioni. Las modelos fueron pintadas.

Juliettaschool.com  
 

 

 

Maquetar. ¿Qué es maquetar?
Nos iniciaremos en el concepto
de
“maquetar” con la siguiente idea: ordenador imágenes y textos en un espacio
(papel).
19

[9] II futuro della Città: slow o fast? La città su misura, Rossella Bertolazzi

[10] http://www.stern.de/

Juliettaschool.com  
 

 

 

20

Juliettaschool.com  
 

 

 

Objetivo General:
Introducir al alumno en la enseñanza de la comunicación visual y los talleres
virtuales para producir dichos diseños.
Desarrollar los primeros pasos hacia la comunicación visual y acercarnos al
entorno de los talleres virtuales.
Emprender con el alumno una visión general del sencillo aprendizaje de la
comunicación visual y su aprovechamiento de la comunicación visual,
buscando el posicionamiento de la marca creada o a crear.
21

Juliettaschool.com  
 

 

 

Módulo 1: Introducción a la comunicación visual y Adobe Illustrator
Unidad didáctica 1: El taller virtual de Adobe Illustrator


Enseñar al alumno la interfaz del taller virtual y sus barras de
herramientas
Dotar al alumno del conocimiento necesario para iniciarse en el taller
virtual de Illustrator
Mostrar la idea de construcción de pensamiento con la que otro ser
humano, nos ha convertido las herramientas físicas de antaño, a un
nuevo entorno virtual

Somos grafistas desde la infancia.

Título: Elefante comiendo arándonos

22

Autor: Darío

Edad: 3 años y nueve meses

Juliettaschool.com  
 

 

 

“Todos poseemos un talento, todos tenemos la
capacidad de ser creativos; y la mayoría vivimos sin
saberlo, convencidos muchas veces de que el creativo
es aquel que sabe componer melodías, o escribir una
poesía.”
Estas son las palabras de Ken Robinson en su libro
titulado: “El Elemento”.
Ken Robinson
1.1.- Taller virtual
El taller de diseño, es el espacio donde se terminan de preparar las ideas
que luego reproduciremos en la imprenta tradicional, en la imprenta digital o
las exportaremos directamente a internet.
23

El taller virtual de Adobe Illustrator es el entorno de trabajo. Antaño
quedaron las tareas que se desarrollaban de inicio a fin, con materiales físicos
y en mesas de dibujo.

Juliettaschool.com  
 

 

 

24

[1] La casera, años 1960 – 1970

Hoy en la pantalla del ordenador encontramos los iconos que nos permitirán
realizar las tareas físicas de ayer. Ayer trabajábamos con nuestras manos
directamente y hoy lo hacemos a través de prótesis como son el ratón o el
teclado. Accedemos a los iconos de cada barra de herramienta que contiene:
silueta de tijera, círculo en sustitución del compás, pluma, lápiz, colores,
formatos de papel, etc.
En la pantalla del ordenador al encenderlo, tenemos lo que conoce como el
escritorio:
Cuando cliqueamos sobre el icono de un taller virtual como puede ser Adobe
Illustrator y realizamos la apertura del programa informático, accedemos al
entorno de trabajo.
¿Por qué llamar al software un taller virtual? En los talleres reales, se
construyen las ideas a partir del uso de herramientas con nuestras manos. En
un taller real nosotros introduciríamos los dedos en los ojos de la tijera y
cortaríamos el papel. La acción sería real.

Juliettaschool.com  
 

 

 

25

Bien, en este caso son talleres virtuales, porque desde una prótesis como es
el ratón, el lápiz óptico o el teclado accedemos a la misma herramienta
virtual, a la tijera y también cortamos.
Aparentemente la tarea es más mental que física. Sin embargo, el trabajo se
va a reproducir en un medio físico como pueda ser la imprenta y si el trabajo
se reprodujera en un entorno como es internet, nos va a transmitir la
sensación y el sentimiento de un papel cortado.

Juliettaschool.com  
 

 

 

En conclusión, el concepto de “taller virtual” sería la oficina para muchos
profesionales. El taller virtual es mucho más económico, rentable y ecológico.
Cuando abrimos el programa informático, abrimos la puerta al taller y queda
el escritorio del sistema operativo en un plano posterior, mientras se expande
la interfaz del taller virtual en la pantalla.
1.2.- Interfaz

26

La interfaz es el escritorio de trabajo de cada taller virtual. Sin embargo, es
interfaz y no escritorio.
¿Por qué? Denominamos interfaz a la ventana que nos muestra las
herramientas y el espacio de trabajo para ilustrar. Entre otras características
destacamos que tiene las barras de herramientas y que en él realizamos
tareas para obtener un producto final. Mientras que en el escritorio estamos
de paso. El escritorio es la estación de tren que nos presta un servicio, nos
lleva y nos trae a internet. El escritorio nos permite cambiar del taller virtual
de Photoshop al taller virtual de InDesing y es por ello un intercambiador de
líneas de trabajo.
El escritorio puede definirse como un intercambiador de líneas de trabajo.
Mientras que la interfaz es el taller de trabajo.

Juliettaschool.com  
 

 

 

Luego, una interfaz nos da la oportunidad, de poder producir un bien y un
escritorio nos presta un servicio.

27

¿Qué tenemos que aprender de la interfaz?
Las rutas.
En todo taller virtual es necesario ubicarse. Siempre hay que saber dónde se
guardan las herramientas. El cómo usarlas vendrá después. Tenemos que
aprender los nombres de las barras, ya que conocer sus nombres, nos facilita
la ruta a los iconos. Recordemos que los iconos contienen la tijera, el
rectángulo, el círculo, el pincel, las medidas, los pantone, etc.
Es el ejemplo del costurero de mamá cuando nos propone en medio una
conversación y un buchito(1) buscarle algo:
-

¿Dónde está? – preguntas tú
Vete a la repisa que lo puse allí – contesta ella, que sabe la ruta del
icono de las tijeras
No lo veo – respondes

En tu mente la luz, con la que ella ilumina el saber de la ruta, tu no la
tienes aprendida. Te esfuerzas en encontrar el icono de las tijeras, pero
quien domina el costurero es mamá.
-

Sí, mira más abajo – indica mamá con su voz lejana desde otra habitación.

Tu eres perseverante. Sigues buscando, no lo ves, pues tu abajo no es el

Juliettaschool.com  
 

 

 

abajo de ella
-

Te prometo que no lo veo – respondes y ella se levanta y os ayudáis

28

[2] Mujer cosiendo, William McGregor Paxton.
(1) Buchito: La expresión es “Buchito de café” o la expresión mínima “Buchito”. Se conoce como “Buchito” al
acto de tomar café en taza pequeña y, normalmente se usa cuando construyes este momento en compañía de familia
o amistades en el hogar canario. Ej.: Nos estamos tomando un buchito. Sería como decir: Nos estamos tomando un
cafecito.

Nos suele pasar muchísimo algo similar con las rutas de los iconos en los
talleres virtuales. Por suerte siempre hay personas en nuestro entorno de
trabajo que encuentra la ruta donde están todos los iconos guardados y nos
facilitan las tareas.
Es necesario aprender los nombres de las barras de herramientas y sus
ubicaciones porque aprovecharemos y rentabilizaremos el tiempo.
En casi todas las ocasiones para realizar una práctica, habrá que indicar una
ruta y hemos de empezar con el nombre de la barra. Incluso, interactuaremos
de una barra a otra para aplicar paso a paso alguna técnica.
1.3.- Creando un archivo nuevo
Cuando abramos por primera vez el taller virtual para acceder a Adobe
Illustrator, en el menú “Archivo” hemos de cliquear en “Nuevo...” y se nos
abrirá un menú flotante:

Juliettaschool.com  
 

 

 

29

En el menú flotante se nos ofrecerán varias posibilidades según la tarea que
vayamos a realizar. Lo que vamos a aprender es: “qué es qué” teóricamente
primero y esto lo iremos entrelazando con las prácticas en el taller virtual.
En este menú flotante vamos abordar el aprendizaje de las casillas: Perfil,
Área de recorte y Avanzado.
1.3.1.- Nuevo documento.
El título escogido para este menú flotante es: “Nuevo documento”. Lo
podrá leer en la parte superior del menú, en el área que está en gris claro.
Abrimos Illustrator cuando ya tenemos clara la tarea sobre papel. Escoger
en este menú, implica haber esbozado la idea, trabajar e investigar mucho y
saber cual es nuestro producto final. Con el tiempo tendremos una plantilla
diseñada para cada producto final específico.
Introducirnos en el taller virtual implica conocer la tecnología y las
herramientas. Es por ello que tenemos que explicar la parte teórica y luego
hacer el clic.

Juliettaschool.com  
 

 

 

1.3.2.- Perfil
¿Cuál es el perfil del documento?

30

Si cliquemos en el triángulo blanco que está a la derecha de perfil se nos
abre una cortinilla que nos ofrece varios perfiles, valga la redundancia.
Tenemos el perfil: Imprimir, Web, Dispositivos, Video y película, RGB básico,
Flash Builder, Explorar… y en la parte superior [A medida], este nos interesa
mucho.
El taller virtual nos trae consigo una serie de perfiles. No partimos de cero
plantilla. Nosotros podemos cliquear en imprimir y nos aparecerán medidas
estandarizadas, efectos de rasterizados, modo de color, mesas de trabajo. El
conjunto de todas estas características suma lo que define un perfil.
Antes de ir al taller virtual tenemos que saber si vamos a realizar un
documento Web o un documento para imprimir.
Nosotros en este curso de introducción vamos a escoger el perfil Web.

Juliettaschool.com  
 

 

 

Si escojo el perfil Web en la cortinilla de “Área de recorte” se nos muestran
varias posibilidades.
Si no quiero ninguna de las medida que me ofrece el perfil, por ej.: 960x560
píxeles. Modificamos e imputamos nuestras medidas personalizadas sobre
estas. Teclearemos en las casillas de “Anchura” y “Altura” unidades decidas
por nosotros y que no sean las estándar. Observaremos que en la casilla Perfil
se nos activará [A medida].

31

Continuamos con la teoría y en la parte práctica tendremos nuestro
momento para recordar cada una de estos epígrafes. Ahora vamos a
introducirnos en la pestaña de área de recorte.
1.3.3.- Área de recorte.
El área de recorte nos muestra la variedad de posibilidades estandarizadas
de escritorios para web al desplegar la cortinilla. Cliqueamos en el triángulo
blanco con punto de flecha hacía abajo y al cliquear en él, se despliega una
cortinilla que nos mostrará las medidas estandarizadas de la Web.
“El área de recorte” dependerá siempre del “Nuevo perfil del documento”.
Los formatos web estandarizados los presentamos de forma visual:

Juliettaschool.com  
 

 

 

32

Las plantillas “Web” se definen en lenguaje universal en las unidades de
píxeles.

Juliettaschool.com  
 

 

 

1.3.4.- Medidas y unidades
El siguiente paso después del “Área de recorte” es la “Anchura” y
“Altura”. Ej.: si en el “Área de recorte” escogemos: 960 x 560 veremos en las
casillas: “Anchura: 960 px” y “Altura: 560 px” ¿Qué es “px”? La “px” es la
abreviatura de “píxeles”.

33

Práctica 1: Crear un banner con Illustrator para Facebook.
Solicite los archivos de las prácticas:
https://juliettaschool.com
1.3.5.- Modo de color: RGB
Analizamos ahora la pestaña: Avanzado. Hay que desplegar la cortilla.
El modo de color RGB es el utilizado en pantallas. Lo forman tres luces con
colores primarios: rojo, verde y azul. RGB del inglés: Red, Green, Blue.

Juliettaschool.com  
 

 

 

Vemos este video: http://www.youtube.com/watch?v=HdttkxRI-Yw

RGB es un sistema aditivo y se denomina tricromía. Es un sistema aditivo
porque genera colores secundarios:

34

1.- La mezcla de dos colores al superponerse no da un nuevo color:
1.1.- Rojo + Verde = Amarillo
1.2.- Rojo + Azul = Magenta
1.3.- Azul + Verde = Cyan
2.- La mezcla de los tres colores colores primarios RGB, superpuestos nos
ofrece el blanco.

Juliettaschool.com  
 

 

 

Vamos a dejar unas preguntas lanzadas al aire y, cuando hagamos la
práctica podremos comprobar la respuesta a:
255, 0, 0
0, 255, 0
0, 0, 255

¿Rojo?
¿Verde?
¿Azul?

Sí sabemos que cuanto más rojo, cuanto más verde y cuanto más azul se
agregue, más se parecerá el blanco a un blanco más puro.
¿Y el negro? Cada uno de los tres colores se percibe en negro sin intensidad
de luz. Los colores se perciben por la intensidad de la luz, si no hay luz, hay
oscuridad. Por otra parte, distintas intensidades de luz producen los matices
de los colores.
La intensidad de la luz es una variable de la iluminación. En lenguaje
máquina tenemos un parámetro que define el blanco y otro parámetro que
define el negro.
0
255

Negro
Blanco

RGB es el modo de color de las pantallas en general. Aquí incluimos entre
otros aparatos tecnológicos la pantalla de TV, la pantalla del ordenador, la
pantalla del móvil, la tablet, la cámara de video, y la cámara fotográfica.

Juliettaschool.com  
 

35

 

 

36

RGB asigna un valor de intensidad a cada píxel que oscile entre 0 y 255.
Las limitaciones técnicas con las que se diseñan los ordenadores fundamentan
dichos códigos.
Los microchips actuales no se pueden desarrollar para usar más de dos
Estados, como la electricidad, que tiene dos estados: encendido y apagado.
Todo se basa en la posición de apagado y encendido. Si apagas la luz es 0, si
enciendes la luz es 1. Los microchips se basan en microinterruptores y por lo
tanto en estos dos estados.
Práctica 2: Crear tres colores.
Solicite los archivos de las prácticas:
https://juliettaschool.com

Juliettaschool.com  
 

 

 

1.3.6.- Efectos de rasterizado (Pantalla 72 ppp)

37

1.3.6.1.- Efectos de rasterizado
El concepto “rasterizado” es igual a decir “mapa de bits” o “puntos”.
Los mapa de bits se refieren a imágenes creadas por píxeles y no por
vectores.

Mapa de bits

Vectores

Juliettaschool.com  
 

 

 

En Illustrator puedes vectorizar y también puedes realizar efectos de
rasterizados. Los efectos de rasterizados convierten el círculo vectorial en
mapa de bits, en píxeles. Un ejemplo de efecto de rasterizado es el efecto
lápiz.

38

Efecto de lápiz

Círculo vectorizado

El primer círculo ha sido creado como vector, le hemos aplicado el efecto de
lápiz y ahora vemos el trazo del círculo con un efecto rasterizado. Observe el
círculo grisáceo sobre el negro con las líneas difuminadas. Ahora ya no
tenemos una fórmula matemática, sino píxeles.
El segundo círculo es un vector sin efecto rasterizado y sigue siendo un dato
vectorial, una fórmula matemática.
Cuando empezamos a trabajar en Illustrator combinamos ambas
posibilidades. Evitar el error de efectos de rasterizados conlleva prever la
calidad de efectos de rasterizados en este menú. Cierto es que podemos
modificarlo a posteriori en el menú efectos y quizás acomodarse a esto, nos
puede llevar al olvido bajo la presión de multitud de tareas. Es por ello que el
consejo es aportar este dato al empezar el proyecto. Quiero decir que al
empezar el proyecto tenemos que saber si los efectos de rasterizados serán a
72ppp o 300ppp y de ello dependerá la calidad de los píxeles al aplicar un
efecto como ha sido el de lápiz.

Juliettaschool.com  
 

 

 

1.3.6.2.- Pantalla 72 ppp
Resolución es un concepto muy extendido e interpretado muchas veces de
forma incorrecta. Cuando usamos el vocablo resolución, tal vez tendríamos
que decir concentración, porque en realidad nos referimos a la densidad de
píxel.

39

Cuando hablamos de concentración de píxeles, nos referimos a que en una
misma superficie puedan haber más o menos píxeles. Viendo estas dos
imágenes que miden los mismo de ancho que de largo, observe que hay más
cuadritos en una que en otra. Luego, en el primer cuadro hay menos
concentración de píxeles que el segundo. Al hablar de resolución de píxeles
nos referimos a la cantidad de cuadritos que hay en una misma dimensión de
alto por ancho.
El concepto resolución se refiere a la precisión del detalle en las imágenes
de mapa de bits. Si hay más cuadraditos hay más precisión del detalle.
Práctica 3: rasterizar una imagen.
Solicite los archivos de las prácticas:
https://juliettaschool.com

Juliettaschool.com  
 

 

 

1.4.- Resumen
. Somos grafistas desde la infancia. Todos tenemos la capacidad de ser
creativos.
. El taller virtual es el entorno de trabajo.
. El escritorio funciona como una estación, es un espacio donde realizamos
intercambios. El escritorio nos presta un servicio.
. La interfaz de un taller virtual nos permite producir un bien, un producto
final.
. Un menú flotante lo podemos mover por toda la interfaz cliqueando sobre
el área donde está su nombre, en Illustrator, en la zona gris clara, en la parte
superior del menú hace clic, mantenemos presionado el botón y movemos el
ratón. A la vez se moverá el menú flotante.
. Un menú fijo no se puede mover de su sitio predeterminado.
. Perfil del documento: son las características del documento. Indicamos las
medidas, las unidades, los modos de color, si es para imprimir, si espera
película o para web, etc.
. Plantillas: Adobe Illustrator nos trae unas plantillas de cada perfil con unas
medidas estándar para que podamos iniciar tareas desde ellas. También
podemos modificar estas plantillas y adaptarlas a nuevas necesidades de
diseño.
. Modo de color RGB: RGB (Red, Green, Blue) Rojo, verde, azul. RGB es el
modo de color de las pantallas en general. El 0 es el negro y el 255 es el
blanco.
. Efectos de rasterizado: Los efectos de rasterizado generan píxeles en vez de
datos vectoriales. Estos efectos afectarán a la resolución final de la
ilustración. Cuanto más alto sea el valor, más calidad tendrán.
. Rasterizado es igual a mapa de bits. Antes de comenzar a trabajar con
efectos en Illustrator hay que revisar la cantidad de píxeles por pulgada que
hemos configurado al inicio en los efectos de rasterizado.
. No deberíamos usar el término resolución y si el término concentración,
pues cuando hablamos de resolución en realidad nos referimos a la densidad
de píxel, ósea, a la concentración de píxel en un área.

Juliettaschool.com  
 

40

 

 

Módulo 1: Introducción a la comunicación visual y Adobe Illustrator
Unidad Didáctica 2: Aplicación práctica. Logotipos y marcas
. Conocer las tipologías de logos y el concepto marca.
. Dotar al alumno para reconocer las tipologías de logos
. Capacitar al alumno para reconocer variedad de usos de imagen y texto,
según el diseño escogido, para representar la marca.

41

Juliettaschool.com  
 

 

 

2.1.- Logotipos y marcas
Resulta bastante probable que los conceptos: “Logotipos y marcas” evoquen
en su mente imágenes como estas. Obsérvelas y luego pase a la página
siguiente.

42

Juliettaschool.com  
 

 

 

Dentro de todas las marcas y logotipos existe un esquema que agrupa a cada
diseño, según tipos:
Logotipo
Tipografía sin icono. La versión de
diseño gráfico establece el nombre
de la marca. Asociamos el nombre
con
una
identificación
visual
diseñada.
Imagotipo
Texto e imagen están separados. La
suma de la imagen refuerza al
logotipo. El texto se pone a un lado.
El texto se pone abajo.

Isotipo
Reconocimiento de la marca sin
necesidad de texto. Es igual ver el
logotipo que ver el isotipo, ambos te
llevan a reconocer la marca. El texto
puede funcionar sólo y la imagen
puede funcionar sola.
Isologo
Logotipo + Isotipo están fundidos en
un solo elemento. No se puede
concebir de forma indivisible. El
texto y la imagen han sido diseñados
para funcionar en unión.
La marca identifica un producto, servicio o institución a través de signos y
valores. Se usan tipografías, imágenes y se conceden derechos exclusivos para

Juliettaschool.com  
 

43

 

 

la explotación de dicha marca. La marca nos trae a la memoria la idea de

empresa.
En la web de Nestle podemos observar todos los productos que tiene Nestle
y, cada nombre de producto también tiene su marca. Ej.: Kit-Kat como marca.
La marca tiene su diseño.

La marca como producto: Nestle helados.

Os proponga visitar la web: de Nestle
Visualicemos estas tres marcas.

Cada persona tendrá una percepción individual por la suma de muchos
parámetros que se valoran. Estos valores que son transmitidos por la marca y
que el público capta, posicionará la marca en el mercado.
Estas tres marcas de leche están muy bien vistas por el consumidor en
nuestro mercado. Sus valores, sus señas de identidad llegan a ser los
suficientemente apetecibles como para las que grandes masas de
consumidores compren estos productos. No vemos la vaca, ni el pasto, ni
olemos la leche recién ordeñada. Es más, todo es leche pasteurizada. Lo que
se vende hoy son signos y valores que están reflejados en la marca. ¿Cómo se
venden estos signos y valores? A través del diseño y la creación de una imagen
de la empresa y sus productos. Así como los audiovisuales y las campañas

Juliettaschool.com  
 

44

 

 

publicitarias.
Cuando diseñamos, creamos identidad.
Hoy todas estas marcas tienen suficientes “me gusta” como para ser
empresas loables y vivir del ordeño de la vaca.
El ordeño de la vaca es una tarea propia de la vida ganadera. La leche es un
producto natural. Lo que se ha construido es un mensaje visual que de
confianza al consumidor para que desde el estante de un supermercado usted
le de valor a esa vida ganadera. Si la imagen de la empresa está bien diseñada.
El consumidor se afianzará a esa marca y lo fidelizará. En los supermercados
no hay vacas, hay diseño. ¿Usted quiere conseguir sus “me gusta”?
Práctica 1: Identificación de logotipos, imagotipos, isotipos e isologos. .
Solicite los archivos de las prácticas:
https://juliettaschool.com

Analizar cada diseño y ordenarlos según sean: logotipos, imagotipos, isotipos
o isologos. No nos vamos a buscar otra información visual. Sabemos que Nike
es algo más que el isotipo. Sin embargo, trabajamos sobre estas imágenes.
Recuerde que estamos realizando un curso de introducción a la comunicación
visual y con este pack de marcas que tenemos aquí, vamos a tener un buen
aprendizaje. (En la siguiente página está la autocorrección, intente realizar la
tarea leyendo de la página 4 hacia atrás y, luego pase a la autocorrección).

Juliettaschool.com  
 

45

 

 

46

Logotipos

Imagotipos

Isotipos

Isologos

Autocorrección:
Logotipos: Tipografía sin icono. La versión de diseño gráfico establece el
nombre de la marca. Asociamos el nombre con una identificación visual
diseñada.
¿Qué tipografías tenemos sin icono?
PayPal y Binter Canarias, seguro. Estas dos son respuestas acertadas.

Juliettaschool.com  
 

 

 

FedEx lleva implícito entre la E y la x una flecha blanca, forma parte del
diseño de la propia tipografía. Sin embargo una flecha, es un símbolo. ¿Cómo
lo interpretamos? ¿Tipografía sin icono? o ¿cómo tipografía con icono que no
están separados?

La primera vez que miramos este logotipo leemos un texto: “FedEx” y
observe que es un logotipo. Al ver la flecha blanca introducida entre la E y la
x ya estamos viendo un isotipo. Al ser blanco sobre blanco tendemos a
observarlo como diseño tipográfico y por tanto sería un logotipo. Si la flecha
fuera de color azul o roja esta distinción de color sobre el resto del blanco
confirmaría que es un isotipo. Pero la flecha es tan blanca como el espacio en
blanco del resto de las palabras.
Podemos decir que es una excelente tipografía diseñada para un logotipo
concreto. El diseñador es Mr.Lindon Leader confirmó que vio un atisbo de
flecha entre la:

Ex
Él vio la posibilidad de una flecha. La flecha como símbolo promueve los
conceptos de velocidad y precisión. Así que decidió incrustar la flecha.
El diseñador tomó las mejores características de las tipografías Univers 67
(Bold) y Bold Futura y combinó una nueva forma de letra. Creó una nueva
tipografía con un poder oculto (la flecha).
Si lo que prevalece es el creación de una nueva tipografía, es un logotipo
excelente.
Por otra parte si lo que prevalece es la flecha ¿Podría ser un isologo?
Sabemos que la flecha surge de forma intencionada y es un símbolo
reconocible que comunica como hemos apuntado anteriormente: velocidad y

Juliettaschool.com  
 

47

 

 

precisión. También sabemos que la flecha es blanca y que vuelve a
confirmar una vez más el diseño de una tipografía. Muchos expertos han
teorizado respecto a la maravilla del diseño de este logotipo.
Imagotipo: Texto e imagen están separados. La suma de la imagen refuerza
al logotipo. Ambos se pueden utilizar por separados.
En este grupo tenemos a: Tropical, Filmin, Bic, Adidas, Cicar, Pepecar.com,
MSNBC (NBC News) y American Airlines.

48

Isologo: Logotipo + Isotipo están
fundidos en un solo elemento. No se
puede
concebir de forma indivisible. El texto
y
la
imagen han sido diseñados para funcionar en unión. ¿Cuántos no se pueden
concebir de forma indivisible?

Juliettaschool.com  
 

 

 

49

Munchitos si usa por separado el texto y la cara sonriente. Así que debemos

Juliettaschool.com  
 

 

 

afirmar que no es un isologo, sino un imagotipo.
Pringles y Playmovil están en la misma situación que la anterior. No son
isologos sino imagotipos.
Isotipo: Reconocimiento de la marca sin necesidad de texto. Es igual ver el
logotipo que ver el isotipo. Ambos nos transportan a la marca. El texto puede
funcionar sólo y la imagen puede funcionar sola.

La M es Macdonal y que el trazo es Nike. Son por ello isotipos.
Logotipos, Imagotipos, Isologos e Isotipos forma parte de la estrategia del
diseño de la marca y del plan de marketing para esa empresa. No sólo hay que
diseñar sino por ejemplo: prever si queremos que en un momento dado del
crecimiento y la expansión de la empresa, el isotipo funcione solo como el
trazo de Nike. Esto ahorra costos en la pintura de vehículos, por ejemplo.
Si usted tiene pensado lanzar una línea de negocio. Habrá de reflexionar
cómo quiere ir introduciendo su marca. Los expertos le ayudarán.
Realmente tener un profesional con experiencia pensando para usted es una
inversión que recoge sus frutos. Si no, que se lo digan a estas marcas
expuestas.
Esta unidad didáctica pretende alcanzar a un público con intención de
formarse y reflexionar. En internet encontrarás loables diseñadores, agencias
y profesionales si quieres diseñar tu marca. En Formación ic te asesoramos,
guiamos y formamos.

Juliettaschool.com  
 

50

 

 

51

Personaje: Pepito Grillo.
Cuento infantil titulado: Pinocho
Autor: Carlo Collodi
Llevada al cine por Walt Disney con el título: “Las aventuras de Pinocho”

2.2.- Imagen corporativa

“Alicia en el País de las Maravillas”, película de Tim Burton.

Habrán muchas variables creativas a partir del libro: “Las aventuras de

Juliettaschool.com  
 

 

 

Alicia en el País de las Maravillas” del autor Charles Lutwidge Dodgson. Sin
embargo, Tim Burton es reconocible por sus cinéfilos con un código único del
director de cine.

52
 
Galatea en las esferas, 1952 y La persistencia de la memoria, 1931

Es muy probable que usted ya haya reconocido estas pinturas y a su pintor.
Le diré que son pinturas del genio Salvador Dalí, el un GRANDE en la técnica
del surrealismo.
Estos dos ejemplos nos lleva a explicarles el concepto: “estilo”.
Una de las mayores fuerzas de la imagen corporativa está en el estilo.
La imagen corporativa hace referencia a la percepción que tenemos de una
marca. Si la marca o el producto se afianza en la mente del consumidor,
hemos logrado que la imagen corporativa funcione.
Los fans del arquitecto Gaudí distinguen con poca didáctica una obra entre
él y Le Corbusier, por el estilo de cada uno. También porque cada uno ha
logrado que nuestro sentir se mueva de forma distinta. ¿Sentimos algo al ver
estos diseños? Quizás nos estremecería más verlos in situ.

Juliettaschool.com  
 

 

 

“La Casa Batlló”, Gaudí.

“La ville Savoye”, Le Corbusier

Web para visitar “La Casa Batlló”, Barcelona. http://www.casabatllo.es/
Web para visitar “La Ville Savoye”, Francia. http://villa-savoye.monuments-nationaux.fr/

El concepto: “estilo”, lo trasladamos al: “Manual de Identidad Corporativa”
El estilo lo evocará la marca siguiendo el protocolo del Manual de Identidad
Corporativa. Se fidelizará a un grupo de personas que admirarán la marca. Si
el trabajo de diseño es bueno, la empresa podrá obtener tantos clientes como
Tim Burton.
Tim Burton encontró su estilo y vive de sus películas.
Barcelona apoya su economía en la fama de Gaudí y su herencia
arquitectónica.
La Fundación Le Corbusier es un proyecto Francés a nivel mundial.
Le propongo que reflexione sobre este concepto: “estilo”.
2.3.- Manual de Identidad Corporativa
Visitemos este sitio web y su manual de identidad corporativa. Lean con una
mirada la idea visual que hay incorporada en este manual:

Juliettaschool.com  
 

53

 

 

Web http://www.unizar.es/sg/doc/3.manual_once_.pdf
Si usted ya ha recorrido visualmente este manual habrá podido observar
cómo se potencia la imagen corporativa en uniformes, logos, papelería, etc.
Sepa que unos de los objetivos de la marca es que se fije la misma en la
mente y que se memorice a largo plazo. ¡Se cuida todo detalle! El diseño
tiene que estar en todo elemento físico y virtual que interviene en la empresa.
La pregunta es: ¿Por qué unas marcas tienen éxito y otras fracasan? La
respuesta es: “El Manual de Identidad Corporativa”. Antes de poner en
marcha una línea de negocio recuerde: “Vísteme despacio que tengo prisa”.
Los competidores que se posicionan logrando la personalidad de la empresa
son recordados y admirados.
El Manual de identidad corporativa es el libro que recoge todos los datos de
diseño de la imagen corporativa de la empresa ya sean pantone, pruebas de
CMYK, diseño Web, etc. Todo el protocolo de diseño de la imagen de la marca
está en este manual.
Si una edificación tiene que tener un libro del edificio y unos planos. Sepa
usted que una marca, tiene que tener un manual de identidad corporativa que
la fortalezca.
Una empresa sin manual de identidad corporativa es como un edificio sin
planos. Las grandes firmas lo saben y es por ello que son las “grandes”. Un
buen diseño, en una época en la que se consumen signos y valores, se hace
tan necesario como el aire para respirar.
RECUERDE: Los grandes no eran nadie su día cero. Eran “Ninguno”.
http://pequelia.es/24756/historias-de-ninguno-de-pilar-mateos/
Si las grandes marcas están hoy en Top-Ten es porque reflexionaron,
investigaron y colaboraron.
Actualmente se nos bombardea con: “Empieza hoy mismo”, “Emprende”. Sí,
cree en ti y se tu propio jefe. Es más, hazlo reflexionando, aprendiendo y
busca colaboraciones sociales con otros emprendedores. Quiero decir que si tu

Juliettaschool.com  
 

54

 

 

eres programador web y quieres emprender busca tus colaboradores y
realiza trueque mercantil con diseñadores, social media.
Tomate con paciencia tu aprendizaje y afiánzalo bien. Si eres un no iniciado
en Formación ic te ofrecemos atención personalizada para que reconstruyas
tu nuevo perfil laboral. Progresa.
2.4.- Rediseño de la Imagen Corporativa
Se han preestablecido algunas pautas por las cuales una empresa tiene que
plantearse realizar una modificación de su imagen corporativa son:
55

NACE LA EMPRESA:

FUSIÓN:
Cuando exista una fusión como ha sido la fusión de los bancos y cajas. Sirva
el ejemplo de Bankia. Este es la imagen corporativa rediseñada.

Y estas son las instituciones que se fusionaron.

Juliettaschool.com  
 

 

 

56

MODERNIZACIÓN:
Es el caso de Mac que se moderniza en el año 1998

POSICIONAMIENTO:
Otras empresas ofrecen productos y servicios parecidos.

Juliettaschool.com  
 

 

 

CAMBIO DE DUEÑO:
Fadesa Inmobiliaria se vende y se rediseña la marca a: Martinsa Fadesa.

HAY NUEVOS PRODUCTOS:

57

Moviestar empieza a ofrecer algo más que la línea fija telefónica que había
establecido en España desde 1924, ya que sus productos hoy también son
telefonía móvil, internet y televisión por cable.

UN

INTEGRAR
IMPACO:

FedEx es una empresa de correo
aéreo y fue fundada con el nombre de
Federal Express en 1971 en EEUU. En 1994 toma la abreviación FedEx y realiza
un cambio en el diseño de imagen corporativa. Realizan así un impulso a la
cultura de su imagen llamando la atención sobre sus ventajas competitivas.

Juliettaschool.com  
 

 

 

PRODUCTOS SON MÁS FAMOSOS QUE LA EMPRESA:
¿ La marca a la sombra del producto ?
La marca no puede ser sombra de un producto.
Expongo un ejemplo: La marca Kraft y su producto estrella: “el queso
Philadelphia”. Existe Philadelphia y se potencia Philadelphia como marca.
Kraft es su marca consolidada. Aunque a veces nos de la impresión de que
Kraft tiene menos valor para nosotros, os cuento una anécdota:
“Estando un paisano de viaje quiso comprar café para traerlo de regalo a su
familia. En los estantes del supermercado todo le resultaba raro, distinto.
Cogió en sus manos el primer paquete de café que le llamó la atención. El
paisano seguía desconfiando. No entendía muy bien el idioma de aquel país.
Miraba las caras raras de aquellos seres humanos que compartían pasillo. Él no
se reconocía en aquel contexto. Quería comprar, mas no se encontraba en su
elemento.
Giró el paquete de café dándose una última oportunidad y ¿qué vio?
“KRAFT”. Leyó la marca detrás y esta marca la enlazó con el queso
Philadelphia y recordó cómo le encantan las cremas de verdura de su hogar
con este queso. ¿Qué pasó? Surgió la confianza, la sonrisa y se realizó la
compra.”

En este caso “PHILADELPHIA” y “KRAFT” sacan provecho de su vida en
común. La marca KRAF como empresa y la marca “PHILADELPHIA” como
producto, conviven culturalmente en la mente de la persona. Ante este caso
particular podemos decir que hubo un refuerzo de la marca KRAFT está muy

Juliettaschool.com  
 

58

 

 

bien diseñada sobre la palabra Philadelphia y la mente la retiene siempre.
Si la marca es sombra del producto hay que plantearse el rediseño de la
marca.
Práctica 2: Responda viendo el Manual de Identidad Corporativa de la
Universidad de Zaragoza.

1.- ¿Se habla de la historia de la institución?
2.- ¿Se sitúan en el manual los Pantone?
3.- ¿Se han diseñado fondos de escritorio?
La autocorrección está en la siguiente página.

Juliettaschool.com  
 

59

 

 

Autocorreción:
1.- ¿Se habla de la historia de la institución? Sí, se inicia en la página 13
2.- ¿Se sitúan en el manual los Pantone? Sí, podemos ver un ejemplo en la
página 40
3.- ¿Se han diseñado fondos de escritorio? Sí, en la página 91 podemos verlo

60

Juliettaschool.com  
 

 

 

2.5.- Resumen
. Logotipo: tipografía sin icono.
. Imagotipo: texto e imagen están por separados y pueden funcionar por
separado aunque la suma de las dos refuerza la imagen.
. Isotipo: icono sin texto
. Logotipo + Isotipo: están fundidos en un solo elemento. No se puede
concebir de forma indivisible.
. La marca identifica un producto, servicio o institución a través de signos y
valores. Se usan tipografías, imágenes y se conceden derechos exclusivos para
la explotación de dicha marca.
. Una de las mayores fuerzas de la imagen corporativa está en el estilo.
. La imagen corporativa se refiere a la percepción que tenemos de una
marca. Si la marca o el producto se afianza en la mente del consumidor,
hemos logrado que la imagen corporativa funcione.
. El Manual de identidad corporativa es el libro que recoge todos los datos
de diseño de la imagen corporativa de la empresa ya sean pantone, pruebas
de CMYK, diseño Web, etc. Todo el protocolo de diseño de la imagen de la
institución está en este manual y con este manual la empresa a la que se le ha
prestado el servicio de diseño debe ser independiente.

Juliettaschool.com  
 

61

 

 

Módulo 1: Introducción a la comunicación visual y Adobe Illustrator
Unidad Didáctica 3: Aplicación práctica. Packaging.
. Enseñar al alumno que es el Packaging
. Realizar con el alumno una introducción práctica al packaging y a la
identificación de las caras para su diseño.
. Mostrar al alumno cómo, con tan poco, se puede construir un modelo de
negocio donde se puedan conseguir los famosos “me gusta” suficientes como
para ser empresa en un mercado que no es tan “vorágine”, sino que está
esperando de nosotros lo que ya sabemos hacer.
62

Juliettaschool.com  
 

 

 

3.1- Packaging
El Packaging es algo más que el embalaje de un producto pues habla de la
imagen corporativa de la institución.
Dividimos en tres partes el Packaging y tenemos:
. El packaging terciario: las cajas, la paletización, los portes…

63

                                                                 

 

 

. El packaging secundario: son los envoltorios de un grupo de productos. Son
los paquetes que se organizan en las estanterías.

Juliettaschool.com  
 

 

 

. El packaging primario: es el envase y embalaje del producto.

                                                                                               

 
64

El huevo, la cáscara del huevo, es un buen packaging primario que ha sabido
conservar con perfección su contenido y además ha permitido realizar un buen
transporte del contenido.

                                                       

             

 

 
 

 

 

 

 
El packaging secundario fue durante mucho tiempo la cesta de mimbre y
posteriormente se diseño el cartón de huevos. El huevo, al ser un alimento natural
tiene su fecha preferente y no tiene etiqueta nutricional.

Juliettaschool.com  
 

 

 

 

                                 

 

 
65

 

El Packaging protege el alimento durante su distribución y conserva los
alimentos.
Desde un punto de vista del marketing, una de las metas del packaging es
conseguir que cuando el producto esté en los estantes del supermercado, el
comprador lo coja en la mano. La buena comunicación visual hará que ante
una gran variedad de productos la persona desee adquirir su producto o el de
la competencia.
Allí, en los estantes, todos compiten y la única boca que habla y cuenta una
historia es el diseño.

               

             

 

Juliettaschool.com  
 

 

 

 

Vayamos a leer este artículo:
http://www.clubdarwin.net/seccion/packaging/conocer-la-trayectoria-delos-ojos-sobre-la-etiqueta-clave-para-hacerlas-mas-efica
3.2.- Packaging en 2D y en 3D
El diseño del Packaging lo haremos en 2D y en 3D

66

 

 

 
 
 

En 2D iremos diseñando cada una de las caras. Construiremos el mensaje del
contenido atiendo a su cara frontal y en 3D haremos maquetas con cartulinas
o similar para estudiar el montaje del diseño en 3D. También realizaremos el
3D en un taller virtual apropiado para la buena presentación publicitaria.
Ambas simulaciones tanto la física como la virtual, definirán la fabricación
final del envase y del embalaje. Todo ello aderezado con una buena
comunicación visual.
 

3.3.- Packaging y las normativas
Finalmente el Packaging se recicla. Lo recicla el consumidor. Existen
normativas europeas para regular los materiales y los espesores de los
materiales. Las tintas, las medidas, etc., y no basta con comunicar
visualmente sino que a la hora de enfrentarnos a la fabricación del packaging
tendremos que tener en cuenta estas normativas.

Juliettaschool.com  
 

 

 

Práctica 1: Vea este video:
http://www.youtube.com/watch?v=sVx94LoIZ5U
Visitar la página web:
http://selfpackaging.es/es/
La empresa SelfPackaging.es es el resultado de un consolidado proyecto
situado en Barcelona. Es una empresa loable y con un excelente potencial que
nos sirve para introducirnos en el mundo del packaging.
¿Qué elementos creativos han destacado en el video publicitario que a usted
le hayan gustado? ¿Han conseguido que el packaging sea sencillo para su
publico?
Práctica 2: Práctica en Illustrator. Hay que imprimir en la impresora
doméstica. Hace falta papel para imprimir y una tijera.
Solicite los archivos de las prácticas:
https://juliettaschool.com

Juliettaschool.com  
 

67

 

 

3.4.- Resumen
. El Packaging se divide en tres partes:
. El packaging terciario: son cajas, la paletización, los portes…
. El packaging secundario: son los envoltorios de un grupo de productos.
Son los paquetes que se organizan y las estanterías.

. El packaging primario: es el envase y embalaje del producto.
. El Packaging protege el alimento durante su distribución y conserva los
alimentos.
. Desde un punto de vista del marketing la meta del packaging es conseguir
que cuando el producto esté en los estantes del supermercado, el comprador
lo coja en la mano.
. El packaging lo recicla el consumidor. Existen normativas europeas que
tendremos que tener en cuenta.

Juliettaschool.com  
 

68

 

 

Módulo 1: Introducción a la comunicación visual y Adobe Illustrator.
Unidad didáctica 4.- Técnicas para el diseño del cartel.
. Introducir al alumno en el concepto de composición
. Realizar con el alumno un primer análisis de los mensajes de información
del cartel publicitario para una actuación de ballet
. Capacitar al alumno con una variedad de valores que le ayudarán a
iniciarse en la composición de un buen diseño de cartel

69

Julies Chéret

y

Toulouse-Lautrec

Juliettaschool.com  
 

 

 

4.1.- El número Phi

70

El halcón ante una necesidad innata, la de alimentarse, realiza este giro en
su vuelo porque así consigue tener en todo momento en el punto de mira el
elemento orgánico que le dará sosiego. El halcón peregrino realiza un vuelo
que se acerca a la espiral. Esta trayectoria describe el número phi. El número
phi es igual a: 1,61803398874…
Galileo dijo: “El libro de la naturaleza está escrito con caracteres
matemáticos”
Nosotros en la vida cotidiana siempre estamos observando formas
geométricas. La flor es un ejemplo de orden geométrico. El ciclo de
crecimiento de las hojas sigue la secuencia de Fibonacci y aunque varían
según cada planta, responde a este número.
En la secuencia de Fibonacci se suma: 0 + 1 = 1, luego sumamos 1 + 1 = 2 y
así sucesivamente hasta el infinito.

Juliettaschool.com  
 

 

 

0+1+1+2+3+5+8+13+21… infinito
El crecimiento de las plantas que gira en busca del Sol muestra el número de
Fibonacci.

71

Girasol

Tuno

“La cosa más bella que podemos experimentar es lo misterioso. Es la emoción
fundamental que hallamos en la cuna del auténtico arte y la ciencia.” Einsten.
Asombro absoluto fue lo que sintió Einsten cuando descubrió lo que ofrecía la
Proporción Áurea. Cuando hablamos de la proporción áurea o de la divina
proporción, estamos en el número de Fibonacci.
4.2.- Las formas simples
La mente busca las formas simples. Si ves una montaña o un árbol intentas
contonearla visualmente en un triángulo.
Un nene a la edad de 2 años y 10 meses estaba con su padre de compras
navideñas en un centro comercial. Su padre le dijo:
-

Mira nene el árbol de navidad – El nene le respondió
No papi, es un cono – el padre construyó en su mente un enorme silencio
en medio todo el bullicio.

¿Es un cono? o ¿Un árbol de navidad? ¿Para qué entrenamos nuestra mente?

Juliettaschool.com  
 

 

 

¿Qué información aprendida nos da nuestra mente?
4.3.- El entrenamiento de la mente y las formas simples
Entrenamiento
Fórmula
Geometría

Elemento
A = pi x r2

Diseño
72

Gases

El entrenamiento que tenemos a lo largo de nuestra programación
enseñanza-aprendizaje es una reflexión que abordamos ante la anécdota de
este nene y su padre. El niño tomó la decisión de decir que era un cono y su
padre tomó la decisión de decir que había visto un árbol de navidad. La buena
comunicación visual tiene que presumir a su publico y también la forma de
pensar de su público, para lograr acertar de forma universal cuando dibuja
textos e imágenes.
Construyamos juntos una nueva reflexión: el Sol tendrá para cada mente un
valor más importante que para otros. Hemos puesto algunos ejemplos en los
cuadros de las posibles respuestas. Estamos seguros de que afloraran más.
Si usted puede y lo desea realice la siguiente práctica: solicítele a otro ser
que le defina con un dibujo, con texto o simplemente con números el
concepto Sol y pídaselo a varias amistades abriendo el abanico a la diversidad.

Juliettaschool.com  
 

 

 

4.4.- Organizar la construcción del mensaje que se debe expresar
Es una necesidad de la especie humana la organización y la presentación de
sus ideas y sentimientos.
A la hora de diseñar un cartel habremos de adquirir unos conocimientos
previos respecto al microuniverso que gira alrededor del diseño del cartel,
desde su primera idea inconsciente hasta su impresión final.

73

Tenemos que aprender estética y ética. ¿Cuáles son las limitaciones de las
máquinas de impresión del cartel? ¿Qué tamaños de papel estándar tenemos
en el mercado de la imprenta? Conoceremos las tipografías y la cuatricromía
(CMYK). Gestionaremos la psicología del color, la imagen y organizaremos
palabras e imágenes en el espacio de papel.

Juliettaschool.com  
 

 

 

Todos estos conceptos iniciales tendrán que ir de menos a más, mientras
evolucionamos, para conseguir establecer las premisas de un buen diseño de

cartel.
4.5.- Introducción al cartel
En cualquier diseño que realicemos estamos siempre proporcionando
medidas para ordenar imágenes y textos. No caen al azar como si fuera un
efecto aleatorio en el papel.
El mensaje visual se construye por ejemplo: para un publico de una edad y
de unos gustos. El publico percibe la vida según su forma de pensar. El cartel
ha de manifestar en el diseño, la intención de la comunicación visual.
Observemos este cartel. El Estudio Social Desing creó este cartel para la obra
de ballet londinense de Romeo y Julieta.

Juliettaschool.com  
 

74

 

 

75

Juliettaschool.com  
 

 

 

76

El cartel está formado por una primera imagen fotográfica y por lo tanto es
una imagen rasterizada. Sobre dicha imagen se sitúan el resto de los
elementos que necesitamos para expresar el mensaje del ballet y, también
para comunicar cómo llegar a ver este evento.
La fotografía se trabajaría en Photoshop. El cartel en sí en Illustrator.
Práctica 1: Vamos a tomar nota de los mensajes tipográficos. Realizamos
la tarea juntos.
Solicite los archivos de las prácticas:
https://juliettaschool.com

Juliettaschool.com  
 

 

 

77

1.- En la parte superior tenemos el nombre del compañía de ballet.
2.- A la derecha el título de la obra de ballet.
3.- A la izquierda y en rojo, un mensaje de la obra de ballet.
4.- Parte inferior:

Juliettaschool.com  
 

 

 

4.1.- El director del ballet
4.2.- Fechas de representación
4.3.- Nos ofrecen otro mensaje donde nos citan a tres grandes directos en
fechas determinadas.
4.4.- El nombre del teatro
4.5.- Una mensaje sobre el teatro
4.6.- Oficina de ticket y su número para adquirir las entradas
4.7.- Página web del teatro
78
El cartel de esta obra de teatro manda el mensaje del ballet e informa a nivel de
nuestra capacidad tecnológica. Tener teléfonos y una web ayuda a captar al cliente
del instante. El cartel se imprime porque tiene una función a pie de calle.

Juliettaschool.com  
 

 

 

4.6.- Resumen
. El número Phi está representado en la naturaleza con caracteres
matemáticos. Nos lo encontramos constantemente en la espiral que surge en
la naturaleza en busca del Sol.
. Las formas simples definen elementos de la naturaleza. La mente humana
siempre busca encajar todo en formas sencillas como puede ser el círculo, el
cono, etc.
. Existe un microuniverso alrededor del diseño del cartel el cual tenemos
que aprender. Entre estos parámetros está: la estética, la ética, las
limitaciones de las máquinas, los tamaños estándar de papel, la tipografía, el
blanco y negro, los colores, la imagen y la gestión de espacio y papel.
. El cartel que se imprime para estar a pie de calle, tiene que facilitar la
información acorde con la tecnología y así poder captar al cliente del instante.

Juliettaschool.com  
 

79

 

 

Módulo 2: Introducción a la comunicación visual y Adobe Photoshop.
Unidad didáctica 1: El taller virtual de pintura y retoque fotográfico.


Enseñar al alumno la interfaz del taller virtual y las barras de
herramientas
Dotar al alumno de los primeros conocimientos de los modos de color
Mostrar al alumno los inicios entre la cámara fotográfica y Photoshop

80

Recordamos: Las cámaras fotográficas Polaroid de los años ochenta que
realizaban el revelado de forma automática, introdujeron a muchas personas
en este arte. Hoy, este formato de marco, resulta muy atractivo en
comunicación visual.

La gran cantante Alaska.

Juliettaschool.com  
 

 

 

1.1.- El taller virtual
Photoshop contiene un taller de retoque fotográfico y un taller de pintura.

81

El liderazgo de Photoshop hoy en día es indiscutible ya que es el más popular
taller de retoque fotográfico.

Juliettaschool.com  
 

 

 

1.2.- la interfaz
Interfaz de Photoshop.

82

1.3.- Archivo Nuevo
Al crear un archivo nuevo se nos abre este menú flotante.

Juliettaschool.com  
 

 

 

Vamos a desmenuzar este menú poco a poco:

1.3.1.- Perfil de color

Adobe RGB (1998)
Todo dispositivo de captación de imágenes tiene un capacidad distinta para
reproducir el color. Adobe RGB (1998) es un perfil que proporciona una gama
de colores grande y equilibrada y puede ser reutilizada para la reproducción
en una variedad de dispositivos.
Si queremos iniciarnos en la gestión de color habrá que empezar por conocer
los perfiles de color.
Adobe RGB (1998) y sRGB son los dos perfiles que vamos a abordar en este
curso introductorio:
Los modos de color los hemos de ajustar en la cámara fotográfica.
Normalmente estando en (M, A, S o P) vamos al menú de la cámara y
buscamos la opción: Optimizar imagen/Personalizar/ IIIa Modo de color. Esto
es el caso de Nikon reflex gama semiprofesional y en el resto de cámaras
tendría que ser similar la ruta. No obstante en el manual de la cámara en el
apartado de “tamaño y calidad de la imagen” ya tendréis que encontrar la
información para acceder a estos pasos en la cámara fotográfica.
Adobe RGB es aconsajeble si el destino de las fotografías es imprimirlas,
pues las tintas CMYK reproducen bien este modo de color. Mientras que para
imprimir sRGB suspende. A esto añado que a nivel de usuario las impresoras
de sobremesa están ajustadas casi a sRGB. Los laboratorios saben que las
fotografías les llega en sRGB. Si se usted llevara su fotografía a un laboratorio
general, en Adobe RGB y no se informa que están en Adobe RGB, al tener

Juliettaschool.com  
 

83

 

 

ellos sRGB, lo más probable es que los colores no se impriman bien.
Adobe RGB es un formato que usan los laboratorios profesionales de forma
asidua y no los laboratorios generales. Pregunte e informese.
Por otra parte, están los monitores, que trabajan en su gran mayoría en
sRGB y sRGB se usa para publicar en la Web. Hay navegadores que sí
interprentan Adobe RGB pero otros sólo sRGB. Si el objeto de la fotografía es
internet, sRGB es buena decisión.
Lo que nos interesa si disparamos con la cámara fotográfica en sRGB o en
Adobe RGB, es la siguiente respuesta a esta pregunta: ¿Hacia qué espacio de
salida va dirigida la fotografía?
Supongamos que nos interesa imprimir la fotografía en un laboratorio con
calidad para una exposición, para un producto final publicitario. Si tenemos
un encargo para un cartel de cine y otros trabajos que nos hacen necesario
trabajar en cuatricomía a nivel profesional o semiprofesional. Usted debe
fotografiar en Adobe RGB.
Si usted aún no tiene cámara fotográfica y tiene intenciones serias de cara a
un futuro compruebe que puede cambiar de un formato Adobe RGB a otro
formato sRGB en su cámara fotográfica antes de realizar la inversión.
No estamos hablando del formato RAW, este formato no tiene espacio de
color creado.
En todo caso la riqueza de color está en el formato Adobe RGB. Si hablamos
de formato JPEG, con formato Adobe RGB.
Si no sabemos bien el destino de la fotografía, Adobe RGB tiene una mayor
cantidad de información. Estaría bien usar siempre este modo (Adobe RGB) y
una conversión de Adobe RGB a sRGB siempre será más real. (Al hablar de
conversión, hablamos de que los píxeles Adobe RGB se calculen con algoritmos
y pasen a ser píxeles sRGB).
sRGB está basado en RGB sin embargo, sRGB no representa el 100% de los
colores. Mientras que Adobe RGB (1998) intenta fidelizar el modo de color

Juliettaschool.com  
 

84

 

 

CMYK que es el que usan las imprentas. Por otra parte, hay modos de color
creados por empresas profesionales como Kodak. Los profesionales desean
más otros modos de color como el de Kodak.
Adobe RGB (1998) nos lo trae Photoshop y la cámara digital. En este curso
de introducción nos acercamos a los conceptos básicos de sRGB y Adobe RGB.
sRGB tiene menor rango de colores y a cambio ofrece más contraste en
colores básicos y mejor brillo. sRGB es el formato de los laboratorios
generales y no profesionales. Es el formato de las pantallas de ordenador, de
los navegadores web.
Adobe RGB es el modo de color de la impresión de calidad y del retoque
fotográfico profesional. Quizás veamos los colores más apagados en el monitor
con Adobe RGB, aunque podemos calibrar el monitor para verlas en este
formato perfectas, simulando la calidad final.
Si sacamos una fotografía en JPEG en sRGB o en Adob RGB los resultados van
a ser muy diferentes. Lo realmente interesante si queremos sacar fotografías
de alta calidad es sacarlas en formato RAW. Sobre todo porque nos
despreocupamos de sRGB y AdobeRGB de cara a su uso en un futuro. Siempre
que queramos emprender con nuestro material fotográfico personal.
Práctica 1: Abrir una fotografía sRGB para usarla en internet
Solicite el video y los archivos para realizar esta práctica suscribiéndose
en:
Solicite los archivos de las prácticas:
https://juliettaschool.com
1.3.2. El píxel
La fotografía digital evoluciona en la forma de capturar la imagen. En la
fotografía química la imagen se capta en un soporte fotosensible de origen
químico que se conoce como película. Es esta película, la que capta la luz.
En la fotografía digital la captación de luz se hace sobre un sensor
fotosensible. El CCD convierte la luz en información digital, es un tipo de
chip fotosensible. También tenemos sensores de captadores de luz digital
CMOS. En ambos existe el filtro de Bayer. La matriz de colores rojo, verde y

Juliettaschool.com  
 

85

 

 

azul ordenada en el espacio de forma regular cada píxel. Tenemos dos veces
el verde, una vez el rojo y una vez el azul.

                                     

 

 

 

Los millones de cuadrados que registran la luz y crean los llamados píxeles,
son los fotositos. El tamaño de los fotositos está entre 4 y 25 micras.
El filtro de Bayer usa el doble de verde, porque el ojo humano es más
sensible al verde que a otros colores debido a su evolución humana y su
relación visual con la naturaleza.
Observe en la Matriz de Bayer, en la parte superior: fila 1: azul + verde, fila
2: rojo + verde. Concluímos por tanto que por cada uno de azul y rojo hay dos
de verde.
Cada píxel sólo reacciona ante uno de los tres colores. Se mezclan gracias a
la matriz de Bayer que registra un proceso de interpolación de los colores de
cada píxel con sus vecinos.
El resultado final es una imagen cuadriculada de rojos, verdes y azules.
Al interpolarse estos cuadritos se realizan cálculos matemáticos para hacer
un promedio del píxel más adecuado que formará dicha imagen. Un impulso
eléctrico interpretará el circuito electrónico de la cámara.
Los píxeles captan la luz de la imagen pero no el color. Registran la
intensidad de la luz en una escala de grises de 256 tonos que van del blanco al
negro puros.

Juliettaschool.com  
 

86

 

 

                                                                                                         

 

 

Los colores se consiguen por el filtro superpuesto, por la matriz de Bayer:
rojo, verde y azul.

                                                                                     

 

Si el píxel no tuviese el filtro de color, una imagen luminosa quedaría casi
blanca.
1.3.3.- Paleta de Canales de Photoshop
Todas las fotografías integran sus canales. Los canales se organizan en el
siguente orden: RGB, Rojo, Verde y Azul. Si visualizamos sólo un canal activo
la fotografía se mostrará en gris y si se activa más de un color se visualizarán
colores.

Juliettaschool.com  
 

87

 

 

Los canales en Photoshop se crean automáticamente al abrir la imagen.
Práctica 2.- Convertir una imagen para subirla al entorno de internet
Solicite los archivos de las prácticas:
https://juliettaschool.com
1.3.4.- Mapa de bit
La profundidad de bits. La imagen bitonal está formada por 1 bit (negro y
blanco) utilizando valores 0 para el negro y 1 para el blanco. Nos referimos a
un modo de mapa de bits en blanco y negro con sólo dos tonos. Es útil para
trabajos de impresión.
88

Una imagen de escala de grises varía entre 2 y 8 bits o más. La imagen de 2
bits tiene cuatro combinaciones posibles: 00, 11, 01, 10 siendo 00 el negro y
11 el blanco el resto serán gris claro y gris oscuro.
En una imagen de color de profudidad de:
. 8 bits es 28 siendo igual a 256 tonalidades
256 tonalidades de color admiten los ficheros con extensión GIF y PNG-8,
aplicaciones multimedia, el modo de escala de grises, modo de color
indexado.
El modo de color indexado se produce cuando Photoshop selecciona los
colores más parecidos a los que tiene disponibles. Es útil para entorno web,
pesan poco y mantienen la calidad visual.

Juliettaschool.com  
 

 

 

. 16 bits es 216 siendo igual a 65.536 tonalidades
Alta calidad de color.
. 32 bits es 232 siendo igual a 4.294.967.295 tonalidades
Modo CMYK. Se usa para libros, revitas, caratulas, etc. A cada píxel se le
asigna un valor coincidente con un % de tinta de CMYK. Photoshop varía
respecto de las imprentas el CMYK. Es algo a tener en cuenta.
Modo de color:

1.3.5.- Píxeles para video
Proporción de píxeles:

Juliettaschool.com  
 

89

 

 

Los píxeles cuadrados tienen un aspecto de píxel de 1.0.
Son cuadrados de 1:1 (largo y ancho miden 1x1)
                                                                                 

Nos referimos a la relación de largo por ancho de un píxel en la imagen. El
aspecto de relación de píxel o la proporción de aspecto de imagen sigue la
siguiente fórmula: PAR = x/y
Los aspectos 4:3 para televisión estándar y 16:9 para pantalla panorámica y
televisión de alta definición. La mayoría de los gráficos informáticos utilizan
píxeles de 1:1 sin embargo, en formato de vídeo digital no todos los píxeles
son cuadrados.
Ej.: D1/DV NTSC (0,91) usa un tamaño de fotograma de 720 x 480 píxeles, se
ve en 4:3 y esto es porque es rectángular, tiene un PAR de 0,91
Práctica 3: Convertir una imagen a distintos mapas de bits
Solicite los archivos de las prácticas:
https://juliettaschool.com

Juliettaschool.com  
 

90

 

 

1.4.- Resumen
. El taller virtual de Photoshop contiene un taller fotográfico y un taller de
pintura.
. Todo dispositivo de captación de imágenes tiene una capacidad distinta
para reproducir el color. Adobe RGB (1998) es un perfil que proporciona una
gama de colores grande y equilibrada.
. sRGB y Adobe RGB (1998) son dos perfiles de color de Photoshop y que
también tenemos la opción de escoger en nuestra cámara fotográfica.
. sRGB es un modo de color que se usa para productos finales en pantalla, en
la Web y similar.
. Adobe RGB (1998) es un perfil de color para productos finales que se vayan
a imprimir. La conversión a CMYK estará mejor procesada con este modo de
color.
. La imagen web hay que trabajarla en modo sRGB ya que no todos los
navegadores, van a interpretar correctamente otros modos de color. Nos
podemos econtrar con la sorpresa de que la imagen a color, en otro
navegador, no reproduzca los colores deseados.
. Actualmente tenemos dos sensores de luz para la fotografía digital el CCD
y el CMOS
. La matriz de Bayer capta el color en el sensor.
. El mapa de bits de 2 a 8 bits tiene una profundidad en escala de grises del
0 que es el negro al 1 que es el blanco.
. El mapa de bits de 16 bits tiene una alta calidad de color
. El mapa de bits de 32 bits se utiliza para imprimir en modo CMYK
. El aspecto de relación de píxel o la proporción de aspecto de imagen sigue
una fórmula que nos permite obtener los aspectos para televisión. Conocemos
los formatos 4:3 de pantalla estándar y el 16:9 de pantalla panorámica. El

Juliettaschool.com  
 

91

 

 

formato 4:3 está formado por píxeles cuadrados de 1x1.

92

Juliettaschool.com  
 

 

 

Módulo 2: Introducción a la comunicación visual y Adobe Photoshop.
Unidad didáctica 2: Aplicación práctica. La fotografía digital.


Enseñar e introducir al alumno en la tecnología de la cámara
fotográfica digital y el taller virtual de Photoshop
Dotar al alumno de los primero pasos básicos para la buena
resolución ante la impresión fotográfica
Iniciar al alumno en los conocimientos básicos desde la fotografía
digital hasta la fotografía impresa.

93

“Todo Mafalda”, Quino.

Juliettaschool.com  
 

 

 

2.1.- El sensor
El sensor de la cámara fotográfica es la guía de la luz con la cual vamos a
escribir la imagen. El sensor de las cámaras digitales es fijo, no como el
carrete de la cámara analógica, que lo cambiábamos. En el sensor
proyectamos y en la tarjeta de memoria, almacenamos.
Si hablamos de calidad óptica nos referimos a los objetivos, pero si no
tenemos un buen sensor, el objetivo poco podrá hacer por nosotros.
El sensor es un chip con millones de componentes sensibles a la luz,
llamados píxeles. Siempre están a oscuras. Si les entra luz, ellos capturan luz.
En la actualidad los sensores tienden a ser CMOS ya que consumen menos
batería y es más económico de fabricar que el CCD. CMOS ha alcanzado hoy la
calidad la calidad del CCD de ayer. Los análisis para compararlos son
complicados entre CMOS y CCD y la tecnología está siempre avanzando.

CCD y CMOS están basados en la Matriz de Bayer. Están fabricados con
tecnologías distintas para captar la luz.
CCD trabaja enviando la información a una esquina y en ese rinconcito
traduce la luz. Siempre necesita un circuito adicional que se encargue de
tratar los datos recogidos. La tecnología de CMOS trata la información de la
luz píxel a píxel, y el circuito adicional es menos costoso. En conclusión, CCD
y CMOS efectúan de forma diferente la lectura de la luz. Es la tecnología la
que marca los precios, CMOS es más económico actualmente.
En este video se expresa el funcionamiento de cada tecnología y se puede
iniciar una compresión de precios y calidades contra dos técnicas que intentan
lograr un mismo objetivo. Ver el siguiente video.

Juliettaschool.com  
 

94

 

 

http://www.youtube.com/watch?v=nxUDHcZl1uo&feature=related
La tecnología con la que se capta la luz nos pone de manifiesto las ventajas
y desventajas de CCD y CMOS. Un comparativo entre CCD y CMOS nos aporta
la siguiente información:
CMOS
Los sensores CMOS responden antes
que los CCD en su trabajo de
captación de luz y utilizan menos
batería.

CCD

CCD supera en el doble a CMOS en
RD, en rango dinámico.
CMOS al convertir la luz que recoge
en el mismo sitio, genera más ruido.
CCD es más uniforme que CMOS ya
que un píxel en CCD recoge la misma
luz que sus vecinos. En CMOS al ser
individuales y trabajar de forma
individual, crea un problema de
relación en la misma cantidad de
alimentación de luz entre los píxeles
perimetrales.
CMOS es superior en velocidad de
captura de imagen.
CCD satura a sus vecinos con
efectos no deseados y es la
tecnología CCD la que solventa este
mismo problema, se revierte esto en
sus costes.
CMOS en situaciones de poca luz
está en las antípodas de CCD.
Las cámaras semiprofesionales de hoy, eran las cámaras profesionales hasta
hace pocos años. Los sensores profesionales de hoy, se usan en la gama de
cámaras básicas, como son las compactas. Hemos llegado a un avance

Juliettaschool.com  
 

95

 

 

tecnológico donde se afirma ya, que no es el sensor la parte más
importante que dará la buena calidad a la imagen fotográfica, sino una de las
partes.
El tamaño del sensor es importante a la hora de adquirir una nueva cámara
digital.
Sensor
Full Frame 35mm
APS-H
APS-C Nikon, Pentax y Sony
APS-C Canon
Foveon Sigma

Tamaño (mm)
36 x 24
28,7 x 19
23,6 x 15,7
22,2 x 14,8
20,7 x 13,8

El sensor Foveon X3 ofrece una calidad de imagen que muchos profesionales
consideran admirable. Este sensor tiene un sistema de captura vertical que no
requiere la interpolación de color. También posee un sistema de proceso de
imágenes que no requiere un filtro óptico. No estropea los colores y elimina
las zonas de alta frecuencia. La alta nitidez para impresión de alta resolución,
se compensa.
Permite pasar la luz a diferentes profundidades, con distintas longitudes de
onda y todo este éxito se consigue en un solo píxel, sin filtro de color. Las
imágenes producidas son nítidas desde el principio. Son imágenes con matices,
muy naturales.
2.2.- La resolución: Lpi, dpi y ppi (siglas en inglés)
Los Lpi son líneas por pulgada. La resolución de una lente, de una película o
de un papel se expresa en Lpi. Cuanto mayor sea el número de líneas por
pulgada, mayor será la nitidez de la imagen y por tanto mayor resolución.

Juliettaschool.com  
 

96

 

 

Los Dpi son puntos por pulgada. Se usa para impresoras. Es el número de
puntos que un sistema de impresión puede poner en una pulgada. No guardan
relación con los lpi. Lo que se aproxima siempre son pruebas.

                                                                                                   

 

Los Ppi son píxeles por pulgada. Los escáner y las cámaras digitales trabajan
con píxeles y no con puntos. Los fabricantes de revistas informáticas usan dpi
en las características de los escáner y esto es un error porque los escáner usan
Ppi.
Los Ppi sí se relacionan matemáticamente con los Lpi. La relación es la
mitad. Un escaneo de 300 ppi se resolvería con 150 lpi.

Juliettaschool.com  
 

97

 

 

 

Los ppp debemos usarlos sólo para referirnos a impresoras porque nos
referimos a puntos por pulgada y no a píxeles por pulgada.
2.3.- Resolución y medidas para imprimir una fotografía digital
Si tenemos una fotografía que mide 1225 x 805 píxeles y la queremos
imprimir en una medida de 14,85 x 10,5 cms, realizamos la siguiente
operación:
1225 píxeles : 14,85 cms = 82,49
(82,49) x 2,54 = 209,53 píxeles por pulgada
1” = 2,54 cms
Práctica 1: Convertir una imagen tras el cálculo a las nuevas medidas en
Solicite los archivos de las prácticas:
https://juliettaschool.com

Juliettaschool.com  
 

98

 

 

2.4.- Resumen
. El sensor es un chip con millones de componentes sensibles a la luz,
llamados píxeles.
. Los sensores CCD han sido los mejores hasta hace poco tiempo con unas
grandes ventajas sobre el sensor CMOS. El avance de la tecnología actual ha
permitido a CMOS mejorar aquellos aspectos donde estaba quedando obsoleto.
. Las cámaras fotográficas semiprofesionales de hoy eran las profesionales
de hace una década. Incluso las cámaras compactas, ya incorporan sensores
profesionales.
. Los Ppi son píxeles por pulgada. Los escáner y las cámaras digitales
trabajan con píxeles y no con puntos.
. Los Dpi son puntos por pulgada. Se usa para impresoras.
. Los Lpi son líneas de pulgada. Se usa para papel.

Juliettaschool.com  
 

99

 

 

Módulo 2: Introducción a la comunicación visual y Adobe Photoshop.
Unidad didáctica 3: Ayer negro y hoy blanco.


Enseñar los conceptos básicos de luces y sombras simples
Capacitar al alumno en la identificación de luces y sombras simples
Mostrar al alumno la idea de proyecto con matices de calidad

100

Ver este video.

Juliettaschool.com  
 

 

 

3.1.- Escala de grises
Todos los elementos de nuestro entorno los percibimos gracias a la luz. El
claroscuro es la técnica de la degradación de luces y sombras. Crea sensación
de volumen. Yendo del negro al blanco pasamos por una serie de valores de
grises y se establece una escala de nueve etapas.

101

Blanco, negro y gris. ¿Colores sin colores? Se definen como colores
acromáticos a aquellos que van del blanco al negro.
El blanco, negro y gris producen sensaciones y reacciones. Ejemplo de ello
son los Test de Rorschach que usa parámetros como la forma y color con sólo
estos tres impresionantes colores.
Físicamente no se considera al blanco como un color, sino la suma de todos
los colores. El negro se produce cuando no hay luz.

3.2.- Luz y sombra
Los cuerpos reciben la luz produciendo zonas de luz, penumbra, sombra
propia, reflejo y sombra arrojada.

Juliettaschool.com  
 

 

 

La sombra propia es la que el cuerpo opaco produce en su propio cuerpo.
La sombra arrojada es la que el cuerpo opaco proyecta sobre otros cuerpos o
sobra una superficie.
Penumbra es casi sombra, es sombra débil. Existe entre la luz y la oscuridad.
La sombra reflejada simula que el cuerpo se apoya en una superficie.
La luz es la que nos permite ver los cuerpos.
3.3.- Luces y sombras en la evolución de la pintura
Las luces y sombras se han adaptado a nuestra vida. En el cine por ejemplo
se han aprovechado para movernos los sentimientos. Vamos a hacer un breve
recorrido por las luces y sombras en la pintura en esta unidad didáctica.
Los movimientos artísticos históricos han integran la evolución científica al
arte. Algunas veces la estudiaron y otras aprendieron por observación.
Las luces y sombras que vamos a aprender a aplicar en el taller de retoque
fotográfico, surgen tras consolidar día a día técnicas y efectos donde el pintor
nos trató de mostrar la realidad de su época, con o sin electricidad.
Las luces y sombras a veces desvelan la atmósfera, como es el cuadro de
Rembrandt titulado: “Filoso Meditando.”

Juliettaschool.com  
 

102

 

 

103

También nos muestran sentimientos. El ser humano crece espiritualmente e
integra estas influencias en la construcción de su ser. Observemos la
expresión cuadro titulado: “Retrato de anciano” de Rembrandt.

Al interesarnos en explorar el recorrido del ser en el aprendizaje de luces y
sombras. Así como en la integración de las luces y sombras en la pintura y su

Juliettaschool.com  
 

 

 

evolución, hay dos puntos clave:
. El ser humano integró las luces y sombras que hoy son más comunes en
nuestra vida cotidiana en un recorrido de unos trescientos años. Resulta
loable en nuestra época tener las bases de cómo se perciben las luces y
sombras en los cuerpos. Sin embargo, tendremos que tener la mesura
suficiente para aprender luces y sombras. Ya que si la variedad de genios
vivieron el descubrimiento tras tres siglos, nosotros como mínimo habremos
de dedicarle un puñado de tiempo con su Sol y su Luna para dominarlas a ellas,
a la luces y a las sombras.
. Inicialmente ir a Photoshop y convertir una fotografía tomada a color a
escala de grises es tan sencillo como hacer tres clics. El primero para abrir la
foto, el segundo para ir al menú imagen/Modo/Escala de grises y el tercer clic
para aceptar la conversión. Ahora bien, teniendo en cuenta estas premisas de
luces y sombras. Nuestro proyecto en el programa de enseñanza-aprendizaje
pretende integrar los conocimientos más realistas posibles en un taller virtual.
Consideramos que la única forma de enriquecer la fotografía captada y darle
un carácter profesional, pasa por el estudio de la misma.
Steve Mcurry es un loable fotógrafo. Visiten su página web.
http://stevemccurry.com/
Observen las luces y sombras que logra captar en sus fotografías. Es emoción
lo que caza y si ayer fue Rembrant con la pintura. Hoy la fotografía con un
buen estudio de luces y sombras nos pondrá a temblar. Es por ello que nos
iniciaremos como no iniciados en luces y sombras.
Las técnicas hoy día de fotografía y los efectos a producir en Photoshop se
nutren del arte. En los museos está la biblioteca visual que necesitamos para
aprender y comprender la emoción que Photoshop atesora. No se conforme
con un clic. Será un largo recorrido y conseguirá que las imágenes comuniquen
visualmente un mensaje determinado.
Nos interesa aprender que la fotografía en blanco y negro tiene una
valoración monocromática de la forma. Esta se produce en el cuerpo cuando
recibe la luz.

Juliettaschool.com  
 

104

 

 

Nos introducimos en un breve recorrido por varios movimientos artísticos
que a lo largo de tres siglos evolucionaron los conceptos de luces y sombras.
3.3.1.- Quattrocento
La pintura del S.XVI ignora las sombras y la luz expresa la forma y los colores.

105

El nacimiento de Venus. Sandro Botticelli. 1482/85

Venus sobre la concha tiene una luz suave, con sombras suavizadas sobre su
cuerpo. La luz es la protagonista y nos cuentan las sombras del personaje. Se
ha desdibujado el contorno, se ha abandonado la forma plana. El hombre
denota un área de oscuridad. El suelo es oscuro y las hojas de los árboles
terminan de dar ese peso de oscuridad a la escena. Ella, Venus, es la que
tiene la piel más blanca y apenas denota pliegues.
3.3.2.- El barroco
Movimiento artístico y cultura que se inicia en el año 1600 y hasta principios
del S.XVIII. Esta pintura dramatiza la escena usando el efecto lumínico del
claroscuro.

Juliettaschool.com  
 

 

 

3.3.2.1.- El barroco y el tenebrismo de Caravaggio
El tenebrismo realiza un contraste fuerte entre la luz y la sombra, sin tener
en cuenta ni la penumbra ni los reflejos. Se ilumina lo que tiene interés para
el autor. Se oscurecen los fondos. Aporta dramatismo y sentimiento.

106

San Jerónimo penitente, de Caravaggio 1605/6

La luz actúa como un foco que descubre el sentimiento del anciano. San
Jerónimo está iluminado de forma violenta sobre un fondo oscuro.

Juliettaschool.com  
 

 

 

3.3.2.2.- El barroco y el claroscuro de Rembrandt
La técnica del claroscuro produce un efecto de contraste entre la luz y la
sombra. La transición ha de ser suave entre la claridad y la oscuridad.
Rembrandt. Representa la psicología del personaje que retrata y su estado
anímico. También representa sus facciones. Destaca la luz en el rostro y su
deseo de extraer el perfil psicológico del personaje.

107

Se incorporaron nuevos conocimientos científicos sobre la iluminación. La
técnica del claroscuro se adentra en la compresión del sentimiento humano.
Los detalles y contrastes está muy marcados por las luces y sombras.
Rembrandt arroja sombra de las partes opaca de la faz, como puede ser la
nariz, que proyecta la sombra sobre el bigote. La luz se proyecta, mirando de
frente, hacía el lado del rostro derecho y, es el giro de la cabeza mirando al
espectador y captándolo, el que denota que el lado oscuro es el izquierdo. El
lado izquierdo está más difuminado y se pierde con la oscuridad, con matices
suaves. No es brusca esta ruptura entre la luz y la oscuridad. Es una penumbra
que nos invita a tomar la decisión de que vemos el cabello de la cabeza, en el
lado izquierdo.

Juliettaschool.com  
 

 

 

3.3.2.3.- El impresionismo y Monet
El impresionismo usa reflejos y penumbra. Monet y Renoir descubren dichos
principios.

108

El Parlamento de Londres, de Monet

La niebla confunde las formas. El Sol se refleja en las aguas del Támesis.
Tenemos azul oscuro, violetas y anaranjados rosáceos. El Sol despide los
reflejos rojos que tiñe el río. Es la teoría de la reflexión. El Sol se proyecta y
se refleja en el agua del mar. A su vez los colores se entremezclan y se
distribuyen. Hasta ahora la fotosíntesis no se ha denotado en la pintura. Es
bello por ello el impresionismo y por más secretos que guarda.
Aprender más sobre luces y sombras nos ayudará a sacarle partido al taller
de retoque fotográfico.
Práctica 1: Adobe Photoshop
Solicite los archivos de las prácticas:
https://juliettaschool.com

Juliettaschool.com  
 

 

 

3.4.- Introducción al análisis de la escala de grises y de la composición
del lienzo

109

La conversión de la imagen de esta pintura a blanco y negro sirve para
ayudarnos analizar la misma sin la distracción del color.
La escala de grises la podremos usar para calcular el blanco y negro de la
imagen a la imprenta.

Juliettaschool.com  
 

 

 

También nos interesa analizar la composición y para ello es más conveniente
estudiar la obra sobre el blanco y negro una vez más, si con ello nos
permitimos una mejor concentración. Nos tenemos que fijar en el equilibrio
de la imagen. Por ej.: dos triángulos verdes.
Una vez efectuados los análisis que consideremos de una obra. La podremos
encauzar para aprovecharla como fuente de inspiración para crear un nuevo
proyecto.
La imagen que tomemos como apoyo para crear una comunicación visual
actualizada acabaremos aprendiéndola y sabiéndola de memoria. Es el
resultado de un análisis sobre otro y del buen estudio del mensaje.
La siguiente etapa de aprendizaje consistirá en investigar el
aprovechamiento de estos recursos de pintura, en la fotografía digital actual.

Juliettaschool.com  
 

110

 

 

3.5.- La pintura y la fotografía en un mano a mano con la publicidad
Esta es una imagen de publicidad que anuncia la publicación del disco
“Glitter doom live” de Tom Waits.

111

Las luces y sombras de esta imagen promocionan el próximo disco del
cantante. ¿Nos evoca a la memoria un movimiento artístico que hemos
descrito anteriormente?
La campaña para promocionar una cadena hotelera nos ofrece esta
composición. Observamos, se han basado en el cuadro titulado: “El
nacimiento de Venús” de Boticelli.

Juliettaschool.com  
 

 

 

112

Antes de llegar con nuestra fotografía al taller de retoque fotográfico nos
interesa todo lo necesario para componer una buena escena. Durante el
proceso de montaje de varias fotografías también nos interesa conocer qué es
lo que queremos realizar.
¿Queremos dramatizar a un Tom Waits? ¿Queremos alimentar el sentimiento
del tenebrismo?
¿Queremos decir que nuestro hotel es para ti? ¿Qué tu eres nuestra perla?
El mensaje que queremos hacer llegar de forma universal tiene que ser
sencillo y claro. La mente es cómoda y muy inteligente a la vez.
La intención es que el alumno despierte en él el deseo de construir nuevas
composiciones a partir de obras, emociones y deseos.
Práctica 2. Adobe Photoshop
Solicite los archivos de las prácticas:
https://juliettaschool.com

Juliettaschool.com  
 

 

 

3.6.- Resumen
. La fotografía de ayer se llevaba a un estudio de revelado. Hoy nuestro
estudio de revelado es nuestro taller virtual de fotografía en el ordenador.
. La escala de Munsell nos proporciona una gama de grises desde el blanco
hasta el negro.
. El blanco, negro y gris producen sensaciones y reacciones. Son colores
acromáticos.
. Los cuerpos reciben la luz produciendo zonas de luz, penumbra, sombra
propia, reflejo y sombra arrojada.
. La sombra propia es la que el cuerpo opaco produce en su propio cuerpo.
. La sombra arrojada es la que el cuerpo opaco proyecta sobre otros cuerpos
o sobra una superficie.
. Penumbra es casi sombra, es sombra débil. Existe entre la luz y la
oscuridad.
. La sombra reflejada simula que el cuerpo se apoya en una superficie.
. La luz es la que nos permite ver los cuerpos.
. Si queremos estudiar la composición de un cuadro debemos empezar
haciéndolo en escala de grises. El color nos puede producir distracción.

Juliettaschool.com  
 

113

 

 

Módulo 3: Introducción a la comunicación visual y Adobe InDesing.
Unidad didáctica 1: El taller virtual de maquetación.


Iniciar al alumno en la interfaz del taller virtual de InDesing
Realizar la introducción a la maquetación de la
Introducir al alumnos en las posibilidades del taller virtual de Adobe
InDesing

114

Juliettaschool.com  
 

 

 

1.1.- Taller virtual
El taller de maquetación virtual se convierte en un espacio de trabajo donde
vamos a organizar los textos y las imágenes.

115

Juliettaschool.com  
 

 

 

1.2.- La interfaz
Indicamos la situación de las barras de herramientas que tenemos que
aprender para situarnos en el taller virtual.

116

Juliettaschool.com  
 

 

 

1.3.- Nuevo documento
Menú flotante para la creación de un nuevo documento.

117

1.3.1.- Calidad
Las calidades que nos ofrece el menú flotante de la creación de nuevo
documento son: Web, imprimir y Publicación digital.
En InDesing podemos exportar documentos tipo Flash para realizar
documentos interactivos. Les propongo visitar la siguiente Web.
http://flashlarevista.com/
Imprimir: En formatos A4, A3, A5, A medida…, entre otros. El formato A4 es
el formato de folio que adquirimos para impresora doméstica. El formato A5
es la mitad del folio y el formato A3 es el doble del folio. Visitar la web.

Juliettaschool.com  
 

 

 

http://www.osce.org/es/odihr/elections/14304
Publicación digital: cuando escogemos esta opción el tamaño de página, no
se adapta para crear formatos para los dispositivos que tiene previsto el taller
virtual: iPad, iPhone, Android, Kindle, A4 y A medida.
Se definen las unidades en píxeles (px), que es la unidad que usamos para
ver los formatos en pantallas digitales del tipo informáticas. Este documento
de La Biblioteca Cervantes que ha sido escaneado, se ha actualizado a una
posible forma de libro electrónico.
Web.
http://bib.cervantesvirtual.com/servlet/SirveObras/platero/0147054108901
4040757857/ima0008.htm

1.3.2.- Tamaño de página
El tamaño de página responde al formato de papel que vamos a utilizar para
maquetar libros, revistas, prensa, libro electrónico, catálogos, etc. Por una
parte existen una serie de formatos propuestos por el taller virtual y por otra
parte podemos poner nosotros las medidas. También podemos crear nuevos
documentos e ir creando una base datos con los formatos más habituales que
maquetemos.
El tamaño de la página hace referencia al tamaño del papel que vamos a
usar para maquetar los libros, las revistas, los Ebooks, etc.
1.3.3.- Márgenes
Los márgenes de la página son el espacio en blanco perimetral de cada caja
de texto.

Juliettaschool.com  
 

118

 

 

1.3.4.- Sangría
En la imprenta es normal que el papel se mueva y sufra desajustes. Siempre
se establecen 2 ó 3 milímetros de sangrado. El sangrado es un espacio
perimetral a los márgenes y se deja para que en la imprenta se pueda cortar
el papel, en caso de movimiento.
Prática 1: Preparar formato para importa novela de Word a InDesing
Solicite los archivos de las prácticas:
https://juliettaschool.com

Juliettaschool.com  
 

119

 

 

1.4.- Resumen
. Las calidades que nos ofrece el taller virtual de maquetación son: Web,
Imprimir y Publicación digital.
. Podemos exportar documentos tipo Flash para crear documento
interactivos como son revistas, prensa, libros y otros.
. Exportaremos también libros electrónicos para dispositivos como iPad,
iPhone, Kindle, Android, etc.
. El tamaño de la página hace referencia al tamaño del papel que vamos a
usar para maquetar los libros, las revistas, los Ebooks, etc.
. Los márgenes de la página son el espacio en blanco perimetral de cada
caja de texto.
. En la imprenta es normal que el papel se mueva y sufra desajustes.
Siempre se establecen 2 ó 3 milímetros de sangrado. El sangrado es un espacio
perimetral a los márgenes y se deja para que en la imprenta podamos cortar
el papel, en caso de movimiento.

Juliettaschool.com  
 

120

 

 

Módulo 3: Introducción a la comunicación visual y Adobe InDesing.
Unidad didáctica 2: Aplicación práctica. La novela.


Enseñar e introducir al alumno en los conceptos básicos de la
maquetación de la novela.
Emprender con el alumno los primeros pasos de maquetación.
Comprender y mostrar la realización de la maquetación en el taller
virtual de InDesing y para imprenta.

121

Llevamos años acostumbrándonos a leer e interpretar las tipografías por que
conocemos las palabras completas. En la primera línea dice: “Bajo la luz de
seguridad, se introduce la tira en el líquido de revelado – Ácido Fijador”. Lo
adivinas cuando has leído mucho sobre el tema y conoces el lenguaje técnico.
Intente usted adivinar el resto del texto que sigue.
En la segunda línea dice: “Una vez sacada la tira del fijador, se puede juzgar
cuál es el mejor tiempo de exposición, para la copia por contacto.”
Le propongo ver este documental pues nos servirá de introducción a la
maquetación y a la tipografía. Vamos a trabajar en los epígrafes de este
unidad didáctica sobre este documental. Ir a la web.

http://www.youtube.com/watch?v=IPg05uCE608

Juliettaschool.com  
 

 

 

Vean este video pues el siguiente epígrafe se entiende habiendo visto este
contenido.
2.1. Tipografía
Del video visto extraigo las partes que aún hoy nos interesan en la
maquetación, aunque la hagamos en un taller virtual:
00:43 “Bien tallados estos tipos”
¿Qué son los tipos? ¿Qué quiere decir Gutenberg?
Sabemos que antes de la tecnología digital, el diseño de palabras impresas
se ya estaba desarrollado.
El tipo es el diseño de un caracter, y la tipografía responde a la combinación
de un grupo de caracteres.
El tipo y el caracter se realiza siguiendo unas pautas de diseño para ese
caracter. Se tiene en cuenta la relación de ese tipo con otros tipos.

Este tipo realizado en papel milimetrado, responde a una serie de enlaces y
tangencias. Usted podrá observar los círculos que conforman este diseño. A
partir de aquí la tipografía empieza a asumir la responsabilidad de ser dividida
en una variedad de partes que la definen.

Juliettaschool.com  
 

122

 

 

A las tipografías se les define denominando al cuerpo con las distintas
partes: Brazo, Ojal, Cartela, Oreja y una vez más los tipógrafos logran
ponerse bastante de acuerdo para lograr tener una conversación técnica sobre
tipos.
Los tipos se dividen actualmente hoy en dos grandes grupos:

123

a) Las tipografías con adornos (tipografías con Serif)
Garamound es una tipografía con Serif , con adorno. Ahora escribo en Garamaound.

G, F, T, R, V, X
“Observen que los adornos son los pies de apoyo en la F, en la T, en la R, en la X y,
también hay líneas exageradas que embellecen en la G, F, T, V y en la parte superior de la
X” Además, todas las tipografías con Serif forman una familia tipográfica”
a) Las tipografías sin adornos (tipografía de palo seco)
La tipografía de palo Seco, en este caso Helvética, no tiene nada de adornos,
observe:

G, F, T, R, V, X
La familia de tipografías de palo seco se distinguen por no tener adornos, son

Juliettaschool.com  
 

 

 

tipografías sin serif.
Las tipografías con serif forman una familia tipográfica y las tipografías de
palo seco forman otra familia tipográfica distinta.
Tipos y tipografías se ponen de manifiesto en esta primera frase que nos
expresa Gutenberg. El tipo es el carácter. La suma de tipos da como resultado
la tipografía. Hoy además distinguimos dos tipos de tipografías que son las de
adorno y las de palo seco. Cada una de ellas será muy aprovechable en cada
canal visual, precisamente por su diseño.
06:12 “Las ideas del renacimiento sitúan al hombre, al individuo, como
centro y medida de todas la cosas…”
124

Observamos el tipo A, diseñado sobre las medidas del cuerpo humano, según
las proporciones del cuerpo humano de Leonardo Da Vinci.
07:00 “Los intentos para abaratar el proceso de copia y sobre todo para
garantizar la exactitud de los textos…”

Juliettaschool.com  
 

 

 

125

La caligrafía es muy individual y personalizada. No se garantiza la legibilidad
de los caracteres, por muchos cuadernillos “Rubio” que hayamos rellenado a
lo largo de nuestra vida.
Nuestros antecesores desarrollaron los tipos de los caracteres metálicos para
fueran duraderos y también buscaban similitud entre ellos.
08:50 “Desde los comienzos de la tipografía los criterios para el diseño y la
grabación de tipos fueron adaptándose a las nuevas corrientes artísticas y de
pensamiento…”

Los diseñadores de tipografías siguen unas directrices para que se produzca
el efecto de facilidad de lectura y buena legibilidad. Ya que si no fuera así la
mente se fatigaría y no conseguiríamos el objetivo de los libros, que es que

Juliettaschool.com  
 

 

 

sean leídos.

10:10 “La búsqueda de proporciones que se basaran en las del cuerpo
humano, llevó a los grabadores de tipos a imitar las inscripciones de la Roma
Imperial”

126

En esta época y en este caso el diseño de la tipografía se realizó imitando
los caracteres romanos.
10:28 “El racionalismo impuso nuevos criterios de claridad y legibilidad
sobre otros ajenos a la tipografía”

Se han realizado estudios científicos que demuestran como leemos y
cuales son las mejores tipografías para niños y adultos. También hay

Juliettaschool.com  
 

 

 

tipografías que dan mejor resultado para leer en prensa o para leer en

internet. Debemos ser conscientes de ello si queremos tener éxito. Ósea, si
queremos que nos lean.
11:50 “Con la aparición de la imprenta se extiende y consolida la vida
pública de los libros y su influencia en la fijación de las lenguas vernáculas”

12:07 “Los impresores corrigen los textos antes de imprimirlos para crear un
estándar que fije la lengua en la que imprimen…”
20:14 “El pueblo llano no sabe o no se atreve a soñar el mundo como lo hace
el lector ilustrado […] con la imprenta el pensamiento popular se recoge en
pliegos de cordel”

Juliettaschool.com  
 

127

 

 

128

En esta parte estamos empezando a ilustrar para contar una historia. ¿Es la
antesala al hecho de contar historias con imágenes y textos?
La creatividad y el ingenio del individuo siempre en la evolución de la
enseñanza-aprendizaje.
2.2. Legibilidad
Gutenberg al crear la imprenta, pone en marcha el libro, el único
documento que permitió registrar, conservar y transmitir el conocimiento
para llegar a la mayor cantidad de personas posibles.
Hoy la imprenta nos puede parecer austera. Ya que nos resulta más
descansado escuchar la radio o ver la televisión. Los mensajes se transmiten
más fácilmente y son más seductivos. Sin embargo, la impresión de libros no
ha bajado, en todo caso vivimos una modificación del formato del libro de
papel, al libro electrónico.
El espectador que escucha radio y ve televisión percibe los mensajes a una
velocidad oral y un ritmo inducido por dichos medios de comunicación.
Hoy los lectores seleccionan más los textos a leer. La lectura sigue siendo un
medio privilegiado, cuando se quieren adquirir conocimientos.

Juliettaschool.com  
 

 

 

El proceso de lectura visual fue estudiado por primera vez en torno 1900. Se
hace un seguimiento al ojo del lector.
La lectura pone en marcha en el ser humano la vista y el pensamiento.
Proponemos un ejemplo de un texto sin espacios en blanco poco legible:
LacañadeazúcarseconocedesdeépocasmuyremotasyaquedesdeelsigloIIIseprod
ucíaenlaIndia.Suexpansiónestáligadaconladelosárabes,puesexistenpruebasdesu
explotaciónenEgipto,ChipreySicilia.
Un ejemplo del mismo texto con espacios en blanco y legible:
La caña de azúcar se conoce desde épocas muy remotas ya que desde el
siglo III se producía en la India. Su expansión está ligada con la de los árabes,
pues existen pruebas de su explotación en Egipto, Chipre y Sicilia.
El mismo texto con un orden aleatorio, ilegible:
La caña
de azúcar se
conoce desde
épocas muy
remotas ya que
desde el siglo III se
producía en la
India. Su
expansión está ligada
con la
de los árabes, pues
existen pruebas
de su explotación
en
Egipto,
Chipre
y
Sicilia.
Maquetamos para que el texto sea legible y que no se produzca ni el efecto
visual de los caracteres pegados, ni el efecto visual de los caracteres tan
separados. Si queremos que nos lean tenemos que maquetar con máximo
cuidado, pues si la mente se fatiga, no lee.
2.3. Facilidad de lectura
Facilidad de lectura o dificultad de lectura. Desde el punto de vista del
diseñador cuenta el tamaño de la letra, el formato del tipo, el estilo del tipo.
SI

usted lee esto y  encuentra   dificultades

sepa que en la

facilidad de kectyra cuentan       desde  

los       factores       de       de la longitud de FRASE, altura de carácter, ESTilo Y
cada diferencia empeora o MEJORA la facilidad de lectura.

Juliettaschool.com  
 

129

 

 

Incluso la facilidad de lectura sigue una fórmula para la Web y otra fórmula
para las impresiones de papel.
Práctica 2: Importar la novela. Vamos a Adobe InDesing.
Solicite los archivos de las prácticas:
https://juliettaschool.com
Empezamos por el libro:
Tengan un libro a mano. Abran ese libro. Acercarse su mirada al lomo del
libro, por la parte interior.
 

Los libros son fascículos o pliegues agrupados y numerados en un orden
progresivo. Se cosen y se pegan y esta es su bisagra. Recuerde: El video de la
Unidad Didáctica 01 pues en él se muestran el lomo del libro.
Ahora vamos a realizar un pliego de 16 páginas a partir de un folio. Sigan los
pasos siguientes:
Paso 1: Dividimos el folio con nuestras manos lo mejor posible como indica
la imagen siguiente.

Juliettaschool.com  
 

130

 

 

131

El aspecto total del papel doblado debe ser similar a este si lo abrimos.

Juliettaschool.com  
 

 

 

132

¿Repasamos cómo doblar el papel para obtener las 16 páginas?
Doblado uno, similar a este:

Juliettaschool.com  
 

 

 

133

Doblado dos…

Juliettaschool.com  
 

 

 

134

Doblado 3…

Juliettaschool.com  
 

 

 

135

Paso 2: Cuando tenemos el papel totalmente doblado lo observamos. Vamos
a ver qué resultado hemos obtenido, en cada uno de los lados del fascículo o
pliegue que estamos construyendo.
He abierto la muestra para que lo observemos juntos (en la siguiente página).
En este escaneo vemos una especie de cúspide en la línea horizontal del
centro. Esta es la parte donde irá el plegado y el cosido.
Lo volvemos a cerrar, porque ya tenemos una verdad y es que la línea
horizontal del centro sería el lomo del libro y por lo tanto no tocamos esa
zona. Esto lo añado porque ahora empezaremos a cortar con la tijera.

Juliettaschool.com  
 

 

 

136

Ahora hemos cerrado el fascículo y continuamos:

Juliettaschool.com  
 

 

 

Intentamos colocar el fascículo en esta posición, la línea superior que
observamos (en la posición que lo tengo colocado) es el lomo. El lomo no lo
vamos a recortar, ni a tocar. Nos quedan dos líneas verticales y la horizontal
inferior.
Una nueva observación: de las dos líneas verticales una de ellas nos muestra
el papel doblado y la otra el papel abierto en gran mayoría. Pues la línea
vertical que está doblada tampoco la vamos a recortar con las tijeras. No la
tocamos.
Ahora mismo del papel tenemos la línea horizontal inferior como objetivo de
las tijeras y la línea vertical derecha (en este caso concreto y tal vez para
usted sea la izquierda). Bien, hemos llegado a la esquina donde vamos a
intervenir con las tijeras, ¿Qué hacemos?
Las páginas que están abiertas no las recortamos. Las páginas que tenga un
doblez en esta esquina sí. Introducimos la boca de la tijera en el doblez y
cortamos apenas un centímetro en cada página con doblez, produciendo un
corte.
Vuelvo a escanear el documento para que vean como debe ir quedando:

Juliettaschool.com  
 

137

 

 

138

La zona que he marcado en rojo son los dos cortes que he realizado.
Cerramos otra vez el documento.
Ya estamos en el 50% de esta práctica. Ahora viene la parte más divertida.
Vamos a enumerar las páginas del fascículo.

Juliettaschool.com  
 

 

 

Paso 3:

139

Nos hemos de situar en la esquina donde hemos producido el corte. Ahora no
tengo el fascículo apaisado, sino en vertical. Escribo el uno en la primera
página. Doblo y escribo el dos. La página dos tiene truco… hay que formar un
triángulo en el doblado externo tal y como indico con las líneas rojas.
Esta es la técnica que vamos a usar para enumerar las 16 páginas.
Si ya hemos terminado la numeración de las páginas, abrimos el pliego. Lo
voy a escanear por una de las caras nada más, para empezar con el siguiente
paso.

Juliettaschool.com  
 

 

 

Paso 4:
El documento está en vertical. Lo giramos en horizontal y tenemos que leer
en la posición correcta los números del 8 al 5. Voy a enumerar las páginas en
la zona central de cada doblez. Vuelvo a girar el papel y enumero del 1 al 4.
Os pongo el ejemplo terminado en la siguiente página.

140

Juliettaschool.com  
 

 

 

Esto lo hacemos en las dos caras y volvemos a cerrar el fascículo.

141

Juliettaschool.com  
 

 

 

Paso 5:
Cerrado el pliego o fascículo, grapamos el lomo. Traten que la grapa esté lo
más cerca posible de la línea de doblez, más o menos como usted ve en esta
imagen.

142

Cuando ya tenemos las grapas, recortamos los otros tres lados perimetrales.
Viéndolo en vertical: recortamos la línea horizontal superior e inferior y la
línea vertical paralela al lomo. Metemos las tijeras y recortamos las
longitudes completas. ¿Os acordaís del concepto de sangría? Os lo recuerdo.
Epígrafe 1.3.4.- Sangría
En la imprenta es normal que el papel se mueva y sufra desajustes. Siempre
se establecen 2 ó 3 milímetros de sangrado. El sangrado es un espacio físico
perimetral que bordea a los márgenes y se deja para que en la imprenta
podamos cortar el papel en caso de movimiento.
Esto es la simulación de un pliegue de imprenta.

Juliettaschool.com  
 

 

 

2.4. Resumen
. Al leer conocemos palabras completas de memoria y por ello hoy en día
leemos oraciones completas aunque tengan una tipografía inadecuada.
. Cuando hablamos de tipo nos referimos al diseño de un caracter.
. Los tipos se dividen actualmente hoy en dos grandes grupos:
. Las tipografías con adornos (tipografías con Serif)
. Las tipografías sin adornos o de palo seco
. Las tipografías con serif forman una familia tipográfica y las tipografías de
palo seco forman una familia tipográfica distinta.
. Los diseñadores de tipografías siguen unas directrices para que se produzca
el efecto de facilidad de lectura y buena legibilidad.
. Se han realizado estudios científicos que demuestran como leemos y cuales
son las mejores tipografías para niños y adultos. También hay tipografías que
dan mejor resultado para leer en prensa o para leer en internet. Debemos ser
conscientes de ello si queremos tener éxito. Ósea, si queremos que nos lean.
. Gutenberg al crear la imprenta, pone en marcha el libro, el único
documento que permitió registrar, conservar y transmitir el conocimiento
para llegar a la mayor cantidad de personas.
. La lectura pone en marcha en el ser humano la vista y el pensamiento.
. Maquetamos para que el texto sea legible y, que no se produzca ni el
efecto visual de los caracteres pegados ni el efecto visual de los caracteres
tan separados. Si queremos que nos lean tenemos que maquetar con máximo
cuidado pues si la mente se fatiga, no lee.

Juliettaschool.com  
 

143

 

 

Módulo 3: Introducción a la comunicación visual y Adobe InDesing.
Unidad didáctica 2: Maquetación del libro electrónico. Ebook.


Aprender los conceptos básicos del Ebook y los primeros pasos para
realizarlo en InDesing
Introducir al alumno en la maquetación de Ebook
Mostrar al alumno cómo se inician los pasos para crear un Ebook

144

Juliettaschool.com  
 

 

 

3.1.eBooks
La versión electrónica del libro es lo que conocemos como EBook, libro
digital o ecolibro.
Los Ebooks ofrecen libros de texto con imágenes en su gran mayoría, ya que
la tablet aún hoy está avanzando hacía el video incorporado en el libro
electrónico. El Ipad sí permite la lectura del Ebook con audiovisuales
incorporados. Aunque las tecnologías avanzan tan rápidamente que mañana
mismo pueden haber otros fabricantes que la igualen.
Los DRM (Digital Rights Management) aplican restricciones a los archivos
adquiridos en formato de libro electrónico para proteger dichos documentos
de ser copiados e impresos. Así quedan limitadas el número de copias.
Los formatos digitales se propagan por la red y se distribuyen los contenidos
en espacio y tiempo más allá de los límites propuestos por los editores.
Algunas editoriales sólo imprimen sus libros en formato de papel.
Volviendo al DRM. Este controla la parte física (el hardware) y la
programación (software). Se han creado unos usos, permitidos al titular, que
han adquirido la obra digital. Al igual, se han creado otros usos no permitidos
sobre la obra, aunque se haya comprado. La OMPI (Organización Mundial de la
Propiedad Intelectual) y la CE ratifican los “Derechos de autor en Internet”
El DRM en las bibliotecas limita el tiempo del préstamo del libro electrónico.
Esto quiere decir que pasado el tiempo concertado, el libro se bloquea o
desaparece.
Con el DRM el comprador queda limitado en la copia privada, así como con
intercambio de formato para usuarios.
Hasta ahora la compra del libro físico no solicitaba la identificación del
usuario y con el libro digital se hace necesaria la identificación. Un aspecto
positivo de este registro, es que cuando la tablet es cambiada por otra, al
existir un registro de compradores, el usuario puede volver a descargar de
manera gratuita los libros electrónicos adquiridos. Aunque siempre será bueno
tener copia de la compra de dichos libros electrónicos, pues no se sabe si las
bases de datos algún día se puedan perder.

Juliettaschool.com  
 

145

 

 

3.2. InDesing y el Ebooks profesional
La página web: www.lulu.com o www.bubok.es son editoriales rápidas
donde además de publicar su libro, usted puede obtener su ISBN. Las
condiciones para editar un libro serán efectivas.
El ISBN es el número estándar internacional de libros. El ISBN expresa datos
como son el país de origen, la lengua de origen, el editor del libro, etc. La
obra queda legalmente registrada.
Nosotros podemos tener una idea de libro. Trabajar nuestras imágenes en
los talleres de Adobe Illustrator y/o Adobe Photoshop y, luego importarlas a
Adobe InDesing. Los textos los importaríamos desde procesadores de texto y,
vamos conformando la maquetación, según unas reglas como la de
composición o la de tipografía.
La publicación más rápida hoy es en internet. Obtenido el ISBN se distribuirá
a Amazon y a otras librerías del ciberespacio tanto por el autor como por el
editor, según las condiciones pactadas en la web.
Respecto a la distribución del libro si adquirimos una buena formación del
perfil de Comunity Manager o Social Media, estaremos capacitados además,
para distribuir nuestros libros en internet conociendo la variedad de empresas
on line, que nos pueden llevar a dar a conocer el libro o el proyecto a una
gran afluencia de público.
Así que aquellas personas que siempre han querido que le editen un libro
sobre el pastoreo, sobre cuentos infantiles, una investigación que hayan hecho,
un proyecto fin de grado, un libro de recetas de cocina, etc. Hemos de
decirles que si bien el perfil del editor es quien distribuye y coloca los libros
en los grandes centros comerciales. No será ni más fácil ni tan complicado
mover y promocionar el libro en la red. Si aprendemos a maquetar libros con
InDesing y esto lo aderezamos con una formación de Social Media, el éxito
empieza a labrarse con estos pasos.
Estaremos así, entrando en la espiral del cambio que ya viene
desarrollándose respecto a cómo se ha concebido hasta hoy este mundo del
escritor y el editor. Así que mucho ánimo para todas aquellas personas que
tienen inquietudes, por que internet nos proporciona soluciones tangibles.

Juliettaschool.com  
 

146

 

 

Práctica 1: Instalar el Digital Editions
Solicite los archivos de las prácticas:
https://juliettaschool.com
El Digital Editions es compatible con los formatos de libro electrónico: PDF y
EPUB
Web

http://www.adobe.com/es/products/digital-editions.html
Lo descargamos e instalamos si no lo tenemos aún en nuestro ordenador.
147

En la parte de la derecha nos sale leemos: Descargar ahora, pues clic en ese
texto.

Juliettaschool.com  
 

 

 

148

Como observaran tienen la versión para Macintosh y la versión para Windows.
Seguimos los pasos e instalamos la versión que nos sea necesaria. Se os
descarga el programa y comenzamos la instalación.
Práctica 2: Exportar Madam Bovary a libro electrónico. Nos vamos a
Solicite los archivos de las prácticas:
https://juliettaschool.com
Abrir el archivo que importamos a InDesing de Madam Bovary y realizar la
practica siguiendo el video.

Juliettaschool.com  
 

 

 

3.2. Resumen
. La versión electrónica del libro es lo que conocemos como eBook, libro
digital o ecolibro.
. Los DRM (Digital Rights Management) aplican restricciones a los archivos
adquiridos en formato de libro electrónico para proteger dichos documentos
de ser copiados e impresos.
. El ISBN es el número estándar internacional de libros. El ISBN expresa datos
como son el país de origen, la lengua de origen, el editor del libro, etc. La
obra queda legalmente registrada.

Bibliografía
“La fotografía paso a paso un curso completo”, Michael Langford.
“Historia de la fotografía”, Beamont Newhall.
“Imagen digital conceptos básicos”, Hugo Rodríguez.
“Andy Warhol” ,Stan Barets, Martine Desoille y Malt Wrbican
“Publicidad on line: Las claves del éxito en Internet”, Rafael Ordozgoiti de la Rica, Daniel
Rodríguez del Pino, Antonio Olmos Hurtado y Jóse Antonio Miranda Villalón.
“El elemento”, Ken Robisson.
“La imagen corporativa”, Norberto Chaves
“¿Existe una hormiga de seis pisos? Claves de la creatividad”, Ivan Gauriloff, Bruno Jarroson.
“Desingt ET Packaging Promotionnel”, Cristian Campos
“La proporción áurea”, Mario Livio
“Comprender el arte y entender su lenguaje”, Maria Carla Prette y Alfonso De Giorgis.
“Los maestros de la pintura occidental”, Ingo E.Wather.
“Todo Mafalda”, Quino.
“Madam Bovary”, Gustave Flaubert.
www.adobe.es

 

Juliettaschool.com  
 

149

 

Sign up to vote on this title
UsefulNot useful