Yksinkertainen interaktiivinen käyttöliittymä opettamiseen ja arviointiin: 11 vaihetta

2025 Kirjoittaja: John Day | [email protected]. Viimeksi muokattu: 2025-01-13 06:57

Tämä projekti kehitettiin osana yliopistotuntia, tavoitteena oli luoda vuorovaikutteinen järjestelmä opettamaan ja arvioimaan tiettyä aihetta. Käytimme sitä varten prosessointia PC: llä käyttöliittymälle ja Arduino NANO: ta arcade -painikkeelle ja LEDeille, joten se on melko yksinkertaista. saadaksesi siitä kuvauksen tekstillä. Käyttäjän arvioimiseksi se tarjoaa kuitenkin palapelin kaltaisen ongelman, jossa käyttäjän on vedettävä ja pudotettava jokainen osa rakentaakseen vastaavan mallin, ja painamalla painiketta vahvistaakseen vastauksensa, jolloin painikkeen merkkivalot kertovat käyttäjälle onko vastaus oikea vai ei.

Yleisin ongelma, johon törmäsimme tämän projektin tekemisessä, oli Processingin ja Arduinon välinen kommunikaatio, koska yhteyden viive voi vaihdella tietokoneiden välillä, mikä haittaa laitteen siirrettävyyttä. Sinun on myös määritettävä portti, johon Arduino on yhdistetty joka kerta, koska jokainen liitetty USB -laite laskee, joten sinun on tarkistettava, mikä COM se on.

Vaihe 1: Käyttöliittymän ohjelmointi käsittelyyn (asennus)

Asetamme käytettävät muuttujat, kaikkien osien sijainnin x- ja y -koordinaattien matriiseiksi, sekä taulukot kunkin osien kuville opetus- (imgA) ja arviointi (img) -valikoille, taulukko, jolla tarkistetaan, ovatko vastaukset oikeita, ja joukot bovereille ja lukituille, jotka määrittävät, onko hiiri kappaleiden yläpuolella ja yrittääkö se noutaa ne. Jatka sitten niiden alustamista ja avaa portti, josta käyttöliittymä aikoo kommunikoida Arduinon kanssa.

Vaihe 2: Käyttöliittymän ohjelmointi käsittelyyn (päävalikko)

Ensinnäkin päävalikossa näytetään kaksi painiketta, ja kun yhtä niistä painetaan, ohjelma lataa joko "Opeta" -valikon tai "Arvioi" -valikon.

Joten kun hiirtä painetaan ja se on jonkin painikkeen yläpuolella, se lähettää kaikkien uusien valikkojen tarvitsemien osien sijainnit ja lataa toisen valikon.

Vaihe 3: Käyttöliittymän ohjelmointi käsittelyyn ("Opetus" -valikko)

Tässä tapauksessa, jos hiiri liikuttaa jotakin osaa, se aktivoi vastaavan suojan, joka, jos hiirtä painetaan, aktivoi vastaavan tekstin ja näyttää sen näytöllä.

Vaihe 4: Käyttöliittymän ohjelmointi käsittelyyn ("Arvioi" -valikko)

Tässä on sama, se aktivoi bovers, jotka hiiren painalluksella aktivoivat lukot, mutta tällä kertaa tekstien näyttämisen sijaan se vetää valittua osaa. (Tämä perustui Processing.js: n vetämiseen, pudottamiseen ja hiiren kohdistamiseen.)

Vaihe 5: Kun hiirtä painetaan

Kuten aiemmin todettiin, kun hiirtä painetaan ja kansi on "tosi", se aktivoi vastaavan lukitun.

Vaihe 6: Kun hiirtä vedetään

Jos hiirtä vedetään, todellinen valikko on arviointivalikko ja yksi lukituista on "tosi", se vetäisi vastaavaa osaa hiiren vieressä.

Vaihe 7: Kun hiiri vapautetaan

Joten jos hiiri vapautetaan ja on edelleen "Arvioi" -valikossa, se sijoittaa vedettävän osan siihen kohtaan, johon sinun on rakennettava malli, jos se on riittävän lähellä, ja tarkistaisi, onko vastauksesi oikea. Sitten se palauttaisi kaikki lukitukset ja tekstit "epätosi".

Vaihe 8: Yhteydenpito Arduinon kanssa

Joten jos nyt painat Arduinon painiketta, se tarkistaa, asetitko kaikki oikeat osat paikoilleen ja kertoo, onko se oikein vai väärin, ja lähettää sitten "1", jos se on oikein, tai "2", jos se on väärin Arduino.

Vaihe 9: Arduinon määrittäminen (kaavio)

Tämä oli järjestelmä, jota käytettiin arduinoon, mutta jossa oli Arcade -painike, joten painikkeeseen menevä vihreä johto menisi painikkeen (COM) alaliittimeen ja punainen johto keskelle (EI). LEDeille käytettiin 220Ω vastusta, 1kΩ painikkeelle.

Vaihe 10: Arduinon ohjelmointi

Nyt se määrittää painikkeen tuloksi digitaalisessa nastassa 2 ja LED -valot OUTPUT -asetuksiksi 4, 6 ja 8. Sitten konfiguroidaan portti ja luetaan se, jos se saa "1" (oikea vastaus), se sytyttää 3 LEDit yksitellen, jos se saa "2" (väärä vastaus), se sytyttää vain yhden niistä. Lisäksi jos painiketta painetaan, se lähettää "e" -rajapinnan käyttöliittymään.

Vaihe 11: Siinä kaikki, pidä hauskaa

Tässä ovat tässä projektissa käytetyt koodit: