Artes Visuales Electrónicas

 

Este portal es para uso de los estudiantes de la Escuela Regional de Bellas Artes de Arecibo que están matriculados en el curso AVE 1 y AVE 2. Aquí tendrán un punto de encuentro para reforzar lo aprendido en las clases presénciales con el profesor Borges Soto.

 

El objetivo de este curso, es ofrecer, una visión general de las técnicas de diseño gráfico en 2D, aplicables a los videojuegos, presentaciones corporativas y paginas web.. Para ello, comenzaremos desde un nivel básico e iremos utilizando cada vez técnicas más complejas. En la parte práctica, crearemos unos pequeños videojuegos con FUSION, simplemente para aplicar las técnicas utilizadas y poder ver, de forma práctica como se implementan desde la parte de la herramienta de desarrollo, no siendo cometido de este curso, el enseñar programación ni técnicas de desarrollo de juegos. No obstante si que podras utilizar los distintos programas para crear pantallas de opciones, desplazamientos de mapas, animación de personajes, etc... , por lo que procuraré que sean lo más sencillos y didácticos posible.

Notaran, que según se vaya desarrollando el curso, algunos de los capítulos de la parte práctica que aparecen en la tutoria inicial, se van ampliando, esto es debido a que para realizar una determinada pantalla de un juego necesitamos aplicar diversas técnicas, de modo que en una tutoria se explicará como podemos aplicar efectos con el texto, con los gráficos, con animación, etc...

Nada más, espero que disfrutén con este curso, al menos, tanto como yo he disfrutado realizándolo.

 

 

La herramienta de diseño: Paint Shop Pro.

¿Porqué Paint Shop Pro?

¿Porqué Paint Shop Pro?. La respuesta es muy sencilla, debido a que este curso se encuentra orientado inicialmente a personas que no tienen experiencia en el diseño gráfico, he tratado de seleccionar una herramienta casi análoga a la mesa de trabajo, que no fuese inmensa en el número de opciones y a la vez, que estuviese disponible para cualquier persona.

Paint Shop Pro, es una herramienta shareware, que podemos encontrar en infinidad de web en Internet, la página de sus creadores es
http://www.jasc.com, pero podemos descargarla de otros sitios como http://www.download.com, o http://www.areas.net/porelmorro/ , sitio este donde podemos encontrar gran cantidad de aplicaciones, manuales, y recursos gratuito en Internet. La versión que utilizaremos en este curso es la 7. Evaluation.

Recordemos que Paint Shop Pro es una aplicación shareware, con lo que ello conlleva, ya que deberemos registrarnos después de usarla durante treinta días, y que a los sesenta dejará de funcionar.

Entre las características de Paint Shop Pro, se encuentran la posibilidad de trabajar con un gran número de formatos gráficos, la posibilidad de aplicar un buen número de efectos gráficos o la de trabajar con capas “layers”, muy útil para el coloreado de dibujos escaneados para animación, trabajo con fondos, obstáculos, botones, etc... Por supuesto, con esta herramienta tenemos a nuestra disposición todo tipo de primitivas gráficas, polígonos, líneas, pinceles y demás.

Frente a otras herramientas, comparativamente hablando, Paint Shop Pro puede quedarse corto, sobre todo respecto al número de efectos gráficos que pueden aplicarse. Pero debido a que su manejo es mucho más sencillo y sobre todo al precio y facilidades para obtención. Evidentemente, la persona que disponga de otras herramientas gráficas como Adobe Photoshop o Corel Photopaint, pueden utilizarlas para seguir este curso, intentaré comentar brevemente como se aplican las técnicas explicadas siempre que se me posible.

Y ahora, sin más, vamos a dar una rápida introducción a esta herramienta, para poder manejarnos rápidamente con ella, ya que a medida que se vayan presentando las técnicas, iremos comentando como llevarlas acabo. Si desea bajar el programado lo puede hacer ahora y seguir las instrucciones de los tutoriales que ofreceré en la clase presencial.

 

Paint Shop Pro 7  bajarlo

 

 

 

Introducción a Paint Shop Pro

En primer lugar, debemos conocer un poco la herramienta con la que vamos a trabajar, para ello, vamos a verla un poco por encima, comentando sus posibles opciones y herramientas.

Cuando entramos en la herramienta, nos encontraremos la siguiente ventana:

En esta ventana, podemos encontrar cuatro partes claramente diferenciadas:

  1. - La barra de opciones
  2. - La barra de herramientas
  3. - La paleta de control de la herramienta seleccionada
  4. - La barra de color

Empecemos a conocer el programa.

 

Lo primero que vemos al abrir el programa son varias barras apagadas, para activarlas hay o que abrir alguna imagen del disco o crea una nueva, esto se puede hacer desde menú Edit/new o pinchando el primer icono

Al abrir una imagen nueva aparace una ventana pidiéndonos información de como queremos que sea, tamaño, color de fondo, número de colores, etc. Por defecto toma el de la última imagen creada. Al pulsar OK, tenemos las barras activadas y un recuadro del color que hayamos elegido como fondo y donde podemos empezar a trabajar.

 

 

La barra de opciones:

Contiene iconos para acceder directamente a las opciones más comunes del menú, las opciones presentadas de izquierda a derecha son las siguientes:

  1. - Nueva imagen: Crea una nueva imagen vacía, para lo cual se nos presentará un cuadro de diálogo que nos solicitará anchura, altura y resolución (que le podremos indicar en varias unidades de medida, siendo la más habitual pixels o puntos de pantalla), color de fondo y número de colores de la imagen. También nos informará de la memoria necesaria para crear y manipular la imagen
  2. - Abrir imagen: Nos permite abrir una imagen que tengamos guardada en el disco.
  3. - Salvar imagen: Nos permite guardar una imagen en el disco.
  4. - Imprimir imagen: Nos permite imprimir una imagen.
  5. - Deshacer: Deshace la última operación
  6. - Rehacer: Rehace la última operación deshecha.
  7. - Cortar: Corta y copia al portapapeles un área previamente marcada con la herramienta de selección.
  8. - Copiar: Copia al portapapeles un área previamente marcada con la herramienta de selección.
  9. - Pegar: Pega el contenido del portapapeles en la imagen.
  10. - Pantalla completa: Visualiza la imagen a pantalla completa.
  11. - Pantalla normal: Visualiza la imagen a pantalla normal.
  12. - Barra de herramientas: Muestra u oculta la barra de herramientas.
  13. - Paleta de control: Muestra u oculta la paleta de control.
  14. - Barra de color: Muestra u oculta la barra de color.
  15. - Histograma: Muestra u oculta la ventana de histograma.
  16. - Paleta de capas: Muestra u oculta la paleta de capas.
  17. - Ayuda: Proporciona ayuda de Paint Shop Pro.

Estas funciones que hemos descrito de forma general admiten variaciones si utilizamos las posibilidades de la ventana de control, que estará visible o invisible según hayamos pulsado en la botonera que hay bajo los menús.

Si no molestan en el trabajo es conveniente tener todas visibles, salvo el histograma que es meramente informativo. De todas maneras podemos desplazarlas por la pantalla u ocultarlas cuando sea preciso.

 

 

 La barra de herramientas

Contiene iconos para acceder a las distintas herramientas de dibujo que nos proporciona Paint Shop Pro, estas herramientas (de arriba abajo) son las siguientes:

  1. Apuntador: Nos permite desplazarnos por las zonas de la imagen ampliada sin recurrir a las barras de desplazamiento
  2. Zoom: Si la utilizamos pulsando el botón izquierdo aumenta la zona que estamos viendo. Con el derecho la reduce.
  3. Modificación de (Selección o Layers)s: Permite cambiar el tamaño y girar las (Selección o Layers). (Solo se activa cuando trabajamos sobre una (Selección o Layers))
  4. Recorte: Elimina todo aquello que no esté en la zona rectangular seleccionada. (Una vez seleccionada la zona hay que hacer doble-clic)
  5. Posición de (Selección o Layers)s/selecciones: Si se utiliza sobre una (Selección o Layers) permite ajustar su posición en la imagen. Si se utiliza con una selección activa (con el botón derecho) sirve para situar los límites de la selección en otra zona de la imagen.
  6. Selección geométrica: Con ella seleccionamos zonas con un contorno predeterminado
  7. Lazo: Sirve para seleccionar zonas irregulares.
  8. Varita mágica: Selecciona zonas contiguas de la imagen que coincidan en color, luminosidad o saturación con el punto en el que pinchamos.
  9. Cuentagotas: Establece el color del pixel sobre el que pinchamos como color de primer plano (botón izquierdo) o de fondo (botón derecho)
  10. Pincel: Pinta con el color de primer plano o de fondo según el botón con el que lo utilicemos.
  11. Tampón: Hace una réplica exacta de una zona de la imagen superponiéndola en otra zona diferente.
  12. Intercambio de color: Cambia los píxeles de un color convirtiéndolos en otro color que seleccionemos.
  13. Dedo: Difumina, aclara, oscurece...las zonas de la imagen por las que pasamos.
  14. Borrador: Borra zonas de la imagen sustituyéndolas por el color de fondo o el de primer plano (En este caso el uso de los botones produce el resultado inverso al habitual)
  15. Pincel de tampones: Deposita sobre la imagen unos tampones predefinidos llamados "tubes"
  16. Aerosol: Distribuye pintura sobre la imagen simulando el efecto de un aerosol.
  17. Relleno: Rellena zonas contiguas de la imagen con color liso o degradado.
  18. Texto: Introduce texto del color del primer plano sobre la imagen.

19.  Línea: Permite dibujar segmentos rectilíneos y curvas bezier simples.

20.  Figuras geométricas: Dibuja cuadrados, rectángulos, círculos u óvalos perfilados o rellenos 

La paleta de colores

Esta paleta se encuentra dividida en tres zonas, en la parte superior, nos aparece toda la gama de colores disponibles, podemos seleccionar un color haciendo click sobre el (con el botón izquierdo para el primer plano y derecho para el segundo), si hacemos doble click nos aparecerá una nueva ventana, sobre la cual podemos hacer una selección mas cómoda del color.

En la zona central, nos aparece el color del primer plano, es decir, el que se va a utilizar para realizar los trazos, siempre que utilizemos el botón izquierdo del ratón.

Detrás de este está el color de segundo plano, que cumple la misma función que el de primer plano pero se utiliza con el botón derecho del ratón.

Cualquier herramienta de dibujo, puede utilizarse con cualquiera de los dos botones, es decir, si por ejemplo estamos dibujando con la herramienta lápiz, al pulsar el boton izquierdo dibujaremos con el color de primer plano y si pulsamos el derecho, con el de segundo plano.

Por último, en la parte inferior, tenemos una zona informativa, que nos indica el color sobre el que estamos situados en la paleta superior y la composición en RGB del color.

El sistema RGB, nos indica como componer un color basándonos en una determinada cantidad (0-255) de rojo, verde y azúl.

 

El control de las herramientas

 

Por ejemplo, si queremos utilizar la herramienta de selección geométrica podríamos elegir en la ventana de control el tipo de figura del contorno, el fundido (Feather) y la suavización de bordes (Antialias).

Las posibilidades que se presentan en la ventana de control varían de forma automática en función de la herramienta que estemos usando.

Poco a poco irás comprobando la importancia de la herramienta Antialias. Su utilización hará que las transiciones entre lo que dibujamos o seleccionamos y el resto de la imagen no presenten el antiestético borde en dientes de sierra.

Combinado con el fundido entre ambas zonas permitirá efectos muy realistas.

 

 Bueno, hasta aquí, esta pequeña introducción a Paint Shop Pro, en clase veremos unos tutoriales que nos permitirán realizar algún experimentos con esta herramienta de diseño gráfico.

 

Tutorial 01           Tutorial 02

 

Tutorial 03           Tutorial 04

 

WEBMASTER Roland Borges Soto

directNIC Search
Hosted by directNIC.com