Kunstikinnas: 10 sammu (piltidega)

2024 Autor: John Day | [email protected]. Viimati modifitseeritud: 2024-01-30 08:45

Art Glove on kantav kinnas, mis sisaldab erinevat tüüpi andureid, et juhtida kunstigraafikat Micro: bit ja p5.js abil. Sõrmed kasutavad paindeandureid, mis kontrollivad r, g, b väärtusi, ja Micro: bit juhtimisseadmete kiirendusmõõturit x, y graafika koordinaadid. Lõin selle projekti oma kandmisvõimaluste tehnoloogia klassi tähtajalise projektina CU Boulderi tehnoloogia, kunsti ja meedia programmi vanemana.

Tarvikud:

• Aiakindad
• BBC Micro: natuke
• 3-4 Flex-andurit
• 10K oomi takistid
• Haaketraat (punane ja must)
• Traadi lõikurid
• Leivalaud
• Alligaatori klambrid (kahe- ja ühepoolsed)
• Jootma
• Jootekolb
• Nõel
• Niit
• Vahapaber
• Lint
• Käärid
• Pliiats ja pliiats

1. samm: painutage anduri jälgi

Esiteks keskendume riistvara valmistamisele. Nii saame kodeerimise juurde jõudes kasutada ja testida kindakomponenti.

1. Alustuseks teeme sõrmedele rajad, mis hoiavad paindeandurid paigal. Nende radade olemasolu võimaldab paindeanduritel veidi edasi -tagasi liikuda, hoides samal ajal ka painutamiseks sõrme külge kinnitatud. Kõigepealt pöörake kinnas tagurpidi.
2. Võtke paindesensor ja asetage see sõrme keskele. Pliiatsiga visandage paindeandur
3. Libistage niit läbi nõela. Andke endale helde tükk. Siduge niidi otsa sõlm.
4. Alustades ülaosast ja joonest, puhuge lihtsalt paindeanduri kaar, libistage nõel läbi kinda seestpoolt ja lükake see paralleelsel joonel tagasi. Tõmmake nõel lõpuni läbi, nii et sõlm paikneb joonistatud joonel.
5. Tihedalt tõmmates tehke 2-3 sõlme teisel küljel. See tagab, et niit ei tule välja. Veenduge, et see oleks pingul, nii et paindeandur oleks sõrme vastas
6. Katkesta lõng, jättes paar cm. lõnga lõpus, nii et sõlm ei jääks lahti.
7. Korrake samme 2-6 kõigi sõrmede jaoks, mille külge paindeandureid kinnitate, kuni see näeb välja nagu kolmas kuni viimane pilt.
8. Pöörake kinnas tagasi nii, et see oleks õigesti pööratud. Libistage oma paindeandurid läbi radade, veendumaks, et need sobivad teie käele õigesti

2. samm: jadamisside kasutamine Micro: bitiga

Andurite väljundite nägemiseks kasutame jadaühendust. Järgmisel etapil näete Makecode'is koodi seadistamist, kuid kõigepealt õpime seda oma terminalist lugema. (Märkus: ma kasutan Maci, nii et need sammud võivad olenevalt teie operatsioonisüsteemist erineda. Teiste operatsioonisüsteemide kohta vaadake siit).

1. Ühendage oma Micro: bit
2. Avage oma terminal
3. tippige "ls /dev/cu.*"
4. Te peaksite nägema midagi, mis näeb välja nagu „/dev/cu.usbmodem1422”, kuid täpne arv sõltub teie arvutist
5. Kui olete koodi käivitanud, sisestage "screen /dev/cu.usbmodem1422 115200" (koos teie konkreetse jadapordi numbriga) teie Micro: bit seeriaväljund
6. Sõltuvalt väljundi vormindamisest peaks teie väljund välja nägema ülaltoodud pildi sarnane!

3. samm: vooluringi prototüüpimine

Enne kõigi komponentide kokku jootmist teeme vooluringi prototüübi ja kirjutame paar rida näidiskoodi, et lugeda meie andurite väärtusi ja veenduda, et meie komponendid töötavad õigesti.

1. Kasutades ülaltoodud skeemi, prototüüpige oma vooluahel leivaplaadil, kasutades hüppajajuhtmeid, takistid, ühepoolsed alligaatoriklambrid ja Micro: bit.
2. Ühendage paindeandurid tihvtidega 0, 1 ja 2.
3. Kasutasin seda koodi oma paindeandurite testimiseks
4. Painutage neid paar korda, et näha nende näitu ja veenduda, et need töötavad õigesti

Koodis on viimane rida "serial.writeLine" koht, kus me kirjutame oma jadaväljundile. Saate selle väljundi vormindada, kuidas soovite, eraldasin kõik muutujad komaga ja jagasin need hiljem komaks, kuid see osa on teie otsustada.

(Märkus. Pärast seda sammu avastasin, et ühel mu paindeanduril oli juhtivvärvi kiip ja seetõttu ei saanud see häid näiteid. Sellepärast näitavad mõned pildid, et töötan nelja anduriga. Pärast selle avastamist läksin kuni kolm andurit osuti, keskmise ja sõrmuse sõrmes. Samuti leidsin, et minu paindesensoritel oli kõige laiem lugemisulatus, painutades "vastupidist" suunda, mistõttu panin need kindale vastupanuvärviga allapoole.)

Samm: kiirendusmõõturi ja valgusanduri testimine

Selles etapis otsustasin ka Micro: bitil kiirendusmõõturit ja valgusandurit testida

1. Ühendage oma Micro: bit arvutiga
2. Laadige see kood alla
3. Seejärel katsetasin kiirendusmõõturi, valguse ja paindeandureid koos selle koodiga

(Märkus: just sel hetkel mõistsin, et te ei saa tihvte ja valgusandurit korraga kasutada, nii et ma ei kasutanud oma finaalis valgusandurit, kuid tahtsin, et te näeksite, kuidas lugeda vajadusel valgusandurit!)

Samm: painutusandurite jootmine

Nüüd hakkame oma komponente koos jootma! See on põnev osa, kuid oluline on aeglaselt liikuda ja kontrollida, kas kõik töötab endiselt, nii et te ei jõua lõpuni, midagi ei tööta ja pole kindel, kus see valesti läks! Soovitan siin kasutada oma kahepoolseid alligaatoriklambreid, et kontrollida, kas iga andur töötab ikka veel, kui juhtmed ja takistid on kokku joodetud.

1. Võtke paindeandur ja teip või asetage sellele raske ese, et seda paigal hoida.
2. Võtke oma 10K oomi takisti ja lõigake suurem osa otsast ära, nii et juhe oleks umbes sama pikk kui paindeanduri juhe.
3. Võtke jootekolb ja vajutage seda nii takistile kui ka painutusanduri juhtmele, kuni need on kuumad
4. Võtke joodis ja vajutage see kuuma rauda, kuna see hakkab komponentide kohal sulama. Teil on vaja lihtsalt piisavalt juhtmeid katta.
5. Eemaldage triikraud. Siin panin ma teise aiakinda kätte ja hoidsin takisti ja traati paigal, kuni joodis jahtus.
6. Klammerdage pikk tükk punast traati ja asetage see jootekohta, kus takisti ja paindeandur kohtuvad. Korrake samme 4-5. See on analoog -tihvtraat.
7. Lõigake pikk tükk musta traati ja asetage see teise juhtme otsa. Korrake samme 4-5. See on teie maandusjuhe.
8. Lõika pikk tükk punast traati ja klammerda takisti teine ots nii, et see oleks umbes sama pikk kui eelmine pool. Korrake samme 4-5. See on teie toitejuhe.
9. Korrake samme 1-8 ülejäänud paindeandurite jaoks.
10. Jätke oma juhtmed pikaks, et teil oleks ruumi töötada, et need hiljem Micro: bitile pannes õige pikkusega muuta.

6. samm: jootmine Micro: bitti ja kinda kokkupanek

Nüüd, kui meie andurid on valmis, hakkame Micro: bitti jootma ja kinnast kokku panema. Ärge unustage uuesti katsetada, kasutades alligaatoriklambreid, veendumaks, et komponendid töötavad ka pärast nende kokku jootmist.

1. Asetage andurid ja Micro: bit kindale, et saada aimu, kuhu juhtmed peavad minema ja kui kaua nad peavad olema.
2. Keerake toitepistiku ümber punane juhe. Kasutage traadi eemaldamiseks traadilõikureid ja jätke lahti tühimikud, mille külge te traadi kinnitate. Tehke seda ka maandusjuhtme jaoks.
3. Visandage kinnas, mida te ei kasuta. See aitab meil kõik kokku joota ja asjade pikkuse õigesti määrata. Teete siiski kõike tagurpidi, nii et kontrollige veel kord, kas joote asju õigesti!
4. Asetage oma Micro: bit umbes sinna, kuhu soovite, et see teie käele asetataks. Jälgige, et maa ja toitejuhtmed istuksid.
5. Kleepige teip, vool või maandus oma kohale.
6. Kleepige oma paindeandur oma kohale.
7. Katkestage toitejuhe nii, et see läheks üle kogu toiteliini märgi.
8. Jootke need tükid kokku.
9. Korrake samme 5-8 teiste toitejuhtmete ja maandusjuhtmete puhul.
10. Võtke Micro: bit ja asetage see värskelt joodetud juhtmete alla. Jootke toide ja maandus õigete tihvtideni.
11. Lõigake analoogjuhtmed nii, et need läheksid tihvtide otsast mööda ja saaksid esiküljele ümber keerata.
12. Jootke juhtmed õigete tihvtide külge.
13. Leidsin, et minu näidud olid parimad ja kõige järjepidevamad, kui kõik juhtmed (toide, maandus ja analoog) puudutasid tihvtide esi- ja tagakülge.
14. Üks rada ükshaaval lükake paindeandurid samaaegselt sõrmedest üles.
15. Kui andurid on paigas, pange kinnas kätte ja veenduge, et see sobib. Kui teil on vaja lugusid lisada või nende paigutust parandada, tehke seda kohe.
16. Kui andurid asuvad soovitud kohas, pange tähele, kuhu Micro: bit siduda. Võite kasutada nuppe A ja B mõlemal küljel olevaid väikeseid auke või kasutada tihvtide jaoks mõeldud auke. Siduge see oma nõela ja niidiga käe külge

Palju õnne! Kinda riistvarakomponendid on nüüd valmis!

Samm: mikro: bitikood

Nüüd tutvustan teile Micro: bit koodi. Olete rohkem kui teretulnud selle koodi muutma, mida soovite, aga ma tahtsin kõik läbi vaadata ja selgitada, et näeksite, mida tegin, kuidas tegin ja miks! Minu koodi leiate siit.

1. Ridad 1-31. Siin kasutan Micro: bitiga kaasasolevaid eelseadistatud funktsioone.

   • Vajutades klahvi A, väheneb loend, mis on saadavaloleva graafika valik. Kui jõuate 0 -ni, läheb see tagasi suurimale numbrile.
   • Kui vajutate klahvi B, suurendate arvu, kui jõuate suurima saadaoleva graafika hulka, läheb see tagasi 0 -le.
   • Kui teie valitud graafika ei ole praegu joonistatav, valib A ja B üheaegne vajutamine uue graafika.
   • Kui teie valitud graafika on sama, mis joonistatav, täidab A ja B üheaegselt vajutamine kuju, kui sellel võib olla täidis.
   • Mikro: bitti raputamine seab kustutusmuutujaks 1, mis käsib p5.js -l lõuendi kustutada ja alustada mustalt. See peatab jooksu hetkeks ja seejärel seab selle tagasi väärtusele 0, et kasutaja saaks joonistamist jätkata.

2. Liinid 32-64 seadistavad minu muutujaid. Oluline oli kasutada palju muutujaid, et enamik väärtusi ei oleks kõvakodeeritud. Need võivad kindaga muutuda ja neid saab hõlpsalt ühes kohas vahetada, selle asemel, et kõikjal väärtusi värskendada. Toon välja mõned olulised.

   • Lõuendi suurus on üks, mida on tore ühes muutujas värskendada, sõltuvalt minu lõuendi suurusest. Sama kujuga Kõrge. Graafikat lisades või sellest vabanedes saan seda numbrit siin värskendada.
   • Kõrged ja madalad muutujad võimaldavad mul jälgida andurite praegust kõrget ja madalat taset ning neil on pidev kalibreerimisvahemik. See on oluline, kuna igal kindaid kandval inimesel on erinev liikumisulatus ja seetõttu erinevad tõusud ja mõõnad, mida nad suudavad saavutada.
3. Ridad 66-68 loevad paindandurite tihvtide analoogväärtusi

4. Ridad 69–74 kalibreerivad osuti sõrme kõrget väärtust.

   • Kui saavutatakse uus tipp, seab see selle kõrgeimaks.
   • Kalibreerib selle sõrme ulatuse uuesti.
   • Kasutab seda värvivaliku uut vahemikku
5. Ridad 75–80 kalibreerivad osuti sõrme madalat väärtust.
6. Liinid 81–104 teevad keskmise ja sõrmusesõrme puhul sama, mida 4 ja 5.

7. Ridad 105–107 kaardistavad minu paindeanduri väärtused värviväärtusteks 0–255 (või värvi Vähe värviks, kui ma ei tee kogu vahemikku)

   • Makecode'i sisseehitatud kaardifunktsioon ei andnud mulle suurepärast kaardistamist, arvestades andurite poolt saadud piiratud ulatust. Seega tegin oma kaardistamisfunktsiooni.
   • See toimib järgmiselt. Iga sõrme sisendvahemik määratakse selle järgi (kõrgeim väärtus - see on madalaim väärtus). Värvivalik, mis on ühtlasi (kõrgeim värviväärtus - madalaim värviväärtus), jagatakse iga sõrmevahemikuga. See arv ümardatakse madalaima täisarvuna ja on jagatis.
   • (Anduri tegelik väärtus - madalaim anduri väärtus) annab teile väärtuse vahemikus. Selle korrutamine ülaltoodud jagatisega ja väikseimate värviväärtuste lisamine annab teile anduri kaardistatud väärtuse värvivahemikus.
8. Rida 109 näitab pigi väärtust (üles ja alla).
9. Liinid 110-115 kalibreerivad selle väärtuse jaoks kõrgeid ja madalaid
10. Rida 116 kuvab rulli väärtust (vasak ja parem).
11. Liinid 117-122 kalibreerivad selle väärtuse jaoks kõrgeid ja madalaid
12. Ridad 123-126 kaardistavad helikõrguse ja rulli väärtused lõuendi suurusele ja ümardavad need täisarvudeks.
13. Rida 127 kirjutab muutujad jadaväljundisse, kasutades serial.writeLine, eraldades kõik väärtused koma ja tühikuga ",", et hiljem analüüsida.

Kui kood on teile meelepärane, laadige see alla ja lohistage see allalaaditud failidest oma Micro: bitile (peaksite seda leidja vasakul küljel asuvale asukohale nägema), et kood Micro: bitile üles laadida

8. samm: jadaühendus P5.js -ga

P5.js -iga seeriasuhtlemiseks vajame lisatööriista. Seeriakommunikatsiooni telgitaguste kohta lisateabe saamiseks soovitan lugeda seda artiklit.

1. Laadige sellelt lingilt alla rakenduse p5.js versioon. Mul on Alpha 6 versioon, kuid mis tahes töötab.
2. Kasutage seda p5.js malli järjestikuseks suhtlemiseks. Selle seadistamiseks sisestage reale 12. õige portName jadapordi nimi. See on nimi, mille me arvasime 2. sammus.
3. Ühendage oma Micro: bit arvutiga
4. Avage jadarakendus p5.js.
5. Valige portide loendist oma port ja ärge tehke midagi muud. Isegi mitte vajutada lahti! Valige lihtsalt oma loendist oma port.
6. Vajutage p5.js seeriamalli käivita. Te peaksite nägema seda avatuna ja see loeb teile nullväärtusi, kuna me pole oma jadaväljundi sõelumiseks koodi veel kirjutanud.

Nüüd saame suhelda järjestikku oma Micro: bitist p5.js!

9. samm: P5.js -kood

Nüüd hüppame p5.js koodi. Siit loeme jadaväljundi väärtused ja kasutame neid kunsti loomiseks.

1. Nagu ma eelmises etapis mainisin, veenduge, et rea 12 portName on teie konkreetne arvuti pordi nimi.
2. Funktsioonis setup () lisasin ridadele 32-33 vasaku ja parema puhvri createGraphics abil, lõuendi eraldamiseks nii, et üht osa kasutatakse joonistamiseks ja teine osa saab kuvada juhiseid ja näidata, milline graafika vaatate või sirvite.
3. Funktsioon draw () kutsub üles minu loodud funktsioonid, et luua vasakpoolne ja parempoolne puhver eraldi. Samuti määratletakse, kust algab iga puhvri vasak ülemine nurk.
4. Funktsioon drawRightBuffer () kuvab kogu teksti juhiste ja graafiliste valikute jaoks

5. Funktsioonid drawLeftBuffer () kuvab kogu graafika.

   • Rida 93 genereerib juhuslikult alfa -väärtuse väärtuse. See on nii, et kõigil värvidel on erinevad läbipaistvuse väärtused, et muuta see huvitavamaks. Kui mul oleks olnud 4 paindeandurit, oleksin selle jaoks kasutanud neljandat!
   • Rida 94 seab käigu väärtuseks painduvusandurite määratud r, g, b väärtused
   • Ridu 96-102 saab kommenteerimata jätta, et katsetada kinnaste toimimist ilma kinnaseta, kasutades selleks hoopis hiirt. Asendage rida 102 ülejäänud funktsiooni graafikaga.
6. 104-106 kustutage lõuend, kui käsi väriseb, määrates lõuendi tausta mustaks
7. 108-114 kontrollivad kujundite täitmist, kui vajutada ja valida A+B ning praegune kuju on sama
8. 117-312 on need kohad, kus graafikat kuvatakse. See on suurem osa koodist ja osa loominguliseks muutmiseks! Soovitan vaadata p5.js viiteid, et paremini mõista, kuidas kujundeid juhtida. Kasutasin rulli ja sammu x, y positsioonide juhtimiseks ning kujundite ja graafika suuruse muutmiseks ning nagu varem mainisin, kasutasin. painutage andureid värvi juhtimiseks. Siin saate olla loov! Mängige sellega, mida p5.js pakub, ja mõelge välja oma lõbus graafika, mida juhtida! Siin määran ka paremal puhveril kuvatava praeguse kuju kirjelduse.
9. 318-460 Määran valitudVormi kirjelduse.

10. Ridad 478-498 on funktsioon serialEvent (). Siit saame seeriaandmed.

    • Ridadel 485-486 seadsin proll ja ppitch (eelmine rull ja samm) eelmisele rulli ja sammu väärtusele.
    • Reas 487 jagasin andmed ",". Teen seda seetõttu, et kirjutasin andmed komadega eraldatavaks. Sa paneksid siia kõik, millega oma muutujad eraldasid. Need muutujad sisestatakse numbrimassiivi.
    • Seejärel seadsin ridadel 488-496 muutujad massiivi vastavale elemendile ja tõlgin need stringist arvuks. Ma kasutan neid muutujaid graafika juhtimiseks kogu drawLeftBuffer () funktsioonis.

See võtab koodi peaaegu kokku ja lõpetab projekti! Nüüd näeme, kuidas kinnas töötab.

10. etapp: lõpptoode

Siin on mõned pildid valmis kinnast ja mõned selle loodud kunstiteosed! Vaadake demo videot, et näha seda tegevuses!