Yleistä

Sähkömoottori voidaan käynnistää ja sammuttaa halutuksi ajaksi käyttäen Arduino-kehitysalustaa.

Pyörittääksesi sähkömoottoria tarvitset avuksi transistorin. Transistori on katkaisija, jota voidaan käyttää Arduinon digitaali pinneistä otettavalla virralla. Transistori katkoo Arduinosta saatavaa 5V sähkövirtaa. Transistorin käyttäminen on välttämätöntä, koska suoraan Arduinon digitaalipinneistä saadaan vain 30mA sähkövirta, joka riittää ledin sytyttämiseen, mutta moottori vaatii käynnistyäkseen usein reilusti yli 200mA.

Kytkennät

Tee alla oleva kytkentä ennen siirtymistä ohjelmointi osioon. Voit tehdä kytkennän joko edellä mainituista irto-osista tai kokeilla ensin valmiilla perma-proto kytkennällä. Tällöin riittää että kytket hyppylangat kuvan mukaisesti oikesiin kohtiin Arduinossa.

Huomaathan että transistorin asennolla ja diodin suunnalla on merkitystä.

Ohjelmointi

Graafinen ohjelmointi Snap4Arduinolla

1.     Avaa Arduino IDE
2.     Kytke Arduino UNO koneeseen USB kaapelilla
3.     Avaa Arduino IDE ja lataa Arduinoon Firmata-koodi. Kuvasta näkyy, mistä koodi löytyy.

4. Avaa Snap4Arduino-ohjelmointiympäristö.
5. Rakenna koodi esimerkin mukaan. Muista yhdistää Arduino ohjelmaan painamalla ohjelman valikosta ”Connect Arduino”. (Klikkaa
kuva suuremmaksi.)

Koodin rakentaminen Snap4Arduino ohjelmointiympäristössä

Rakenna koodi esimerkin mukaan.

1.     Valitse Ohjaus-välilehdestä ”kun painetaan välilyönti” (huom. ´välilyönti´ löytyy komennon alasvetovalikosta.)
2.     Valitse Ohjaus-välilehdestä ”toista (  ) kertaa”-komento ja raahaa se rakennettavan ohjelmakoodin jatkoksi. Täytä kenttään haluamasi kerta toistoja. Aloita pienellä toistomäärällä ja kasvata lukua kun kytkentä ja koodi toimii.
3.      Valitse Arduino-välilehdestä aktiiviseksi digitaalipinni 6. Raahaa jälleen komento jatkoksi toista-komennon sisälle. Katso esimerkkikuvasta näkymä. Mikäli kytket useamman moottorin ohjelmoitavaksi, aktivoi aina se digitaalipinni, mihin kyseisen moottorin kytket.
4.     Valitse Ohjaus-välilehdestä ”odota (  ) sekuntia”-komento ja raahaa se komennon jatkoksi. Tämä komento määrittelee kuinka monta sekuntia moottori on päällä.
5.     Tämän jälkeen se tulee sammuttaa. Ilman sammutuskomentoa moottori olisi päällä jatkuvasti. Valitse siis jälleen Arduino-valikosta ”set digital pin (6) to…”-komento, raahaa se komennon jatkoksi ja määritä se sammuttamaan signaali klikkaamalla ”to” sanan jälkeistä ruutua kahdesti, niin että se muuttuu punaiseksi.
6.     Määritä lopuksi kauanko moottori pidetään pois päältä ennen palaamista toistokomennon alkuun. Käytä tähän jällleen Ohjaus-valikon ”odota (  ) sekuntia”-komentoa.

Painamalla välilyöntiä, moottori käynnistyy ja sammuu määrittelemäsi määrän kertoja.

Tekstipohjainen ohjelmointi Arduino IDE:ssä

1. Avaa Arduino IDE ohjelmointiympäristö.
2. Kytke Arduino kiinni koneeseen USB A-B kaapelilla.
3. Avaa uusi ohjelmointialusta valitsemalla Tiedosto valikosta Uusi
4. Kopioi ja liitä seuraava koodi ohjelmointialustalle.
5. Tutustu koodin rakentumiseen joko kirjoittamalla koodi kokonaan itse ohjeiden mukaan, tai kopioimalla kokonainen koodi sivun lopusta. Lataa koodi Arduino kehitysalustaan painamalla ylälaidassa olevaa oikealle osoittavaa nuolta eli Lähetä-painiketta. Mikäli lataamisessa ilmenee ongelmia, palaa lukuun Arduinon perusteisiin ja tarkista että oikea dataportti on valittu.

6. Koodi rakentuu kahdesta funktiosta: setup-funktiosta ja loop-funktiosta. Ensimmäisen setup-funktion voi ajatella käynnistävän Arduinon ja aktivoivan kaikki ne pinnit, joita tullaan käyttämään. Siinä määritellään, että pinni 13 valmistautuu antamaan ulos sähkövirtaa. Pinni 13:aan on liitetty ledin (+)-jalka ja (–)-jalka Arduinon GND pinniin.

void setup() {
pinMode(13, OUTPUT);
}

7. Loop-funktio puolestaan toteuttaa varsinaisen toiminnan Arduino-kehitysalustalla. Tätä koodia luetaan ylhäältä alas. Esimerkkikoodissa pinni 13 aktivoidaan antamaan sähkövirtaa komennolla ”digitalWrite(13, HIGH);” Puolipiste (;) päättää komennon ja on siksi erittäin tärkeä.

void loop() {
digitalWrite(13, HIGH);

8. Seuraava komento on ”delay(1000);” joka määrittää, että edellinen komento pidetään toiminnassa 1000 millisekuntia, eli yhden sekunnin ajan. Tämän jälkeen siirrytään seuraavalle koodin riville.

delay(1000);

9. Komento ”digitalWrite(13, LOW);” määrittää ledin pois päältä.
Jälleen ”delay(1000);”-komennolla led pidetään sekunnin ajan pois päältä.

digitalWrite(13, LOW);
delay(1000);
}

10. Lopuksi vielä kokonainen koodi:

void setup() {
pinMode(13, OUTPUT);
}

void loop() {
digitalWrite(13, HIGH);
delay(1000);
digitalWrite(13, LOW);
delay(1000);
}

Kokeile rohkeasti muuttaa delay(1000)-komennon aikoja. Kokeile esimerkiksi kolmen sekunnin vilkutusta laittamalla delayn arvoksi 3000. Muistathan että muokattu koodi tulee aina ladata uudelleen Arduinoon.

Mitä seuraavaksi?

Mitä voisit pyörittää moottorilla? Tutustuitko jo painokytkimen toimintaan? Voit esimerkiksi kokeilla moottorin ohjausta painokytkimellä?

Voit seuraavaksi kokeilla joko interaktivisten graafisten ohjelmien tekemistä Processing-ohjelmointialustalla tai testata miten liiketunnistin toimii!

Yleistä

Processing on ohjelmointikieli jolla voi helposti luoda omia teoksia, interaktiivisia pelejä tai vaikkapa taidetta. Processing on suunniteltu nimenomaan median kanssa työskenteleville luovien alojen ihmisille ja sen käyttöönotto on helppoa. Tässä ohjeessa näytetään miten asennat Procssingin tai vaihtoehtoisesti käytät sitä nettiselaimella. Nettiselain versioita on mahdollista käyttää myös tableteille, älypuhelimilla tai muilla koneilla joihin ei ole mahdollista asentaa ohjelmistoa.

Processingin asentaminen tietokoneeseen

1. Processing-ohjelmointiympäristön voit ladata osoitteesta: https://processing.org/download/
2. Valitse käyttämäsi käyttöjärjestelmä ja aloita lataus
3. Seuraa latausohjelman ohjeita ja processing on asennettu koneellesi
4. Kun olet saanut processingin-käynnistettyä, aukeaa processingiin tyhjä ikkuna, jota processing kutsuu sketch:ksi. Tähän voit alkaa kirjoittamaan koodia.
5. Processingissa on kaksi nappulaa Play ja Stop (katso kuva) joilla saat ohjelman aloitettua ja lopetettua.
6. Lisäksi alhaalta löydät paikan joka ilmoittaa mahdollisista virheistä koodista.
7. Nyt voit aloittaa, vaikka tekemällä interaktiivisen naama-tehtävän

Processingin käyttäminen nettiselaimessa

Processing-ohjelmointiympäristöä voi käyttää kahdella eri verkkosivulla: Sketchpad.cc-sivustolla sekä OpenProcessing-sivustolla. Sketchpad.cc-sivuston hyvä puoli on se, että se ei vaadi kirjautumista, mutta sketchpadd-sivusto ei toimi kaikissa mobiililaitteissa. OpenProcessing toimii kaikissa mobiileissa, mutta vaatii tilin luomisen, joka on tosin ilmaista. OpenProcessingin lisäetu on se että siinä voi tehdä luokkahuoneita ja tällöin tehtyjä töitä voi helposti jakaa ja esitellä.

1. Processing-ohjelmointiympäristön voit ladata osoitteesta: https://processing.org/download/

1. Valitse käyttämäsi käyttöjärjestelmä ja aloita lataus
2. Seuraa latausohjelman ohjeita ja processing on asennettu koneellesi

Mitä seuraavaksi?

• Kokeile interaktiivisen naaman tekemistä, katso ohjeet!.

Yleistä

Tässä ohjeessa tutustut Processing-ohjelman perusteisiin ja teet samalla hauskan piirustusohjelman. Ohje toimii niin Processing-IDE:ssä kuin vaikka openprocessing.org tai Sketchpad.cc sivuilla

Ohjelmoiminen

1. Aloita ohjelmoiminen kirjoittamalla void setup-komento (katso esimerkkikoodi alta) ja sen sisälle komento size-komento, joka määrittelee piirtustusohjelmamme ikkunan koon. Esimerkissä sen kooksi on asetettu 500(leveys)*500(korkeus) pikseliä.
2. Pistä size-komennon alle, seuraavalle riville vielä komento background, joka kertoo minkä värinen ikkuna on. Esimerkissä sivun väriksi on asetettu valkoinen, eli numero 255. (Processing käyttää kaikista väreistä kuvanmuokkaus-ohjelmistostakin tuttuja RGB (red,green,blue)arvoja, jotka vaihtelevat välillä 0-255.
3. Tämän jälkeen kirjoita void draw-komento, joka aloittaa itse piirustusohjelman koodin.
4. Kirjoita ellipse-komento, joka piirtää ympyrän. Ellipse-komennossa on neljä arvoa sisällä. Niistä kaksi ensimmäistä asettavat ympyrän X ja Y -arvot ja kaksi viimeistä ympyrän leveyden ja korkeuden. Esimerkkikoodissa,ympyrän sijainti on sidottu hiiren sijaintiin komennoilla mouseX ja mouseY. Lisätietoa komennoista: mouseX, mouseY, ellipse. 
   

   Piirto-ohjelman koodi kokonaisuudessaan. (Klikkaa isommaksi)

5. Seuraavaksi voit kokeilla painaa play-nappia ja testata ohjelmaa.
6. Seuraavaksi voimme alkaa muokata piirto-ohjelmaa mielenkiintoisemmaksi. Näytämme tässä muutaman idean, mutta ohjelmaa voi myös jatkaa pidemmälle, ideoita voi saada vaikka selailemalla Processingin referenssi sivustoa.
7. Kirjoita ennen ellipse-komentoa, komento fill(255,0,0); tämä komento värittää ympyrän punaiseksi. fill-komennossa on kolme tai neljä arvoa: kolme ensimmäistä kertovat värin, eli RGB (red, green, blue)-arvot. Kun ensimmäinen arvo on 255 ja muut 0 niin silloin väri on aivan punainen. Voit myös kokeilla omia värejäsi kirjoittamalla eri numeroita noiksi kolmeksi arvoksi. Neljäs, vapaaehtoinen arvo on läpinäkyvyys joissa 0 on täysin läpinäkyvä.
   

   Piirto-ohjelman muokattu koodi

8.  Voit taas kokeilla ohjelmaa ja katsoa että kaikki toimii. Tämän jälkeen voimme muokata piirrettävien pallojen väriä vielä lisää Random-komennolla. Random-komento nimensä mukaisesti valitsee satunnaisluvun asettamaltamme skaalalta. Esimerkiksi komento random(0,255); asettaa arvoksi minkä vain luvun väliltä 0-255.
9. Muokkaa fill-komentoa vastaavaksi: fill(random(0,255), random(0,255), random(0,255)); tämä komento antaa jokaiselle eri värille arvon 0:n ja 255:n väliltä. Kokeile!
10. Tämän jälkeen muokkaame ympyrän kokoa. Muokkaa ellipse-komennoksi seuraava: ellipse(mouseX, mouseY, mouseY/5, mouseX/5); Tämä komento ottaa ympyrän kooksi hiiren sijainnin arvon (Eli jos ikkunamme koko on 500*500 niin jonkun arvon 0:n ja 500:n väliltä.) Tämän jälkeen komento myös jakaa tuon hiiren arvon viidellä, jottei ympyrästä tulisi liian suuria. Kokeile! 
11.  Piirustusohjelmamme on nyt valmis. Voit tietenkin jatkaa muokkausta. Katso lisäideoita Mitä Seuraavaksi osiosta!

Tässä koodi kokonaisuudessaan:

/* Yksinkertainen piirustusohjelma Processingilla. */

void setup() {
size(500,500);
//size(500, 500); // Tämä koodi kertoo ohjelman ikkunan koon (500*500 pikseliä)
background(255);
}

void draw () {
fill(random(0, 255), random(0, 255), random(0, 255)); //fill-komento täyttää alla olevat muodot valitulla värillä
ellipse(mouseX, mouseY, mouseY/5, mouseX/5); /*ellipse-komento piirtää ympyrän, ensimmäiset
kaksi arvoa kertovat sijainnin mihin ympyrä piirretään ja kaksi viimeistä ympyrän koon*/
}

Mitä seuraavaksi?

Piirto-ohjelmalla voit hyvin testata Processingin erilaisia komentoja, sekä tutustua ohjelmointiin paremmin. Tässä pari ideaa:

1. Kokeile muuttaa piirto-ohjelmaa niin että se piirtää neliöitä ympyrän sijaan
2. Kokeile muuttaa piirrettävän muodon kokoa satunnaiseksi
3. Kokeile läpikuultavia värejä
4. Jos ohjelmointi on jo tutumpaa kokeile tehdä monimutkaisempi piirustusohjelma: esimerkiksi eri näppäimiä painamalla piirtoohjelman väri, tai piirretävä muoto muuttuu.

Yleistä

Tässä ohjeessa esitellään kuinka Processing-ohjelmointikielellä voidaan ohjelmoida interaktiivinen hahmo. Processing on erityisesti taiteilijoille suunniteltu ohjelmointikieli, jolla voi helposti luoda erilaisia interaktiivisa teoksia. Katso Processingin-asennusohjeet täältä.

Ohjelmoiminen

Ohjelmoiminen tapahtuu joko Processingin omalla ohjelmalla tai nettiselaimessa toimivalla sketchpad.cc-sivustolla. Sketchpad sivusto ei vaadi asennusta koneille ja sitä voi siis käyttää millä tahansa koneella josta löytyy nettiyhteys. Processing-ohjelman hyviä puolia ovat nopeus ja monipuolisuus. (Katso asennus- ja lataus ohjeet täältä).

 Ympyrän piirtäminen

1. Ensimmäiseksi processingissä määritellään ikkunan, eli taideteoksen koko pikseleissä. Eli koko teosta voi ajatella koordinaateissa. Esimerkiksi 500,50o kokoisen teoksen ylä-vasen kulma on piste 0,0 ja ala-oikea kulma on 500,500.
2. Komento size(500,500); asettaa teoksen kooksi 500 kertaa 500 pikseliä. Kokeile painaa play-painiketta ja katso miltä teos näyttää.
3. Komento background(255,255,255); asettaa taustan värin valkoiseksi. Sulkujen sisällä olevat numerot asettavat taustan RGB (Red, Green, Blue) arvot välillä 0-255 (Sama kuin esimerkiksi photoshopissa) Kun kaikki arvot ovat 255 niin tausta on valkoinen.
4. Kokeile muuttaa background-komennon arvoja ja katso mitä tapahtuu.
5. Seuraavaksi piirretään ympyrä. Kirjoita komento Ellipse (250,250,200,200); Ellipsen sulkujen kaksi ensimmäistä arvoa kertovat sijainnin ja kaksi viimeistä koon: ellipse(x-sijainti, y-sijainti, x-koko, y-koko). Näillä asetuksilla piirtyy ympyrä täysin keskelle.
6. Kokeile muuttaa ympyrän kokoa ja sijaintia!

 Naaman piirtäminen

1. Piirrä naama ja sinne silmät käyttämällä ellipse-komentoja. Tässä yksi esimerkki naamasta, mutta voit keksiä oman! Muista piirtää myös pupillit: Tarvitse siis neljä ellipse-komentoa piirtämään silmät ja pupillit. Koita saada pupillit silmien keskelle!
2. Seuraavaksi käytetään line-komentoa, jolla piirretään nenä ja suu. line-komento yksinkertaisesti piirtää viivan, myöhemmin muokkaamme nenää ja suuta vielä paremmaksi. line-komento koostuu neljästä osasta, jotka ovat sulkujen sisällä :(x-aloituspiste, y-aloituspiste, x-lopetuspiste, y-lopetuspiste)
3. Kirjoita line (250,200,250,300); joka tekee nenän
4. Komento line (200,350,300,350); puolestaan piirtää suun.
5. Muokkaa suun ja nenän korkeuksia ja pituuksia haluamaksesi.

 Naaman muokkaaminen

Seuraavaksi lisätään naamaan hieman väri ja muotoa, sitä voidaan tehdä muutamalla eri komennolla: stroke(r,g,b) muokkaa piirretyn viivan väriä. Sulkujen sisällä olevat r,g,b kirjaimet viittaavat punaiseen, vihreään ja siniseen arvoon, joista kukin voi olla jotain välillä 0-255. Komento strokeWeight(x) (-huomaa että Weight kirjoitetaan isolla kirjaimella!) muokkaa piirretyn viivan paksuutta. Muuta x:n tilalle haluamasi paksuus. Lopuksi komento fill(r,g,b) muokkaa piirrettyjen muotojen sisällön väriä.

1. Kirjoita ennen ensimmäistä ellipse-komentoa (eli ihan alkuun)komento: fill(255,0,0); tämä värjää naaman punaiseksi.
2. Kokeile painaa play-nappia ja katso mitä tapahtuu!
3. Huomaatko että myös kaikki ympyrät fill()-komennon jälkeen värittyvät punaiseksi? Kirjoita ensimmäisen ellipse-komennon jälkeen toinen fill-komento: fill(255); tämä värjää muut ympyrät valkoiseksi. Huomaatko eron kahden fill-komennon välillä? Jos haluat vain tehdä harmaan sävyjä, tai mustaa ja valkoista, voit käyttää vain yhtä arvoa kun määrittelet värejä. Tällöin 0 on musta ja 255 on valkoinen.
4. Seuraavaksi muokataan nenän paksuutta. Kirjoita strokeWeight(30)-komento ennen nenää piirtävää viivaa.
5. Sitten muokataan suuta. Ennen suuta piirtävää viivaa kirjoita stroke(255,0,0); ja seuraavalle riville strokeWeight(10); Nämä muokkaavat suun viivan punaiseksi ja hieman paksummaksi.

Nyt naaman pitäisi näyttää jo hieman värikkäämmälle. Muokkaa vielä värejä ja paksuuksia, jotta saat tuntumaa koodiin. Huomaa että jokaisen komennon pitää olla omalla rivillään. Jos koodi ei toimi tarkista myös oikeinkirjoitus!

VINKKI: voit myös kommentoida koodia kirjoittamalla kommenttisi eteen kaksi kenoviivaa: // Näin voit esimerkiksi jakaa koodin selkeämmin ja näet helpommin mitä mikin koodirivi tekee. Katso kuva alla:

Vuorovaikutuksen tekeminen

Seuraavaksi teemme kasvoista hieman aktiivisemmat pistämällä ne reagoimaan hiiren (tai kosketuslevyn) liikkeisiin käyttämällä mouseX ja mouseY-komentoja. Samoin kuin teoksemme, myös koko tietokoneen näyttö koostuu pikseleistä X ja Y-akseleilla. mouseX-komento yksinkertaisesti kertoo osoittimen tilan x-akselilla ja mouseY-komento vastaavan y-akselilla. Voimme käyttää näitä arvoja ennaltamääriteltyjen arvojen sijasta tuomalla interaktiivisuutta teokseen.

Ennenkuin aloitamme joudumme hieman muokkaamaan ohjelmamme rakennetta jakamalla sen kahteen osaan void setup-asetusosioon ja void draw-ohjelma osioon. Tätä voidaan ajatella hieman samoin kuin tietokonetta: Kun käynnistämme tietokoneen niin ensin kuulemme käynnistysäänen ja tietokone alkaa lataamaan käyttöjärjestelmää ja konetta valmiiksi eli se käy setup-ohjelmaa läpi. Kun kaikki on valmista tietokone siirtyy ajamaan käyttöjärjestelmä-ohjelmaa, eli Processingin tapauksessa void draw-ohjelmaa. Tuo draw-ohjelma on päällä niin kauan kunnes suljemme ohjelman, läpikäyden kirjoittamaamme koodia rivi riviltä loopissa aina uudestaan ja uudestaan.

1. Ensin siirrämme tarvittavat asetus-komennot (tässä tapauksessa teoksen koko ja taustan väri)  void setup-kohtaan. Koodin pitäisi näyttää tältä:

 void setup(){
  size (500, 500);
background(255);
}

2. Seuraavaksi suljemme lopun koodin void draw-funktion sisälle. Silloin koko koodin pitäisi näyttää suunnilleen tältä, riippuen toki millaisen hahmon olet tehnyt:

void setup(){
  size (500, 500);
background(255);
}

void draw(){
//pää
stroke(0);
strokeWeight(1);
fill(255,100,100);


//silmät
ellipse(250, 250, 300, 400);
fill(255);
ellipse(200, 150, 50, 100);
ellipse(300, 150, 50, 100);

//pupillit
strokeWeight(5);
ellipse(200,150, 10, 10);
ellipse(300,150, 10, 10);

//nenä
strokeWeight(30);
line (250,200,250,300);

//suu
strokeWeight(10);
stroke(255,0,0);
line (200,370,250,350);
}

3. Kokeile miltä piirros näyttää nyt. Jos kaikki meni oikein, niin piiroksen pitäisi näyttää samalle kuin äsken. Jos ohjelma ei toimi tarkista kirjoitusvirheet ja huomaa että sekä setup ja draw-funktio alkavat ja loppuvat aaltosulkuihin, löydät ne Windows-koneessa AltGr + 6 tai 0-näppäinyhdistelmällä ja Macissa taas SHIFT+COMMAND+8 tai 9-näppäinyhdistelmällä.
4. Seuraavaksi animoimme pupillit liikkumaan hiiren mukaan. Etsi ellipse-komento joka määrittää pupillien pienet ympyrät.
5. ellipse-komennon kaksi ensimmäistä arvoa määrittävät pupillin sijainnin. Kokeillaan ensin muokata silmiä liikkumaan x-akselilla. Kirjoita ellipsen ensimmäisen arvon sijaan mouseX-komento ja katso mitä tapahtuu!
6. Nyt silmä liikkuu villisti ulos koko päästä! Saadaksemme sen liikkumaan hieman hillitymmin voimme pyytää processingia tekemään pienen laskutoimituksen puolestamme. Kirjoita ensimmäinen ellipse-komennon arvo takaisin siksi mikä se oli ja sen jälkeen, ennen pilkkua +(mouseX/12). Tämä lisää silmän arvoon hiiren x-akselin liikkeen jaettuna kahdellatoista. Tämä vähentää liikettä huomattavasti. Kokeile!
7. Nyt haluamme hieman viela viilata tuota liikettä niin että se ei mene yksipuoliseksi. Vähennä ellipsen ensimmäistä arvoa hieman, ehkä 20-30 pikseliä kunnes tuo pupilli liikkuu sopivasti.
8. Sitten teemme saman seuraavalle pupillille.
9. Tämän jälkeen lisätään Y-akselin liike. Löydä ellipse-komennon toinen arvo, vähennä siitä 20-30 pikseliä ja kirjoita +(mouseY/10).
10. Toista sama toiselle pupillille ja säädä arvot sopiviksi! Voit kokeilla myös muuttaa jakolaskua.
11. Seuraavaksi pistämme vielä suun liikkumaan. Kokeile lisätä suuta piirtävän line-komennon jotakin arvoa kirjoittamalla +(mouseX/10) tai vaikka -(mouseY/10).
12. Kokeile eri kohtia ja lisää suuhun haluamasi määrä animaatiota!
13. Viimeiseksi muokataan naaman väri muuttumaan x ja y-akselin mukaan. Muokkaa fill-arvoiksi (mouseX,mouseY,mouseX+150); ja katso mitä tapahtuu. Kokeile rohkeasti muokata noita arvoja haluamiksesi. Muista myös että voit käyttää matemaattisia yhtälöitä arvojen muokkaamiseen, kuten teimme edellä.

Tässä yksi esimerkki koodista, voit kopioida sen ja muokata sitä!

void setup() {
 size (500, 500);
}

void draw() {
 background(255);

 //naama
 stroke(0);
 strokeWeight(1);
 fill(pmouseX, pmouseX-100, pmouseX-200);
 ellipse(250, 250, 300+(pmouseY/2), 400+(pmouseX/2));

 //silmät
 fill(255);
 ellipse(200, 150, 50+(pmouseY/6), 120-(pmouseX/10));
 ellipse(300, 150, 50+(pmouseY/6), 120-(pmouseX/10));

 //pupillit
 strokeWeight(5);
 ellipse(180+(mouseX/12), 120+(mouseY/10), 10, 10);
 ellipse(280+(mouseX/12), 120+(mouseY/10), 10, 10);

 //nenä
 strokeWeight(30);
 line (250, 200, 250, 300);

 //suu
 strokeWeight(10);
 stroke(255, 0, 0);
 line (200, 370-(mouseY/10), 250, 350);
 line (250, 350, 300, 370-(mouseY/10));
}

Mitä seuraavaksi?

Tutustu Processingin-sanastoon täällä: https://processing.org/reference/ ja tutki esimerkiksi Pmouse tai mousepressed-komentoja. Mitä voisit saada niillä tehtyä naama-ohjelmassasi?

Yleistä

Tässä ohjeessa esitellään, kuinka voidaan tunnistaa liikettä käyttäen Arduino kehitysalustaa ja edullista pir-liiketunnistina. Pir-liiketunnistin tunnistaa ympärillä olevan infrapunasäteilyn muutokset, joita tulee esimerkiksi ihmisen liikkuessa. Käytännössä Pir-liiketunnistin toimii hieman samalla tavalla kuten esimerkiksi valokatkaisija, eli havaitessaan muutokseet, sensori menee päälle ja jos liikettä ei tapahdu määritellyn ajan kuluessa sensori menee pois päältä. Toisin sanoen Pir-liiketunnistimella ei voi mitata etäisyyttä, vaan se on digitaalinen sensori, joka kertoo vain onko liikettä vai ei. Analoginen sensori, kertoisi meille liikkeentunnistamisen lisäksi kuinka kaukana tai nopeasti joku liikkuu.

Tarvitset tehtävään tietokoneen.

Voit tehdä kytkennän alla mainituilla osilla tai hyödyntää valmista permaproto-kytkentää, jonka löydät Meta-boxi tarvikkeista. Permaproto-kytkennän kanssa tarvitset Arduino-mikrokontrollerin, tietokoneen ja USB-johdon.

Kytkennät

Pir-liiketunnistin kytketään arduinoon (mallista riippuen) +5-voltin pinniin, maahan, sekä valitsemaan digitaaliseen pinniin. Tässä esimerkissä se on kytketty pinniin 2.

Tee alla oleva kytkentä ennen siirtymistä ohjelmointi osioon. Voit tehdä kytkennän joko edellä mainituista irto-osista tai kokeilla ensin valmiilla perma-proto kytkennällä. Tällöin riittää että kytket hyppylangat kuvan mukaisesti oikesiin kohtiin Arduinossa.

Ohjelmoiminen

Graafinen ohjelmointi

1.     Avaa Arduino IDE
2.     Kytke Arduino UNO koneeseen USB kaapelilla
   
3.     Avaa Arduino IDE ja lataa Arduinoon Firmata-koodi. Kuvasta näkyy, mistä koodi löytyy.

4. Avaa Snap4Arduino-ohjelmointiympäristö.

5. Rakenna koodi esimerkin mukaan. Muista yhdistää Arduino ohjelmaan painamalla ohjelman valikosta ”connect arduino”.

Koodin rakentaminen Snap4Arduino ohjelmointiympäristössä

1. Valitse Ohjaus-välilehdestä ”Kun klikataan ”vihreä lippu””
2. Valitse Ohjaus välilehdestä Ikuisesti-komento
3. Valitse Ohjaus-välilehdestä Jos—muuten-komento ja raahaa se rakennettavan ohjelmointikoodin jatkoksi.
4. Valitse Laskenta-välilhdestä vihreä yhtäsuuri kuin palkki (katso kuva alla) ja raahaa se jos sanan jälkeen olevaan tyhjään valkoiseen laatikkoon.
5. Valitse Arduino-välilehdestä”digital reading”-komento ja raahaa se yhtä suuri kuin palkin ensimmäiseen tyhjään laatikkoon. Aseta Digital reading -komennon alasvetonuolesta pinniksi 2. 
6. Lisää toiseen yhtä suuri kuin palkin laatikkoon Laskenta valikosta  ”tosi”-painike.
7. Tämä vastaa samaa kuin HIGH tai ON.
8. Valitse Arduino-välilehdestä ”set digital pin”-komento ja raahaa se JOS sanan alle.
9. Aseta ”set digital pin”-komennon numeroksi 13. (Tämä vastaa siis pinniä missä Led-valo on kytketty.)
10. Aseta ”set digital pin”-komennon oikealla oleva painike vihreäksi, tämä laittaa siis ledin päälle.
11. Raahaa toinen ”set digital pin”-komento MUUTEN sanan alle.

Painamalla vihreää lippua pitäisi led-valon syttyä aina kun Pir-liiketunnistin havaitsee liikettä ja sammua silloin kuin se ei havaitse.

Ohjelmointi Arduinolla

Pir-liiketunnistinta voi helposti ohjelmoida myös suoraan Arduinosta. Oheinen koodi tekee saman kuin ylläoleva koodi: Laittaa ledin päälle kun liikettä tunnistetaan. Vaikka teksipohjainen ohjelmointi voi olla vaikeaselkoisempaa, voi sillä tehdä helposti monipuolisia ohjelmia, eikä tietokoneen tarvitse olla auki tai kytkettynä Arduinoon. Kopioi ja lataa alla oleva koodi Arduinoon.

/*
 * Pir-liiketunnistimen demokoodi
 */
 
int led = 13; // Led-valo kytkettynä pinniin 13
int pir = 2; // pinni missä pir-liiketunnistin on kiinni
int pirState = LOW; // muuttuja, joka komentaa liiketunnistimen tilaa, asetettuna aluksi pois päältä
int val = 0; // muuttuja johon luetaan liiketunnistimen tila
 
void setup() {
 pinMode(led, OUTPUT); //Led-valon pinnin asettaminen outputiksi
 pinMode(pir, INPUT); // Liiketunnistimen pinnin asettaminen inputiksi
 Serial.begin(9600); // Aloitetaan yhteys arduinon ja tietokoneen välille, vianmäärittelyyn yms.
}
 
void loop(){
 val = digitalRead(pir); //luetaan liiketunnistimen tila
 if (val == HIGH) { // tarkastetaan onko tunnistin päällä ja jos se on päällä laitetaan led paalle.
 digitalWrite(led, HIGH); 
 if (pirState == LOW) {
 // we have just turned on
 Serial.println("Liiketta havaittu");
 pirState = HIGH;
 }
 } else {
 digitalWrite(led, LOW); // jos liikettä ei ole havaittu, pistetään led pois päältä.
 if (pirState == HIGH){
 // we have just turned of
 Serial.println("Ei liiketta");
 pirState = LOW;
 }
 }
}

Mitä seuraavaksi?

Voit muuttaa PIR-sensorin herkkyyttä ja aikaa kuinka kauan se on päällä suoraan vääntämällä sensorissa olevia potentiometrejä eli keltaisia säätöruuveja.

Liiketunnistinta voi käyttää moneen asiaan, esimerkiksi laittamaan moottorin päälle kun joku liikkuu, tai valot vilkkumaan kun joku liikkuu. Liiketunnistimen voi myös laittaa osaksi monipuolisempaa ohjelmaa.

Seuraavaksi  voit kokeilla servomoottorin toimintaa!