Corrección de prueba y estilos grupo 4

Título	Corrección de prueba y estilos grupo 4
Asignatura	Taller Diseño de Ediciones Digitales
Del Curso	Taller Diseño de Ediciones Digitales 2022
Carreras	Diseño, Diseño Gráfico"Diseño Gráfico" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property.
Nº	10
Alumno(s)	Catalina Riveros, Macarena Alonso, Javiera Ruiz, Juan Pablo Moscoso
PDF	Archivo:Visualizaciónpdf Grupo04.pdf
URL	https://drive.google.com/drive/folders/1Q41I6PvcB-GEVOzD5-VAmqvIP02l2syp?usp=sharing

Introducción

La propuesta consiste en un manual interactivo para estudiantes de diseño en la e[ad] que cursan primer año, fue basado en el libro “Manual de edición y autoedición” de José Martínez de Sousa. La finalidad de la edición es entregar nociones básicas sobre tipografía, diagramación y elementos visuales, a aquellos alumnos que comienzan a adentrarse al mundo del diseño; se abordan temas como anatomía de la tipografía, el modelo de lámina de primer año, textos en general, los colores y sus contrastes. El manual se realizará en grupo, este es conformado por 4 estudiantes: Kathia Cofré, Itay Rojas, Natalia Soto y Catalina Landeros. La interacción se visualizará al exportar la edición en formato EPUB.

Propuestas individuales

Las propuestas individuales se efectuaron para poder probar y percibir las diferentes combinaciones entre los matices establecidos de la paleta de colores monocromática. Así mismo, dentro de todas las propuestas, apareció la implementación de una portada (página de presentación de cada tema), de carácter colorido y llamativo, con el objetivo principal de poder navegar con mayor facilidad a través de vínculos o botones que dirigen al tema relacionado.

Conservamos el diseño de elaborar la página de índice a través de botones interactivos que dirigen a los distintos capítulos, con sus respectivos colores y sus propias portadas. De esta manera el lector puede seleccionar el tema de su interés y vincularse directamente, sin tener que necesariamente visualizar todos los capítulos.

Propuesta grupal

Temas

1. Guías y reglas (Diagramación de página): 1.1 Retículas; 1.2 Márgenes; 1.3 Partes de la edición

2. Letras y caracteres

2.1 Partes de la letra

2.2 Tipos de tipografía / letras

2.3 Clasificaciones de tipografías

2.3.1 Familias tipográficas

2.4 Kerning / Tracking

2.5 Letra inicial / capitular

2.6 Números

3. El texto: 3.1 Longitud alfabética; 3.2 Partes del texto; 3.3 Signos

4. Elementos visuales: 4.1 Imágenes / grabados y tramas; 4.2 Gráficos; 4.3 Color (RGB y CMYK)

Elementos gráficos

Tipografía

Para la presente edición se utilizan las tipografías Raleway y Acumin. Estas fuentes pertenecen a la familia Sans serif, ya que permite adaptarse de mejor manera a las pantallas y a sus resoluciones para los lectores digitales.

Familias tipográficas utilizadas en la edición con sus respectivos colores dependiendo del capítulo. Acumin ha sido tomada desde Adobe Fonts y Raleway desde Google Fonts

Títulos

Se utiliza la tipografía Raleway de estilo Bold, ya que su grosor genera un mayor contraste con la página, permitiendo que la letra no se pierda dentro de una página coloreada.

Cuerpo de texto

Se utiliza la tipografía Acumin desde Adobe; se opta por un tamaño de 20p, teniendo en cuenta que para que una lectura en pantalla sea legible es recomendada un tamaño mayor a 16p. En tanto a las cajas de texto, se emplea un criterio de que los párrafos escritos no fueran mayores a 80 palabras.

Paleta de color

Para la creación de la paleta de color se utiliza un contraste de colores cálidos y fríos. Desde este punto se seleccionan 4 colores con cierto grado de diferenciación entre unos y otros, observando cómo se comportan sobre los blancos y negros dentro de la pantalla.

Íconos

Se crea la familia de íconos en base a la figura circular por ser esta la figura predeterminada de los botones en su generalidad y así generar una familiaridad en el lector para así aumentar su entendimiento de la interacción de forma intuitiva. Aparte se usa esta base circular en el diseño de los botones para coincidir con la cohesión gráfica del libro en un estilo simple y geométrico. Mientras tanto en la elección del color, esta varía según la sección jugando con la paleta de colores y según el fondo sea claro u oscuro para así aumentar su visibilidad.

Ícono home

Tiene la función de regresar al lector al inicio del libro y se escogió la silueta de la casa en referencia al hogar y como uno vuelve a este todos los días, o sea vuelvo al inicio de donde empezó su día.

Este botón es multiuso y puede ser usado de distintas formas dependiendo de la función requerida, estas pueden ser: navegación entre páginas, pops ups o como navegador en un objeto de multiestado. Por esto es que su diseño es simple para poder ser re-usado de distintas formas. Las interacciones se utilizarán en casos donde la información a mostrar sea extensa, con el fin de evitar la utilización de páginas de más, aprovechando las cualidades permitidas por el programa.

Diagramación del formato

Para la edición se opta por un formato vertical, ya que en el uso cotidiano las aplicaciones para celular funcionan mayoritariamente en este formato. Para lograr este propósito, se opta por una medida predeterminada para IPhone 7, 6 y 8 desde InDesign. En cuanto a la diagramación, se divide la página en márgenes de 6 columnas y 6 filas donde se dispone el contenido.

Retícula utilizada para el formato de la edición. Se compone de seis columnas y seis filas obviando el margen

Propuesta páginas tipo

Índice y Portadilla

Para el diseño del índice se propone una separación de los 4 temas por colores, al seleccionar uno de los temas se dirige hacia a la portadilla del tema escogido. En el caso de la portadilla, se propone una por cada uno de los 4 temaa. Esta portadilla posee los colores del tema, el nombre y letras o formas que permitan ilustrar.

Páginas de contenido

Se propone el uso de una franja que dispone de un subtema a tratar en la página. Se utiliza la tipografía Raleway para el título de la página y Acumin variable para el cuerpo de texto. En cada tema cambia el color que predomina.

En la primera propuesta (páginas tipo 1), el fondo de la página es blanco y la franja contiene únicamente el nombre del subtema a tratar, el texto se encuentra en la parte inferior de la página. En la segunda propuesta (página tipo 2), el fondo de la página es de color para romper con la página análoga blanca, la franja contiene el título y el texto que lo desarrolla, fuera de la franja se encuentra el resto del contenido acompañado de su ilustración.

Vista formato PDF

Propuesta interacción

Como primera propuesta de interacción, se realizaron botones sobre distintos fondos a partir de nuestra paleta de colores. En una primera instancia, los botones son de color blanco, pero al apretarlos cambian a un color de la temperatura opuesta a la del fondo en el que se encuentran, por ejemplo, al apretar el botón en el fondo de color frío, se vuelve de un color cálido. La finalidad de esto es resaltar el botón y su interacción al producir un contraste de temperatura.

La segunda propuesta de interacción se presenta en un prototipo de página del manual, esta interacción consiste en poder visualizar las variables de la letra; su peso, el ancho de la caja y la inclinación.

Avance 12-09

Planificación de temas y páginas

Visualización en celulares