Salta al contingut

Universitat Oberta
de Catalunya

  • Català
  • Spanish

Quadern de programació amb p5js

Autoria: Carlos Casado, Federico Guardabrazo i Rocío Márquez
La revisió d'aquest recurs d'aprenentatge UOC ha estat coordinada pels professors: Enric Mor i Joan Soler-Adillon
PID_00290093
Segona edició: setembre 2022

Menú
  • Portada
  • 1. Programació creativa
    • 1.1. Introducció i objectius
    • 1.2. Breu història de la computació
    • 1.3. Pensament algorítmic
    • 1.4. Llenguatges de programació
    • 1.5. Llenguatges i entorns per a la programació creativa
    • 1.6. Programació creativa en el disseny i les arts
  • 2. Primers passos: formes i colors
    • Portada 2. Primers passos: formes i colors
    • 2.1. Introducció i objectius
    • 2.2. CodeLab
    • 2.3. Estructura d’un programa en P5.js
    • 2.4. Formes bàsiques i coordenades
    • 2.5. Referència de P5
    • 2.6. Comentaris
    • 2.7. Ordre d’execució i de dibuix
    • 2.8. Propietats de les formes
    • 2.9. Color
    • 2.10. Formes personalitzades
    • 2.11. Repàs: coordenades, formes i color
  • 3. Variables i funcions
    • 3.1. Introducció i objectius
    • 3.2. Variables: reutilitzar valors
    • 3.3. Variables del sistema
    • 3.4. Operacions bàsiques
    • 3.5. Consola
    • 3.6. Funcions
    • 3.7. Funcions amb paràmetres
    • 3.8. Funcions amb valors de retorn
    • 3.9. Refactoritzar
    • 3.10. Repàs: operacions bàsiques i funcions
  • 4. Bucles i aleatorietat
    • Portada 4. Bucles i aleatorietat
    • 4.1. Introducció i objectius
    • 4.2. Iteració
    • 4.3. Bucles for
    • 4.4. Bucles imbricats
    • 4.5. Aleatorietat
    • 4.6. Repàs: bucles for
  • 5. Condicionals
    • 5.1. Introducció i objectius
    • 5.2. Lògica condicional
    • 5.3. Condicionals if, if-else
    • 5.4. Operadors lògics
    • 5.5. Condicionals switch
    • 5.6. Temporitzadors
    • 5.7. Bucles i condicionals
    • 5.8. Repàs: condicionals
  • 6. Interacció
    • Portada 6. Interacció
    • 6.1. Introducció i objectius
    • 6.2. Execució única vs. contínua
    • 6.3. Interactuant amb el ratolí
    • 6.4. El mètode map()
    • 6.5. Interactuant amb el teclat
    • 6.6. Patró interactiu
  • 7. Moviment
    • Portada 7. Moviment
    • 7.1. Introducció i objectius
    • 7.2. Moviment lineal
    • 7.3. Moviment ondulatori
    • 7.4. Moviment circular
    • 7.5. Moviment aleatori
  • 8. Multimèdia
    • 8.1. Introducció i objectius
    • 8.2. Text
    • 8.3. Imatges
    • 8.4. Vídeo
    • 8.5. Repàs: imatges i tipografia
  • 9. Objectes i arrays
    • Portada 9. Objectes i arrays
    • 9.1. Introducció i objectius
    • 9.2. Objectes
    • 9.3. Arrays
    • 9.4. Arrays i objectes
    • 9.5. Repàs: arrays
  • 10. Visualització de dades
    • 10.1. Introducció i objectius
    • 10.2. Dades
    • 10.3. Taules
    • 10.4. JSON
    • 10.5. Dades d’internet: API
    • 10.6. Exemple pràctic de tractament de dades d’una font espanyola
  • Annex. Entorn de treball
    • Annex 1. Introducció
    • Annex 2. L’espai de treball en el nostre ordinador
    • Annex 3. L’editor de codi
    • Annex 4. La llibreria de p5.js
    • Annex 5. El fitxer HTML base
    • Annex 6. El fitxer sketch.js
  • Portada
  • 1. Programació creativa
    • 1.1. Introducció i objectius
    • 1.2. Breu història de la computació
    • 1.3. Pensament algorítmic
    • 1.4. Llenguatges de programació
    • 1.5. Llenguatges i entorns per a la programació creativa
    • 1.6. Programació creativa en el disseny i les arts
  • 2. Primers passos: formes i colors
    • Portada 2. Primers passos: formes i colors
    • 2.1. Introducció i objectius
    • 2.2. CodeLab
    • 2.3. Estructura d’un programa en P5.js
    • 2.4. Formes bàsiques i coordenades
    • 2.5. Referència de P5
    • 2.6. Comentaris
    • 2.7. Ordre d’execució i de dibuix
    • 2.8. Propietats de les formes
    • 2.9. Color
    • 2.10. Formes personalitzades
    • 2.11. Repàs: coordenades, formes i color
  • 3. Variables i funcions
    • 3.1. Introducció i objectius
    • 3.2. Variables: reutilitzar valors
    • 3.3. Variables del sistema
    • 3.4. Operacions bàsiques
    • 3.5. Consola
    • 3.6. Funcions
    • 3.7. Funcions amb paràmetres
    • 3.8. Funcions amb valors de retorn
    • 3.9. Refactoritzar
    • 3.10. Repàs: operacions bàsiques i funcions
  • 4. Bucles i aleatorietat
    • Portada 4. Bucles i aleatorietat
    • 4.1. Introducció i objectius
    • 4.2. Iteració
    • 4.3. Bucles for
    • 4.4. Bucles imbricats
    • 4.5. Aleatorietat
    • 4.6. Repàs: bucles for
  • 5. Condicionals
    • 5.1. Introducció i objectius
    • 5.2. Lògica condicional
    • 5.3. Condicionals if, if-else
    • 5.4. Operadors lògics
    • 5.5. Condicionals switch
    • 5.6. Temporitzadors
    • 5.7. Bucles i condicionals
    • 5.8. Repàs: condicionals
  • 6. Interacció
    • Portada 6. Interacció
    • 6.1. Introducció i objectius
    • 6.2. Execució única vs. contínua
    • 6.3. Interactuant amb el ratolí
    • 6.4. El mètode map()
    • 6.5. Interactuant amb el teclat
    • 6.6. Patró interactiu
  • 7. Moviment
    • Portada 7. Moviment
    • 7.1. Introducció i objectius
    • 7.2. Moviment lineal
    • 7.3. Moviment ondulatori
    • 7.4. Moviment circular
    • 7.5. Moviment aleatori
  • 8. Multimèdia
    • 8.1. Introducció i objectius
    • 8.2. Text
    • 8.3. Imatges
    • 8.4. Vídeo
    • 8.5. Repàs: imatges i tipografia
  • 9. Objectes i arrays
    • Portada 9. Objectes i arrays
    • 9.1. Introducció i objectius
    • 9.2. Objectes
    • 9.3. Arrays
    • 9.4. Arrays i objectes
    • 9.5. Repàs: arrays
  • 10. Visualització de dades
    • 10.1. Introducció i objectius
    • 10.2. Dades
    • 10.3. Taules
    • 10.4. JSON
    • 10.5. Dades d’internet: API
    • 10.6. Exemple pràctic de tractament de dades d’una font espanyola
  • Annex. Entorn de treball
    • Annex 1. Introducció
    • Annex 2. L’espai de treball en el nostre ordinador
    • Annex 3. L’editor de codi
    • Annex 4. La llibreria de p5.js
    • Annex 5. El fitxer HTML base
    • Annex 6. El fitxer sketch.js

8. Multimèdia

8.5. Repàs: imatges i tipografia

El vídeo no es pot reproduir

Vídeo 6. Imatges i tipografia

Scroll
uoc.edu
BY-SA

Els textos i imatges publicats en aquesta obra estan subjectes –llevat que s’indiqui el contrari– a una llicència Creative Commons de tipus Reconeixement-Compartir igual (BY-SA) v.3.0. Podeu modificar l’obra, reproduirla, distribuir-la o comunicar-la públicament sempre que en citeu l’autor i la font (Fundació per a la Universitat Oberta de Catalunya), i sempre que l’obra derivada quedi subjecta a la mateixa llicència que l’obra original. La llicència completa es pot consultar a http://creativecommons.org/licenses/by-sa/3.0/es/legalcode.ca

Tancar modal

Modal per imatges

This site is registered on wpml.org as a development site.