Les 1 - Je eerste tekening

Je gaat aan het einde van deze les je eerste tekening maken. Gebruik zo veel mogelijk variabelen om de verschillende lengtes aan te geven. Je zult merken dat je tekening dan veel sneller te veranderen is zonder dat je moet gaan zoeken waar welk getal ook alweer voor staat.

Een aantal belangrijke figuren zijn ellipsen, rechthoeken en lijnen. Je kunt ze vullen met een bepaalde kleur of de rand uitzetten of van kleur veranderen. Kijk maar eens naar het voorbeeld hieronder.

See the Pen boEgrp by Jurjenh (@jurjenh) on CodePen.

Zoals je ziet zijn al die getallen wel onoverzichtelijk. Wat als we nu iets willen veranderen? Laten we hetzelfde voorbeeld nu eens maken met behulp van variabelen.

See the Pen BwjpML by Jurjenh (@jurjenh) on CodePen.

Dat ziet er al beter uit. Natuurlijk kunnen we ook nog een variabele toevoegen voor bepaalde kleuren of de hoogte van de wielen en meer. We gaan dat nu niet doen.

Opdracht - Je eigen tekening

Ga nu zelf een tekening maken. Je mag zelf weten wat je tekent. Zorg dat je oefent met de verschillende vormen en kleuren etcetera.

Je hebt hiervoor een html pagina nodig met het volgende erin:

<!DOCTYPE html>
<html>
  <head>
  <meta charset="utf-8">
    <title></title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.14/p5.js"></script>
    <script src="tekening.js"></script> <!-- dit javascriptbestand bevat je tekening -->
  </head>
  <body>
  </body>
</html>

Zet dit bestand en je tekening in de map waar je de webserver hebt opgestart.

Als je wilt weten wat je nog meer kunt gebruiken kijk dan op https://p5js.org/reference/.

results matching ""

    No results matching ""