Filmoteca Española: Auditoría e Inventario
Design System, Figma, Auditoría, Accesibilidad, Inventario
Entradas Filmoteca Española
El proyecto se inicia con la intención de proponer al Ministerio de Cultura y Deporte un Rebranding y construcción de un Design System para la página de venta de entradas online de la Filmoteca Española. Para ello inicio este proyecto con la auditoría e inventario del sistema actual, con la intención de obtener resultados que apoyen la actualización.
La Filmoteca Española y el Cine Doré son un símbolo en la ciudad de Madrid. Un espacio para los más cinéfilos con la misión de difundir y preservar el patrimonio cinematográfico español.
Actualmente, entradasfilmoteca.gob.es es la plataforma online de venta de entradas y divulgación de la programación mensual del Cine Doré.
El look&feel de esta plataforma online está desactualizada a estos tiempos, no presenta una coherencia de navegación y usabilidad, además de diferentes fallos de accesibilidad digital. Es un formato poco amigable para usuarios diversos y que no brinda la información y servicios de forma accesible.
Un icono cultural que requiere de una actualización desde el punto de vista visual, funcional y accesible para seguir siendo relevante y conectar con cualquier audiencia que reclama un aspecto y contenidos más contemporáneos y al alcance de todos.
Primeros pasos
Realicé una recopilación de información y normas de marca para ir acorde a la identidad corporativa y principios de la organización. Posteriormente inicié la auditoría e inventario de la página con la intención de evaluar la accesibilidad digital, recopilar y reconocer todos los elementos, componentes y estilos que permitan reconocer funcionalidades y carencias digitales que faciliten este proyecto de actualización.
Auditoría e inventario
Siguiendo con el proyecto, en esta fase deconstruiré y catalogaré la interfaz (arquitectura, componentes, contenido, formularios, interacciones y estilos) con la intención de auditar la accesibilidad y facilitar la estrategia de creación del Design System y el Rebranding de la página de venta de entradas.
Accesibilidad Digital
Realicé evaluaciones de accesibilidad digital, una combinación de pruebas manuales y asistidas que cubren aspectos de los criterios de éxito de WCAG 2.2 AA. Los resultados revelaron la necesidad de mejora para este site.
De las pruebas realizadas, se destacan principalmente las siguientes áreas problemáticas:
Campos de entrada ARIA sin nombre accesible (WCAG 4.1.2): Se detectaron errores en la asignación de nombres a los campos de entrada ARIA.
Roles ARIA inadecuados (WCAG 1.3.1): Algunos elementos con roles ARIA específicos no han sido incluidos. Como en el Carrusel de imágenes, en el formulario del buscador
Contraste de color insuficiente (WCAG 1.4.3): Varios elementos no cumplen con los mínimos de relación de contraste de color, lo que dificulta su legibilidad para algunos usuarios. Podemos observarlos en los enlaces de la navegación principal y en los encabezados.
Enlaces sin texto discernible (WCAG 2.4.4): Se encontraron enlaces que no tenían un texto claro para describir su propósito.
Listas que contienen elementos no permitidos (WCAG 1.3.1): Las listas <ul> y <ol> no solo contenían elementos <li>, <script> o <template>, como es requerido.
Problemas de navegación por teclado (WCAG 2.1.1): Usuarios no pueden navegar a todos los componentes de la interfaz interactiva utilizando únicamente el teclado.
Orden de enfoque incorrecto (WCAG 2.4.3): Algunos componentes pierden el foco en un orden que no preserva el significado y la operatividad.
Falta de encabezados y niveles incorrectos (WCAG 1.3.1, WCAG 2.4.6): Se detectaron problemas relacionados con la estructura y jerarquía de los encabezados.
Falta de descripciones accesibles para imágenes (WCAG 1.1.1): Se encontraron imágenes que carecen de atributos alt o que estos no son descriptivos.
Problemas de reflujo en el contenido adaptable (WCAG 1.4.10): Se evidencia que el contenido no es completamente visible sin tener que desplazarse en dos dimensiones, en este caso se puede observar como desaparece el contenido principal en Tablets y Móviles.
Resultados de evaluación de los criterios de conformidad WCAG 2.2 AA
*Resultados de la evaluación de los criterios de conformidad de nivel A, donde el 57,4% de los datos en conjunto no cumplen con la conformidad del criterio
*Resultados de la evaluación de los criterios de conformidad de nivel AA, donde el 69% de los datos en conjunto no cumplen con la conformidad del criterio
En resumen, la página web de Venta de Entradas de la Filmoteca Española presenta una serie de deficiencias en términos de accesibilidad digital, lo que dificulta su uso para ciertos usuarios, especialmente aquellos con discapacidades visuales o de movilidad. Es esencial abordar estos problemas para garantizar que el sitio sea accesible para todos los usuarios.
Conclusiones
Se descubrieron errores de accesibilidad, pérdida de información dependiendo de diferentes resoluciones, elementos definidos sin ningún uso, tipografías y encabezados usados equivocadamente, uso de exceso de colores sin correspondencia a una lógica, overrides sin coherencia visual, párrafos y textos de difícil lectura.
Estos primeros pasos corroboran la premisa inicial, donde asumí que se tendrían que realizar varias tareas de refuerzo para la construcción del sistema de diseño de venta de entradas. Este proceso facilitará los siguientes pasos, como establecer una nueva arquitectura de información, modernizar los procesos e interfaces, evitar el exceso de componentes y estilos, un rebranding digital de la plataforma y un espacio digital accesible para todos los usuarios.
Gracias… continuará.