Diseño tipográfico

Diseño tipográfico
Diseño tipográfico
Formas básicas y
efectos ópticos
Diseño tipográfico
Formas básicas y
efectos ópticos
OT
anual
Diseño tipográfico
Cuerpo 120 pt
Gill Sans
Helvetica
Ibarra Real
Times New Roman
aaaa
aaaa
Diseño tipográfico
Formas básicas y
efectos ópticos
Frederick William
Goudy
Tan sólo
los trazos
completamente
horizontales
coinciden con
las guías.
Diseño tipográfico
Formas básicas y
efectos ópticos
Diseño tipográfico
Formas básicas y
efectos ópticos
Ilusión óptica
de Oppel-Kundt
Ilusión óptica
de Helmholtz
La figura está formada
por dos espacios del
mismo ancho, uno lleno
de líneas verticales y el
otro simplemente tiene
líneas en los bordes.
Nuestro cerebro percibe
como más ancho el
espacio lleno de rayas
que el espacio que solo
tiene líneas a ambos
lados
Un cuadrado con líneas
horizontales parece ser
más alto y más delgado
que un cuadrado del
mismo tamaño formado
de líneas verticales.
Diseño tipográfico
Formas básicas y
efectos ópticos
E
Futura
Paul Renner
1929
Peso visual en la
distribución de la
forma.
Trazos horizontales
menos anchos, trazo
intermedio más corto
y ligeramente alto.
Diseño tipográfico
Formas básicas y
efectos ópticos
El ancho de los
trazos rectos
verticales no es el
mismo que el de
las formas curvas.
Deben ser ajustados
ópticamente.
Recta, 48 pt.
Curva, 58 pt.
Diseño tipográfico
Formas básicas y
efectos ópticos
Deben repetirse
los mismos
anchos en cada
variedad de
forma.
Ancho contraforma curva
Ancho contraforma recta
Ancho formas curvas
verticales
Ancho formas rectas
verticales
Ancho formas curvas
horizontales
Ancho en la unión de astas
y horizontales
Diseño tipográfico
Formas básicas y
efectos ópticos
El mejor sistema
para mantener
la coherencia de
la escritura es
repetir módulos
en las letras
que tengan
una estructura
similar.
Frederick Goudy
Diseño tipográfico
Formas básicas y
efectos ópticos
El mejor sistema
para mantener
la coherencia de
la escritura es
repetir módulos
en las letras
que tengan
una estructura
similar.
Diseño tipográfico
Formas básicas y
efectos ópticos
El ancho de las
astas y los blancos
internos, son
inversamente
proporcionales.
Diseño tipográfico
Diseño tipográfico
a partir de
un original
digitalizado
Plantilla en Illustrator de 1.100 x 3.000 puntos.
Guías para formas rectas y curvas.
Diseño tipográfico
Helvetica
Minion Pro
Ambas redondas,
en el mismo
cuerpo.
Garamond
ITC
Adobe
abcpe abcpe
Diseño tipográfico
Diseño tipográfico
a partir de
un original
digitalizado
El trazado de las
letras sigue los
principios de la
ortogonalidad.
Diseño tipográfico
Diseño tipográfico
a partir de
un original
digitalizado
Distribución
métrica de las
distintas partes
de la letra.
Ascendente 744
Mayusculas 544
Ojo medio 348
Descendente -256
Diseño tipográfico
El espacio para
la “n” tiene en
cuenta que la
prosa derecha es
algo inferior
a la izquierda ya
que la primera
tiene mas blanco
en el “arco”.
Es necesario
vincular a las
formas básicas
al resto de
caracteres
con la misma
métrica. Cada
forma tendrá su
espaciado.
El espacio para
la “o”se obtiene
dando los
mismos
valores en la
prosa
izquierda y en la
derecha.
Diseño tipográfico
Diseño tipográfico
Hitchcock
Font
Matt Terich
a b c d e f g h i j k
l m n ñ o p q r s
t u v w x y z ç
1 2 3 4 5 6 7 8 9 0
. , : ; - * + @ % ?
Diseño tipográfico
Webdings
A
K
T
a
k
t
1
.
ª
B
L
U
b
l
u
2
,
º
C D E F G H I J
M N Ñ O P Q R S
V W X Y Z Ç
c d e f g h i j
m n ñ o p q r s
v w x y z ç
3 4 5 6 7 8 9 0
: ; - ^ * + @ \
% & ( ) = ¿ ?
Diseño tipográfico
Claude Garamond
diseñó tipos
inspirados en
los de Francesco
Griffo. Más tarde
Jacques Sabon
llevó las matrices
de Garamond
a la imprenta
Egenolff Berner
de Frankfurt.
Monotype
Garamond
Adobe
Garamond
ABCDEFGHIJKLMNÑOP
QRSTUVWXYZÇ
abcdef ghijklmnñopqrstuvw
ABCDEFGHIJKLMNÑOP
Q R ST UVW XY Z Ç
abcdefghijklmnñopqrstuv
abcdefghijklmnñopqr
stuvwxyzç
Diseño tipográfico
Claude Garamond
diseñó tipos
inspirados en
los de Francesco
Griffo. Más tarde
Jacques Sabon
llevó las matrices
de Garamond
a la imprenta
Egenolff Berner
de Frankfurt.
ITC
Garamond
Adobe
Garamond
ABCDEFGHIJKLMNÑO
PQRSTUVWXYZÇ
abcdefghijklmnñopqr
ABCDEFGHIJKLMNÑOP
QRSTUVWXYZÇ
abcdefghijklmnñopqrstu
abcpe abcpe
Diseño tipográfico
En 1970 John
Stan dibujó un
Garamond para
la ITC que tuvo
un gran éxito.
Aparte de su
desproporcionado
ojo medio, sus
letras o y O
estaban basadas
en círculos
perfectos. Se
diseño en muchos
y variados pesos
[de super fina
a super negra],
un concepto
completamente
ajeno a toda la
tipografía del
siglo XVI.
ABCDEFGHIJKLMNÑO
PQRSTUVWXYZÇ
abcdefghijklmnñopqr
ABCDEFGHIJKLMNÑ
OPQRSTUVWXYZÇ
abcdefghijklmnñop
abcdefghijklmnñopqr
stuvwxyzç
Diseño tipográfico
En 1970 John
Stan dibujó un
Garamond para
la ITC que tuvo
un gran éxito.
Aparte de su
desproporcionado
ojo medio, sus
letras o y O
estaban basadas
en círculos
perfectos. Se
diseño en muchos
y variados pesos
[de super fina
a super negra],
un concepto
completamente
ajeno a toda la
tipografía del
siglo XVI.
ABCDEFGHIJKLMNÑO
PQRSTUVWXYZÇ
abcdefghijklmnñopqr
Diseño tipográfico
Beatrice Warde
En un artículo, al que debe su reputación, es donde da cuenta de la
verdadera autoría de los caractères de l’Université conservados en la
Imprimerie Nationale y erróneamente atribuidos a Claude Garamond y
que en realidad fueron creados por Jean Jannon punzonista e impresor
de la Academia protestante de Sedan.
El impacto de este artículo en el mundo tipográfico facilitó a Beatrice
Warde su contratación en la casa Monotype, en realidad contrataron
a Paul Beajuon y cuando vieron que se trataba de una mujer la
sorpresa fue enorme, donde se hizo cargo de la revista de la empresa
The Monotype Recorder a la que convirtió, además de un órgano de
difusión corporativo, en un foro de investigación y discusión sobre
creación tipográfica y el diseño de libros e impresos.
Diseño tipográfico
Diseño tipográfico
Joaquín Ibarra
Siglo XVIII
Grabó caracteres
en estilo
romano clásico,
transicional y
moderno. Fue
Impresor de
Carlos III.
Primera edición
de la Real
Academia del
Quijote entre
1777 y 1780.
Ibarra Real
2009
ABCDEFGHIJKLMNÑO
PQRSTUVWXYZÇ
abcdefghijklmnñopqrst
uvwxyzç
1234567890
.,:;-^*+@\ªº%&()=¿?
Diseño tipográfico
John Baskerville
Siglo XVIII
Mrs Eaves
Zuzana Licko
1989
Licko diseñó Mrs
Eaves. Sarah
Eaves, Mrs
Eaves, fue llaves
de Baskerville
y, más tarde, su
esposa.
ABCDEFGHIJKLMNÑO
PQRSTUVWXYZÇ
abcdefghijklmnñopqrs
1234567890
ABCDEFGHIJKLMNÑOP
QRSTUVWXYZÇ
abcdefghijklmnñopqrst
1234567890
El País
Majerit 2007 Mario Feliciano
Times New Roman 2002
Diseño tipográfico
Akzidenz Grotesk
También conocida
como Berthold
Akzidenz Grotesk
u Odd-job
Sansserif, es
un tipo de letra
paloseco o sans
serif diseñado por
la fundidora de
tipos H. Berthold
de la ciudad de
Berlín en 1896.
Akzidenz
De lo que le
aconteció a don
Quijote en Sierra
Morena.
Rara Historia.
De lo que le
aconteció a don
Quijote en Sierra
Morena.
Rara historia.
Diseño tipográfico
Futura
Paul Renner
1927
La mejor
expresión de la
nueva tipografía
sería la Futura
de Paul Renner,
producida por la
fundición Bauer
en 1927.
ABCDEFGHIJKLMNÑO
PQRSTUVWXYZÇ
abcdefghijklmnñopqr
stuvwxyzç
1234567890
ABCDEFGHIJKLMNÑ
abcdefghijklmnñop
1234567890
Diseño tipográfico
Helvetica
Univers
ABCDEFGHIJKLMNÑ
ABCDEFGHIJKLMNÑ
O P Q R ST U V W XY Z Ç
O P Q R ST UVW XY Z Ç
abcdefghijklmnñop
abcdefghijklmnñop
qrstuvwxyzç.,:ºª
qrstuvwxyzç.,:ºª
1234567890&$=#
1234567890&$=#
Diseño tipográfico
Fuentes creadas para pantalla son concebidas para ser vistas en bajas
resoluciones.
El diseñador ha considerado cada caracter individualmente optimizando no
solo las formas sino también sus alturas e interletrados para que funcionen
dentro de los límites determinados por la grilla definida por la pantalla.
Características
Formas más abiertas
Mayor espacio interior
Letras más anchas
Mayor ojo medio
Interletrado más suelto
Deben encajar en la retícula de pixeles. Rasterización
Diferencia entre caracteres similares: j i l 1
Las san serif son más legibles.
Diseño tipográfico
Verdana
Mathew Carter
1990
ABCDEFGHIJKLMNÑ
OPQRSTUVWXYZÇ
abcdefghijklmnñop
qrstuvwxyzç
1234567890
.,:;-^*+@\ªº%&()
=¿?
Diseño tipográfico
Verdana
Mathew Carter
1990
Diseñada para Microsoft por Matthew Carter especialmente para ser mostrada
en pantalla.
Fue optimizada por Tom Rickner de Monotype. Las curvas y diagonales fueron
meticulosamente ajustadas para que los píxeles sean claros, legibles y
agradables a tamaños pequeños, consiguiendo una fusión perfecta entre forma
y función.
Los caracteres más confusos como la “I” mayúscula, “J”, “L”, “i” o la “l”
minúscula fueron individualizados y los amplios espacios entre las letras
consiguen una legibilidad excepcional.
ABCDEFGHIJKLMNÑ
OPQRSTUVWXYZÇ
abcdefghijklmnñop
qrstuvwxyzç
Diseño tipográfico
Verdana
Mathew Carter
1990
“Al ser concebida Verdana
como fuente de pantalla,
quisimos experimentar
primero con el bitmap
probando en diversas
aplicaciones en las que
Microsoft trabajando. Le
dimos vueltas a diferentes
dibujos, pesos, estilos y
tamaños. Al final tratamos
de que todos opinaran sobre
un pequeño conjunto de
letras bitmaps y, sólo cuando
esto sucedió, volvimos
atrás y creamos las curvas
alrededor de esos dibujos.
Fue entonces cuando le di
las curvas a Tom Rickner, de
Monotype, para que hiciera
los hints ¡que produjeran
los bitmaps que yo había
diseñado anteriormente!”
Diseño tipográfico
Verdana ante
Frutiger: espacios
interiores más
grandes, mayor
ojo medio y
caracteres más
anchos.
Los caracteres
similares de
Verdana poseen
elementos
diferenciadores
para dotarla de
mayor legibilidad.
Verdana frente a
Futura presenta
ajustes en los
interletrados para
evitar problemas de
espaciado. Verdana
produce palabras
más largas.
Diseño tipográfico
Monotype
Arial
1990
La tipografía Arial fue diseñada en 1990 por el equipo de Monotype para
Microsoft cuando lanzó el formato estándar “True Type” para Windows 3.1.
El éxito del sistema operativo haría que la Arial sea actualmente una de las
tipografías más usadas junto con la Helvética o la Times.
Se trata de un tipo funcional, simple y muy versátil. Una de las que posee mejor
“hints” o instrumentos de rasterización ya que Microsoft hizo muchísimos
esfuerzos en optimizarla.
ABCDEFGHIJKLMNÑO
PQRSTUVWXYZÇ
abcdefghijklmnñopqrs
tuvwxyzç
Diseño tipográfico
Mathew Carter
Georgia
1996
ABCDEFGHIJKLMNÑO
PQRSTUVWXYZÇ
abcdefghijklmnñopqrst
uvwxyzç
1234567890
.,:;-^*+@\ªº%&()=¿?
Diseño tipográfico
Fontab 5.0 para Windows
Hints para True Type
Franklin Gothic estrecha
Diseño tipográfico
Diseño tipográfico
Diseño tipográfico
Diseño tipográfico
Diseño tipográfico
Diseño tipográfico