Discusión:Aura: Skin wiki Casiopea

Tareas relacionadas Semestre 2

Organización: Inicio del Proyecto
1. Ordenar las ideas
2. Leer sobre metodos de trabajo (como la Metodología de Design Sprints)
3. Listar las tareas por hacer
4. Hacer la carta gantt
Sistema de Diseño: Átomos
1. Grillas y Brekpoints (definir distintas pantallas en variables de Figma, revisar el material de Jen Simmons)
2. Estilos de texto (párrafos, títulos, enlaces, etc)
3. Paleta de colores (con descripciones y usos para cada color)
4. Tamaños y usos (tamaños de lineas, espacios, grillas, todo...)
Sistema de Diseño: Moléculas y Organismos
1. Listar visualmente (en Figma, tal vez) todos los componentes por diseñar (con el tiempo y el uso naturalmente se irán añadiendo más y más componentes a esta lista)
2. Establecer un orden de cómo se debe documentar este sistema en Figma
3. Diseñar uno a uno estos componentes utilizando la misma biblioteca de variables y estilos
4. Documentar todo este proceso es crucial (puede ser mediante cápsulas tipo vlogs)
5. Tomar en cuenta variaciones (tamaño, color) y microinteracciones (hover, clicked, focused, etc)
Sistema de Diseño: Extensiones, Pluggins, Etc.
1. ¿Cómo trabaja el sistema de diseño ante códigos ajenos a la wiki?
Sistema de Diseño: Publicar en Figma Community
1. Revisar la documentación de otros sistemas de diseño que existen en la comunidad de Figma
2. Ordenar el documento para mejorar la navegación dentro del mismo
3. Listar las tareas que se deben hacer para tener un sistema bien documentado
4. Redactar los textos y crear las visuales para publicarlo
5. (opcional) Crear una presentación audiovisual del sistema y cómo funciona, para que en el futuro, otros compañeros puedan entrar a colaborar
Código: Familiarización con el Entorno de Desarrollo
1. Realizar una tarea que abarque distintas etapas del proceso de desarrollo de forma rápida, para familiarizarme rápido (a modo de calentamiento y para sentir más seguridad)
Código: Construir Átomos
Código: Construir Moléculas y Organismos
Continuación del Proyecto: Proyecciones a Futuro
1. Preguntarse, ¿de qué manera este proyecto puede continuar a futuro
2. (Por definir) Dejar material para posibles futuras postulaciones a fondos (como los objetivos del proyecto, presupuesto, redactar textos, etc)
Entrega de Título
1. Hacer una lista de que hacer de los entregables finales (ppts, carpeta, videos, etc)
2. Realizar estas tareas
3. Ordenar las páginas de la wiki (al menos revisarlas para corregir cualquier error o mejorar lo que se pueda)

Reflexiones sobre la legibilidad

Luego de la presentación de Título, el día martes 09 de julio, 2024, compatrí unas palabras con Alejandro Garretón sobre este proyecto. De esta conversación, me queda más claro que no es sobre qué tipografía usar, si es serif, sans-serif, eso es preferencia propia y hasta es costumbre del lector. El cómo construir una página legible, tiene que ver con la presición y el cuidado de cómo se construye el párrafo. No se pueden tener líneas de texto etérnas. Alejandro decía que "no es natural" tener un texto gigante. Hay que pensar en las pantallas, y pensar que el párrafo tenga un límite establecido.

Los interlineados también deben ser diferentes. Si el largo de las líneas de texto cambia, el interlineado también debe cambiar. Debemos apostar que la lectura de las páginas sean como las de un libro, quizá. Contínuo, fácil al ojo, que no agote.

Por esto, quizá un fondo color crema no sea tan mala idea. No hacerlo de un gris claro casi blanco. Si va a contener imágenes de fondo blanco "puro", tiene más sentido que contraste realmente con estas imágenes. Si el lector ve que hay una leve diferencia, le chocará el hecho de que el color fondo de la imagen no concuerde con el color de fondo de la página, en cambio si el contraste es mayor, si la diferencia es notoria, es una desición que se nota más intencional, por lo tanto, debe tener una razón, y no molesta.

Más sobre el tema de la legibilidad

Links

Notas tomadas de los links

Lo normal es usar tipografía tamaño 16 pixeles o más, y con interlineado de 1,5 o 2 veces el tamaño de la fuente.
Hay que evitar mezclar distintos tipos de alineación, y la aineación a la izquierda y sin justificar es la más natural para la lectura.
Hay que usar colores que contrasten, pero evitar usar colores muy brillantes, muy oscuros o muy parecidos porque pueden fatigar al lector.
Siempre tener en cuenta la fase de prueba entre distintas pantallas, navegadores y sistemas operativos para asegurarse que se lea bien en todos los formatos.

Revistas digitales de diseño, blogs, u otros sitios similares para mirar y analizar después

Printmag
Creative Review
Graphis
Offscreen
Smashing Magazine (Revisar esta entrada de blog luego, trata sobre ux writing)

Idea para testear la legibilidad

Una idea para testear en la misma escuela la legibilidad de algo, puede ser grabar a distintos profesores y alumnos leyendo en voz alta un texto de dificultad mediana a dificil de leer.

Preparación del ejercicio:

Diseñar unas tres propestas con tipografía y estilos de párrafo distinto que se quieran testear.
Seleccionar unos tres textos (A, B y C) para que se lean. Estos pueden ser, por ejemplo, algún fragmento de un discurso de un profesor fundador. Se debe definir la longitud de este texto, quizá para que se demore, aproximadamente un minuto el lector en leerlo en voz alta.
Luego, mostrar este texto en una pantalla lo suficientemente amplia, como una tablet, para que se pueda mostrar el ancho del párrafo ideal en una pantalla desktop.

Ejercicio:

Se debe tener un guión o instrucciones escritas que se les leerá a todos los participantes por igual.
Se les debe explicar que deberán leer tres textos en voz alta de la manera más natural que puedan, y que se les grabará en audio pero que no se publicará esta grabación en ningún lugar, y que es completamente anónimo.
También se les tiene que explicar que tienen un solo intento, y que si se equivocan en leer no se preocupen, que lean el texto de la mejor manera que puedan.
También hay que explicar que no se deben apurar en leer, sino leer a una velocidad de sea cómoda para ellos.
Se deben tener dos tipos de muestra. Una muestra leerá estos textos con el estilo de párrafo actual de la wiki, y los otros leerán los tres textos con los estilos de párrafo que propuse.
La idea es que la persona que lea estos textos en voz alta, no los conosca ni los haya escuchado desde antes.
Además, en cada testeo, se debería cambiar el orden de los textos (persona 1, puede leer los textos A, B y C, después persona 2, leerá B, A y C, y así...)
Igual podrían ser otras personas, no solo alumnos o profes de la ead, pueden ser los guardias, o alumnos de economía quizá...
También sería interesante preguntar a los usuarios cómo se identifican ellos mismos de su nivel de lectura, qué tanto tiempo dedican a la lectura a la semana, por ejemplo. Algo así...

Resultados:

Se medirán en cada uno de estos párrafos el tiempo en que demoró en leer el texto, las veces que se equivocó el usuario en leer algo (sin darse cuenta, y con darse cuenta), quizá las veces que corrigió algo que dijo (eso pasa a veces que uno lee algo mal, y luego lo repite bien leido), o también según en qué momento se leyó el texto, por ejemplo un numero se asignará según si fue el primer texto leido en tal exercicio, o si fue el segundo texto leido, y así; ese tipo de cosas.
Se debe definir algún tipo de formula que asigne un puntaje al nivel de legibilidad en cada uno de los testeos de fragmentos.
Luego se compararán textos. Primero, se compararán entre los mismos fragmentos, por ejemplo, fragmento A en alegreya, y fragmento A con la nueva propuesta. Luego se deberá sacar un puntaje promedio que compare el fragmento A nuevo del viejo. Así con fragmento B y C, y finalmente, el que tenga el mayor puntaje debería ser la propuesta más legible.

Idea de formula

Valor que se le asigna al fragmento cada vez que se lee

Variables:

Orden en que se leen los textos.
Hora del día o qué tan despiertos se encuentran quizá (como para saber si andan como bien despiertos o andan más distraidos, cosas así)
Qué tan buen lector se considera la persona.
Tiempo de lectura.
Equivocaciones
- Cantidad de palabras que leyó mal sin darse cuenta.
- Cantidad de veces que volvió a leer algo (para corregirse).
- Cantidad de veces que pausó para leer algo bien, ese tipo de cosas.
- Nota: Ese tipo de equivocaciones al leer, se podrán clasificar de mejor manera una vez que se haga el ejercicio.

No variables:

Todos los textos deberían tener la misma cantidad de líneas de texto (por lo menos en la versión de la propuesta nueva).
Cantidad de palabras por fragmento (separarlas en cantidad de palabras "complejas" o largas de palabras más simples (o conectores y no conectores cosas así).

Valores:

Orden del texto (o): el primero debería ser el más dificil, y el último el más fácil ya que tiene más práctica. Puntos de importancia = 3
Energía (e): Si está más despierto se le hará más fácil leer el texto. Puntos de importancia = 2
Buen o mal lector (n): Si es buen lector, hay que quitarle, y si es mal lector, hay que subirle. Los números son -2, -1, 0?, 1 y 2. Puntos de importancia = 2
Tiempo de lectura en segundos (t): Número importante. Puntos de importancia = 10
Cantidad de equivocaciones (x): Número importante. Puntos de importancia = 5

Cada testeo de fragmento =