Sommario:
- Passaggio 1: programmazione dell'interfaccia durante l'elaborazione (impostazione)
- Passaggio 2: programmazione dell'interfaccia in elaborazione (menu principale)
- Passaggio 3: Programmazione dell'interfaccia in elaborazione (menu "Teach")
- Fase 4: Programmazione dell'interfaccia in elaborazione (menu "Valuta")
- Passaggio 5: quando si preme il mouse
- Passaggio 6: quando il mouse viene trascinato
- Passaggio 7: quando il mouse viene rilasciato
- Passaggio 8: comunicare con Arduino
- Passaggio 9: configurazione di Arduino (schema)
- Passaggio 10: programmazione di Arduino
- Passaggio 11: è tutto, divertiti
Video: Semplice interfaccia utente interattiva per l'insegnamento e la valutazione: 11 passaggi
2024 Autore: John Day | [email protected]. Ultima modifica: 2024-01-30 10:04
Questo progetto è stato sviluppato come parte di una classe universitaria, l'obiettivo era quello di realizzare un sistema interattivo per insegnare e valutare un determinato argomento. Per questo abbiamo utilizzato un Processing su un PC per l'interfaccia e un Arduino NANO per il pulsante arcade e i LED, quindi è piuttosto semplice. Per insegnare, offre un'interfaccia in cui viene visualizzato un modello e l'utente può fare clic su ciascuno dei componenti per ottenere una descrizione testuale di esso. Tuttavia, per valutare l'utente, offre un problema simile a un puzzle, in cui l'utente deve trascinare e rilasciare ogni parte per costruire il modello corrispondente e premere un pulsante per confermare la risposta, quindi i LED sul pulsante diranno all'utente se la risposta è giusta o no.
Il problema più comune che abbiamo riscontrato durante la realizzazione di questo progetto è stata la comunicazione tra Processing e un Arduino in quanto la latenza della connessione potrebbe variare tra i computer, ostacolando la portabilità del dispositivo. Inoltre, devi definire la porta su cui l'Arduino è connesso ogni volta, perché ogni dispositivo USB connesso conta quindi devi controllare su quale COM è.
Passaggio 1: programmazione dell'interfaccia durante l'elaborazione (impostazione)
Impostiamo le variabili che verranno utilizzate, la posizione di tutte le parti come array di coordinate x e y, nonché array per le immagini di ciascuna delle parti per i menu Teach (imgA) e Evaluate (img), un array per verificare se le risposte sono corrette e array per i bover e i bloccati, che determineranno se il mouse è sopra i pezzi e se sta cercando di raccoglierli. Procedi quindi ad inizializzarli e ad aprire la porta da cui l'interfaccia andrà a comunicare con Arduino.
Passaggio 2: programmazione dell'interfaccia in elaborazione (menu principale)
Innanzitutto, il menu principale visualizzerà due pulsanti e, quando uno di essi viene premuto, il programma caricherà il menu "Apprendi" o il menu "Valuta".
Quindi quando si preme il mouse, e si trova sopra uno dei pulsanti, invia le posizioni di tutte le parti di cui ha bisogno il nuovo menu e carica l'altro menu.
Passaggio 3: Programmazione dell'interfaccia in elaborazione (menu "Teach")
Qui, se il mouse è in bilico su una delle parti, attiverà il bordo corrispondente, che, se si preme il mouse, attiverà il testo corrispondente e lo visualizzerà sullo schermo.
Fase 4: Programmazione dell'interfaccia in elaborazione (menu "Valuta")
Qui è lo stesso, attiverebbe i bover, che, quando si preme il mouse, attiverebbero i bloccati ma questa volta invece di visualizzare i testi, trascinerebbe la parte selezionata. (Questo era basato su "Trascina, rilascia e passa il mouse con il mouse." da processing.js)
Passaggio 5: quando si preme il mouse
Come affermato in precedenza, quando si preme il mouse e un bover è "vero", si attiverebbe il corrispondente bloccato.
Passaggio 6: quando il mouse viene trascinato
Se il mouse viene trascinato, il menu effettivo è il menu di valutazione e uno dei bloccati è "vero" trascinerà la parte corrispondente accanto al mouse.
Passaggio 7: quando il mouse viene rilasciato
Quindi, se il mouse viene rilasciato e ancora nel menu "Valuta", metterà la parte che è stata trascinata nel punto in cui è necessario costruire il modello se è abbastanza vicino e controllerà se la risposta è corretta. Quindi ripristinerebbe tutti i blocchi e i testi su "false".
Passaggio 8: comunicare con Arduino
Quindi ora se premi il pulsante su Arduino, controlla se hai messo tutte le parti giuste in posizione e ti dice se è giusto o sbagliato, quindi invia un "1" se è giusto o un "2" se è sbagliato al Arduino.
Passaggio 9: configurazione di Arduino (schema)
Questo era lo schema utilizzato per l'arduino, ma con un pulsante Arcade, quindi il filo verde che va al pulsante andrebbe al connettore in basso sul pulsante (COM) e il filo rosso andrebbe a quello centrale (NO). Per i led è stata utilizzata una resistenza da 220Ω, per il pulsante una da 1kΩ.
Passaggio 10: programmazione di Arduino
Ora, configura il pulsante come INPUT sul pin digitale 2 e i LED come OUTPUT su 4, 6 e 8. Quindi configura la Porta e la legge, se ottiene un "1" (risposta corretta) si accenderà il 3 LED uno per uno, se ottiene un "2" (risposta errata) ne accenderà solo uno. Inoltre, se il pulsante viene premuto, invierà una "e" all'interfaccia.
Passaggio 11: è tutto, divertiti
Ecco i codici utilizzati per questo progetto:
Consigliato:
Convertitore boost basato su Esp8266 con un'incredibile interfaccia utente Blynk con regolatore di feedback: 6 passaggi
Convertitore boost basato su Esp8266 con un'incredibile interfaccia utente Blynk con regolatore di feedback: in questo progetto ti mostrerò un modo efficiente e comune come aumentare le tensioni CC. Ti mostrerò quanto può essere facile costruire un convertitore boost con l'aiuto di un Nodemcu. Costruiamolo. Include anche un voltmetro su schermo e un feedback
Tester batteria Arduino con interfaccia utente WEB.: 5 passaggi
Arduino Battery Tester Con Interfaccia Utente WEB.: Oggi le apparecchiature elettroniche utilizzano batterie di backup per salvare lo stato in cui si era interrotta l'operazione quando l'apparecchiatura è stata spenta o quando, accidentalmente, l'apparecchiatura è stata spenta. L'utente, all'accensione, torna al punto in cui è rimasto
Creazione di un'interfaccia utente curva in Unity per la realtà virtuale: 4 passaggi
Creazione di un'interfaccia utente curva in Unity per la realtà virtuale: se stai cercando una soluzione semplice e gratuita per creare un'interfaccia utente curva per la tua applicazione di realtà virtuale o gioco VR, sei nel posto giusto. In questo blog imparerai a creare un elemento dell'interfaccia utente curvo in unity utilizzando le estensioni dell'interfaccia utente di Unity
Interfaccia utente per MicroPython: 9 passaggi
UI per MicroPython: Recentemente ho ricevuto una scheda esp8266 e ho installato MicroPython su di essa. Può essere controllato digitando command o caricandovi un codice Python. Per installare MicroPython su esp8266, controlla https://MicroPython.org/download/#esp8266 o https://Mic
Interfaccia utente Android (remotexy) per controllare il servomotore utilizzando Arduino e Bluetooth: 7 passaggi (con immagini)
Interfaccia utente Android (remotexy) per controllare il servomotore utilizzando Arduino e Bluetooth: In questo Instructable ti fornirò un rapido passaggio per creare un'interfaccia utente Android utilizzando Remotexy Interface Maker per controllare il servomotore collegato ad Arduino Mega tramite Bluetooth. Questo video mostra come l'interfaccia utente controllerà la velocità e la posizione del servomotore