Een SVG (Scalable Vector Graphics) is heel gemakkelijk interactief te maken. Hieronder zie je een voorbeeld waarbij elementen in de DOM een andere tekst krijgen.
Categorieën
Categorie: programmeren
Categorieën
Boomerang als alternatief voor WeTranfer
Het is uitvoerig in het nieuws geweest: bij WeTranfer zijn door de nieuwe eigenaars in 2025 de voorwaarden gewijzigd. Data van gebruikers (kunnen) worden ingezet om AI te trainen (details vind je oa hier). Het lijkt dus heel verstandig om naar een alternatief te zoeken om grote bestanden te zenden.
Lees meer over het beste alternatief én -daarnaast- een reuze goed platform om nieuwsbrieven. te versturen. En vooral hoe een software-ontwerper zijn eigen weg bewandelt.
Als ronde voorwerpen zo dicht mogelijk bij elkaar liggen (bijeneitjes bijv.) dan is een driehoekig gelijkzijdig rooster (zie link) de beste optie. Ieder punt wordt dan omgeven door zijn zes (!) andere punten. Een hexagon past dan perfect op die plaats, zie het patroon (in P5-javascript gemaakt) hierboven.
Hoe maak je zo’n patroon met javascript en de p5.js-bibliotheek? En wat is de. link tussen een zeshoek en een voetbal?
Categorieën
Beethovenposter in P5
In P5 is hier de bekende Beethovenposter van Josef Müller-Brockmann nagemaakt, met variabelen voor de grafische onderdelen. Links het origineel en rechts in P5. Het geeft dus oneindig veel variaties. Om het beter te zien, klik hier. Naast het origineel staat daar de javascript versie.
Categorieën
boter, kaas en eieren..
Vorig jaar tijdens een werkweek heb ik dit spelletje tussendoor gemaakt in P5. Als oefening, niets meer dan dat. Het werkt redelijk, alleen zijn de tegenzetten van ’t kruisje nog niet heel sterk in het begin van een spelletje. Dat moet nog eens verbeterd worden…
Om te spelen (tegen de “computer”) klik hier.
Uitdaging
Probeer drie rondjes op een rij te krijgen én een volledig gevuld raster. Dat is niet zo moeilijk omdat de tegenzetten vaak niet zo sterk zijn.
Categorieën
Verdeel en heers
Met een eenvoudige vraag kun je toch nog even bezig zijn. Hoe kun je elementen gelijk verdelen en daarna concentreren rond een kern? In zijn meest elementaire uitwerking zou dat deze (schetsmatige) resultaten moeten opleveren:
Het eerste en laatste blokje moeten blijven staan. We gaan het in javascript (met P5) maken. Hieronder zie je het eindresultaat wat jij vast op een andere manier ook kunt realiseren. Jouw cursor of vinger bepaalt hoeveel blokjes (bovenaan minder, vanonder meer) en de concentratiefactor (links niets, rechts hoog). Voor de mobiele versie klik hier!
Categorieën
Worteltrekken, leuk?
Heb je geen fijne herinneringen aan wiskunde op de middelbare school? Lees dan eens het boek Algebra, van algoritmes tot vectoren van Michael Willers. Ik vond het voor minder van 10 euro in een boekwinkel in Rotterdam en was direct geboeid. Korte hoofdstukken over getallenreeksen maar ook over bijv. Egyptenaren. Zij gebruikten een tientallig getallenstelsel (met symbolen voor 1 t/m 1.000.000) !
En met de Babylonische methode (of Herons methode) om vierkantswortels te berekenen gaan we hier aan de slag. We testen het met behulp van een kort javascript.
Categorieën
Van schets naar recht
Een eenvoudige uitdaging: kan ik een slordige lijn tekenen op een canvas in html die daarna vanzelf een rechte lijn wordt? Hieronder staat een eerste versie met behulp van de P5-bibliotheek. Voor mobiele devices (jouw telefoon dus): klik hier.
De broncode voor deze eerste versie vind je hier. Er volgt nog een uitbreiding naar het herkennen van gebogen curves en, hopelijk, een vereenvoudiging naar bijv. een rechthoek.
Categorieën
Rijen afwisselen met modulus
Een korte uitleg over een javascript dat iedere rij in html een andere achtergrond kleur geeft. We gaan de modulus-operator gebruiken.
Hieronder het eindresultaat dat we willen bereiken:
Categorieën
Perfecte getallen..
In de eerste aflevering van Lewis (de sequel van de politieserie Morse) komt de fascinatie voor perfecte getallen aan bod. Het speelt zich dan ook af in Oxford. Perfecte getallen zijn gehele getallen die gelijk zijn aan de som van hun deelcijfers. Het kleinste perfecte getallen is 6, want deelbaar door 1 ,2 en 3 die opgeteld 6 zijn. Kunnen wij deze getallen vinden met een klein javascript? We gaan het op 2 manieren proberen.