Programación de Interfaces Gráficas y Usabilidad

I. Desarrollo de Componentes y Eventos en Interfaces Gráficas

1. Personalización de Componentes y Diseño (Layout)

• Disposición Relativa (Layout a Null): Se abandona el uso previo de GridBag (diseño tipo tabla) para colocar objetos de manera relativa. Esto se logra poniendo el layout a null.
• Coordenadas: Al usar el layout nulo, la posición de los objetos se define por sus coordenadas, siendo la esquina superior izquierda el punto (0,0). Se debe especificar la posición y el tamaño de cada objeto añadido.
• Componentes Personalizados:
  • Botones (BotonPersonalizado): Se crean heredando de JButton. En el constructor se puede cambiar el color y la localización dentro del JFrame. Se pueden usar métodos existentes de JButton y crear nuevos. Si hay muchas acciones en el constructor, se recomienda crear métodos y llamarlos desde él.
  • Campos de Texto (JTextField): Permiten recoger texto escrito por el usuario. La reacción se programa a los cambios del document (donde se guarda el texto). Se puede modificar, por ejemplo, el color sobre el que se escribe. Métodos importantes incluyen getText().length() (para obtener el número de caracteres) y los listeners al focus (si el objeto está seleccionado).
  • Etiquetas (JLabel): Se personalizan heredando de JLabel. Esto es útil para crear personajes de videojuegos idénticos (ej. los que persiguen en Comecocos). Las imágenes se pintan sobreescribiendo un método de JLabel, sin necesidad de ser llamado desde otro sitio. Se define el ancho, el alto y la posición (x, y) de la imagen a dibujar, generalmente centrándola.

2. Eventos y Dinamismo

• Eventos del Ratón: La programación de objetos se relaciona principalmente con la respuesta a eventos del ratón.
  • Movimiento: Hay métodos para controlar el movimiento del ratón. El texto de un botón puede cambiar mostrando la posición del ratón si el listener está en el botón y se mueve dentro de él.
  • Toques/Clics: Se utilizan utilidades de Swing para distinguir si el clic fue con el botón principal o el secundario.
• Repintado y Animación:
  • repaint(): Al llamar a este método (definido en la clase padre), el método de pintado se ejecuta de nuevo, permitiendo cambiar el tamaño de la imagen automáticamente si un parámetro como la escala cambia. Esto puede activarse al pulsar el botón del ratón.
• Temporizadores: Se puede programar que un método se ejecute después de un número específico de milisegundos. Por ejemplo, ejecutar el método mover cada 2 segundos. Se indica cómo parar la ejecución repetitiva.
• getParent(): Permite obtener el objeto JFrame para manejar su tamaño junto con el del componente en cuestión.

3. Componentes Especializados

• Diálogos (JDialog): Son ventanas que aparecen sobre el JFrame. Inicialmente no tienen botones de cerrar, maximizar o minimizar. El constructor define si el diálogo es modal:
  • false: Permite seguir interactuando con el JFrame subyacente.
  • true: Acapara el foco (es modal).
  • Diseño y Cierre: Se pueden usar diferentes layouts (ej. FlowLayout, que coloca objetos en fila). Se muestra cómo cerrarlo.
  • pack(): Este método (disponible también en frames y paneles) ajusta el tamaño del diálogo para que contenga justo a todos los elementos creados.
• Menús: Para crear un menú, se necesita una barra, menús dentro de ella e items dentro de los menús. Los items como el de «Salir» pueden personalizarse heredando de JMenuItem. Las acciones de los ítems pueden ejecutar métodos (ej. al pulsar «Cambiar color» se cambia la apariencia de otro ítem).
• Listas (JList): Se personalizan. Un ejemplo es asignar un ícono (sacado de una librería) a cada elemento de la lista. Esto se logra añadiendo un JLabel en el constructor de JList.

4. Eventos de Teclado

• KeyListener: El teclado es el otro principal periférico de entrada. Se debe implementar la interfaz KeyListener.
• Implementación: Una vez que se implementa, se exige que se incluyan todos sus métodos. Se debe indicar al JFrame que escuche los eventos del teclado.
• Control de Teclas: Las teclas pulsadas se pueden controlar comparándolas con atajos como KeyEvent.VK_LEFT (que representa la tecla izquierda) o mediante el número que devuelven. Es importante notar que ciertas acciones (como poner una mayúscula usando la flecha de mayúsculas) pueden generar dos eventos de tecla pulsada pero solo una escrita.

5. Aplicación Conjunta y Desarrollo de Juegos

Finalmente, el temario subraya que la tarea de un buen programador es poner todas estas cosas en conjunto. Un ejemplo práctico es la base para los juegos de plataformas, que utiliza un temporizador para consultar la posición de los objetos cada ciertos milisegundos y calcula si hay colisión (si dos objetos coinciden en la misma zona del espacio de la ventana).

II. Principios Fundamentales de Usabilidad y Diseño de Interfaz

1. Recomendaciones de Color en la Interfaz

¿Cuántos colores se recomienda utilizar en una ventana y en una aplicación?

• Se recomienda no usar más de 4 o 5 colores diferentes en una misma ventana.
• Se recomienda no usar más de 7 colores en la interfaz total de la aplicación.

2. Eficiencia vs. Efectividad

¿Cuál es la diferencia entre eficiencia y efectividad?

• Efectividad: Mide la plenitud con la que se alcanza un objetivo concreto. Variables comunes para medirla incluyen el porcentaje (%) de tareas completadas o el porcentaje (%) de usuarios que completan la tarea en el primer intento.
• Eficiencia: Mide el esfuerzo para conseguir un objetivo. Las variables típicas incluyen el tiempo empleado en completar una tarea, el porcentaje (%) de errores cometidos, el tiempo empleado en recuperarse de los errores, o el número de clics necesarios para realizar una tarea.

3. Atributos Clave de la Usabilidad

Dime los 5 atributos de la usabilidad.

1. Facilidad de aprendizaje
2. Eficiencia
3. Recuerdo de utilización en el tiempo
4. Tasas de error
5. Satisfacción

4. Características Importantes de la Usabilidad

Nómbrame las características importantes de la usabilidad.

• Útil
• Fácil de usar
• Fácil de aprender
• Elegante en su diseño
• Previsión de errores de los usuarios al navegar por la interfaz
• Retroalimentación de la interfaz
• Simplicidad de diseño de la interfaz

5. Tipos de Ensayos de Usabilidad Realizados por Expertos

¿Qué tipos de ensayos realizan los expertos a las aplicaciones? Explícalos.

Los principales tipos de evaluación son la Evaluación heurística y la Verificación frente a heurísticas de diseño.

• Revisión de normas: Se examina la interfaz para garantizar que cumpla con las normas establecidas.
• Inspección de consistencia: Se lleva a cabo a través de una familia de interfaces que conforman la aplicación.
• Inspección formal de usabilidad: Es una técnica donde un grupo de expertos realiza un juicio, con un moderador, destacando las fortalezas y debilidades de la aplicación. Su objetivo es encontrar problemas de diseño (color, vocabulario, presentación) y navegación (controles, menús, búsquedas).
• Caminata cognitiva: Un grupo de expertos simula la manera en la cual un usuario navegaría por la interfaz al realizar tareas particulares.