1

Nociones de reglas de usabilidad y accesibilidad en aplicaciones independientes,

móvilesGA5-220501095-AA1-EV06

Juan David Martín Moreno

Aprendiz

Jairo Antonio Muñoz Arango

Instructor

Centro agropecuario La Granja

SENA Regional Tolima

Tecnólogo Análisis y Desarrollo de Software

Ficha 2675782

2023
 2

Tabla de contenido

Introducción ............................................................................................................................... 3

Usabilidad y accesibilidad.......................................................................................................... 4

Principios de usabilidad ......................................................................................................... 4

Reglas de usabilidad móvil .................................................................................................... 5

Reglas de accesibilidad móvil ................................................................................................ 6

Diferencias entre aplicación independiente y aplicación web ............................................... 8

Aplicaciones Independientes .............................................................................................. 8

Aplicaciones Móviles ......................................................................................................... 8

Diferencias entre aplicaciones hibridas y nativas ................................................................ 10

Aplicaciones Móviles Nativas: ......................................................................................... 10

Aplicaciones Móviles Híbridas:........................................................................................ 10

IDES y lenguajes de programación usados para dispositivos móviles ................................ 11

Herramientas IDE: ............................................................................................................ 11

Lenguajes de Programación: ............................................................................................. 12

Conclusiones ............................................................................................................................ 13

Bibliografía. ............................................................................................................................. 14
 3

Introducción

En este documento se presenta un informe donde se muestran los principios de usabilidad, las

reglas tanto de usabilidad y accesibilidad en software móvil, también una comparativa entre las

aplicaciones independientes y las aplicaciones móviles, y las de carácter híbridas y nativas.

 4

Usabilidad y accesibilidad

Principios de usabilidad

• Facilidad de Aprendizaje: La capacidad de los usuarios para aprender a utilizar un

sistema de manera rápida y eficiente es esencial. Esto se puede medir en términos de

tiempo requerido para realizar tareas básicas y comunes.

• Facilidad y Eficiencia de Uso: Los usuarios deben poder llevar a cabo sus tareas de

manera eficiente una vez que han aprendido a usar la herramienta. El tiempo que lleva

completar una tarea es un indicador importante.

• Facilidad de Recordar el Funcionamiento: La capacidad de los usuarios para

recordar cómo usar el sistema después de un período de tiempo es fundamental para la

usabilidad a largo plazo.

• Frecuencia y Gravedad de Errores: La frecuencia y la gravedad de los errores que

cometen los usuarios al interactuar con el sistema son indicadores importantes de la

usabilidad. Proporcionar mensajes de error útiles es esencial para ayudar a los usuarios

a resolver problemas.

• Satisfacción Subjetiva: La satisfacción del usuario es subjetiva y depende de la

percepción individual de cada usuario. Sin embargo, es un aspecto crítico de la

usabilidad, ya que los usuarios satisfechos tienen más probabilidades de utilizar el

sistema de forma continua.

 5

Reglas de usabilidad móvil

1. Visibilidad del estado del sistema: Informa al usuario sobre lo que está sucediendo en la

aplicación cuando realiza acciones, como llenar un formulario.

2. Relación con el mundo real: Diseña la aplicación de manera que se asemeje al contexto

y las acciones familiares para el usuario.

3. Libertad de usuario: Ofrece a los usuarios el control sobre las opciones que tienen,

como cancelar, guardar o editar acciones.

4. Consistencia y coherencia: Mantén una relación coherente entre los elementos de

diseño, como botones y ubicaciones, para que los usuarios puedan entender y utilizar la

aplicación fácilmente.

5. Prevención de errores: Diseña considerando posibles errores del usuario y proporciona

soluciones o guías para evitarlos.

6. Reconocimiento rápido de funciones: Utiliza iconos en lugar de texto siempre que sea

posible para facilitar el reconocimiento y la usabilidad.

7. Flexibilidad y eficiencia: Permite a los usuarios avanzados realizar acciones de manera

más rápida una vez que se familiaricen con la aplicación.

8. Estética y diseño minimalista: Presenta solo la información esencial en una pantalla y

evita abrumar al usuario con demasiada información innecesaria.

9. Ayuda en la recuperación de errores: Proporciona formas de deshacer o verificar

acciones para que los usuarios puedan recuperarse de errores fácilmente.

10. Ayuda y documentación: Ofrece soporte técnico o documentación para ayudar a los

usuarios, especialmente a aquellos que son nuevos en la aplicación.

 6

Reglas de accesibilidad móvil

1. Contraste entre fondo y texto: Asegura un contraste mínimo de 3 a 1 entre el texto y el

fondo para mejorar la legibilidad y ayudar a personas con discapacidad visual.

2. Utiliza tipografías sencillas: Emplea fuentes de tamaño adecuado, espaciado entre líneas

y letras, y tipografías simples para facilitar la lectura.

3. Acompaña las acciones con recursos gráficos además del color: Para que los usuarios

con daltonismo puedan comprender las acciones, utiliza indicadores visuales adicionales,

como iconos o subrayados.

4. Muestra siempre el título en los campos de texto: Los campos de formulario deben

tener títulos claros, incluso cuando están vacíos, para ayudar a los usuarios a comprender

qué se espera de ellos.

5. Utiliza placeholders para clarificar la información: Utiliza placeholders para

proporcionar ejemplos o información adicional en campos de texto confusos.

6. Ofrece textos de ayuda: Proporciona instrucciones claras en campos complicados, como

la creación de contraseñas.

7. Diseña botones grandes y reconocibles: Los botones deben ser lo suficientemente

grandes y con áreas inactivas para evitar selecciones accidentales.

8. Muestra doble confirmación: Solicita confirmación para acciones importantes para

prevenir errores accidentales.

9. Mantén coherencia en la estructura: Haz que la estructura y la disposición de

elementos sean consistentes en todas las pantallas de la aplicación.

10. Muestra el contenido más importante primero: Coloca la información relevante al

principio de la pantalla para una accesibilidad eficaz.

11. Utiliza textos sencillos y claros: Emplea un lenguaje simple y evita jergas y tecnicismos.
 7

12. Utiliza titulares para organizar el contenido: Los títulos ayudan a organizar la

información y orientar a los usuarios.

13. Indica errores específicos en validaciones: Los mensajes de error deben ser claros,

estar en el campo incorrecto y explicar el problema.

14. Haz que los textos sean fáciles de leer: Evita mayúsculas, fuentes finas y fondos que

dificulten la lectura.

15. Utiliza animaciones suaves: Evita destellos, parpadeos y cambios bruscos de color en

las animaciones para evitar problemas de epilepsia.

16. No introduzcas gestos complicados: Ofrece alternativas sencillas para gestos complejos

para usuarios con dificultades motoras.

17. Añade subtítulos a los vídeos: Proporciona subtítulos o transcripciones para hacer que el

contenido de vídeo sea accesible a personas con discapacidad auditiva.

18. No dependas de imágenes para instrucciones importantes: Acompaña las imágenes

con texto para que los usuarios con discapacidad visual puedan entender las

instrucciones.

19. Utiliza componentes nativos: Emplea componentes estándar en lugar de personalizados

para garantizar la accesibilidad.

20. Adapta el contenido para el uso del foco: Asegura que los elementos reciban el foco de

manera coherente y que estén bien etiquetados para facilitar la navegación de usuarios

con discapacidad visual.

 8

Diferencias entre aplicación independiente y aplicación web

Aplicaciones Independientes

Las aplicaciones independientes o nativas se desarrollan específicamente para un sistema

operativo en particular, utilizando el lenguaje nativo de ese sistema, como Swift para iOS o Java

para Android. Tienen acceso completo a los recursos del dispositivo, como la cámara y el GPS.

Algunas características clave incluyen:

• Sin conexión: En algunos casos, pueden funcionar sin una conexión a Internet.

• Distribución: Se distribuyen a través de las tiendas de aplicaciones oficiales, como la

App Store y Google Play.

• Notificaciones: Pueden enviar notificaciones o avisos a los usuarios.

• Actualizaciones constantes: Se actualizan periódicamente para mejorar el rendimiento y

agregar nuevas funciones.

• Rendimiento optimizado: Ofrecen un rendimiento óptimo, ya que están diseñadas

específicamente para el sistema operativo.

• Interfaz adaptada: La interfaz se adapta al sistema operativo, brindando una experiencia

nativa.

• Ejemplos: Facebook y WhatsApp son ejemplos de aplicaciones nativas.

Aplicaciones Móviles

Aplicaciones Móviles Las aplicaciones móviles, o apps móviles, están diseñadas para

dispositivos móviles como smartphones y tabletas. Se desarrollan específicamente para un

sistema operativo, como iOS o Android, y tienen acceso a los recursos del dispositivo, como la

cámara y el GPS. Algunas características clave incluyen:

 9

• Funciones específicas para tareas concretas.

• Pueden operar sin conexión a Internet en algunos casos.

• Se distribuyen en tiendas de aplicaciones oficiales, como la App Store y Google Play.

• Envían notificaciones a los usuarios.

• Reciben actualizaciones periódicas para mejorar el rendimiento y agregar nuevas

funciones.

• Ofrecen un rendimiento óptimo adaptado al sistema operativo.

• La interfaz se adapta al sistema, brindando una experiencia nativa.

• Ejemplos notables incluyen Facebook y WhatsApp.

 10

Diferencias entre aplicaciones hibridas y nativas

Aplicaciones Móviles Nativas:

• Diseñadas para un sistema operativo específico, como iOS o Android.

• Utilizan el lenguaje de programación nativo de la plataforma (por ejemplo, Swift para

iOS o Java para Android).

• Ofrecen un alto rendimiento y acceso completo a los recursos del dispositivo.

• Se descargan desde tiendas de aplicaciones como la App Store o Google Play.

• Proporcionan una experiencia de usuario coherente con la interfaz nativa del sistema

operativo.

• Requieren desarrollos separados para cada plataforma (mayor costo y tiempo).

Aplicaciones Móviles Híbridas:

• Diseñadas para funcionar en múltiples plataformas y sistemas operativos.

• Desarrolladas utilizando tecnologías web estándar como JavaScript y HTML5.

• Utilizan frameworks como Cordova, Ionic, React Native o Xamarin.

• Menor costo de desarrollo y mantenimiento, ya que comparten una base de código.

• Pueden tener un rendimiento similar al de las aplicaciones nativas, pero pueden ser

menos adecuadas para aplicaciones gráficamente intensivas o juegos.

• Requieren una conexión a Internet para funcionar y pueden tener una apariencia y

rendimiento variables en diferentes dispositivos y navegadores.

 11

IDES y lenguajes de programación usados para dispositivos móviles

Herramientas IDE:

1. Android Studio: Un entorno de desarrollo recomendado por Google para crear

aplicaciones Android. Ofrece un editor de diseño visual, un analizador de APK,

emuladores, y perfiles en tiempo real. Es gratuito y compatible con Java, C, C++, Kotlin

y XML.

2. Qt Creator: Un IDE multiplataforma con un sofisticado editor de código, control de

versiones, diseño de interfaz de usuario integrado y gestión de proyectos. Es compatible

con C, C++, QML, JavaScript y otros lenguajes y tiene un costo a partir de $350 para uso

comercial.

3. Xcode: Un IDE para sistemas operativos macOS que permite desarrollar aplicaciones

para iOS, iPadOS, macOS, tvOS y watchOS. Ofrece un constructor de interfaces, control

de versiones, pruebas y personalización. Es gratuito.

4. Eclipse: Un IDE compatible con múltiples lenguajes, incluido Android a través de la

extensión Google ADT. Ofrece características como un sistema de compilación ANT y

autocompletado de código. Es gratuito y compatible con Java, C, C++, JavaScript, y otros

lenguajes.

5. JetBrains Rider: Un potente IDE para el desarrollo de Xamarin con funciones como

editor de código avanzado, navegación y búsqueda, descompilador y control de

versiones. Tiene un costo a partir de $139 por año.

6. Visual Studio Code: Un IDE de Microsoft que permite el desarrollo de aplicaciones

móviles y de escritorio con .NET MAUI. Ofrece características como el App Center y

IntelliCode, y es compatible con varios lenguajes. Es gratuito.

 12

7. DroidScript: Un editor de codificación portátil para el desarrollo de aplicaciones

móviles. Permite el acceso a hardware y gadgets, utiliza JavaScript y es fácil de instalar.

Es gratuito.

Lenguajes de Programación:

1. Java: Ampliamente utilizado en el desarrollo de aplicaciones Android debido a su

rapidez y versatilidad.

2. Kotlin: Recomendado por Google para el desarrollo de aplicaciones Android, es

moderno y escalable.

3. Python: Utilizado para crear aplicaciones móviles, especialmente con Kivy, que es un kit

de desarrollo multiplataforma.

4. JavaScript: Ideal para aplicaciones móviles multiplataforma y se destaca por su

interactividad.

5. Swift: Un lenguaje de programación para iOS, pero también utilizado en otras

plataformas como Windows, Linux y macOS.

 13

Conclusiones

• Garantizar que las aplicaciones móviles sean fáciles de usar y estén disponibles para

todos los usuarios, es esencial para brindar una experiencia de usuario positiva.

• Conocer las diferencias entre aplicaciones independientes y móviles, de carácter

hibridas y nativas es de gran importancia para saber cómo es la mejor forma de aplicar

la usabilidad y accesibilidad.
 14

Bibliografía.

Solera, S. (s. f.). Diseño de aplicaciones: usabilidad y experiencia de usuario.

Occamagenciadigital.com. Recuperado 30 de septiembre de 2023, de

https://www.occamagenciadigital.com/blog/diseno-de-aplicaciones-usabilidad-y-

experiencia-de-usuario

Abajo, L. (2019, diciembre 30). Accesibilidad en las apps: 20 consejos para lograr una app

accesible. Mobivery. https://mobivery.com/accesibilidad-en-las-apps-20-consejos-para-

lograr-una-app-accesible/

Dharmwan, S. (2021, marzo 17). Aplicaciones híbridas frente a aplicaciones nativas: la lista de

verificación para descubrir qué es lo correcto para usted. Cynoteck.

https://cynoteck.com/es/blog-post/hybrid-apps-vs-native-apps-the-checklist/

Medewar, S. (2023, septiembre 14). 7 mejores IDE para el desarrollo de aplicaciones móviles.

Geekflare. https://geekflare.com/es/best-ide-for-mobile-app-development/

Lenguajes de programación para móvil. (s. f.). Immune Technology Institute. de

https://immune.institute/blog/lenguajes-de-programacion-para-movil/

Diseño y construcción de Frontend. (s. f.). Territorio.la. Recuperado 30 de septiembre de

2023, de

https://sena.territorio.la/content/index.php/institucion/Titulada/institution/SENA/Tecnologia/228

118/Contenido/OVA/CF21/index.html#/curso/tema3