UD TIPOGRAFÍA
Historia de la tipografía impresa y digital
SEMANA 1
Presentación del
docente: experiencia
y expectativas
Fuente: freepik.es
Presentación del sílabo, metodología y evaluación de la UD
¿Cuál es tu expectativa de esta
unidad didáctica?
Descríbelo de manera breve.
Fuente: freepik.es
Presentación del sílabo, metodología y evaluación de la UD
Sumilla
La unidad didáctica Tipografía tiene carácter teórico-
práctico. A través de ella se busca que el estudiante sea
capaz de elaborar mensajes visuales, empleando
elementos tipográficos en el plano bidimensional y de
acuerdo con los parámetros de la sintaxis visual,
aplicados a la tipografía.
La unidad didáctica es fundamental porque permitirá al
estudiante observar la cultura tipográfica de su
entorno, diseñar y evaluar la cantidad de estímulos
necesarios dentro de mensajes escritos (fundamento
de legibilidad).
Explicación del Sílabo
Explicación del Sílabo
Elementos de
competencias
(capacidades)
Elaborar mensajes visuales, empleando
elementos tipográficos en el plano
bidimensional y de acuerdo con los
parámetros de la sintaxis visual, aplicados
a la tipografía.
Indicadores de logro (IL1, 2, 3 y 4)
IL1
• Identifica
tipografías y la
anatomía de
estas a partir de
la clasificación
de estilos
tipográficos
(comprensión
de la estructura
del signo
tipográfico y su
uso en el
entorno).
IL2
• Combina fuentes
tipográficas,
aplicando criterios
semánticos y de
legibilidad, para
componer textos
reales y de ficción
de acuerdo a los
criterios de
variables,
alineamiento y
espaciado.
IL3
• Diseña palabras y
frases a partir de
trazos caligráficos
y las técnicas
libres del
"lettering"
(rotulado o
dibujado),
considerando
espaciados e
incorporación de
elementos no
alfabéticos al
Lettering.
IL4
• Elabora una
palabra
Semántica y una
composición
tipográfica a
partir de la
combinación de
fuentes, el
significado del
mensaje y
criterios de
composición.
Explicación del Sílabo
• La metodología de aprendizaje será el portafolio de evidencias
• Para la evaluación se utilizarán rúbricas.
• A lo largo de la Unidad Didáctica se realizarán 4 evidencias correspondientes a cada
actividad de aprendizaje (AA):
Explicación del Sílabo
AA1
Evidencia 1
Selecciona 3 fuentes
tipográficas y aplica
diferentes estilos, donde
identifica las siguientes
partes: astas, travesaños,
hombros, serifas, colas y
ápices. Ambos ejercicios
son sustentados y
argumentados en un
párrafo.
AA2
Evidencia 2
Presenta 3 propuestas
diferentes donde el título,
párrafo y lista de datos
presenta diferencia de
jerarquía para tres tipos de
textos: descripción de
producto, artículo
periodístico y texto de
ficción (novela).
AA3
Evidencia 3
Presenta el análisis de 3
fotos de afiches tipográficos
de su entorno y propone 3
nuevas propuestas digitales
haciendo el uso correcto de
la caligrafía y lettering
aplicados al marketing de
empresas. Este proyecto se
sustenta y argumenta en el
portafolio indicando el
proceso de desarrollo.
AA4
Evidencia 4
Selecciona una palabra y
refuerza su significado a partir
de trazos caligráficos y
técnicas libres del "lettering".
Realiza un afiche tipográfico
con título, párrafo y lista de
datos que presentan
jerarquización y refuerzo
semántico. Ambas propuestas
deben estar sustentadas en
su portafolio.
Explicación del Sílabo
Metodología: Portafolio de evidencias
¿En qué consiste
esta metodología?
Consiste en “una colección de trabajos del estudiante
que nos cuenta la historia de sus esfuerzos, su progreso
y logros en un área determinada. Esta colección debe
incluir la participación del estudiante en la selección del
contenido del portafolio, las guías para la selección, los
criterios para juzgar méritos y la prueba de su
autorreflexión“.
(Arter y Spandel, 1992 en Centro para la excelencia
docente de la Universidad del Norte de Colombia, s.f.)
PROPÓSITO
Elaborar grupal o
individualmente evidencias
de su proceso de
aprendizaje las que
coleccionarán en un
portafolio virtual y les
permitirán la autoreflexión y
motivará su
autoaprendizaje.
Metodología: Portafolio de Evidencias
El repositorio y el Portafolio personal
Estilo de leyenda para repositorio:
Estilo CVS Todo separado por comas (,)
1. Autor: Grupo o estudiante
(Letra, promedio y semestre),
2. Estilo, o caligrafía, o lettering,
3. Donde lo consiguieron: web,
o foto lugar, o tipografía digital)
Ejemplo de leyenda oficial para repositorio.
B, 1, 21-1, Sans Serif, Foto de
diccionario en casa.
Imagen 1. Elaboración propia.
Metodología: Portafolio de Evidencias
Evaluación
Evidencia Nombre/ Descripción
Actividad de
aprendizaje
Indicador Peso Semana
E1
Selecciona 3 fuentes tipográficas y aplica diferentes estilos, donde
identifica las siguientes partes: astas, travesaños, hombros,
serifas, colas y ápices. Ambos ejercicios son sustentados y
argumentados en un párrafo. 1 IL1 15% 2
E2
Presenta 3 propuestas diferentes donde el título, párrafo y lista
de datos presenta diferencia de jerarquía para tres tipos de
textos: descripción de producto, artículo periodístico y texto de
ficción (novela).
2 IL2 20% 4
E3
Presenta el análisis de 3 fotos de afiches tipográficos de su
entorno y propone 3 nuevas propuestas digitales haciendo el uso
correcto de la caligrafía y lettering aplicados al marketing de
empresas. Este proyecto se sustenta y argumenta en el portafolio
indicando el proceso de desarrollo.
3 IL3 30% 6
E4
Selecciona una palabra y refuerza su significado a partir de trazos
caligráficos y técnicas libres del "lettering". Realiza un afiche
tipográfico con título, párrafo y lista de datos que presentan
jerarquización y refuerzo semántico. Ambas propuestas deben
estar sustentadas en su portafolio.
4 IL4
35%
8
Participación activa** (PA) 2,3 y 4 IL2, IL3 e IL4 3,5 y 7
CONECTEMOS
01
Su nombre y personalidad…
…tipográfica
ACTIVIDAD:
Presentación del estudiante. El docente comparte una
variedad de ejemplos de diseño tipográfico. Y les pide a los
estudiantes que dibujen su nombre en una hoja de papel bond
en un estilo que los represente. Pueden usar colores. Los
estudiantes escribirán su nombre con el estilo y tipo de letra
que más les guste y luego verbalmente explicarán por qué.
Fuente: Grand Matter Studio - Póster
tipográfico de Toby Triumph.
CONECTEMOS
01
Esta semana trabajaremos lo siguiente:
• Historia de la tipografía
• Escritura
• La tipografía
• La tipografía digital
• Casas tipográficas
Logro de la sesión: Al finalizar la sesión, los estudiantes identificarán los
diferentes estilos tipográficos tomando en cuenta diferentes datos sobre la
historia de la tipografía y los tipos de escritura.
01 CONECTEMOS
CONECTEMOS
01
Reflexión libre:
¿Qué opinas de las letras dentro del diseño gráfico
y la necesidad de saber trabajarlas en tu carrera?
Historia de la tipografía
La escritura es el hito que separa la
prehistoria de la historia.
...El nacimiento de la proto-escritura del siglo
IV a.C (edad de bronce), conformada por
ideogramas y pictogramas en la escritura
cuneiforme en la antigua Sumeria en
Mesopotamia; la escritura jeroglífica en
Egipto, la escritura Lineal a y b en Grecia...JE
Gómez Ospina - 2020 -
repository.libertadores.edu.co
Historia de la tipografía
CONSTRUYAMOS
02
Cita: Rescatado de: https://repository.libertadores.edu.co/bitstream/handle/11371/2949/G%c3%b3mez_Edisson%20_2013.pdf?sequence=1&isAllowed=y
Imagen 1: Scrittura Cuneiforme. Recuperado de https://miobook.raffaellodigitale.it/progetti/129/risorse/4-antropologico/PHOTOGALLERY/17-scrittura-cuneiforme/scrittura-
cuneiforme.html
Escritura cuneiforme
La escritura
Imagen 2: Cartel: Quiet Piktogramm Kostenloses Stock Bild, rescatado
de:https://www.publicdomainpictures.net/
La escritura
Sistema de representación gráfica de un idioma, por
medio de signos trazados o grabados sobre un
soporte. En tal sentido, la escritura es un modo
gráfico específicamente humano de conservar y
transmitir información.
Tipos de escritura
Pictográfica - Ideográfica - Alfabética.
CONSTRUYAMOS
02
Cartel con los tres tipos de escritura
PICTOGRAMA
Elemento gráfico que
describe una acción o serie
de acciones mediante
referencias o pistas visuales.
CONSTRUYAMOS
02
IDEOGRAMA
Elemento gráfico que
representa una idea o un
concepto.
ALFABETO
Sistema de escritura formado
por signos (llamados letras)
que en general representan
fonemas.
Escritura pictográfica
Imagen 3: Composición basada en: 1.- upload.wikimedia.org/wikipedia/commons/7/7c/Zebu_silhouette.svg : commons.wikimedia.org
2.- faculty.evansville.edu/rl29/art315-316/type1-1a.html 3.- pixabay.com/de/vectors/piktogramm-schwimmbad-schwimmen-2026956/
CONSTRUYAMOS
02
Viento
Chino
contemporáneo
Reciclaje
CONSTRUYAMOS
02
Escritura ideográfica
Imagen 4: Composición basada en: 1.- commons.wikimedia.org/wiki/File:Recycle-91.png 2.-
upload.wikimedia.org/wikipedia/commons/2/23/%E9%A2%A8-order.gif Imagen 5. Comparative
evolution from pictograms to abstract shapes, in cuneiform, Egyptian and Chinese characters.
Rescatado de: en.wikipedia.org
Del pictograma
a lo abstracto
1200 a.C. Fenicios
crean alfabeto Fonético (A)
1000 a.C. Grecia (Alpha)
origen de “Latinos”
5000 a.C.
Buey (Aleph)
Escritura alfabética
Pictográfica – Ideográfica
CONSTRUYAMOS
02
Imagen 6: Elaboración propia
CONSTRUYAMOS
02
Imagen 7. Historia de la Escritura: El
primer alfabeto. Recuperado de:
https://www.youtube.com/watch?v=
z8XuI_y_BqY
Caligrafía con plumas
artesanales.
Video: Historia de la Escritura: El primer alfabeto.
https://www.youtube.com/watch?v=z8XuI_y_BqY
La tipografía
Tipografía:
esta palabra procede de la
unión de tres componentes:
“tipos” que significa molde,
“graphos” que puede
traducirse como “escribir o
grabar” e “ia” que es
equivalente a “cualidad o
acción”. Basado en Wikipedia.
La tipografía
Definición etimológica
CONSTRUYAMOS
02
Imagen 8: tipo de la familia. rescatado de: https://es.wikipedia.org/wiki/Tipo_de_letra
Tipo/molde de ligadura fi
CONSTRUYAMOS
02
Parece una justa ironía el que los
primeros impresores con tipos
móviles hayan tenido ellos
mismos que emigrar de sus
ciudades alemanas hacia otras
comarcas,dado lo amenazante
de su invención. Para la Iglesia los
artistas negros representaronun
riesgo doble:
Avance del conocimiento
CONSTRUYAMOS
02
Político-ideológico por pretender imprimir
versiones “no oficiales” de la Biblia
Político-sindical ya que los scriptoria de los
monasterios podían perder gran parte de su
“mercado editorial”.
Consolo, C. p.19
Preguntas libres para reflexionar
¿Creen ustedes que con esta tecnología
se ha democratizado el conocimiento?
¿Antes el conocimiento lo tenían solo algunos?
CONSTRUYAMOS
02
CONSTRUYAMOS
02
Impresión usando madera / woodblock
printing.
Evolución de la imprenta: Los tipos móviles
Imagen 9: Woodblock Pinting, imagen de news.com recuperado de: sutori.com/story/block-printing-history--4R3xc764vG3HqAyLhZxKncxC
Imagen 10: Metal movable type. Foto tomada por Willy Heidelbach recuperada de Wikipedia bajo licencia CC.
Tipos móviles de metal para imprenta.
CONSTRUYAMOS
02
Línea de
tiempo
de la
imprenta
Fuente: Web
CONSTRUYAMOS
02
Imagen 11. Historia de la Escritura: Y
la escritura cambió el mundo.
Recuperado de:
https://www.youtube.com/watch?v=
kMH5hmXhMNs&t=1s
Importancia del tipo de
papel para la impresión
tipográfica y la escritura
caligráfica.
Video: Historia de la Escritura: Y la escritura cambió el mundo.
https://www.youtube.com/watch?v=kMH5hmXhMNs&t=1s
Reflexión libre:
● ¿Qué características sociales y tecnológicas intervinieron en esta
historia?
● ¿Creen que hubo cambios en la cultura y la tecnología que apoyaron la
construcción de cada máquina?
● ¿Cómo creen que impacta esto en el desarrollo del diseño gráfico?
CONSTRUYAMOS
02
La tipografía digital
Tipografía digital
La tipografía digital comprende a un conjunto de dibujos de
tipo vectorial que representan letras y números. Estos pueden
escalarse y redimensionarse sin que la calidad de dichos
dibujos se reduzca.
CONSTRUYAMOS
02
Fuente: Autor desconocido está bajo licencia CC
BY-SA-NC
Imagen 12. El texto suavizado utiliza
píxeles de tono medio, ya sea en gris
(arriba) o en color (abajo), además del
negro para crear la ilusión de caracteres
con contornos suaves. Recuperado de
https://creativepro.com/state-e-book-
typography/
CONSTRUYAMOS
02
Video: Biografía Susan Kare.
https://www.youtube.com/watch?v=sniCbS16E9c
Susan Kare y la revolución
del diseño gráfico para
sistemas operativos.
Casas tipográficas
CONSTRUYAMOS
02
A las casas tipográficas se les denomina también fundidoras de fuentes:
El concepto de fundición se ha reinterpretado para representar a distribuidoras o
estudios donde se venden y/o crean fuentes. Es decir, en el salto de lo mecánico a lo
digital se ha manteniendo la denominación. Desde el metal a las pantallas. (Sleepydays, 2018)
¿Qué casas tipográficas puedo visitar?
Cuando quieras elegir una buena tipografía e ir a la segura, elige primero las mejores
“casas” tipográficas. Como por ejemplo: Hoefler&Co. (DAVO GTZ, s.f.)
CONSTRUYAMOS
02
Imagen 12, 13, 14. Jonathan Hoefler: Typeface Design. Recuperado de:
https://www.netflix.com/watch/80237098?trackId=255824129&tctx=0%2C0%2C
e324b441-401a-4266-9ef5-cdb6eb8e90c4-75186504%2Ce324b441-401a-4266-
9ef5-cdb6eb8e90c4-75186504%7C2
Video: Jonathan Hoefler: Diseño tipográfico.
Disponible en Netflix. (Serie Documental Abstract: El arte del diseño).
CONSTRUYAMOS
02
Existen muchas páginas para
descargar fuentes. Pero lo
recomendable es buscar páginas
como Google Fonts que otorga
licencias de uso y presenta familias
tipográficas completas con
bastantes variables que son las que
un diseñador profesional necesita
para trabajar.
Actividad
aplicativa 1
I Shoot the Serif
Poner el ojo en el Serif/Serifa
1. Jugar en línea: El docente comparte el juego,
(www.tothepoint.co.uk/us/fun/i-shot-the-serif)
los estudiantes jugarán en nivel JUNIOR
2. Los estudiantes anotarán su puntaje y realizarán
comentarios a través de un padlet.
Actividad Aplicativa 1
Diviértete apuntando y disparando a las letras con serifa de esta tabla de objetivos.
El estudiante que hace el menor tiempo es el ganador.
Actividad
aplicativa 2
1. Sans Serif en grupo. Los estudiantes se unen en grupo y
cada participante toma una foto de una San Serif que
puedan encontrar en su casa.
1. Luego la suben al repositorio y le colocan leyenda
estandarizada.
Estilo de leyenda
para repositorio:
Autor: Grupo (Letra), promedio (IL1) y semestre(21-1),
Estilo: Sin Serif, Objeto fotografiado* y donde o web.
Ejemplo:
José Diaz, IL1, 21-1, Sans Serif, Foto diccionario en mi
casa.
*Cada grupo debe tener como mínimo el 50% de su entrega con fotos originales.
Actividad Aplicativa 2
Ejemplos:
Adolfo Cuba,
IL1, 21-1,
Sans Serif,
Foto de caja
de zapatillas
en mi casa.
María Huamaní, IL1, 21-1, Sans Serif,
Foto de portarretrato en mi casa.
Respuesta individual
¿Qué le transmite la letra de la foto?
¿Por qué cree que esa letra fue usada en ese producto?
CONSTRUYAMOS
02
Avance de la
evidencia AA1
¿En qué consiste?
El estudiante selecciona 3 fuentes tipográficas y aplica
diferentes estilos, donde identifica las siguientes partes:
astas, travesaños, hombros, serifas, colas y ápices.
Ambos ejercicios son sustentados y argumentados en
un párrafo.
Fuente: Esta foto de Autor desconocido está bajo licencia CC BY-SA-NC
Avance de la Actividad de Aprendizaje (AA1)
1. Revisamos los lineamientos
CONSTRUYAMOS
02
2. Revisamos la rúbrica de evaluación
Esta foto de Autor desconocido está bajo licencia CC BY-NC-ND Esta foto de Autor desconocido está bajo licencia CC BY-NC
Presentamos nuestros avances de la AA1
CONSTRUYAMOS
02
Esta foto de Autor desconocido está bajo licencia CC BY-NC-ND
REFLEXIONEMOS
03
Respondemos las siguientes preguntas:
• ¿Qué hemos aprendido?
• ¿Qué significa la palabra tipografía?
• ¿Existe una clasificación para esta tipografía?
• ¿Qué podemos concluir acerca del uso y la
personalidad de la tipografía paloseco sin serif?
Imagen 15. Pregunta. Freepik.
https://www.freepik.es/home
CONECTEMOS
01
Reflexión final:
Luego de todo lo aprendido en esta sesión…
¿Qué opinión te merece, ahora, el universo de las letras dentro del diseño gráfico
y la necesidad de saber trabajarlas en tu carrera?
REFERENCIAS
04
Bibliografía:
• Historia de la tipografía: (avance del conocimiento): CONSOLO, C. (2013). Tipografía en Latinoamérica:
Orígenes e identidad. Sao Paulo, Brasil. Blucher.: La herencia europea, p.19.
• Clasificación: solo de las Sans Serif vs Old Style, J, (año). Phyco Typo, País, editorial. p.43.
• Clasificación completa: WILLIAMS, R, (2004) The Non-Designer's Design Book, California, PeachPit Press.
Recuperado de: https://diegopiovesan.files.wordpress.com/2010/07/livro_-_the_non-designers_desi.pdf
• Personalidad tipográfica: Personalidad Tipográfica, p.20 recuperado de:
http://repositorio.utn.edu.ec/bitstream/123456789/8055/1/05%20FECYT%203329%20TRABAJO%20DE%2
0GRADO.pdf
• Historia de la tipografía: (avance del conocimiento): CONSOLO, C. (2013). Tipografía en Latinoamérica:
Orígenes e identidad. Sao Paulo, Brasil. Blucher.: La herencia europea, p.19.
• Ferrer A., Gomez D., (2013). Escritura y tipografía. Universitat Oberta de Catalunya.
REFERENCIAS
04
Otros recursos:
• WGBH Educational Foundation (Producción). (23 de septiembre de 2020). De la A a la Z: el primer
alfabeto. (Temporada 47. Episodio 1). [Episodio de serie documental] En
https://www.pbs.org/wgbh/nova/series/a-to-z/
• WGBH Educational Foundation (Producción). (23 de septiembre de 2020). De la A a la Z: cómo la escritura
cambió el mundo. (Temporada 47. Episodio 2). [Episodio de serie documental] En
https://www.pbs.org/wgbh/nova/series/a-to-z/
• Dadich S., Neville M., O’Connor D., (2019). Jonathan Hoefler: Diseño tipográfico (Temporada 2. Episodio 6).
[Serie]. Netflix. Dadich S., Neville M., O’Connor D., (2019). Jonathan Hoefler: Diseño tipográfico
(Temporada 2. Episodio 6). [Serie]. Netflix.
https://www.netflix.com/watch/80237098?trackId=255824129&tctx=0%2C0%2Ce324b441-401a-4266-
9ef5-cdb6eb8e90c4-75186504%2Ce324b441-401a-4266-9ef5-cdb6eb8e90c4-
75186504%7C2%2Cunknown%2C%2C%2CtitlesResults%2C%2CVideo%3A80057883%2CdetailsPagePlayButt
on
• Instalar fuentes de Googlefont (paso a paso): https://estudioka.es/como-instalar-tipografias-gratuitas-de-
google-fonts/
• Juego I shoot the Serif: https://www.tothepoint.co.uk/us/fun/i-shot-the-serif/
¡Gracias!

PPT_ SEMANA_1-tipografia digital-historia.pdf

  • 1.
    UD TIPOGRAFÍA Historia dela tipografía impresa y digital
  • 2.
  • 3.
    Presentación del docente: experiencia yexpectativas Fuente: freepik.es Presentación del sílabo, metodología y evaluación de la UD
  • 4.
    ¿Cuál es tuexpectativa de esta unidad didáctica? Descríbelo de manera breve. Fuente: freepik.es Presentación del sílabo, metodología y evaluación de la UD
  • 5.
    Sumilla La unidad didácticaTipografía tiene carácter teórico- práctico. A través de ella se busca que el estudiante sea capaz de elaborar mensajes visuales, empleando elementos tipográficos en el plano bidimensional y de acuerdo con los parámetros de la sintaxis visual, aplicados a la tipografía. La unidad didáctica es fundamental porque permitirá al estudiante observar la cultura tipográfica de su entorno, diseñar y evaluar la cantidad de estímulos necesarios dentro de mensajes escritos (fundamento de legibilidad). Explicación del Sílabo
  • 6.
    Explicación del Sílabo Elementosde competencias (capacidades) Elaborar mensajes visuales, empleando elementos tipográficos en el plano bidimensional y de acuerdo con los parámetros de la sintaxis visual, aplicados a la tipografía.
  • 7.
    Indicadores de logro(IL1, 2, 3 y 4) IL1 • Identifica tipografías y la anatomía de estas a partir de la clasificación de estilos tipográficos (comprensión de la estructura del signo tipográfico y su uso en el entorno). IL2 • Combina fuentes tipográficas, aplicando criterios semánticos y de legibilidad, para componer textos reales y de ficción de acuerdo a los criterios de variables, alineamiento y espaciado. IL3 • Diseña palabras y frases a partir de trazos caligráficos y las técnicas libres del "lettering" (rotulado o dibujado), considerando espaciados e incorporación de elementos no alfabéticos al Lettering. IL4 • Elabora una palabra Semántica y una composición tipográfica a partir de la combinación de fuentes, el significado del mensaje y criterios de composición. Explicación del Sílabo
  • 8.
    • La metodologíade aprendizaje será el portafolio de evidencias • Para la evaluación se utilizarán rúbricas. • A lo largo de la Unidad Didáctica se realizarán 4 evidencias correspondientes a cada actividad de aprendizaje (AA): Explicación del Sílabo AA1 Evidencia 1 Selecciona 3 fuentes tipográficas y aplica diferentes estilos, donde identifica las siguientes partes: astas, travesaños, hombros, serifas, colas y ápices. Ambos ejercicios son sustentados y argumentados en un párrafo. AA2 Evidencia 2 Presenta 3 propuestas diferentes donde el título, párrafo y lista de datos presenta diferencia de jerarquía para tres tipos de textos: descripción de producto, artículo periodístico y texto de ficción (novela). AA3 Evidencia 3 Presenta el análisis de 3 fotos de afiches tipográficos de su entorno y propone 3 nuevas propuestas digitales haciendo el uso correcto de la caligrafía y lettering aplicados al marketing de empresas. Este proyecto se sustenta y argumenta en el portafolio indicando el proceso de desarrollo. AA4 Evidencia 4 Selecciona una palabra y refuerza su significado a partir de trazos caligráficos y técnicas libres del "lettering". Realiza un afiche tipográfico con título, párrafo y lista de datos que presentan jerarquización y refuerzo semántico. Ambas propuestas deben estar sustentadas en su portafolio. Explicación del Sílabo
  • 9.
    Metodología: Portafolio deevidencias ¿En qué consiste esta metodología? Consiste en “una colección de trabajos del estudiante que nos cuenta la historia de sus esfuerzos, su progreso y logros en un área determinada. Esta colección debe incluir la participación del estudiante en la selección del contenido del portafolio, las guías para la selección, los criterios para juzgar méritos y la prueba de su autorreflexión“. (Arter y Spandel, 1992 en Centro para la excelencia docente de la Universidad del Norte de Colombia, s.f.) PROPÓSITO Elaborar grupal o individualmente evidencias de su proceso de aprendizaje las que coleccionarán en un portafolio virtual y les permitirán la autoreflexión y motivará su autoaprendizaje.
  • 10.
  • 11.
    El repositorio yel Portafolio personal Estilo de leyenda para repositorio: Estilo CVS Todo separado por comas (,) 1. Autor: Grupo o estudiante (Letra, promedio y semestre), 2. Estilo, o caligrafía, o lettering, 3. Donde lo consiguieron: web, o foto lugar, o tipografía digital) Ejemplo de leyenda oficial para repositorio. B, 1, 21-1, Sans Serif, Foto de diccionario en casa. Imagen 1. Elaboración propia. Metodología: Portafolio de Evidencias
  • 12.
    Evaluación Evidencia Nombre/ Descripción Actividadde aprendizaje Indicador Peso Semana E1 Selecciona 3 fuentes tipográficas y aplica diferentes estilos, donde identifica las siguientes partes: astas, travesaños, hombros, serifas, colas y ápices. Ambos ejercicios son sustentados y argumentados en un párrafo. 1 IL1 15% 2 E2 Presenta 3 propuestas diferentes donde el título, párrafo y lista de datos presenta diferencia de jerarquía para tres tipos de textos: descripción de producto, artículo periodístico y texto de ficción (novela). 2 IL2 20% 4 E3 Presenta el análisis de 3 fotos de afiches tipográficos de su entorno y propone 3 nuevas propuestas digitales haciendo el uso correcto de la caligrafía y lettering aplicados al marketing de empresas. Este proyecto se sustenta y argumenta en el portafolio indicando el proceso de desarrollo. 3 IL3 30% 6 E4 Selecciona una palabra y refuerza su significado a partir de trazos caligráficos y técnicas libres del "lettering". Realiza un afiche tipográfico con título, párrafo y lista de datos que presentan jerarquización y refuerzo semántico. Ambas propuestas deben estar sustentadas en su portafolio. 4 IL4 35% 8 Participación activa** (PA) 2,3 y 4 IL2, IL3 e IL4 3,5 y 7
  • 13.
    CONECTEMOS 01 Su nombre ypersonalidad… …tipográfica ACTIVIDAD: Presentación del estudiante. El docente comparte una variedad de ejemplos de diseño tipográfico. Y les pide a los estudiantes que dibujen su nombre en una hoja de papel bond en un estilo que los represente. Pueden usar colores. Los estudiantes escribirán su nombre con el estilo y tipo de letra que más les guste y luego verbalmente explicarán por qué. Fuente: Grand Matter Studio - Póster tipográfico de Toby Triumph.
  • 14.
  • 15.
    Esta semana trabajaremoslo siguiente: • Historia de la tipografía • Escritura • La tipografía • La tipografía digital • Casas tipográficas Logro de la sesión: Al finalizar la sesión, los estudiantes identificarán los diferentes estilos tipográficos tomando en cuenta diferentes datos sobre la historia de la tipografía y los tipos de escritura. 01 CONECTEMOS
  • 16.
    CONECTEMOS 01 Reflexión libre: ¿Qué opinasde las letras dentro del diseño gráfico y la necesidad de saber trabajarlas en tu carrera?
  • 17.
    Historia de latipografía
  • 18.
    La escritura esel hito que separa la prehistoria de la historia. ...El nacimiento de la proto-escritura del siglo IV a.C (edad de bronce), conformada por ideogramas y pictogramas en la escritura cuneiforme en la antigua Sumeria en Mesopotamia; la escritura jeroglífica en Egipto, la escritura Lineal a y b en Grecia...JE Gómez Ospina - 2020 - repository.libertadores.edu.co Historia de la tipografía CONSTRUYAMOS 02 Cita: Rescatado de: https://repository.libertadores.edu.co/bitstream/handle/11371/2949/G%c3%b3mez_Edisson%20_2013.pdf?sequence=1&isAllowed=y Imagen 1: Scrittura Cuneiforme. Recuperado de https://miobook.raffaellodigitale.it/progetti/129/risorse/4-antropologico/PHOTOGALLERY/17-scrittura-cuneiforme/scrittura- cuneiforme.html Escritura cuneiforme
  • 19.
  • 20.
    Imagen 2: Cartel:Quiet Piktogramm Kostenloses Stock Bild, rescatado de:https://www.publicdomainpictures.net/ La escritura Sistema de representación gráfica de un idioma, por medio de signos trazados o grabados sobre un soporte. En tal sentido, la escritura es un modo gráfico específicamente humano de conservar y transmitir información. Tipos de escritura Pictográfica - Ideográfica - Alfabética. CONSTRUYAMOS 02 Cartel con los tres tipos de escritura
  • 21.
    PICTOGRAMA Elemento gráfico que describeuna acción o serie de acciones mediante referencias o pistas visuales. CONSTRUYAMOS 02 IDEOGRAMA Elemento gráfico que representa una idea o un concepto. ALFABETO Sistema de escritura formado por signos (llamados letras) que en general representan fonemas.
  • 22.
    Escritura pictográfica Imagen 3:Composición basada en: 1.- upload.wikimedia.org/wikipedia/commons/7/7c/Zebu_silhouette.svg : commons.wikimedia.org 2.- faculty.evansville.edu/rl29/art315-316/type1-1a.html 3.- pixabay.com/de/vectors/piktogramm-schwimmbad-schwimmen-2026956/ CONSTRUYAMOS 02
  • 23.
    Viento Chino contemporáneo Reciclaje CONSTRUYAMOS 02 Escritura ideográfica Imagen 4:Composición basada en: 1.- commons.wikimedia.org/wiki/File:Recycle-91.png 2.- upload.wikimedia.org/wikipedia/commons/2/23/%E9%A2%A8-order.gif Imagen 5. Comparative evolution from pictograms to abstract shapes, in cuneiform, Egyptian and Chinese characters. Rescatado de: en.wikipedia.org Del pictograma a lo abstracto
  • 24.
    1200 a.C. Fenicios creanalfabeto Fonético (A) 1000 a.C. Grecia (Alpha) origen de “Latinos” 5000 a.C. Buey (Aleph) Escritura alfabética Pictográfica – Ideográfica CONSTRUYAMOS 02 Imagen 6: Elaboración propia
  • 25.
    CONSTRUYAMOS 02 Imagen 7. Historiade la Escritura: El primer alfabeto. Recuperado de: https://www.youtube.com/watch?v= z8XuI_y_BqY Caligrafía con plumas artesanales. Video: Historia de la Escritura: El primer alfabeto. https://www.youtube.com/watch?v=z8XuI_y_BqY
  • 26.
  • 27.
    Tipografía: esta palabra procedede la unión de tres componentes: “tipos” que significa molde, “graphos” que puede traducirse como “escribir o grabar” e “ia” que es equivalente a “cualidad o acción”. Basado en Wikipedia. La tipografía Definición etimológica CONSTRUYAMOS 02 Imagen 8: tipo de la familia. rescatado de: https://es.wikipedia.org/wiki/Tipo_de_letra Tipo/molde de ligadura fi
  • 28.
    CONSTRUYAMOS 02 Parece una justaironía el que los primeros impresores con tipos móviles hayan tenido ellos mismos que emigrar de sus ciudades alemanas hacia otras comarcas,dado lo amenazante de su invención. Para la Iglesia los artistas negros representaronun riesgo doble: Avance del conocimiento
  • 29.
    CONSTRUYAMOS 02 Político-ideológico por pretenderimprimir versiones “no oficiales” de la Biblia Político-sindical ya que los scriptoria de los monasterios podían perder gran parte de su “mercado editorial”. Consolo, C. p.19
  • 30.
    Preguntas libres parareflexionar ¿Creen ustedes que con esta tecnología se ha democratizado el conocimiento? ¿Antes el conocimiento lo tenían solo algunos? CONSTRUYAMOS 02
  • 31.
    CONSTRUYAMOS 02 Impresión usando madera/ woodblock printing. Evolución de la imprenta: Los tipos móviles Imagen 9: Woodblock Pinting, imagen de news.com recuperado de: sutori.com/story/block-printing-history--4R3xc764vG3HqAyLhZxKncxC Imagen 10: Metal movable type. Foto tomada por Willy Heidelbach recuperada de Wikipedia bajo licencia CC. Tipos móviles de metal para imprenta.
  • 32.
  • 33.
    CONSTRUYAMOS 02 Imagen 11. Historiade la Escritura: Y la escritura cambió el mundo. Recuperado de: https://www.youtube.com/watch?v= kMH5hmXhMNs&t=1s Importancia del tipo de papel para la impresión tipográfica y la escritura caligráfica. Video: Historia de la Escritura: Y la escritura cambió el mundo. https://www.youtube.com/watch?v=kMH5hmXhMNs&t=1s
  • 34.
    Reflexión libre: ● ¿Quécaracterísticas sociales y tecnológicas intervinieron en esta historia? ● ¿Creen que hubo cambios en la cultura y la tecnología que apoyaron la construcción de cada máquina? ● ¿Cómo creen que impacta esto en el desarrollo del diseño gráfico? CONSTRUYAMOS 02
  • 35.
  • 36.
    Tipografía digital La tipografíadigital comprende a un conjunto de dibujos de tipo vectorial que representan letras y números. Estos pueden escalarse y redimensionarse sin que la calidad de dichos dibujos se reduzca. CONSTRUYAMOS 02 Fuente: Autor desconocido está bajo licencia CC BY-SA-NC Imagen 12. El texto suavizado utiliza píxeles de tono medio, ya sea en gris (arriba) o en color (abajo), además del negro para crear la ilusión de caracteres con contornos suaves. Recuperado de https://creativepro.com/state-e-book- typography/
  • 37.
    CONSTRUYAMOS 02 Video: Biografía SusanKare. https://www.youtube.com/watch?v=sniCbS16E9c Susan Kare y la revolución del diseño gráfico para sistemas operativos.
  • 38.
    Casas tipográficas CONSTRUYAMOS 02 A lascasas tipográficas se les denomina también fundidoras de fuentes: El concepto de fundición se ha reinterpretado para representar a distribuidoras o estudios donde se venden y/o crean fuentes. Es decir, en el salto de lo mecánico a lo digital se ha manteniendo la denominación. Desde el metal a las pantallas. (Sleepydays, 2018) ¿Qué casas tipográficas puedo visitar? Cuando quieras elegir una buena tipografía e ir a la segura, elige primero las mejores “casas” tipográficas. Como por ejemplo: Hoefler&Co. (DAVO GTZ, s.f.)
  • 39.
    CONSTRUYAMOS 02 Imagen 12, 13,14. Jonathan Hoefler: Typeface Design. Recuperado de: https://www.netflix.com/watch/80237098?trackId=255824129&tctx=0%2C0%2C e324b441-401a-4266-9ef5-cdb6eb8e90c4-75186504%2Ce324b441-401a-4266- 9ef5-cdb6eb8e90c4-75186504%7C2 Video: Jonathan Hoefler: Diseño tipográfico. Disponible en Netflix. (Serie Documental Abstract: El arte del diseño).
  • 40.
    CONSTRUYAMOS 02 Existen muchas páginaspara descargar fuentes. Pero lo recomendable es buscar páginas como Google Fonts que otorga licencias de uso y presenta familias tipográficas completas con bastantes variables que son las que un diseñador profesional necesita para trabajar.
  • 41.
    Actividad aplicativa 1 I Shootthe Serif Poner el ojo en el Serif/Serifa 1. Jugar en línea: El docente comparte el juego, (www.tothepoint.co.uk/us/fun/i-shot-the-serif) los estudiantes jugarán en nivel JUNIOR 2. Los estudiantes anotarán su puntaje y realizarán comentarios a través de un padlet.
  • 42.
    Actividad Aplicativa 1 Diviérteteapuntando y disparando a las letras con serifa de esta tabla de objetivos. El estudiante que hace el menor tiempo es el ganador.
  • 43.
    Actividad aplicativa 2 1. SansSerif en grupo. Los estudiantes se unen en grupo y cada participante toma una foto de una San Serif que puedan encontrar en su casa. 1. Luego la suben al repositorio y le colocan leyenda estandarizada. Estilo de leyenda para repositorio: Autor: Grupo (Letra), promedio (IL1) y semestre(21-1), Estilo: Sin Serif, Objeto fotografiado* y donde o web. Ejemplo: José Diaz, IL1, 21-1, Sans Serif, Foto diccionario en mi casa. *Cada grupo debe tener como mínimo el 50% de su entrega con fotos originales.
  • 44.
    Actividad Aplicativa 2 Ejemplos: AdolfoCuba, IL1, 21-1, Sans Serif, Foto de caja de zapatillas en mi casa. María Huamaní, IL1, 21-1, Sans Serif, Foto de portarretrato en mi casa.
  • 45.
    Respuesta individual ¿Qué letransmite la letra de la foto? ¿Por qué cree que esa letra fue usada en ese producto? CONSTRUYAMOS 02
  • 46.
    Avance de la evidenciaAA1 ¿En qué consiste? El estudiante selecciona 3 fuentes tipográficas y aplica diferentes estilos, donde identifica las siguientes partes: astas, travesaños, hombros, serifas, colas y ápices. Ambos ejercicios son sustentados y argumentados en un párrafo. Fuente: Esta foto de Autor desconocido está bajo licencia CC BY-SA-NC
  • 47.
    Avance de laActividad de Aprendizaje (AA1) 1. Revisamos los lineamientos CONSTRUYAMOS 02 2. Revisamos la rúbrica de evaluación Esta foto de Autor desconocido está bajo licencia CC BY-NC-ND Esta foto de Autor desconocido está bajo licencia CC BY-NC
  • 48.
    Presentamos nuestros avancesde la AA1 CONSTRUYAMOS 02 Esta foto de Autor desconocido está bajo licencia CC BY-NC-ND
  • 49.
    REFLEXIONEMOS 03 Respondemos las siguientespreguntas: • ¿Qué hemos aprendido? • ¿Qué significa la palabra tipografía? • ¿Existe una clasificación para esta tipografía? • ¿Qué podemos concluir acerca del uso y la personalidad de la tipografía paloseco sin serif? Imagen 15. Pregunta. Freepik. https://www.freepik.es/home
  • 50.
    CONECTEMOS 01 Reflexión final: Luego detodo lo aprendido en esta sesión… ¿Qué opinión te merece, ahora, el universo de las letras dentro del diseño gráfico y la necesidad de saber trabajarlas en tu carrera?
  • 51.
    REFERENCIAS 04 Bibliografía: • Historia dela tipografía: (avance del conocimiento): CONSOLO, C. (2013). Tipografía en Latinoamérica: Orígenes e identidad. Sao Paulo, Brasil. Blucher.: La herencia europea, p.19. • Clasificación: solo de las Sans Serif vs Old Style, J, (año). Phyco Typo, País, editorial. p.43. • Clasificación completa: WILLIAMS, R, (2004) The Non-Designer's Design Book, California, PeachPit Press. Recuperado de: https://diegopiovesan.files.wordpress.com/2010/07/livro_-_the_non-designers_desi.pdf • Personalidad tipográfica: Personalidad Tipográfica, p.20 recuperado de: http://repositorio.utn.edu.ec/bitstream/123456789/8055/1/05%20FECYT%203329%20TRABAJO%20DE%2 0GRADO.pdf • Historia de la tipografía: (avance del conocimiento): CONSOLO, C. (2013). Tipografía en Latinoamérica: Orígenes e identidad. Sao Paulo, Brasil. Blucher.: La herencia europea, p.19. • Ferrer A., Gomez D., (2013). Escritura y tipografía. Universitat Oberta de Catalunya.
  • 52.
    REFERENCIAS 04 Otros recursos: • WGBHEducational Foundation (Producción). (23 de septiembre de 2020). De la A a la Z: el primer alfabeto. (Temporada 47. Episodio 1). [Episodio de serie documental] En https://www.pbs.org/wgbh/nova/series/a-to-z/ • WGBH Educational Foundation (Producción). (23 de septiembre de 2020). De la A a la Z: cómo la escritura cambió el mundo. (Temporada 47. Episodio 2). [Episodio de serie documental] En https://www.pbs.org/wgbh/nova/series/a-to-z/ • Dadich S., Neville M., O’Connor D., (2019). Jonathan Hoefler: Diseño tipográfico (Temporada 2. Episodio 6). [Serie]. Netflix. Dadich S., Neville M., O’Connor D., (2019). Jonathan Hoefler: Diseño tipográfico (Temporada 2. Episodio 6). [Serie]. Netflix. https://www.netflix.com/watch/80237098?trackId=255824129&tctx=0%2C0%2Ce324b441-401a-4266- 9ef5-cdb6eb8e90c4-75186504%2Ce324b441-401a-4266-9ef5-cdb6eb8e90c4- 75186504%7C2%2Cunknown%2C%2C%2CtitlesResults%2C%2CVideo%3A80057883%2CdetailsPagePlayButt on • Instalar fuentes de Googlefont (paso a paso): https://estudioka.es/como-instalar-tipografias-gratuitas-de- google-fonts/ • Juego I shoot the Serif: https://www.tothepoint.co.uk/us/fun/i-shot-the-serif/
  • 53.