Diferencia entre revisiones de «Processing: LC0»

De Casiopea
(BGPKFTUVYdY)
Sin resumen de edición
 
(No se muestran 19 ediciones intermedias de 11 usuarios)
Línea 1: Línea 1:
http://www.kaboodle.com/bulldoglist bulldoglist faq http://www.kaboodle.com/tehpron tehpron idibzm http://www.kaboodle.com/filthtube filthtube upru
{{Curso
|Asignaturas Relacionadas=Imagen Escrita,
|Año=2007
|Tipo de Curso=Ramo Lectivo
|Profesores=Herbert Spencer,
|Carreras Relacionadas=Diseño Gráfico, Diseño Industrial
|Nombre=Lenguaje Computacional 0
}}
==Descripción==
Módulo de [[Taller de Primer Año Diseño|Primer Año Diseño]]:<br/>''Fundamentos de la Forma Computacional'' o<br/>''Introducción a la Gráfica Interactiva'',<br/>adaptado del curso ''The Interactive Image'' por [http://www.flong.com Golan Levin]
 
Este curso es una introducción a la computación como una herramienta de expresión plástica, donde el objetivo es el diseño pero el medio es el software. Tener experiencia previa en programación no es un prerequisito para este curso. Los estudiantes se familiarizarán con algoritmos básicos, geometría computacional y simulación cinemática.
 
* Libro del Curso: '''[http://processing.org/learning/books/ Processing: A Programming Handbook for Visual Designers and Artists]'''
* Plataforma para la presentación de trabajos y tareas: '''[http://openprocessing.org/ OpenProcessing.org (Beta)]'''
 
==Contenidos del Curso==
<div style="font-size: 10px; color:#666; font-weight: bold;">
# Processing
## Download & Instalación
## Ambiente Gráfico
## Formatos de Exportación
# Elementos del Código
## //, /*  */
## Funciones
## Expresiones y Declaraciones
## Consola
# Dibujo 1
## Definición Espacial: Sistema de Coordenadas
## Figuras Primitivas
### <code>point(), line(), triangle(), quad(), rect(), ellipse(), bezier()</code>
## Orden en el Dibujo
### <code>background(), fill(), stroke(), noFill(), noStroke()</code>
# Variables
## Tipos de datos (dataTypes): <code>int, float, boolean, true, false</code>
## Variables Processing: <code>width, height</code>
## Nomenclarura de color
### <code>color, color(), colorMode(), RGB, HSB</code>, hexadecimal
# Matemáticas: Aritmética y Funciones
## <code>+, -, *, /, %</code>
## Sintaxis ();
## Atajos: <code>++, --, +=, -=, -</code>
# Repetición
## Ciclo '''<code>for</code>'''
## Ciclos anidados
# Dibujo 2
## Por vértices
## <code>beginShape(), endShape(), vertex(), curveVertex(), bezierVertex()</code>
## curvas polares e identidad circular
# Aleatoriedad
## <code>random(), noise()</code>
## dibujo generativo
# Programación orientada a objetos
## Concepto de clases e instancias
## subclases y superclases
# [[Imagen Digital:PDF|Generar archivos PDF desde Processing]] <code>import processing.pdf.*</code>
## Tipografías vectoriales <code>hint(ENABLE_NATIVE_FONTS), PFont.list(), createFont()</code>
## Sin visualización en pantalla <code>size(612, 792, PDF, "dibujo.pdf"),  exit()</code>
## Con visualización en pantalla <code>beginRecord(PDF, "filename.pdf"), endRecord();</code>
### Documentos multipágina <code>pdf.nextPage();</code>
# Objetos de imágenes <code>PImage</code>
## Acceso al [[Arreglo de Pixeles]] <code>pixels[]</code>
 
</div>
 
==Tareas==
* '''Martes 1 de Julio:''' Familiarizarse con el entorno de trabajo de Processing y el sistema de publicación de tareas. Subir un applet a su carpeta individual. Esta carpeta debe estar formateada del siguiente modo: "apellio_nombre". Se suben en esta carpeta todos los ejercicios de este curso. Se debe mantener un cuidado respecto a los nombres de los ejercicios
* '''Martes 8 de Julio:''' Subir un applet que utilice los elementos de dibujo introducidos en la clase anterior. Este ejercicio corresponde a una exploración de las primitivas estándar incluídas como funciones simples en processing, definición de color (relleno y trazo).
* '''Marte 15 de Julio:''' Construir un patrón bidimensional utilizando ciclos anidados y llamando a una función propia. La versión avanzada de la tarea debe considerar que esta función incorpora pequeñas variaciones cada vez que se ejecuta mediante la inclusión de la función <code>random()</code>.
* '''Martes 22 de Julio:''' Perfeccionar y corregir la tarea anterior. Los alumnos avanzados deben explorar el concepto de recursividad.
 
==Ejemplos==
===Dibujo===
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/america dibujo de america]: dibujo con vértices
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/ciclos_anidados ciclos anidados]: dibujo de un patrón xy sensible al mouse
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/trama_y_distancia trama y distancia]: dibujo de un patrón xy sensible a la [[distancia]] del mouse
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/helix1 hélice 1]
 
===Arreglos o Matrices===
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/arreglo_de_puntos arreglo de puntos]: almacenamiento de datos en la memoria
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/croquera croquera]: un programa elemental de dibujo
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/helix2 hélice 2]
 
===Coordenadas Polares y Cartesianas===
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/polar la Lemniscata de Bernoulli]: curva polar animada con la función seno<br/>
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/lissajous la identidad circular de Lissajous]: visualización de la identidad circular en x e y
 
===Random y Noise===
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/random_vs_noise random vs. noise] Dos aproximaciones distintas a la aleatoriedad
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/filtro Modulación y filtro de señales]: La función <code>sin()</code> como envolvente de la función <code>noise()</code>
===Programación Orientada a Objetos: Clases===
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/autos Autos]: clases de autos
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/pelotas1 Pelotas], parte 1
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/tesela tesela simple]: una teselación periódica (p2gg)
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/teselaAnimada tesela animada]: la misma teselación p2gg con un tesel animado y rotacón controlada por el mouse
* [http://www.ead.pucv.cl/processing/2008/spencer-herbert/teselas_chalala/ Teselas de la travesía a Purmamarca 2007]
 
===Manejo de Archivos de Imágenes===
* [http://www.herbertspencer.net/ead/images/a/a4/Random_foto.zip random foto]: este ejemplo construye un arreglo de imágenes a partir de los archivos de una carpeta. Muy útil para grandes cantidades de imágenes. Escencialmente es una extensión de lo hablado en la última clase.
* conversión de pixels<nowiki>[]</nowiki> al sistema cartesiano de coordenadas:
<pre><nowiki>
desde cartesiano a lineal:
pixels[y*width + x]
 
desde un número de índice (index) del arreglo al sistema cartesiano:
int y = index / width;
int x = index % width;
</nowiki></pre>
 
==Referencias==
===Cursos Anteriores===
* [[LC0: 2009]]
* [[LC0: 2007]]
** [[Imagen Digital: Lámina final]], proyecto 2007
 
===Referencias Online===
* http://www.processing.org
* [http://www.proyecto-biopus.com.ar/emiliano/tutorial_programacion/index.html Tutorial de Processing - Castellano]
* http://www.codetree.org/index.php
* [http://jtnimoy.com/itp/p5/workshop/ Tutorial de processing - Inglés] por Josh Nimoy
* [http://www.processinghacks.com/hacks/contents processing hacks]
* [http://www.arduino.cc/ Proyecto Arduino]: Placas programables en processing
* http://local.wasp.uwa.edu.au/~pbourke/surfaces_curves/ - superficies y curvas
* http://www.visualcomplexity.com/vc/ - proyectos de visualización computacional
* http://www.infosthetics.com/
* http://dataisnature.com/
* http://www.generatorx.no/
* http://acg.media.mit.edu/ {aesthetics+computation group: proyectos antiguos, MIT}
* http://www.abstractmachine.net/blog/
* http://www.tom-carden.co.uk/category/weblog/
* http://www.processingblogs.org/
* [http://dev.processing.org/reference/core/javadoc/index-all.html Listadp de comandos no documentados para Processing]
 
==== Personas ====
* http://www.benfry.com - Ben Fry, fundador del proyecto processing
* http://reas.com/ - Casey Reas, fundador del proyecto processing
* http://www.flong.com/ - Golan Levin, artista en medios digitales
* http://www.shiffman.net/teaching/nature - the nature of code, Daniel Shiffman
 
[[Categoría: Pre Grado]]
[[Categoría: Diseño]]
[[Categoría: Lenguaje Computacional]]
[[Categoría: Cursos]]

Revisión actual - 07:58 11 mar 2013




Asignatura(s)Imagen Escrita
Año2007
Tipo de CursoRamo Lectivo
ProfesoresHerbert Spencer
Carreras RelacionadasDiseño Gráfico"Diseño Gráfico" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property., Diseño Industrial"Diseño Industrial" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property.

Estudiantes

Descripción

Módulo de Primer Año Diseño:
Fundamentos de la Forma Computacional o
Introducción a la Gráfica Interactiva,
adaptado del curso The Interactive Image por Golan Levin

Este curso es una introducción a la computación como una herramienta de expresión plástica, donde el objetivo es el diseño pero el medio es el software. Tener experiencia previa en programación no es un prerequisito para este curso. Los estudiantes se familiarizarán con algoritmos básicos, geometría computacional y simulación cinemática.

Contenidos del Curso

  1. Processing
    1. Download & Instalación
    2. Ambiente Gráfico
    3. Formatos de Exportación
  2. Elementos del Código
    1. //, /* */
    2. Funciones
    3. Expresiones y Declaraciones
    4. Consola
  3. Dibujo 1
    1. Definición Espacial: Sistema de Coordenadas
    2. Figuras Primitivas
      1. point(), line(), triangle(), quad(), rect(), ellipse(), bezier()
    3. Orden en el Dibujo
      1. background(), fill(), stroke(), noFill(), noStroke()
  4. Variables
    1. Tipos de datos (dataTypes): int, float, boolean, true, false
    2. Variables Processing: width, height
    3. Nomenclarura de color
      1. color, color(), colorMode(), RGB, HSB, hexadecimal
  5. Matemáticas: Aritmética y Funciones
    1. +, -, *, /, %
    2. Sintaxis ();
    3. Atajos: ++, --, +=, -=, -
  6. Repetición
    1. Ciclo for
    2. Ciclos anidados
  7. Dibujo 2
    1. Por vértices
    2. beginShape(), endShape(), vertex(), curveVertex(), bezierVertex()
    3. curvas polares e identidad circular
  8. Aleatoriedad
    1. random(), noise()
    2. dibujo generativo
  9. Programación orientada a objetos
    1. Concepto de clases e instancias
    2. subclases y superclases
  10. Generar archivos PDF desde Processing import processing.pdf.*
    1. Tipografías vectoriales hint(ENABLE_NATIVE_FONTS), PFont.list(), createFont()
    2. Sin visualización en pantalla size(612, 792, PDF, "dibujo.pdf"), exit()
    3. Con visualización en pantalla beginRecord(PDF, "filename.pdf"), endRecord();
      1. Documentos multipágina pdf.nextPage();
  11. Objetos de imágenes PImage
    1. Acceso al Arreglo de Pixeles pixels[]

Tareas

  • Martes 1 de Julio: Familiarizarse con el entorno de trabajo de Processing y el sistema de publicación de tareas. Subir un applet a su carpeta individual. Esta carpeta debe estar formateada del siguiente modo: "apellio_nombre". Se suben en esta carpeta todos los ejercicios de este curso. Se debe mantener un cuidado respecto a los nombres de los ejercicios
  • Martes 8 de Julio: Subir un applet que utilice los elementos de dibujo introducidos en la clase anterior. Este ejercicio corresponde a una exploración de las primitivas estándar incluídas como funciones simples en processing, definición de color (relleno y trazo).
  • Marte 15 de Julio: Construir un patrón bidimensional utilizando ciclos anidados y llamando a una función propia. La versión avanzada de la tarea debe considerar que esta función incorpora pequeñas variaciones cada vez que se ejecuta mediante la inclusión de la función random().
  • Martes 22 de Julio: Perfeccionar y corregir la tarea anterior. Los alumnos avanzados deben explorar el concepto de recursividad.

Ejemplos

Dibujo

Arreglos o Matrices

Coordenadas Polares y Cartesianas

Random y Noise

Programación Orientada a Objetos: Clases

Manejo de Archivos de Imágenes

  • random foto: este ejemplo construye un arreglo de imágenes a partir de los archivos de una carpeta. Muy útil para grandes cantidades de imágenes. Escencialmente es una extensión de lo hablado en la última clase.
  • conversión de pixels[] al sistema cartesiano de coordenadas:
desde cartesiano a lineal:
pixels[y*width + x]

desde un número de índice (index) del arreglo al sistema cartesiano:
int y = index / width;
int x = index % width;

Referencias

Cursos Anteriores

Referencias Online

Personas