Proyecto infografía - Grupo 8

Título	Proyecto infografía - Grupo 8
Asignatura	Producción Gráfica
Del Curso	Producción Gráfica 2024
Carreras	Diseño
Nº	4
Alumno(s)	Alva Fsund, Marte Fossum, Jaime Samalea

Contexto histórico

Orígenes y Desarrollo

Las tipografías 'Pixel', también conocidas como 'bitmap fonts', se remontan a los inicios de la computación y los videojuegos, en una época donde las capacidades gráficas de las computadoras eran extremadamente limitadas. A diferencia de las tipografías vectoriales modernas, que pueden escalarse sin perder calidad, las tipografías de píxeles están compuestas por una matriz fija de puntos o píxeles.

Décadas de 1970 y 1980

Computadoras personales y Consolas de videojuegos:

• Las primeras computadoras personales y consolas de videojuegos, como el Apple II, Commodore 64 y las consolas Atari, utilizaban tipografías de píxeles debido a la baja resolución de sus pantallas.

• Las tipografías eran monoespaciales (cada carácter ocupa el mismo ancho) y solían ser de 8x8 píxeles para maximizar la legibilidad dentro de las limitaciones de resolución.

Década de 1990

Sistemas operativos y Videojuegos:

• Con el advenimiento de los sistemas operativos gráficos como Windows y Mac OS, las tipografías de píxeles siguieron siendo esenciales, especialmente en interfaces y videojuegos que aún operaban bajo limitaciones gráficas.

• Las tipografías más detalladas, como las de 16x16 o más, empezaron a aparecer, permitiendo diseños más complejos y variados.

Siglo XXI

Retrogaming y Diseño web:

• La estética retro de las tipografías de píxeles ha experimentado un resurgimiento en el diseño gráfico moderno y en los videojuegos indie.

• También son populares en el diseño web, especialmente en sitios que buscan una apariencia nostálgica o que adoptan la estética del arte digital temprano.

---

Desarrollo técnico de las tipografías Pixel como Mapas de Bits

Motivo del desarrollo

Las tipografías pixel, también conocidas como fuentes bitmap, se desarrollaron principalmente debido a las limitaciones técnicas de las primeras computadoras y dispositivos de pantalla. Aquí están los motivos principales:

• Limitaciones de Resolución:

Las pantallas de las primeras computadoras tenían resoluciones muy bajas comparadas con los estándares actuales. Para asegurar la legibilidad, las tipografías tenían que ser diseñadas para caber en una matriz limitada de píxeles.

• Capacidades de Procesamiento:

Las primeras computadoras tenían capacidades de procesamiento limitadas. El uso de fuentes bitmap era eficiente en términos de procesamiento porque implicaba simplemente encender y apagar píxeles específicos.

• Memoria y Almacenamiento:

Las fuentes vectoriales, que describen formas mediante ecuaciones matemáticas, requieren más memoria y capacidad de procesamiento para renderizarse. Las fuentes bitmap, en cambio, son sencillas de almacenar y renderizar porque consisten en patrones predefinidos de píxeles.

Ajustes de las tipografías al mapa de bits

El ajuste de las tipografías pixel al mapa de bits implica una serie de consideraciones técnicas para garantizar la legibilidad y estética dentro de las limitaciones de píxeles disponibles. Aquí se detallan los pasos y conceptos clave:

• Definición de la Matriz:
• Cada carácter se define dentro de una matriz rectangular de píxeles, como 8x8, 8x16, 16x16, etc.
• El tamaño de la matriz depende de la resolución de la pantalla y los requisitos de legibilidad.

• Diseño de Caracteres:
• Pixel Perfect: Cada píxel se enciende o apaga para formar la forma del carácter. Esto se hace de manera que cada carácter sea reconocible y legible.

• Espaciado: Los caracteres son usualmente monoespaciales en las primeras fuentes bitmap, es decir, cada carácter ocupa el mismo ancho, facilitando el cálculo y alineación.

• Uso de Algoritmos de Antialiasing (Opcional):

Aunque las primeras tipografías bitmap no utilizaban antialiasing, con el tiempo se introdujeron técnicas para suavizar los bordes de los caracteres. Esto implica ajustar la intensidad de los píxeles en los bordes de un carácter para dar la ilusión de una curva más suave.

• Escalabilidad:

Las fuentes bitmap son inherentemente no escalables. Cada tamaño de fuente requiere un conjunto completo de caracteres rediseñados. A medida que las resoluciones de las pantallas mejoraron, se desarrollaron más variantes de las fuentes bitmap para diferentes resoluciones y tamaños.

• Rendimiento:
• Carga Rápida: Las fuentes bitmap se cargan rápidamente porque no requieren cálculo adicional más allá de encender y apagar píxeles.

• Consistencia: Garantizan una representación consistente y predecible de los caracteres en diferentes dispositivos y resoluciones.

---

Tipografía Pix Chicago en Apple

Creación y desarrollo inicial

La tipografía Chicago fue diseñada por Susan Kare en 1983 para ser utilizada en la interfaz del primer Apple Macintosh, lanzado en 1984. Susan Kare, una pionera en el diseño de interfaces gráficas, fue contratada por Apple para trabajar en la creación de los elementos visuales del sistema operativo Macintosh. Su trabajo incluyó iconos, elementos de la interfaz gráfica y tipografías.

Contexto del diseño

• Requerimientos Técnicos: Las pantallas del primer Macintosh eran monocromáticas y de baja resolución (512x342 píxeles). Las tipografías tenían que ser altamente legibles en estas condiciones.

• Inspiración: Kare se inspiró en las letras de las máquinas de escribir y en la necesidad de una legibilidad clara y eficiente.

• Matriz de Píxeles: La tipografía Chicago fue diseñada en una matriz de 9x15 píxeles, lo que permitía una representación clara y funcional de cada carácter dentro de las limitaciones técnicas de la época.

Características técnicas

• Estilo: Sans-serif, con un diseño robusto y claro.

• Tamaño: Inicialmente diseñada en 12 puntos.

• Legibilidad: El diseño de Chicago se centró en la máxima legibilidad posible, utilizando formas simples y claras que funcionaban bien en las pantallas de baja resolución del Macintosh.

Evolución y Uso

• Primeros Años:

Sistema Operativo Macintosh: Chicago fue la fuente principal para la interfaz gráfica del Macintosh. Fue utilizada en menús, cuadros de diálogo y otros elementos de la interfaz.

Reconocibilidad: Su uso extensivo y su diseño distintivo hicieron de Chicago una parte integral de la identidad visual del Macintosh.

• Años 90:

Macintosh System 7: La tipografía Chicago continuó siendo utilizada en versiones posteriores del sistema operativo Macintosh, incluyendo System 7.

Cambio a Fuentes Vectoriales: Con la mejora de las capacidades gráficas y el aumento de las resoluciones de pantalla, Apple comenzó a incorporar fuentes vectoriales en su sistema operativo, que permitían una mayor escalabilidad y flexibilidad.

• Mac OS 8:

Rediseño: Para Mac OS 8, lanzado en 1997, la tipografía Chicago fue rediseñada como una fuente TrueType. Esto permitió una mayor escalabilidad y uso en resoluciones más altas sin perder la esencia del diseño original.

Importancia y Legado

• Identidad Visual: La tipografía Chicago es uno de los elementos más reconocibles de la interfaz gráfica del Macintosh. Su diseño contribuyó a la identidad visual única de Apple durante los años 80 y 90.

• Legibilidad: La claridad y simplicidad de la tipografía Chicago la hicieron ideal para las interfaces gráficas de la época, mejorando la experiencia del usuario.

• Influencia en el Diseño de Tipografías: Chicago ha influido en el diseño de otras tipografías y sigue siendo una referencia importante en el estudio del diseño de tipografías para interfaces de usuario.

---

Proceso de diseño de la infografía

El proceso de creación de la infografía comienza con un análisis general de esta. Primero se estudia la historia y el contexto para entender cómo se ha desarrollado a lo largo de los años y los motivos de su éxito.

En el caso de las tipografías Pixel, éstas se desarrollan en función de una grilla de 32 x 28. Dicha grilla es la resolución de pantalla en el comienzo de estas, en donde la tipografía se ajustaba a la resolución utilizada. A su vez, dicha pantalla de 32x28 estaba subdividida en Bytes, los cuales tenían cada uno otra grilla de 8x8 en donde se posicionaba cada caracter incluyendo en ese espacio tanto el caracter como el espacio con el siguiente.

Debido a esto y a su importancia en el origen y desarrollo de los videojuegos y los principales sistemas operativos, los cuales han evolucionado hasta el día de hoy, decidimos organizar la infografía con un estilo visual ambientado en los videojuegos de arcade y las primeras pantallas.

Para ello, comenzamos con un bocetado previo a mano, para después realizar varias pruebas acerca de la forma en la que se organiza la información dentro de la infografía.

Para el contenido de esta, hemos decidido explicar la información mediante una línea temporal en la cual plasmar la información principal que se ha ido implantando desde la década de los 70.

Diseño de Portada

La idea detrás de la imagen de la portada es referirse a la historia y al uso. La imagen es de los años 70 y muestra a un grupo reunido para jugar Space Invaders. Este es un juego de píxeles y es uno de los primeros videojuegos. Juegos como Space Invaders promovieron una estética de píxeles. La imagen original tenía una pantalla de televisión borrosa, por lo que esta ha sido reemplazada por una imagen del juego, así como un texto en "Chicago Pix" donde dice PIXEL.

Diseño de Infografía