Generador de formes amb p5.js — Ultra Premium v2 (coordenades absolutes)

Editor tàctil amb zoom, pan, exportació de codi p5.js amb coordenades absolutes i projectes JSON per desar i carregar tot el treball.



Mòbil: toca un punt per moure’l · toc curt sobre buit = nou punt · arrossegar sobre buit = desplaça la vista · 2 dits = zoom + pan.
Exportació: cada forma s’exporta com a bloc amb comentari del nom, fill(...) i coordenades absolutes.
Punts actuals: 0 Formes desades: 0 Punt seleccionat: cap Mode: Nova forma Pipeta: desactivada Zoom: 100% Color triat:
Coordenades del punt seleccionat: cap
Vista:
100%

Com s’utilitza?

  1. Toc curt sobre una zona buida → afegeix un punt.
  2. Toca un punt i arrossega’l → mou el punt.
  3. Arrossega sobre buit → desplaça la vista.
  4. Fes pinça amb dos dits → zoom i desplaçament.
  5. Activa la pipeta si vols captar el color d’una zona de la imatge.
  6. Quan desis, el codi exportat tindrà comentari + fill + vèrtexs absoluts.

Codi exportat

// Encara no hi ha cap forma desada.

Llegenda visual

Punt normal
Punt sota el punter
Punt seleccionat
Punt arrossegat

Formes desades

Cada forma s’exporta com un bloc independent amb comentari, color i coordenades absolutes.

Encara no hi ha cap forma desada.

Ajuda didàctica

Exemple d’exportació:

// Ull esquerre
fill(255, 120, 80);
beginShape();
vertex(120, 80);
vertex(140, 92);
vertex(135, 110);
endShape(CLOSE);

Nota sobre bezierVertex

El primer punt és el punt inicial. Després, els punts es llegeixen en grups de 3: control 1, control 2 i punt final.