Your SlideShare is downloading. ×
Taller de Processing Sesion 1 @ 25-10-10
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Taller de Processing Sesion 1 @ 25-10-10

1,413
views

Published on

Published in: Education, Technology

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,413
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
13
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Introducción a Processing Sesión 1 @ 25/10/10
  • 2. Qué es Processing  Es un lenguaje de programación y un ambiente de desarrollo que permite crear imágenes, animaciones y programas interactivos.  Por su sencillez es un lenguaje ideal para aprender a programar
  • 3. Qué se puede hacer con Processing  Dibujar en 2 y 3 dimensiones  Trabajar con imagen, sonido y video  Crear juegos y programas interactivos Algunos ejemplos se pueden ver en: http://processing.org/exhibition/
  • 4. Descarga • Lo primero es descargar Processing: http://processing.org/download/ • Processing es multiplataforma y hay versiones disponibles para Linux, Windows y Mac OS X
  • 5. Instalación y Ejecución • Linux y Windows: Descomprimir el archivo, copiando la carpeta que contiene en cualquier lugar que se desee. Ejecutar el archivo processing • Mac OS X: El archivo descargado es *.dmg, basta con arrastrarlo hacia cualquier carpeta y ejecutarlo
  • 6. Interfaz • Barra de herramientas (Run, Stop, New, Open, Save, Export) • Pestañas • Editor • Área de mensajes • Consola
  • 7. El primer programa • En el editor de texto escribir lo siguiente: ellipse(50,50,80,80); • Hacer click en el botón Run (Ctrl + R) • El resultado es un círculo con centro en (50,50), con 80 pixeles de alto y 80 de ancho
  • 8. Algunas figuras 2D • ellipse(x,y,width,height); • rect(x,y,width,height); • line(x1,y1,x2,y2); • poing(x,y,) • triangle(x1,y1,x2,y2,x3,y3);
  • 9. Trabajando con color • Escala de grises: 0 = negro, 255 = blanco fill(100); ellipse(50,50,80,80); • Color RGB: Se convinan 3 colores con escala del 0 al 255, 0 = negro, 255 = canal de color fill(255,0,0); ellipse(50,50,80,80);
  • 10. Trabajando con color • Tanto en escala de grises como en color RGB es posible trabajar con transparencias con el canal alpha fill(75,50); ellipse(40,60,40,40); fill(255,0,0,50); ellipse(65,40,40,40);
  • 11. Funciones básicas • setup – Es la primer función que se ejecuta. Aquí se debe configurar el comportamiento del sketch, inicializar variables, etc. • draw – Es el bucle principal de Processing. Esta función es la que dibuja lo que se ve en pantalla.
  • 12. setup y draw void setup() { size(200,200); smooth(); background(128,0,50); } void draw() { strokeWeight(10); ellipse(100,100,80,80); }
  • 13. Un poco de interactividad void setup() { size(250,400); smooth(); } void draw() { ellipse(mouseX,mouseY,40,40); }