Ahora que los estudiantes tienen experiencia en tratar la pantalla del cerebro como un botón grande, pueden convertir la pantalla en dos botones. Esta actividad presentará a los estudiantes el uso de declaraciones anidadas if-else para gestionar mejor las declaraciones condicionales y la lógica subyacente de hacerlo. Primero se guía a los estudiantes a través de la construcción del proyecto para que al presionar la pantalla el robot gire hacia la izquierda o hacia la derecha. Pero luego se les pide que cambien los botones para que lo que hizo girar al robot hacia la izquierda ahora lo gire hacia la derecha, y viceversa.

Para obtener más información sobre las declaraciones if y if-else u otras utilizadas en esta actividad, visite la información de ayuda en VEXcode V5. Para obtener más información sobre esta herramienta de ayuda integrada, este artículo.

El siguiente es un resumen de lo que harán sus estudiantes en esta actividad:

• Revisando el proyecto StopOrDrive y el diseño de la pantalla del cerebro en píxeles.
• Construir un nuevo proyecto LeftOrRight mientras se le guía a través del razonamiento de la programación.
• Revisando el proyecto para que los botones en pantalla funcionen de manera opuesta.
• Amplíe su aprendizaje: divide la pantalla en dos botones que, cuando se presionan, giran el robot hacia la izquierda o hacia la derecha.
   

Para obtener sugerencias sobre estrategias de enseñanza para esta sección, revise la columna Entrega de la Guía de ritmo de cosas que hacer o no hacer. (Google Doc )

El valor x en el centro de la pantalla es igual a la mitad del ancho de la pantalla en píxeles. Entonces el valor x del punto central es 240. Los estudiantes necesitarán este número para programar el condicional sobre si la pantalla se presiona hacia la izquierda o hacia la derecha. Así que asegúrese de comprobar que todos tengan el valor correcto.

De cara al futuro, el Desafío de la interfaz de usuario en la sección Repensar requerirá que los estudiantes apliquen lo que han aprendido para crear cuatro botones en la pantalla. Entonces, para eso, necesitarán los valores de x e y.

Para obtener más ayuda, consulte la Biblioteca VEX para obtener artículos de ayuda complementarios.

Al realizar la prueba, los estudiantes deben reconocer que la interfaz de usuario, cuando se usa detrás del Clawbot, parece funcionar a la inversa. Desde la perspectiva del usuario, el Clawbot se aleja del lado que está siendo presionado por el usuario. Esa no es una experiencia de usuario óptima.

Los estudiantes deben planificar, probar y perfeccionar estos cambios en el proyecto mientras los documentan en sus cuadernos de ingeniería. Para la rúbrica del cuaderno de ingeniería individual, clic en uno de los siguientes enlaces (Google Doc / .docx / .pdf), o haga clic en uno de los siguientes enlaces para los cuadernos de equipo (Google Doc / .docx / .pdf). Recuerde explicar la puntuación a los estudiantes antes de que comiencen a trabajar.

Hay dos formas posibles de solucionar el problema planteado anteriormente. La primera forma es la que está escrita en las instrucciones: revise el proyecto LeftOrRight y revíselo para que cuando el usuario presione los botones detrás del Clawbot, el robot gire a la derecha cuando el usuario presione el lado izquierdo de la pantalla. De lo contrario, el Clawbot gira a la izquierda.

La otra solución es cambiar la instrucción del Operador para que cuando el valor x sea mayor que 240, el Clawbot gire a la izquierda. 
 

Necesitaba usar coordenadas de un plano de coordenadas cuando programó la declaración condicional para cuando el valor de x fuera menor que 240 (lado izquierdo de la pantalla). Para que la pantalla del Cerebro dibuje botones visuales, también necesitarás usar coordenadas.
Regrese al Paso 2 donde se le mostraron las coordenadas de la pantalla del V5 Robot Brain.

P: ¿Cuál es el valor de x en el borde derecho de la pantalla?
A: El valor de x aumenta de 0 en el borde izquierdo a 480 en el borde derecho.

P: Entonces, el rango del valor de x es 480 (0 a 480). ¿Cuál es el rango del valor de y?
A: El rango del valor y es 240 (0 a 240).

P: ¿Dónde está el origen (0, 0) de este plano coordenado?
A: El origen está en la parte superior izquierda.

P: Estás en la parte superior de la pantalla cuando el valor de y es igual a 0. ¿Por qué es esto inusual?
A: Normalmente, el valor de y aumenta a medida que se mueve hacia arriba, pero en la pantalla V5, el valor de y aumenta a medida que se mueve hacia abajo. Pero puedes pensar en ello como si el valor de y aumenta a medida que te alejas del origen (0, 0) en la parte superior izquierda de la pantalla.

En el Desafío de interfaz de usuario de la sección Rethink, se pedirá a los estudiantes que desarrollen un proyecto que cree cuatro botones en la pantalla para controlar la garra y el brazo del Clawbot. Para ese desafío, también se les pide que muestren esos cuatro botones en la pantalla. Esta extensión de su aprendizaje, al igual que la página anterior, los ayudará a prepararse para ese desafío porque el desafío tiene cuatro botones para programar, y este solo tiene dos.

Haga que los estudiantes agreguen un evento al programa para que la pantalla dibuje dos botones visibles cuando se ejecute el proyecto. Sugiera que los estudiantes utilicen la función de Ayuda en VEXcode V5 para obtener información sobre eventos, particularmente la información del comando dibujar rectángulo . Indique a los estudiantes que revisen cómo se organiza la pantalla del Cerebro en un sistema de coordenadas basado en la cantidad de píxeles cuando se usa en el comando dibujar rectángulo . Deberán entenderlo para poder establecer parámetros dentro de ese comando. Además, deberán saber cómo transmitir eventos. En este caso, el evento consiste en dibujar botones.

Los estudiantes deben planificar, probar y perfeccionar estos cambios en el proyecto mientras los documentan en sus cuadernos de ingeniería. Para la rúbrica del cuaderno de ingeniería individual, clic en uno de los siguientes enlaces (Google Doc / .docx / .pdf), o haga clic en uno de los siguientes enlaces para los cuadernos de equipo (Google Doc / .docx / .pdf).

Aquí hay una solución de ejemplo:

Para una experiencia profesionalmente realista adicional, haga que los estudiantes pidan a sus compañeros comentarios sobre sus dos opciones de color.

¿Los colores elegidos te hacen querer usar la interfaz o qué colores preferirían como usuarios?

Parte del desarrollo de una excelente interfaz de usuario es recopilar datos sobre la experiencia del usuario, incluso preferencias estéticas.