galera

Gestor para la carrera de Edición

Informática para la Producción Editorial · 26 min de lectura

Diseño inclusivo y accesibilidad

Abrir en Galera

En este apunte 26 partes
  1. Mapa rápido
  2. Glosario técnico
  3. Busquets: «Diseño desde Marte» (cap. «La función»)
  4. Tesis central
  5. Conceptos clave
  6. Leyes de UX (Laws of UX, Yablonski, 2018; pág. 9-16)
  7. Distinciones
  8. Procesos y técnicas
  9. Ejemplos del texto
  10. García, Heredia, Reznik y Rusler: «La accesibilidad como derecho»
  11. Tesis central
  12. Conceptos clave
  13. Marco normativo argentino citado (pág. 5-7)
  14. Distinciones
  15. Ejemplos del texto (Programa de Discapacidad, Filo UBA)
  16. Pautas de accesibilidad académica y de materiales (pág. 14) — muy preguntables
  17. Werneck (2005): Manual sobre Desarrollo Inclusivo…, cap. 3
  18. Tesis central
  19. Conceptos clave
  20. Distinción: ayuda técnica vs. diseño universal
  21. Ejemplos de los medios (pág. 20-22)
  22. Cuadro comparativo / Quién dijo qué
  23. Lo imprescindible (repaso de 5 minutos)
  24. Figuras a insertar
  25. Erratas de las fuentes
  26. Autoevaluación

⚠️ Borrador. Este apunte se armó a partir de los textos del campus, algunos escaneados. Los datos marcados [verificar] o [reconstruido] no están confirmados: contrastalos con la bibliografía. Si encontrás un error, avisame con 💡 Sugerencias.

Textos: Busquets (s. f. [verificar]), «Diseño desde Marte» (cap. «La función: principios y leyes de UX, flujos y prototipos») · García, Heredia, Reznik y Rusler (s. f. [verificar]), «La accesibilidad como derecho. Desafíos en torno a nuevas formas de habitar la universidad» · Werneck (2005), Manual sobre Desarrollo Inclusivo para los Medios y Profesionales de la Comunicación, cap. 3 «Accesibilidad, ayudas técnicas y diseño universal» | Tiempo estimado de lectura: 25 min (el apunte reemplaza la lectura)

Las páginas citadas son las del archivo .txt (pág. N del PDF), no las del libro impreso. Los tres textos son escaneos u OCR: el 18 es una foto de libro con ruido; el 19 y el 20 se leen bien.

Mapa rápido #

Glosario técnico #

Término Definición Dato clave
UX (experiencia de usuario) «Todos los aspectos de la interacción del usuario final con la empresa, sus servicios y sus productos» (Nielsen Norman Group). Busquets la elige entre «definiciones para todos los gustos» (pág. 4).
Patrón de UX «Solución reutilizable a un problema habitual de usabilidad»: reduce la carga cognitiva y da familiaridad. Ejemplo: teclado telefónico 1-2-3 arriba (Bell Labs, años 50-60).
Dark patterns Patrones diseñados para engañar al usuario (comprar o registrarse sin querer). Opuestos a «creíble» (Morville).
Wireframe Representación en baja fidelidad (formas geométricas, gris, casi sin texto). Rectángulo con X = imagen; rectángulo oscuro = CTA.
Prototipo Artefacto que imita la funcionalidad para probarla con usuarios. El resultado esperado son los aprendizajes del test, no el prototipo.
Arquitectura de la información (AI) Organizar, estructurar y etiquetar el contenido para que se encuentre. Morville y Rosenfeld, 1998: usuarios, contenido, contexto.
Card sorting Técnica para ver cómo agrupan el contenido los usuarios. Paso 3 del trabajo de AI.
Accesibilidad Condición del entorno, los productos y la comunicación para ser usados con la máxima autonomía posible. Enfoque de derechos humanos (CDPCD, art. 9).
Ayuda técnica Equipamiento, producto o sistema (de bajo o alto costo) que facilita el acceso a procesos y bienes. Puede ser cinta adhesiva o un bus con rampa.
Diseño universal Diseño de productos, entornos, programas y servicios utilizables por todos «sin necesidad de adaptación ni diseño especializado». 7 principios; no excluye ayudas técnicas.
Lector de pantalla Programa que sintetiza a voz el texto y permite operar con teclado. No reconoce imágenes: exige texto plano y descripciones.

Busquets: «Diseño desde Marte» (cap. «La función») #

Tesis central #

Después de la investigación (inside-out y outside-in), la diseñadora tangibiliza el problema con patrones de UX, diagramas de flujo, wireframes y prototipos para validar o invalidar una hipótesis con usuarios antes de invertir en diseño y desarrollo; validar temprano es barato (pág. 33).

Conceptos clave #

Leyes de UX (Laws of UX, Yablonski, 2018; pág. 9-16) #

Ley / efecto Autor y fecha Qué dice Ejemplo o aplicación del texto
Umbral de Doherty Doherty y Thadani (IBM), 1982, The Economic Value of Rapid Response Time La interacción ideal es cuando nadie espera al otro: ~0,5 s (el estándar previo era de 2 s). Más rapidez, más compras. Animaciones pesadas, imágenes de alta resolución o muchas tipografías frenan la carga; si no es rápida, dar feedback (Tognazzini, 2014).
Ley de Fitts Paul M. Fitts, 1954 Es más fácil seleccionar un objetivo grande y cercano. Ecuación no lineal. Controles de un reproductor de música, juntos y destacados. A veces se usa al revés: botón destructivo lejos para frenar el clic automático.
Ley de Hick (Hick-Hyman) Hick, 1952; Hyman, 1953 Más opciones, más tiempo de reacción. RT = a · log10(n+1) (el texto aclara que otras versiones usan log2). Landing page con pocos elementos frente a otra con formulario largo y navegación completa. Relevante en listas cortas.
Ley de Miller George Miller, 1956, The Magical Number Seven, Plus or Minus Two Memoria de trabajo limitada: siete (±2) elementos. Navegación de tienda online: mostrar ~7 categorías y ocultar el resto (Amazon). El propio Miller cierra su ensayo hablando de una «perniciosa coincidencia pitagórica».
Principio de Pareto Vilfredo Pareto, 1896 (Cours d'économie politique) 80/20: el 80 % de la tierra era del 20 % de la población. Ballmer (Microsoft, 2002): 20 % de los bugs causaba 80 % de los errores. En interfaces: 80 % de los usuarios usa 20 % de las funciones. Sirve para priorizar.
Efecto Von Restorff («de aislamiento») Hedwig von Restorff, 1933 El elemento diferente de una lista es el más recordado. Color distinto en el botón de la acción principal. Imagen: una naranja entre limones (el limón entre naranjas).
Efecto Zeigarnik Bluma Zeigarnik, 1927 (observación en un restaurante en 1920) Se recuerdan mejor las tareas interrumpidas que las terminadas (tensión cognitiva). Barra de progreso del perfil (LinkedIn, Twitter, Slack); porcentaje de un curso.

Advertencia del texto: las leyes de Miller y Pareto no son «absolutamente fiables»; sirven como orientación.

Distinciones #

A B
Útil: tiene sentido para el usuario. Usable: se puede utilizar con facilidad.
Task flow (flujo de tareas): una tarea específica, a alto nivel, simple y sin ramificaciones (login, registro). User flow (flujo de usuarios): enfatiza puntos de entrada y tipos de usuarios; más ramificado. (En la práctica, «casi siempre intercambiables»).
Competencia directa: hace lo mismo que vos (~10 empresas; 5 del país y otras de otros países). Competencia indirecta: producto o servicio similar que sirve de inspiración (seguros, bancos, telecomunicaciones).
Wireframe: baja fidelidad, define estructura. Prototipo: simula interacción para probar.
Prototipo de baja fidelidad: papel, pizarra, fotos enlazadas con la app POP de Marvel. Sirve para interacciones simples. Prototipo de alta fidelidad: animaciones e interacciones realistas (Figma, Framer, ProtoPie…). Más caro y distrae con detalles.

Procesos y técnicas #

Ejemplos del texto #

Teclado telefónico de Bell Labs; controles de música en streaming; landing page (ilustración 21); navegación de Amazon; barras de progreso de LinkedIn, Twitter y Slack; Ballmer y los bugs de Windows y Office.

📄 Ver figura: 18-Diseño desde Marte.pdf, pág. 7 — ilustración 19: dos teclados numéricos (telefónico y de calculadora). 📄 Ver figura: 18-Diseño desde Marte.pdf, pág. 12 — ilustración 21: dos landing pages comparadas (ley de Hick). 📄 Ver figura: 18-Diseño desde Marte.pdf, pág. 20 — ilustración 22: estructura convencional de un diagrama de flujo. 📄 Ver figura: 18-Diseño desde Marte.pdf, pág. 22 — ilustración 23: diagrama de Venn de la AI (usuarios, contenido, contexto). 📄 Ver figura: 18-Diseño desde Marte.pdf, pág. 24-25 — ilustraciones 24 y 25: elementos básicos y anotaciones de wireframes.


García, Heredia, Reznik y Rusler: «La accesibilidad como derecho» #

Artículo del Programa de Discapacidad de la Facultad de Filosofía y Letras (UBA), publicado en la revista Espacios de Crítica y Producción (sección «Políticas públicas e inclusión educativa», págs. 41-55 del impreso).

Tesis central #

La accesibilidad es un derecho humano y una categoría interdisciplinaria, no solo una cuestión edilicia. Las normas son «necesarias, pero no suficientes»: hace falta concientizar, escuchar a las personas con discapacidad como fuentes genuinas y asumir la accesibilidad como política institucional estructural (pág. 2, 6).

Conceptos clave #

Marco normativo argentino citado (pág. 5-7) #

Distinciones #

Dimensión (Sassaki) Sin barreras en…
Arquitectónica Residencias, edificios, espacios y equipamientos urbanos, transporte.
Comunicacional Comunicación interpersonal (cara a cara, lengua de señas), escrita (incluye braille) y virtual (accesibilidad digital).
Metodológica Métodos y tecnologías de estudio, trabajo, acción comunitaria, educación de los hijos.
Instrumental Instrumentos, utensilios y herramientas de estudio, trabajo, recreación.
Programática Barreras «invisibles» en políticas públicas (leyes, decretos), normas y reglamentos.
Actitudinal Preconceptos, estigmas, estereotipos y discriminaciones.
(Tecnológica) No es aparte: atraviesa las demás, salvo la actitudinal.
Modelo (Palacios) Concepción de la discapacidad
Prescindencia Pecado o enfermedad.
Rehabilitador (médico) Persona como objeto de asistencia y rehabilitación.
Social El problema está en las barreras del entorno y las actitudes.

Ejemplos del texto (Programa de Discapacidad, Filo UBA) #

Pautas de accesibilidad académica y de materiales (pág. 14) — muy preguntables #


Werneck (2005): Manual sobre Desarrollo Inclusivo…, cap. 3 #

Manual elaborado por la Escola de Gente – Comunicação em Inclusão para el Banco Mundial (Río de Janeiro, junio de 2005; texto y edición de Claudia Werneck). Se centra en el rol de los medios y los profesionales de la comunicación. En el eje solo entra el capítulo 3 (págs. 40-49 del impreso) y la presentación.

Tesis central #

La accesibilidad, las ayudas técnicas y el diseño universal son instrumentos del modelo social y del desarrollo inclusivo; la accesibilidad es un «activo social universal» que beneficia a toda la sociedad, y los medios deben mostrarlo (pág. 18, 20).

Conceptos clave #

Distinción: ayuda técnica vs. diseño universal #

Ayuda técnica Diseño universal
Idea Solución adaptativa, a menudo individual. Diseño pensado para todos desde el inicio.
Alcance Facilita el acceso de una persona o grupo concreto. Reduce la necesidad de adaptar o readaptar.
Relación Complementaria: el diseño universal no las excluye cuando se necesitan. «Engloba y avanza» respecto de accesibilidad y ayudas técnicas.
Ejemplo Cinta para sostener el lápiz; rampa en un bus. Sitio web accesible desde su concepción.

Ejemplos de los medios (pág. 20-22) #


Cuadro comparativo / Quién dijo qué #

Concepto Autor (año) Texto
Panal de la experiencia de usuario (7 aspectos) Morville (2004) 18
Ley de la experiencia de usuario de Internet Nielsen (2017) 18
Definición de UX («todos los aspectos de la interacción») Nielsen Norman Group 18
Feedback ante cargas lentas Tognazzini (2014) 18
Laws of UX (recopilación) Yablonski (2018) 18
Umbral de Doherty Doherty y Thadani (1982) 18
Ley de Fitts Fitts (1954) 18
Ley de Hick (log10(n+1)) Hick (1952), Hyman (1953) 18
Ley de Miller (7 ± 2) Miller (1956) 18
Principio de Pareto (80/20) Pareto (1896) 18
Efecto Von Restorff von Restorff (1933) 18
Efecto Zeigarnik Zeigarnik (1927) 18
Marco usuarios-contenido-contexto (AI) Morville y Rosenfeld (1998) 18
Seis dimensiones de la accesibilidad Sassaki (2005) 19 y 20
Tres modelos (prescindencia, rehabilitador, social) Palacios (2008) 19
«Disponibles» / «qué pasa entre nosotros» Skliar (2008) 19
Saber técnico vs. saber experiencial Pérez de Lara (1998) 19
Hábitat, «restricciones kafkianas» Coriat (2001) 19
Barreras como omisiones discriminatorias Seda (2014) 19
Buena accesibilidad = para todos Rovira-Beleta y Tresserra Soler (2009) 19
Siete principios del diseño universal; Declaración de Río Manual de Werneck (2005) 20
Texto Foco Idea fuerza
Busquets Método de diseño de producto digital Validar con prototipos y usuarios; usar convenciones.
García, Heredia, Reznik, Rusler Accesibilidad como derecho en la universidad Escucha, modelo social, política institucional y materiales accesibles.
Werneck Diseño universal y desarrollo inclusivo Accesibilidad como activo social; 7 principios; Declaración de Río.

Lo imprescindible (repaso de 5 minutos) #


Figuras a insertar #

Erratas de las fuentes #

Autoevaluación

15 preguntas. Tocá «Ver respuesta» para comprobar. En Galera podés responder con puntaje.

  1. Según Busquets, en el panal de la experiencia de usuario de Morville (2004), ¿cuál de estos aspectos es el que retoma explícitamente las pautas WCAG?

    • a) Creíble
    • b) Localizable
    • c) Accesible
    • d) Valioso
    Ver respuesta

    c) Busquets desarrolla lo «accesible» como el quinto aspecto y remite a las WCAG.

  2. ¿Qué dice la ley de Fitts tal como la presenta Busquets?

    • a) Más opciones aumentan el tiempo de reacción.
    • b) Un objetivo grande y cercano es más fácil de seleccionar.
    • c) La memoria inmediata retiene siete elementos más o menos dos.
    • d) El elemento distinto de una lista es el más recordado.
    Ver respuesta

    b) Es la ley de Fitts; b) es Hick, c) Miller, d) Von Restorff.

  3. ¿Qué ley o efecto explica que una barra de progreso de «completá tu perfil» motive a terminar la tarea?

    • a) Efecto Von Restorff
    • b) Ley de Hick
    • c) Principio de Pareto
    • d) Efecto Zeigarnik
    Ver respuesta

    d) Zeigarnik: la tarea inconclusa se recuerda (ejemplos: LinkedIn, Twitter, Slack).

  4. En un diagrama de flujo, el rombo representa:

    • a) Una decisión que divide el flujo en dos caminos.
    • b) Una interacción del usuario.
    • c) El inicio y el fin del flujo.
    • d) Una pantalla o estado.
    Ver respuesta

    a) El rombo marca una decisión, habitualmente sí/no; el círculo es inicio y fin.

  5. Para Busquets, un wireframe típico es de baja fidelidad: formas geométricas, blanco y negro o grises, casi sin texto.

    Verdadero o falso.

    Ver respuesta

    Verdadero. Los wireframes son de baja fidelidad: formas geométricas, blanco y negro o grises, casi sin texto.

  6. Según Busquets, ¿cuál es el resultado esperado de prototipar?

    • a) Un archivo con todas las pantallas del sitio.
    • b) El reemplazo del wireframe y del diagrama de flujo.
    • c) Los aprendizajes obtenidos al testear con usuarios.
    • d) Un diseño listo para entregar a desarrollo.
    Ver respuesta

    c) «El outcome esperado no es el prototipo en sí mismo, sino los aprendizajes».

  7. ¿Cuál de las siguientes opciones enumera correctamente las tres dimensiones del marco de la arquitectura de la información de Morville y Rosenfeld (1998)?

    • a) Usuarios, navegación y marca
    • b) Contenido, diseño y tecnología
    • c) Contexto, flujo y prototipo
    • d) Usuarios, contenido y contexto
    Ver respuesta

    d) Es el diagrama de Venn de usuarios, contenido y contexto.

  8. En «La accesibilidad como derecho», la tecnológica es una dimensión que:

    • a) Es independiente de las demás.
    • b) Atraviesa las otras dimensiones, excepto la actitudinal.
    • c) Solo aplica a lo edilicio.
    • d) Reemplaza a la comunicacional.
    Ver respuesta

    b) «Debe interpolar las otras accesibilidades, excepto la actitudinal».

  9. ¿Qué modelo de la discapacidad (Palacios, 2008) se focaliza en las barreras que impiden la participación plena y está presente en la CDPCD?

    • a) Social
    • b) Médico
    • c) Rehabilitador
    • d) Prescindencia
    Ver respuesta

    a) El modelo social; el rehabilitador (o médico) ve a la persona como objeto de asistencia.

  10. Según el artículo del Programa de Discapacidad de Filo, las soluciones de buena voluntad de docentes y compañeros pueden suplantar y postergar las responsabilidades institucionales.

    Verdadero o falso.

    Ver respuesta

    Verdadero. Hay que diferenciar las intervenciones provisorias de las medidas estructurales (Seda, 2014).

  11. Para Skliar (2008), en lugar de preguntarse si se está «capacitado» o «preparado», conviene:

    • a) Delegar el tema en un equipo especializado.
    • b) Estar «disponibles» y preguntar «qué pasa entre nosotros».
    • c) Esperar a que exista una norma obligatoria.
    • d) Aplicar protocolos universales de normalización.
    Ver respuesta

    b) Skliar propone la disponibilidad y el «entre nosotros».

  12. Entre las pautas para materiales accesibles del artículo, ¿cuál es correcta?

    • a) Evitar marcadores para no recargar el documento.
    • b) Dejar celdas en blanco para ordenar visualmente las tablas.
    • c) Insertar todo como imagen escaneada para conservar el formato.
    • d) Anteponer un texto auxiliar a imágenes, tablas y gráficos.
    Ver respuesta

    d) Se antepone un texto auxiliar; las celdas en blanco, las imágenes y la falta de marcadores son lo que se desaconseja.

  13. Según el manual de Werneck, ¿qué es el diseño universal en relación con la accesibilidad y las ayudas técnicas?

    • a) Un concepto que las engloba y avanza, sin excluir las ayudas técnicas.
    • b) Una dimensión más de la accesibilidad.
    • c) Un sustituto que elimina la necesidad de las ayudas técnicas.
    • d) Una ayuda técnica de alto costo.
    Ver respuesta

    a) «Engloba y avanza conceptualmente»; la CDPCD aclara que no excluye las ayudas técnicas.

  14. ¿Cuál de estos NO es uno de los siete principios del diseño universal que enumera el manual?

    • a) Mínimo esfuerzo físico
    • b) Flexibilidad
    • c) Rentabilidad comercial inmediata
    • d) Tolerancia para el error
    Ver respuesta

    c) Los siete son: equiparación, flexibilidad, uso simple e intuitivo, capacidad de información, tolerancia para el error, mínimo esfuerzo físico, dimensión y espacio.

  15. Según los comentarios del manual de Werneck, un parque solo para ciegos es un buen ejemplo de inclusión.

    Verdadero o falso.

    Ver respuesta

    Falso.

    El comentario dice que refuerza el modelo médico y segrega: «Inclusión no es privilegiar un grupo en detrimento de otro».


Seguí en Galera: marcá el apunte como leído, respondé la autoevaluación con puntaje y buscá en todos los resúmenes.Abrir en Galera

Todos los apuntes de Informática para la Producción Editorial