Please enable JavaScript.

Coggle requires JavaScript to display documents.

Usabilidad, Diseño de interfaces Fernando González Fernández ISC81 -…

- - - - Evolución del concepto
        
        la idea de accesibilidad universal abarca una serie de medidas que deben ser tenidas en cuenta a la hora de elaborar estrategias políticas y sociales.
        
        La accesibilidad web busca derribar barreras para personas que sufren algún tipo de discapacidad, ya sea auditiva, visual, cognitiva o neurológica.
        
        Los individuos beneficiados no quedarán excluidos de un sistema que se vuelve primordial a la hora de conseguir un empleo inclusivo.
        
        El estándar w3c es un conjunto de reglas que, una vez cumplidas, certifican que la página web es accesible a pesar de que el usuario posea limitaciones físicas, psíquicas o sensoriales de los usuarios.
  - - - sin discapacidad
        
        Beneficia a
        
        Personas utilizando teléfonos móviles, relojes inteligentes, televisores inteligentes y otros dispositivos con pantallas pequeñas, diferentes modos de entrada, etc.
        
        Personas mayores cuyas habilidades cambian con la edad
        
        Personas con “discapacidades temporales”, como puede ser un brazo roto o la pérdida de unas gafas
        
        Personas con “limitaciones por su ubicación”, como puede ser bajo la luz del sol o en un entorno donde no se puede escuchar audio
        
        Personas con conexión lenta a Internet o que tienen ancho de banda limitado o costoso
        
        La Accesibilidad da soporte a la inclusión social tanto a personas con discapacidad como a otras tales como:
        
        • personas mayores
        
        El diseño accesible mejora la experiencia y satisfacción de las personas usuarias, en una variedad de situaciones, a través de diferentes dispositivos y para personas mayores.
        
        • personas en áreas rurales
        
        • personas en países en desarrollo
      - Con alguna discapacidad
        
        Significa que sitios web, herramientas y tecnologías están diseñadas y desarrolladas de tal manera que las personas con discapacidades pueden usarlas
        
        Pueden
        
        Percibir, comprender, navegar e interactuar con la Web
        
        • Contribuir a la Web
        
        Abarca las discapacidades
        
        • auditivas
        
        • cognitivas
        
        • neurológicas
        
        • físicas
        
        • del habla
        
        • visuales
  - - - Principio 2: Operable: Los componentes de la interfaz de usuario y la navegación debe ser manejable.
        
        Pauta 2.1 Teclado accesible: Poder controlar todas las funciones desde el teclado.
        
        Pauta 2.2 Tiempo suficiente: Proporciona tiempo suficiente a los usuarios para leer y utilizar el contenido.
        
        Pauta 2.3 Ataques epilépticos: No diseñar contenido que pueda causar ataques epilépticos.
        
        Pauta 2.4 Navegación: Proporciona formas para ayudar a los usuarios a navegar, a buscar contenido y a determinar donde están estos
        
        Pauta 2.5 Modalidades de entrada: Facilitar a los usuarios operar la funcionalidad a través de varios métodos de entrada además del teclado. (Nuevo).
      - Principio 3: Comprensible. La información y las
        operaciones de usuarios deben ser comprensibles.
        
        Pauta 3.1 Legible. Hacer contenido de texto legible y comprensible.
        
        Pauta 3.2 Previsible: Hacer la apariencia y la forma de utilizar las páginas web previsibles.
        
        Pauta 3.3 Asistencia a la entrada de datos: los usuarios de ayuda evitarán y corregirán errores.
      - Principio 4: Robustez: el contenido deber ser suficientemente robusto para que pueda ser bien interpretado por una gran variedad de agentes de usuario, incluyendo tecnologías de asistencia.
        
        Pauta 4.1 Compatible: Maximiza la compatibilidad con los agentes de usuario actuales y futuros, incluyendo tecnologías de asistencia.
      - Principio 1: Perceptible: la información y los componentes de la interfaz de usuario deben ser mostrados a los usuarios en formas que ellos puedan entender.
        
        Pauta 1.1 Texto alternativo: Proporciona texto alternativo para el contenido que no sea textual, así podrá ser transformado en otros formatos que la gente necesite, como caracteres grandes, lenguaje braille (braile no es correcto), lenguaje oral, símbolos o lenguaje más simple.
        
        Pauta 1.2 Contenido multimedia dependiente del tiempo: Proporcione alternativas sincronizadas para contenidos multimedia sincronizados dependientes del tiempo.
        
        Pauta 1.3 Adaptable: Crear contenido que pueda ser presentado de diferentes formas sin perder ni información ni estructura.
        
        Pauta 1.4 Distinguible: Facilitar a los usuarios ver y escuchar el contenido incluyendo la distinción entre lo más y menos importante.
- - - - No es sólo traducirlo a otro idioma sino también tener en cuenta otro tipo de factores que implican adaptarlo en relación con:
        
        Diferentes formatos
        
        numéricos: por ejemplo separación de miles y decimales con coma o con punto
        
        de fecha: por ejemplo "02/03/04" puede interpretarse de diferente manera en EEUU, Europa o Japón, como veremos luego; o incluso pueden utilizarse diferentes calendarios
        
        de hora: formato 12 horas por defecto para EEUU o de 24 horas europeo; pero también puede ser necesario indicar respecto a qué uso horario hace referencia un horario concreto
        
        diferentes monedas y símbolos de las mismas
        
        diferentes medidas de distancia, temperatura, etc.
        
        diferentes alfabetos, dirección de escritura o uso del teclado
        
        diferentes tipos y formatos de tratamientos, nombres y apellidos, direcciones o teléfonos
        
        los algoritmos de comparación y ordenamiento deben adaptarse al idioma, pero a veces también al país, por ejemplo en Islandia los directorios se ordenan por nombre de pila
        
        diferente significado y percepción de metáforas, símbolos, iconos y colores
        
        los textos y gráficos que contengan referencia a objetos, acciones o ideas que, en una cultura dada, puedan ser objeto de mala interpretación o considerados ofensivos
        
        diferentes exigencias legales
        
        diferentes tamaños estándar de papel (relevante para la impresión)
      - Requiere una reelaboración exhaustiva de:
        
        • la lógica
        
        • el diseño visual
        
        • la presentación
      - Es el proceso de adaptar el software para una región específica mediante la adición de componentes específicos de un locale y la traducción de los textos, por lo que también se le puede denominar regionalización.
      - Herramientas y técnicas:
        
        • Entrevistas individualizadas
        
        • Workshops colaborativos
        
        • Cuestionarios con preguntas cerradas
        
        • Sketching
        
        • Wireframing
  - - - implica:
        
        Un modo de diseño y desarrollo que elimine obstáculos a la localización o la distribución internacional.
        
        Usar Unicode o asegurar, un correcto tratamiento de las codificaciones de caracteres anticuadas
        
        Controlar la concatenación de cadenas
        
        Evitar que la programación dependa de valores de cadenas pertenecientes a la interfaz de usuario.
        
        Habilitar características que tal vez no sean usadas hasta el momento de la localización.
        
        Añadir en la DTD etiquetas para habilitar el texto bidireccional o la identificación de idiomas.
        
        Hacer la CSS compatible con texto vertical u otras características tipográficas ajenas al alfabeto latino
        
        Preparar el código para hacer frente a las preferencias locales, regionales, lingüísticas o culturales.
        
        Incorporar características y datos de localización predefinidos a partir de bibliotecas existentes o de las preferencias del usuario.
        
        Ejemplos: formatos de fecha y hora, calendarios locales, formatos y sistemas de números, ordenamiento y presentación de listas, uso de nombres personales y formas de tratamiento, etc.
        
        Separar del código o contenido fuente los elementos localizables, de modo que puedan cargarse o seleccionarse alternativas localizadas según determinen las preferencias internacionales del usuario.
    - - Internacional
        
        Sitio destinado a un público internacional
        
        Un sitio web internacional puede ser o no multilingüe
        
        Si en la captura de un formulario se tiene en cuenta a todos los posibles usuarios que pueden utilizar ese formulario, independientemente de su país de origen, será internacional aunque sólo esté disponible en un idioma.
      - plurilingüe
        
        Sitio que está disponible en más de un idioma
        
        Un sitio web multilingüe puede ser o no internacional.
        
        Ejemplo, un formulario en el cual se indica un importe en euros, se solicita obligatoriamente dos apellidos y seleccionar de un desplegable una provincia, se pide el DNI, etc. en varios idiomas.
    - - La internacionalización influye considerablemente en la facilidad de localización del producto
      - Es más difícil y más laborioso adaptar retrospectivamente un producto centrado en un idioma y cultura particulares que diseñarlo desde un primer momento con la intención de presentarlo mundialmente.
      - En condiciones ideales, la internacionalización se da como un paso fundamental en el proceso de diseño y desarrollo, más que como un agregado posterior que, a menudo, puede implicar un difícil y costoso proceso de reingeniería
      - En el diseño de sitios web monolingües o plurilingües, el enfoque depende de:
        
        El tipo de material; por ejemplo, ¿es material técnico sencillo o material destinado a motivar o vender?
        
        Su público; por ejemplo, ¿es un grupo bien definido que se ajusta a estándares acordados o son lectores en general?
        
        Sus medios económicos y recursos; por ejemplo, ¿se puede lograr el enfoque preferido dentro del presupuesto, o es simplemente demasiado complejo o costoso mantener el negocio?
        
        Los requisitos para acceder a la información; por ejemplo, ¿los usuarios pueden entender sin traducción?
        
        El impacto deseado en el lector; por ejemplo, ¿su intención es motivarlo, persuadirlo o entretenerlo?
        
        Lo pertinente o apropiado que sea a la situación de los usuarios; por ejemplo, ¿tiene que considerar diferentes hábitos de compra, precios, requisitos legales u otros diversos contextos sociales del público internacional?
- - - - Comunicación lineal Mensaje transmitido durante la lectura. No se puede expresar respuesta u objeción
      - EL lector se puede comunicar con el autor, para dudas, sugerencias, ideas. Demuestra satisfacción mediante likes y shares.
    - - Altos En cuanto a producción, venta y distribución
      - Bajos
    - - Requieren del corte de arboles, transporte
      - Solo almacenamiento en línea.
    - - Impreso, imagenes
      - Imágenes en movimiento, audios y videos, contenidos descargables Experiencia más completa
    - - No es instantánea, debe ser
        reimpreso
      - Modificados y actualizados al
        instante
    - - Lenta
      - La rapidez en la transmisión y la capacidad de comunicación instantánea en Internet, hace que los contenidos digitales sean una fuente de información práctica y ligera
    - - Periódicos y revistas, tienen clases de formatos bastante particulares, definen con precisión el principio y el fin de sus textos, una vez que deben desarrollar su contenido dentro de las demarcaciones que existen
      - Disponen de un límite de espacio, sea en número de hojas, columnas o márgenes.
    - - Más formal. El periódico impreso presenta un lenguaje más serio y objetivo, la informalidad no tiene la costumbre de hacerse presente, al igual que el perfil de sus lectores
      - De acuerdo al publico que va
        dirigido, más dinámico
    - - Las notas de pie apuntan citas o referencias al final de la página, en fuente menor y divididas del resto del texto a través de una pequeña línea. Son comúnmente informaciones adicionales que resultan de interés para el lector, pero que no pueden incluirse dentro del texto de forma fluida.
      - A través de links, brindan una mayor información
  - - - Al crear un contenido web, se debe considerar un comportamiento muy común de los lectores del medio digital: la búsqueda por contenidos específicos en Internet.
        
        Search Engine Optimization (SEO) significa optimizar un contenido para que aparezca de manera más fácil en las búsquedas realizadas por los usuarios, usa técnicas y estrategias variadas.
    - - Las palabras clave (keywords, en inglés) son el principal instrumento de una búsqueda en Internet, es decir, son la forma en cómo el usuario escribe lo que desea encontrar a través de los buscadores.
      - Los términos pueden ser compuestos por una o más palabras y son insertados de manera estratégica en el transcurso del texto
    - - La hipertextualidad es la práctica en la que se agregan otros conjuntos de informaciones en un texto a través de hipervínculos.
      - Explicando de modo más simples, el hipertexto es una conexión que conduce la navegación de los usuarios. Un texto puede tener varias palabras, imágenes o incluso sonidos que, al ser pulsados, remiten a otra página donde se aclara con más precisión el asunto del enlace abordado.
      - El hipertexto es responsable por dictar la popularidad y la relevancia de un artículo. Un texto sin vínculos no se posiciona bien en los motores de búsqueda y consecuentemente recibe poco o casi ningún tráfico.
    - - Con tanto contenido disponible en línea, los textos web adoptan medidas adecuadas para destacarse, trasmitir credibilidad y ganar la confianza del lector. Entre ellas, garantizar que el texto sea escaneable
      - La función de la escaneabilidad es hacer con que el lector entienda con una rápida mirada el contenido de un texto
      - Algunos puntos importantes para eso, son: – el uso de negrita (en la medida correcta, solo para destacar las ideas principales); – creación de listas con bullet points; – numeración de los temas; – atención especial a la distribución de los párrafos
    - - Un CTA o call-to-action, es una llamada que tiene como finalidad hacer al lector tomar una acción.
      - Son creados en formatos visuales o de texto y sirven para diversos propósitos, por ejemplo, invitar el visitante a leer otro artículo o descargar un contenido de valor, como un libro electrónico
      - Los CTA son usados dentro de la estrategia de marketing de contenidos para mantener al usuario dentro de la web o llevarlo a un siguiente paso del funnel de ventas
- - - - Ayuda
        
        La GUI debe brindar ayuda y asistencia:
        
        Claridad en los mensajes de ayuda
        
        Existencia de ayuda (Help)
        
        Existencia de ayuda on Line
        
        Existencia de un asistente
      - Robustez
        
        La GUI responde ante diversas situaciones:
        
        Manejo de errores: comportamiento de la GUI ante información errónea:
        
        *Recuperar estados anteriores.
        
        *Prevención de errores.
        
        *Corrección de errores.
        
        -Alertas: Alertar ante acciones destructivas:
        
        *Aviso de acciones destructivas
      - Funcionalidad
        
        La GUI debe permitir
        
        Multitarea-Atajos
        
        Respuestas ante sobrecarga
        
        Actualizaciones
      - Efectividad
        
        La interfaz es efectiva si el usuario puede concretar las tareas que necesita realizar, sintiendo conformidad al realizarlas.
        
        Facilidad para encontrar tareas.
      - Consistencia
        
        Todo elemento (imagen, icono, sonido, mensajes, etc.) siempre representa lo mismo y es coherente con el mundo real.
        
        -Cada elemento siempre representa lo mismo.
        
        -Cada elemento es representativo del dominio que representa.
        
        -Cada imagen se asocia a palabras claves del proceso.
        
        Los mensajes siempre se muestran iguales.
      - Flexibilidad
        
        La GUI es flexible si permite al usuario personalizar sus componentes
      - Portabilidad
        
        La interfaz siempre debe verse igual en cualquier S.O.:
        -Igual apariencia en cualquier SO
      - Estética
        
        La GUI debe tener un diseño visualmente agradable, sencilla y facilitar el trabajo sin distraer:
        
        -Fuente: Legibilidad en tipo y tamaño.
        
        *Colores resaltar lo importante sin sobrecargar la visión.
        
        *Usar entre 4 y7 colores para evitar la fatiga visual.
        
        *Usar tonos claros reservando los fuertes para información importante.
        
        *Los elementos extras (imágenes, tablas, sonidos, etc) no deben sobrecargar ni distraer
      - Vocabulario
        
        Se refiere a que el usuario pueda comprender los términos que se emplean en la GUI:
        
        -Términos técnicos
        
        -Términos vulgares
        
        -Términos sofisticados
        
        -Términos desconocidos
      - Organización
        
        Una interfaz debe estar bien organizada, las opciones del menú principal, deben tener un orden y las opciones dentro de ellas deben estar relacionadas.
        
        -Cantidad de opciones del menú principal.
        
        -Promedio de cantidad de opciones por cada opción del menú principal
  - - - Interfaz bien diseñada
        
        El usuario experto o no sin previos conocimientos puede operar con la aplicación
      - Interfaz mal diseñada
        
        Obstaculiza la ‘usabilidad’, es decir aquella característica ‘que hace que la aplicación sea fácil de utilizar y fácil de aprender
  - - - Procedimiento en el que se recogen datos relevantes sobre la operatibilidad y usabilidad de un sistema.
      - La evaluación puede ayudar a la interfaz a ser usable, y debe tenerse en cuenta que los aspectos detectados en la interfaz no sólo van a mejorar esta interfaz sino el producto en su conjunto
    - - Debe ir acorde a la etapa de diseño en la que se encuentre la interfaz, se debe evaluar siempre y de forma continua
        
        El evaluar supone ahorrar recursos y da objetivos al desarrollo.
        
        – Durante la fase de desarrollo de la interfaz el énfasis se produce sobre el sistema, no sobre el usuario final.
        
        – La evolución de los desarrollos de los productos no es tan rápida como los cambios en las tendencias de los usuarios.
        
        – El diseño de productos “usables” requiere esfuerzos y trivializarlos equivale a no conectar con el usuario final.
        
        – Las organizaciones no emplean equipos integrados con diferente formación.
        
        – El diseño de las interfaces y la implantación de la misma son actividades diferentes
    - - Mejorar la interfaz lo máximo posible antes de su distribución comercial, en el momento en el que los cambios son medianamente sencillos y no demasiado caros, se pueden utilizar diversas formas de valoración:
        
        – Las revisiones de expertos
        – Los tests de usabilidad,
    - - Esta metodología consiste en la revisión del sistema por parte de un experto en usabilidad, sin que medie el usuario.
      - Puede tener lugar en cualquier etapa del diseño y su resultado es un informe que expresa los problemas identificados y/o las recomendaciones de cambio
      - Las recomendaciones deben ser dadas por el experto, pero las soluciones deben aportarlas los diseñadores.
    - - Evaluación heurística
        
        La medición de la satisfacción del usuario puede realizarse preguntando directamente al usuario “si recomendaría la interfaz” o “si trabajar con ella le ha resultado satisfactorio”, o por medio de una encuesta con enunciados en forma de escala de Likert131
      - Revisión por recomendaciones previas
      - Inspección de la consistencia
      - Simulación de usuar
      - Juicio formal.
    - - Una interfaz bien diseñada y evaluada es un buen producto, pero el éxito requiere de constante atención por parte de los desarrolladores y demás equipo involucrado en su diseño, realización y mantenimiento.
      - Sirven tanto como formas de soporte al usuario como formas de evaluación
        del sistema.
      - El equipo evaluador debe encontrar la forma de hacer cuantificable las
        opiniones de los usuarios
      - Los sistemas de evaluación más habituales durante la vida comercial de
        una interfaz son
        
        Seguimiento de la actuación del usuario
        
        Continuous user performance data logging. La propia interfaz recopila los datos sobre su uso, sirven para mejorar o adecuar los sistemas de ayuda, nuevas funcionalidades o atajos. El mayor beneficio es el conocimiento de la actuación real y diaria del usuario.
        
        Seguimiento y/o ayuda telefónica u online
        
        online or telephone consultants, proporcionar una atención personalizada al usuario final, ya que usa una metodología integrada en la asistencia o mantenimiento al usuario. Servicios de ayuda telefónica.
        
        Comunicación de problemas
        
        online suggestion box or trouble reporting. El correo electrónico o cualquier otro sistema de comunicación puede ser empleado por los usuarios para mandar mensajes a los desarrolladores de la interfaz.
        
        Grupos de noticias
        
        online bulletin board or newsgroup, algunos sistemas ofrecen grupos de noticias para recibir y responder preguntas de los usuarios.
        
        Comunicación de problemas
        
        online suggestion box or trouble reporting, el correo electrónico o cualquier otro sistema de comunicación puede ser empleado por los usuarios para mandar mensajes a los desarrolladores de la interfaz
    - - Diseño de la
        interfaz
        
        Diseño de la
        interfaz
        
        Mantenimiento
        de la interfaz
    - - Proceso de evaluación de IU
        
        Google Analytics: Es una herramienta comúnmente utilizada para evaluar la interacción de los usuarios con un sitio web, proporcionando datos sobre el comportamiento del usuario, el rendimiento del sitio y más.
      - Métodos de evaluación de IU
        
        Eye-tracking: Sitios web como Tobii ( https://www.tobii.com/) ofrecen tecnología de eye-tracking que permite a los diseñadores evaluar cómo los usuarios interactúan visualmente con una interfaz.
      - Proceso de prototipado de IU
        
        Adobe XD: Es una herramienta de diseño que permite a los diseñadores crear prototipos interactivos de interfaces de usuario, lo que facilita la evaluación y la iteración del diseño
      - Grado de usabilidad de sistema de cómputo
        
        Sistema operativo Windows: Microsoft utiliza métodos de evaluación de la usabilidad para mejorar constantemente la experiencia del usuario en sus sistemas operativos, como Windows, utilizando datos de retroalimentación del usuario y pruebas de usabilidad