1. Desarrollo del Proyecto Web Interaccion2023
Esta página forma parte de la contribución realizada al congreso Interacción2023 del articulo titulado:
Metodología MPIu+aX, de Diseño Centrado en el Usuario que empatiza con el usuario y genera una mejor experiencia accesible (De la teoría a la práctica)
2. Proceso de desarrollo del sitio web del congreso Interacción 2023
Primero se presenta el caso de uso: el desarrollo de la web del congreso Interaccion2023 con las técnicas seguidas de la metodología MPIu+aX.
Luego se explica la metodología MPIu+aX Modelo de Proceso de la Ingeniería de la usabilidad y la accesibilidad en la que se tiene en cuenta la eXperiencia de Usuario Accesible.
3. Caso de uso: desarrollo de la web del congreso Interacción 2023
3.1. Antecedentes y objetivos
A continuación se presenta primero los antecedentes y objetivos del sistema.
El Congreso Internacional Interacción Persona Ordenador se celebra desde el año 2000 con el objetivo de reunir a investigadores, estudiantes y profesionales de la Interacción Persona-Ordenador (IPO), tanto del mundo académico como de la industria, para promover la presentación de propuestas innovadoras, el intercambio de ideas y la discusión.
Las primeras ediciones del congreso no tenían presencia online y en el año 2003 se creó una sola página web con el horario del congreso. Durante las siguientes ediciones, el diseño de la web ha ido según la implicación del comité organizativo. Los años 2005, 2010 y 2013 el congreso se celebró dentro del Congreso Español de Informática (CEDI) y la web tuvo que adoptar el diseño visual propuesto por esta organización. A partir del año 2018 la web del congreso se realizó siguiendo una misma plantilla de WordPress (Zerif Lite) pero tenía algunos problemas de accesibilidad relacionados directamente con la plantilla y el contenido (documento PDF del articulo).
El planteamiento de la nueva web del congreso Interacción 2023 se ha realizado considerado algunas premisas. Estas son:
- Inspiración en la estética de la web del congreso interacción celebrado en Lleida 2004 y tener en cuenta el color de la Universidad de Lleida (Diseño de la interfaz).
- Posibilidad de que el usuario pueda personalizar la interfaz (incluir la opción de modo oscuro/claro – Dark Mode)
- Adaptación del contenido según dispositivo (Diseño responsive)
- Desarrollo con un sistema de gestión de contenidos (CMS) para poder permitir crear contenido a cualquier miembro del comité del congreso.
- Ofrecer la información de forma empática y adaptada al modelo mental y a las necesidades de los asistentes al congreso.
- Crear un sitio web con características de usabilidad y accesibilidad para disponer de una buena eXperiencia de Usuario Accesible, para que todos los usuarios se beneficien.
- Disponer de retroalimentación del usuario en la propia web para analizar la utilidad de la información mostrada en la web.
- Posibilidad de contactar entre miembros asistentes del congreso para crear una red de expertos en IPO, a través de la creación de un grupo Linkedin.
- Disponer de una interfaz que identifique anualmente el congreso Interacción
Para lograr llevar a cabo estos objetivos, se realizaron diferentes iteraciones en la metodología MPIu+aX para avanzar de forma sistemática en la creación del sistema web. Cada iteración o sprint del proyecto se realizaba con una temporalidad de 1 semana, y los resultados significativos y avances se mostraban en la reunión quincenal del comité del congreso.
3.2. Técnicas seguidas en cada fase del desarrollo del proyecto
A continuación, se indica como se han abordado las distintas técnicas en las fases de desarrollo de la metodología MPIu+aX para desarrollar el proyecto del sitio web del congreso Interacción 2023.
En esta fase se han trabajado estas técnicas
análisis etnográfico
Journey customer map
Journey customer map, define la experiencia del cliente en el uso de un producto o servicio.
Más información
- Journey Map Template
- Interaction Design
Desarrollado para Interacción2023
Se presenta el esquema del Journey customer map trabajado para la web del congreso
![UserJourneyMap0.1](http://172.16.240.160:8080/wp-content/uploads/2023/05/UserJourneyMap0.1.png)
análisis etnográfico
Mapa de empatía
Mapa de empatía, identifica lo que el usuario hace, piensa, siente, dice, escucha, etc. en una situación determinada. Luego, se han de determinar sus necesidades y cómo se siente a lo largo de la experiencia. Es importante considerar a las barreras y fuentes de molestia.
Más información
Desarrollado para Interacción2023
Se presenta el esquema del Mapa de empatía trabajado para la web del congreso
![mapaempatiaInteraccion2023](http://172.16.240.160:8080/wp-content/uploads/2023/05/mapaempatiaInteraccion2023.png)
Implicados (Stakeholders)
Mapa de Actores
Mapa de actores, refleja de forma gráfica las conexiones entre los distintos actores sociales que componen un servicio.
Más información
Desarrollado para Interacción2023
Se presenta el esquema del Mapa de actores trabajado para la web del congreso
![mapadeactoresInteraccion2023](http://172.16.240.160:8080/wp-content/uploads/2023/05/mapadeactoresInteraccion2023.png)
Clasificar los Usuarios
Personas
Personas, son personajes ficticios creados en función de su investigación para representar los diferentes tipos de usuarios que podrían usar el servicio, producto, sitio o marca de manera similar. La creación de personas ayuda al diseñador a comprender las necesidades, experiencias, comportamientos y objetivos de los usuarios.
Más información
Desarrollado para Interacción2023
Se presentan las Personas consideradas para la web del congreso
Congresista JunioR
MARíA IBAÑEZ
Escenario: Maria tiene 36 años, es estudiante de doctorado de la Universidad Juan Carlos.
Objetivo: Esta interesada en publicar su investigación en congresos de IPO para que se conozca su trabajo.
Discapacidad: Maria no tienen ningún tipo de discapacidad.
![](https://library.generateblocks.com/wp-content/uploads/2020/07/team-2.jpg)
Congresista Senior
MARIO IBAÑEZ
Escenario: Mario tiene 56 años, es profesor lector de la Universidad de Sevilla
Objetivo: Esta interesado en participar en congresos que tengan postprocedings con un alto índice de impacto para mejorar su catetoría laboral en su universidad.
Discapacidad: Mario tiene baja visión
![](https://library.generateblocks.com/wp-content/uploads/2020/07/test-3.jpg)
En esta fase se han trabajado estas técnicas
Diseño de la actividad
Mapa de Interacción de usuarios
El mapa de interacción, ayuda a definir lo que el usuario puede hacer en el sistema.
Más información
Desarrollado para Interacción2023
Se presenta el esquema del Mapa de interacción trabajado para la web del congreso
![mapa-interaccionInteraccion2023](http://172.16.240.160:8080/wp-content/uploads/2023/05/mapa-interaccionInteraccion2023-1.png)
Diseño de la interfaz
Sistema de diseño
Un sistema de diseño, es un conjunto robusto, consistente, y centralizado de elementos jerarquizados y reutilizables, que permiten a los equipos de diseño UX, y desarrollo, trabajar de una manera más rápida y eficaz
Más información
Desarrollado para Interacción2023
Se presenta el esquema del Sistema de diseño trabajado para la web del congreso
Falta incluir
Diseño de la interfaz
Benchmarking
Benchmarking, para conocer las características de los competidores de nuestro producto y/o para saber cómo otros productos –no necesariamente competidores– resuelven determinados problemas.
Más información
Desarrollado para Interacción2023
Se presentan una tabla con la información analizada de congresos anteriores.
Edición y Sede | Características | Organización de páginas |
---|---|---|
2000 – Granada, España (sin presencia online) | ||
2001 – Salamanca, España (sin presencia online) | ||
2002 – Leganés, España (sin presencia online) | ||
2003 – Vigo , España (sin visualización en web archive) | ||
2004 – Lleida, España(web archive) | Menú izquierda Diseño: rojo y negro Sistema desarrollo: HTML – CSS | Presentación – Sede (Lleida – Universitat de Lleida – Como llegar) Organización (Comite Honor – Comite Programa – Comite Organización – Patrocinadores – Colaboradores) Programa (Congreso – Tutoriales – Conferenciantes – Seminario Doctorado – Día de la industria) Fechas Importantes Ponencias (Normas de Participación – Plantillas – Fechas limite – Instrucciones envio – Tipo Participación – Gestión ponencias) Inscripción Alojamiento (hoteles) Enlaces |
2005 – Granada, España | Menu: sin menu Diseño: Cedi Sistema desarrollo: HTML – CSS | |
2006 – Puertollano, España | Menú izquierda Diseño: rojo y negro Sistema desarrollo: HTML – CSS | Inicio linea roja Presentación linea roja Organización Comité de Organización Sede Patrocinadores Colaboradores Alojamiento linea roja Programa Temática Estructura Comité científico Tipos de participación Conferenciantes plenarios Programa del congreso Actas linea roja Calendario linea roja Contribuciones Normas Plantillas Instrucciones de envío Gestor de contribuciones linea roja Inscripción linea roja Enlaces |
2007 – Zaragoza, España (sin presencia online) | ||
2008 – Albacete, España (sin presencia online) | ||
2009 – Barcelona, España y Armenia, Colombia | Presentación – Organización – Calendario – Contribuciones – Inscripción – Sede – Programa – Expositores – Blog | |
2010 – Valencia, España | Menu: sin menu Diseño: Cedi Sistema desarrollo: HTML – CSS | |
2011 – Lisboa, Portugal | ||
2012 – Elche, España y México, México | Menú superior | ELCHE Presentación – Temas interés – Calendario – Contribuciones – Organización – Inscripción – Sede – Programa – Eventos Sociales – Blog MÉXICO Inicio – Programa – Conferencias – Concurso estudiantes – Noticias – Inscripción – Comité- Organización – Sede – Hotel |
2013 – Madrid, España | Menú superior Diseño congreso CEDI | Home – Programa- Organizadores – Inscripción y Alojamiento – Sedes – Patrocinadores y Colaboradores – Prensa |
2014 – Puerto de la Cruz. Tenerife, España | Menú superior Diseño: colores rojo y blanco Enlace a redes sociales (twitter, facebook, linkedin, google+) https://twitter.com/Interaccion_ull | Home – About – Topics – Committees – Dates – Submission – Registration – Contact – Special Tracks |
2015 – Vilanova i la Geltrú, España | Menú superior. | Home – About- Topics – Committees – Dates – Submission – Registration – Program – Sponsor – Contact |
2016 – Salamanca, España | Menú superior en dos filas | WELCOME – DATES – COMMITTEES – SUBMISSIONS – TOPICS – WORKSHOP – SPECIAL TRACK – CONTEST – KEYNOTE – REGISTRATION – VENUE – SCHEDULE – PROGRAM – ORGANIZERS – CONTACT |
2017 – Cancún, México | Web sin hoja de estilo | Date – Topics – Speakers – Contest – Submissions – Registration – Collaborating Universities – Organizing Committee – Partners – Venue – Contact |
2018 – Palma de Mallorca, España | Menú superior desplegable Diseño: Zerif Lite desarrollado por ThemeIsle Sistema desarrollo: WordPress | About (The conference – Dates – Topics – Committee – Organizers) Authors (Contributions – IV EnGendering Technologies Workshop – Special Tracks (Human – Agent Social Interaction: Design principles and Practices – Advances and Challenges in HCI in Agriculture) – CHIJOTE’18 – II JOrnada de Trabajo sobre Enseñanza de CHI) Attendees (Final Program – Registration – Keynotes – Venue/Travel) Concurso |
2019 – San Sebastián, España | Menú superior desplegable Diseño: Zerif Lite desarrollado por ThemeIsle Sistema desarrollo: WordPress | HOME – PROGRAM KEYNOTE SPEAKERS – PROGRAM at a glance june 26, 2019 Interacción 2019 june 27, 2019 Interacción 2019 June 28 2019 Interacción 2019 WS Engendering Technologies 2019 Day of HCI in the Industry Workshop CHIjote’19 Tutorial 1: Anna Ripoll AIPO celebrates its 20th anniversary CONFERENCE Guidelines for presentations About events and meals VENUE Cultural, recreational and sports activities Accepted Long Papers Accepted Short Papers Photos of INTERACCION’2019 CALLS SUBMISSIONS Full and short papers Posters Advances and Challenges in HCI in the Digitalized Industry Workshop Engendering Technologies 2019 Doctoral Consortium Demonstrations and installations Research Groups Presentations Workshop/Tutorial Proposals 5th Contest for Degree and Master Thesis on HCI COMMITTEES REGISTRATION |
2020 – No celebrado por el Covid-19 | ||
2021 – Málaga, España | Menú superior desplegable Diseño: Zerif Lite desarrollado por ThemeIsle Sistema desarrollo: WordPress | Conferencia (Acerca de – Fechas – Temas – Comité) Contribuciones (Artículos de congreso – Sesiones especiales (Sesión especial sobre Ética e interacción humano computador – Sesión especial EnGendering Technologies (EGT)) – Otra Contribuciones – Coloquio doctoral – Presentación de grupos – Artículos Relevantes ya Publicados – 6º Concurso de TFGs y TFMs convocado por AIPO) Registro Programa Actas |
2022 – Teruel, España | Menú superior desplegable Diseño: Zerif Lite desarrollado por ThemeIsle Sistema desarrollo: WordPress | Inicio Contribuciones (Llamada a contribuciones – Fechas importantes – Concurso de TFM/TFG Comités Congreso (como llegar – alojamiento – registro – programa científico – conferenciantes invitados – sesión empresarial e IPO – programa social – ACTAS) |
En esta fase se han trabajado estas técnicas
Bocetos
Esbozo en papel
Esbozo en papel, permite organizar las primeras ideas del sistema.
Más información
Desarrollado para Interacción2023
Falta incluir
wireframes
Prototipo de baja y alta fidelidad
Prototipo software
Creación de paginas
Creación de paginas, se realiza una creación de páginas directas sin publicar en la plataforma de desarrollo.
Más información
Desarrollado para Interacción2023
Se realizó la implementación directamente en el Gestor de Contenido.
Consultar el resultado del sitio web del congreso Interacción2023.
En esta fase se han trabajado estas técnicas
- Encuesta
- Entrevista
- Evaluación heurística
- Evaluación de pautas WCAG
- Técnicas de Simulación
- Test guerrilla
- User test asíncrono
- User test remoto
Indagación
Encuesta
Desarrollado para Interacción2023
Encuesta masiva a usuarios objetivos del sistema (socios de la Asociación Interacción Persona Ordenador) con un formulario online.
Primera iteración del prototipo
Encuesta para obtener las necesidades que puede tener un congresista antes, durante y después de la celebración de un congreso. (8 respuestas)
Segunda iteración del prototipo
Encuesta para obtener las necesidades que puede tener un congresista al asistir a un congreso Interacción. (13 respuestas).
Indagación
Entrevista
Desarrollado para Interacción2023
Entrevista informal para obtener información de las necesidades reales del usuario.
Inspección
Evaluación Heurística
Evaluación Heurística, uso del sistema RetLab para realizar la evaluación de una nueva propuesta de Evaluación Heurística.
Más información
Desarrollado para Interacción2023
Falta incluir
Inspección
Evaluación pautas WCAG
Evaluación pautas WCAG, uso del sistema RetLab para realizar la evaluación de las pautas de evaluación de accesibilidad del contenido web.
Más información
Desarrollado para Interacción2023
Falta incluir
Test
Técnicas de Simulación
Técnicas de Simulación, un sistema se configura con herramientas asistenciales u simulaciones para conseguir consultar el sistema tal y como lo haría un usuario con discapacidad..
Herramientas de simulación
Desarrollado para Interacción2023
Un evaluador experto realizó una simulación de discapacidad utilizando plugins como Funkify o Web Disability Simulator. Además se utilizaron herramientas asistenciales como lector de voz, herramientas de zoom o navegado de voz.
Test
Test guerrilla
Test guerrilla, donde se le indica al usuario tareas y se espera que muestre sus opiniones del sistema (Thinking Aloud).
Mas información
- Thinking Aloud (2012).
Desarrollado para Interacción2023
Se realizó un test guerrilla con usuarios del sistema. Se realizó diversos test en diferentes iteraciones del sistema
Primera iteración
Test deusuario (interacción2023) Marzo (18 respuestas). Se testearon diversas tareas importantes del sitio web:
- TAREA 1: Regístrate en el congreso
- TAREA 2: Busca información sobre como puedes participar en el congreso (contribuciones)
- TAREA 3: Busca información sobre tu viaje al congreso
Ver los resultados del test.
Segunda iteración
Test de usuario (interacción2023) Abril (19 respuestas). Se testearon diversas tareas importantes del sitio web:
- TAREA1: Busca el precio de tarifa estudiante para registrarte en el congreso
- TAREA 2. Busca las bases del concurso de Trabajo Final de Carrera o Trabajo Final de Máster (TFC/TFM)
- TAREA 3: Busca información sobre tu viaje al congreso
- TAREA 4: Busca el programa del congreso
Ver los resultados del test.
Test
User test asíncrono
User Test Asíncrono, se lanza un formulario al usuario con los cuestionarios pre-test, tareas, post-tarea y post-test para que el usuario pueda realizar en cualquier momento.
Puede hacerse una grabación del test y se enviarla al evaluador.
MÁS INFORMACIÓN
Desarrollado para Interacción2023
También se lanzó un test a miembros del comité
Test de usuario a comité (interacción2023) Abril (5 respuestas). Se testearon diversas tareas importantes del sitio web:
- TAREA 1: Busca el precio de tarifa de socios AIPO para registrarte en el congreso
- TAREA 2. Busca la plantilla del articulo corto
- TAREA 3: Busca información sobre tu viaje al congreso
Test
User test Remoto
User Test Remoto, se realiza un test de usuario con una plataforma de videoconferencia y se recogen los datos con un formulario online.
MÁS INFORMACIÓN
- Test con usuarios en remoto (Uxables)
Desarrollado para Interacción2023
También se lanzó un test a un usuario con baja visión.
Realizar evaluaciones con usuarios con discapacidad (visual, auditiva, motriz, cognitiva), enriquece la evaluación y aporta un gran valor al sistema, pues en la siguiente iteración se puede mejorar el sistema con las aportaciones de los usuarios.
Test de usuario a (interacción2023) Abril (es la ultima respuesta del formulario). Se testearon diversas tareas importantes del sitio web:
- TAREA 1: Busca el precio de tarifa de socios AIPO para registrarte en el congreso
- TAREA 2. Busca la plantilla del articulo corto
- TAREA 3: Busca información sobre tu viaje al congreso
Ver los resultados del test. (es la ultima respuesta del formulario)
En esta fase se han trabajado estas técnicas
Implementación
Codificación
Codificación. Uso de plantillas y elementos web (según el framework elegido) para facilitar el desarrollo Uso del editor web para crear contenido |
Más información
Desarrollado para Interacción2023
Se utiliza WordPress, como Content Manager System (CMS) para el desarrollo de la web del congreso
CMS más utilizados actualmente en la web (un 60% de sitios web se han desarrollado con WordPress) y para que cualquier miembro del comité pudiera crear o actualizar contenido.
Implementación
Accesibilidad
Accesibilidad en la codificación. Selección de plantillas y elementos accesibles que sigan las pautas WCAG |
.
Más información
Desarrollado para Interacción2023
Se utilizó la plantilla GeneratePress-Pro con plugins (GenerateBlocks , Google Language Translator , Darklup – WP Dark Mode ) que mejoraban el desarrollo backend del sistema y también ofrecían características y funcionalidades que permitían mejorar la experiencia de usuario en el diseño frontend.
4. Descripción de la Metodología MPIu+aX
A continuación, se explican las aportaciones realizadas a la metodología MPIu+a para pasar a denominarse metodología MPIu+aX.
![MpiuaX Esquema de la propuesta MPIu+aX, aportando a la metodología MPIu+a, técnicas de Design Sprint, de Design Thiking, de diseño de Interfaces de Usuario y técnicas de UX y AUX.](http://172.16.240.160:8080/wp-content/uploads/2023/05/MpiuaX.jpg)
La metodología MPIu+a se divide en distintas fases: Análisis de requisitos, Diseño, Implementación, Lanzamiento, Prototipado y Evaluación.
En cada fase de la medotodogía MPIu+a se han incluido técnicas relacionadas para mejorar la empatía y la experiencia de usuario con el fin de conseguir un producto/sistema con una buena experiencia de uso y acceso a todos los usuarios. A continuación se muestran las nuevas técnicas aportadas.
4.1. Fases de la metodología
El análisis de requisitos, incluye conocer mediante técnicas de investigación UX las necesidades y preferencias del usuario objeto del sistema.
Esta fase se compone de las tres primeras etapas del Design Thingin:
- 1. Empatizar con el usuario investigando sus necesidades;
- 2. Definir las necesidades y problemas;
- 3. Idear soluciones que ayuden a resolver el problema.
Todo este análisis ayuda al equipo de desarrollo a comprender profundamente las necesidades del usuario respecto al sistema y descubrir los elementos importantes que pueden empatizar con lo que realmente necesita al interactuar con el sistema.
La Tabla 1 muestra distintas técnicas de las fases de la metodología MPIu+a junto a técnicas de Design Thinking que se consideran importantes en cada caso
Técnicas de MPIu+a (original) | Ampliación de técnicas para Mpiu+aX |
---|---|
Análisis etnográfico | Journey customer map, define la experiencia del cliente en el uso de un producto o servicio. Mapa de empatía, identifica lo que el usuario hace, piensa, siente, dice, escucha, etc. en una situación determinada. Luego, se han de determinar sus necesidades y cómo se siente a lo largo de la experiencia. Es importante considerar a las barreras y fuentes de molestia. |
Implicados (Stakeholders) | Mapa de actores, refleja de forma gráfica las conexiones entre los distintos actores sociales que componen un servicio. |
Clasificar los Usuarios | Personas, son personajes ficticios creados en función de su investigación para representar los diferentes tipos de usuarios que podrían usar el servicio, producto, sitio o marca de manera similar. La creación de personas ayuda al diseñador a comprender las necesidades, experiencias, comportamientos y objetivos de los usuarios. |
En el análisis etnográfico se han incluido técnicas provenientes del Design Thinking para conseguir una profunda comprensión de las necesidades de los usuarios implicados en la solución a desarrollar, y también de su entorno.
En el análisis de implicados y clasificación de usuarios, las técnicas utilizadas son similares en la metodología MPIu+a pero permiten obtener otro enfoque. Por ejemplo, la técnica Persona añade más capas de información del usuario respecto a la técnica de clasificación de usuarios
La fase de diseño supone analizar como presentar la información en la interfaz para que el usuario pueda navegar e interactuar por ella: definir una adecuada arquitectura de la información presenta una organización del contenido más ajustado al modelo mental del usuario; crear un mapa de interacción, ayuda a definir lo que el usuario puede hacer en el sistema; concebir un sistema de diseño con principios, patrones y reglas para el diseño de la interfaz de usuario, facilita el trabajo de los desarrolladores.
La Tabla 2 muestra las técnicas incluidas en el modelo MPIu+aX. Se han incluido técnicas provenientes de la metodología Atomic Design y del Design Thinking para agilizar el diseño y realizar entregas parciales de resultados tempranos y así evaluar en las distintas iteraciones avances significativos del proyecto
Técnicas de MPIu+a (original) | Ampliación de técnicas para Mpiu+aX |
---|---|
Modelos de navegación | Definición de la arquitectura de navegación. |
Diseño de la actividad. | Mapa de interacción de usuarios, refleja las distintas tareas que todos los usuarios finales de una posible solución realizan a lo largo de las distintas etapas de uso, definiendo las interacciones entre ellos. |
Diseño de la interfaz | Sistema de diseño, es un conjunto robusto, consistente, y centralizado de elementos jerarquizados y reutilizables, que permiten a los equipos de diseño UX, y desarrollo, trabajar de una manera más rápida y eficaz. Benchmarking, para conocer las características de los competidores de nuestro producto y/o para saber cómo otros productos –no necesariamente competidores– resuelven determinados problemas. |
Las técnicas de definición de la arquitectura de la información no aportan nada nuevo respecto a la metodología MPIu+a, pero sí el mapa de interacción del usuario que proviene de la metodología del Design Thinking. Respecto al sistema de diseño, el uso de la metodología de trabajo Atomic Design facilita el desarrollo posterior de la interfaz y evita errores futuros de diseño.
En la fase de prototipado, no se han incluido mejoras significativas en la metodología MPIu+a porque ya dispone de técnicas suficientes. Sin embargo, se han añadido nuevas herramientas que permiten agilizar la producción de prototipos.
Los esbozos en papel, ayudan a clarificar y despejar ideas respecto a las necesidades del usuario y los objetivos del sistema, analizadas en las primeras iteraciones de la metodología. Disponer de un prototipo de baja fidelidad, ayuda a evaluaciones iniciales del sistema. Disponer de un prototipo de alta fidelidad o wireframe ayuda a evaluar de forma temprana funcionalidades o diseños con el usuario, y sobretodo obtener retroalimentación para mejorar el diseño una vez se pase a prototipo software. Se propone el uso de herramientas colaborativas de prototipado digital para crear los distintos tipos. La metodología Design Thinking, ya consideran estas técnicas .
La Tabla 3 muestra las técnicas incluidas en el modelo MPIu+aX.
Técnicas de MPIu+a (original) | Ampliación de técnicas para Mpiu+aX |
---|---|
Bocetos | Esbozo en papel para organizar las primeras ideas del sistema |
Prototipo de baja y alta fidelidad (wireframes) | Uso de aplicaciones de prototipado colaborativo. Por ejemplo: marvel, Figma o Adobe XD. |
Prototipo software | Creación de paginas en la plataforma de implementación (sin publicar) |
La fase de evaluación de la metodología MPIu+a ya dispone de una gran cantidad de técnicas que permiten inspeccionar, indagar y testear el sistema, por ello el aporte se ha limitado a indicar herramientas digitales que facilitar la evaluación. La Tabla 4 muestra las técnicas incluidas en el modelo MPIu+aX y el listado de otras técnicas con sus correspondientes herramientas. La metodología Design Thinking, ya consideran estas técnicas.
Técnicas de MPIu+a (original) | Ampliación de técnicas para Mpiu+aX |
---|---|
Inspección: Evaluación Heurística Recorrido cognitivo Inspección de estándares | Evaluación heurística y de pautas WCAG. uso del sistema RetLab para realizar la evaluación de una nueva propuesta de Evaluación heurística y evaluación WCAG a partir de los criterios del informe IRA. |
Indagación: Observación de campo Focus Group Entrevistas Cuestionarios Análisis de logs | Encuesta masiva a usuarios objetivos del sistema a partir de formularios online. Entrevista informal guerrilla para obtener información de las necesidades reales del usuario. |
Test: Medida de las prestaciones Thinking aloud Interacción constructiva Ordenación de tarjetas (card sorting). | Técnicas de Simulación, en las que se configura un sistema con herramientas asistenciales u simulaciones para conseguir consultar el sistema tal y como lo haría un usuario con discapacidad. Test guerrilla, donde se le indica al usuario tareas y se espera que muestre sus opiniones del sistema (Thinking Aloud). User test asíncrono, se lanza un formulario al usuario con los cuestionarios pre-test, tareas, post-tarea y post-test para que el usuario pueda realizar en cualquier momento. Complementariamente, el usuario hace una grabación del test y la envía al evaluador. User test remoto, se realiza un test de usuario con una plataforma de videoconferencia y se recogen los datos con un formulario online. |
Respecto a las técnicas de inspección, se ha considerado el uso de una nueva propuesta de evaluación heurística en la que se han mezclado Principios heurísticos de usabilidad para el diseño de interfaces de usuario de J. Nielsen y los Principios de Diseño de Interfaces de B. Tognazzini.
En el caso de la accesibilidad, la evaluación de pautas WCAG, se han validado siguiendo el Informe de Revisión de la Accesibilidad, creado por el Observatorio de Accesibilidad.
Para realizar estas las evaluaciones por expertos, se utiliza RetLab, una herramienta online que permite realizar evaluaciones heurísticas entre varios usuarios y muestra gráficas sobre el resultado del porcentaje de usabilidad del sistema.
Respecto a las técnicas de indagación, se incluyen las mismas técnicas de la metodologia MPIu+a, pero llevadas a cabo con formularios online como Google Forms u otras plataformas.
En cuanto a las técnicas de test, se propone llevar a cabo test de usuarios de guerrilla, porque permite recopilar comentarios de los usuarios sobre un diseño o prototipo. Esta técnica es más efectiva que un test de usuarios, porque es posible probar prototipos intermedios, sin todas sus funcionalidades y hacer evaluaciones sobre la web publicada recabando datos para mejorar en la siguiente iteración. Se recopilan los comentarios de los usuarios (Thinking aloud, la percepción de facilidad o dificultad al realizar la tarea, pero sobretodo se recogen el impacto emocional que le causa al usuario la ejecución de la tarea, mediante un framework de emociones.
Además, el uso de formularios on-line para recoger estos datos permiten que el propio usuario (o el facilitador) deje constancia de forma rápida de estos datos mientras se lleva a cabo el test.
Para evaluar la eXperiencia de Usuario Accesible, se propone llevar a cabo test de usuario a dos niveles: primero evaluaciones tempranas, en fase de diseño y prototipado de los aspectos que se puedan evaluar a través de simulaciones de discapacidades. Sin embargo, este tipo de evaluaciones permiten obtener resultados parciales al disponer solo del nivel de la capa de diseño (contrastes, tamaño de elementos, y poco más) y no se puede evaluar el sistema con una herramienta asistencial, puesto que todavía no se ha desarrollado.
Un nivel más profundo de evaluación, es cuando se realiza un prototipo software porque la evaluación puede realizarse con herramientas asistenciales. En este punto, es posible que un evaluador experto realice una simulación de discapacidad utilizando algún plugin como Funkify o Web Disability Simulator o lo haga a través del uso real de herramientas asistenciales como lector de voz, herramientas de zoom o navegado de voz. Y sobre todo, realizar evaluaciones con usuarios con discapacidad (visual, auditiva, motriz, cognitiva), enriquece la evaluación y aporta un gran valor al sistema, pues en la siguiente iteración se puede mejorar el sistema con las aportaciones de los usuarios.
La fase de implementación consiste en codificar el sistema y desarrollarlo con una plataforma frameworks (front-end o back-end).
La implementación puede llevarse a cabo en distintas fases que se van completando a lo largo del tiempo: publicación inicial, con contenido mínimo y alguna funcionalidad; publicación de un sistema intermedio, con más contenido y alguna funcionalidad más desarrollada; publicación del sistema final, con todas las funcionalidades y contenidos implementados. En esta fase es imprescindible haber decidido la plataforma de desarrollo, que puede ser con un framework front-ent o framework back-end, según la complejidad que tenga el sistema a desarrollar.
La metodología MPIu+a no profundiza demasiado en esta fase, y las técnicas utilizadas en la metodología MPIu+aX se enumeran indicando buenas prácticas en esta fase de implementación
Técnicas de MPIu+a (original) | Ampliación de técnicas para Mpiu+aX |
---|---|
Codificación | Uso de plantillas y elementos web (según el framework elegido) para facilitar el desarrollo Uso del editor web para crear contenido |
Accesibilidad | Selección de plantillas y elementos accesibles que sigan las pautas WCAG |