Fundamentos Esenciales de Diseño Gráfico, Tipografía y Animación Web

Fundamentos de Diseño Gráfico y Producción Multimedia

I. Animación Web y Gestión de Recursos (Sprites)

1. Configuración de Sprite para Animación

Si nos pidieran realizar un banner con un sprite cuyas medidas son de 1050 píxeles de ancho x 700 píxeles de altura, ¿qué parámetros se deberían establecer para realizar la animación? (6 puntos)

• Anchura del fotograma: 350 píxeles
• Altura del fotograma: 350 píxeles
• Número de fotogramas: 6

(Nota: Esto implica que el sprite contiene 3 columnas y 2 filas de fotogramas de 350x350 píxeles, sumando 1050x700 píxeles totales).

2. Definición de Ruta para Sprite en Entorno Web

Si tuviéramos que implementar un banner con un sprite, ¿qué ruta deberíamos utilizar, teniendo en cuenta que disponemos de dos carpetas (una local y otra en servidor)? (4 puntos)

Respuesta: Se debe utilizar la ruta que contenga la imagen en el servidor, asegurando su accesibilidad pública.

Ejemplo de ruta absoluta: https://mmdg2.000webhostapp.com/sprite/trump_run.png, donde trump_run.png es el nombre de la imagen.

II. Tipografía, CSS y Estándares Web

10. Kerning por Defecto en CSS

El kerning por defecto en CSS ¿cuál es? (2 puntos)

a) Auto

11. Uso de Tipografías de Google Fonts

Cuando se utilizan las tipografías de Google Fonts, ¿es necesario descargar la tipografía y alojarla en nuestro servidor? (4 puntos)

a) Falso. No es necesario; solo hay que incluir el código de enlace que proporciona el propio Google Fonts en el documento HTML o CSS.

12. Formato SVG en HTML5

¿En HTML5 una imagen con formato SVG se puede utilizar como una imagen PNG, JPG o GIF? (4 puntos)

Verdadero. El formato SVG (Scalable Vector Graphics) es una imagen que se puede utilizar directamente en la etiqueta <img>. Por ejemplo, suponiendo que la imagen se llamara imagen.svg, se pondría: <img src="imagen.svg" alt="Descripción">.

13. Riesgos al Usar Tipografías de Dafont

Si utilizamos tipografía de Dafont, ¿qué errores podemos tener? Explica tu respuesta. (4 puntos)

Cuando se utiliza tipografía de plataformas como Dafont, es posible que la fuente no contenga todos los caracteres necesarios (glifos), como la tilde, la letra eñe (ñ), la diéresis, o ciertos números y símbolos. Esto puede provocar que el texto se muestre incompleto o con caracteres sustitutos (fallback).

14. Diferencias entre Tipografía, Caligrafía y Lettering

¿Qué diferencias hay entre tipografía, caligrafía y lettering? Pon un ejemplo de cada uno. (6 puntos)

Tipografía:

Letra prediseñada y estandarizada, lista para ser reproducida (ejemplo: Times New Roman).

Caligrafía:

Letra ejecutada en directo, escritura a mano que enfatiza la fluidez y el trazo (ejemplo: escritura con pluma estilográfica).

Lettering:

Letra dibujada o ilustrada, donde cada carácter es una composición artística única (ejemplo: un logotipo de marca basado en letras dibujadas a mano).

15. Ajuste de Espaciado entre Caracteres

El ajuste de espaciado que se aplica entre dos caracteres específicos se llama:

c) Kerning

17. Elementos del Renglón Gráfico

Escribe el nombre correspondiente a los elementos del renglón gráfico indicados en la siguiente figura: (10 puntos)

1. Línea Base
2. Altura X (o Altura de Cuerpo)
3. Altura de Ascendentes
4. Altura de Descendentes
5. Altura de Mayúsculas

Clasificación Tipográfica (Ejemplos Adicionales)

A continuación, se listan algunas clasificaciones tipográficas:

• Decorativas
• Sans Serif Básicas
• Cursivas
• Serif Reales

24. Tipografía Estándar para Guion Literario

Un guion literario debe estar escrito con la tipografía y cuerpo...: (4 puntos)

b) Courier New a 12 puntos. Este estándar se utiliza porque permite realizar una estimación precisa de la duración del guion (aproximadamente un minuto de pantalla por página), ya que mantiene la misma cantidad de texto por página.

III. Creatividad, Composición y Conceptos de Diseño

7. Tipología de Infografía para Trayectoria Educativa

¿Qué tipología de infografía aplicarías a la educación de una persona, teniendo en cuenta que tenemos sus datos desde infantil hasta la universidad? Dibuja de manera esquemática los apartados que tendría la infografía. (8 puntos)

b) Secuencial (o Cronológica/Línea de Tiempo).

Esquema de Apartados Sugeridos

1. Título y Datos Personales.
2. Etapa Infantil (Hitos y Fechas).
3. Educación Primaria (Centros, Logros).
4. Educación Secundaria Obligatoria (ESO) y Bachillerato.
5. Educación Universitaria (Grado, Máster, Especializaciones).
6. Resumen de Habilidades y Trayectoria.

19. Definición y Uso del Moodboard

¿En qué consiste un moodboard? ¿En qué fase de un proyecto de diseño usarías un moodboard? (6 puntos)

Un moodboard (o panel de inspiración) es una composición visual que consta de fotos, colores, tipografías, iconos y texturas, utilizada para definir el estilo, la atmósfera y la dirección estética de un diseño o proyecto.

Se utiliza principalmente en la fase de conceptualización o ideación del proyecto.

20. Técnica de Creatividad de Tony Buzan

La técnica de creatividad creada por Tony Buzan, que consiste en un método gráfico que permite organizar con facilidad los pensamientos y utilizar al máximo las capacidades mentales, como expresión del pensamiento irradiante, se denomina: (2 puntos)

b) Mind Mapping (Mapa Mental)

21. Contraste Gráfico: Aguzamiento

Cuando hablamos de contraste en una composición gráfica, el concepto “aguzamiento” se refiere a: (2 puntos)

a) Incremento o exageración de la peculiaridad de un patrón.

22. Estilo Tipográfico "Itálicas"

De los tres ejemplos siguientes, ¿cuál se corresponde con el estilo “itálicas”?

La finita rara (Se asume que esta era la opción correcta de una lista no proporcionada).

23. Síntesis Sustractiva y Color

El concepto “síntesis sustractiva” se relaciona con la imagen... (2 puntos)

Negro (La síntesis sustractiva se relaciona con los pigmentos CMYK, donde la mezcla de todos los colores primarios sustractivos resulta teóricamente en negro).