Successfully reported this slideshow.

Clase14

0

Share

Upcoming SlideShare
Un poco de RGB
Un poco de RGB
Loading in …3
×
1 of 15
1 of 15

Clase14

0

Share

Download to read offline

Color en la computadora. Pixeles y la información que requieren. Representación de la información de color. Profundidad de color. Canal alfa (alpha channel). Rutinas en VBScript para usar colores en HTML. Imágenes ráster y vectorizadas. Rueda del color. Problema ejercicio. Páginas de referencia.

Color en la computadora. Pixeles y la información que requieren. Representación de la información de color. Profundidad de color. Canal alfa (alpha channel). Rutinas en VBScript para usar colores en HTML. Imágenes ráster y vectorizadas. Rueda del color. Problema ejercicio. Páginas de referencia.

More Related Content

Related Books

Free with a 14 day trial from Scribd

See all

Related Audiobooks

Free with a 14 day trial from Scribd

See all

Clase14

  1. 1. Color en la Computadora Leonel Morales Díaz Ingeniería Simple [email_address] Disponible en: http://www.ingenieriasimple.com/introprogra Copyright 2008 by Leonel Morales Díaz – Ingeniería Simple. Derechos reservados
  2. 2. Pixels <ul><li>Picture Elements = Pixels </li></ul><ul><ul><li>Pequeños puntos que componen la imagen en pantalla </li></ul></ul><ul><ul><li>Retícula discreta de puntos </li></ul></ul><ul><li>Resolución de una imagen: </li></ul><ul><ul><li>El número de puntos en ella </li></ul></ul><ul><ul><li>320x200, 640x480, etc. </li></ul></ul>
  3. 3. Información en un Pixel <ul><li>Las imágenes se componen de pixeles </li></ul><ul><li>Por cada pixel hay que guardar: </li></ul><ul><ul><li>Color </li></ul></ul><ul><ul><ul><li>¿B/W? </li></ul></ul></ul><ul><ul><ul><li>¿Colores? </li></ul></ul></ul><ul><ul><li>¿Posición? </li></ul></ul><ul><ul><li>¿Transparencia? </li></ul></ul>
  4. 4. Información en un Pixel <ul><li>Color </li></ul><ul><ul><li>B/W puro: </li></ul></ul><ul><ul><ul><li>1 bit por pixel </li></ul></ul></ul><ul><ul><li>Tonos de gris: </li></ul></ul><ul><ul><ul><li>1-255 por pixel (1 byte) </li></ul></ul></ul><ul><ul><ul><li>0 Negro, 255 blanco </li></ul></ul></ul><ul><ul><li>Color: </li></ul></ul><ul><ul><ul><li>Composición de rojo, verde y azul </li></ul></ul></ul><ul><ul><ul><li>RGB (R,G,B) </li></ul></ul></ul>
  5. 5. Profundidad de Color <ul><li>R,G,B </li></ul><ul><ul><li>16 colores: 4 bits </li></ul></ul><ul><ul><ul><li>Grupos – paletas – de colores </li></ul></ul></ul><ul><ul><li>256 colores: 8 bits (1 byte) </li></ul></ul><ul><ul><li>16 bits (¿Cuántos colores?) </li></ul></ul><ul><ul><li>24 bits (Color verdadero) </li></ul></ul><ul><ul><li>32 bits </li></ul></ul>
  6. 6. 24 Bits – Color Verdadero <ul><li>24 bits son 3 bytes </li></ul><ul><li>1 byte para cada color </li></ul><ul><ul><li>(0-255,0-255,0-255) </li></ul></ul><ul><li>Rojo: (255,0,0) - Verde: (0,255,0) - Azul: (0,0,255) </li></ul><ul><li>Blanco: (255,255,255) - Negro: (0,0,0) </li></ul><ul><li>Amarillo: (255,255,0) - Cyan: (0,255,255) - Magenta: (255,0,255) </li></ul>
  7. 7. Almacenamiento <ul><li>¿Cuántos bytes se necesitan para almacenar </li></ul><ul><ul><li>640x480 pixels en color verdadero? </li></ul></ul><ul><ul><li>1,024x768? </li></ul></ul><ul><li>¿Dónde se almacenan estos bytes? </li></ul><ul><li>¿Es necesario almacenar la posición de cada pixel? </li></ul><ul><li>¿Qué es un mapa de bits? </li></ul>
  8. 8. Colores y Canal Alfa <ul><li>RGB: (R,G,B) </li></ul><ul><li>1 byte para opacidad </li></ul><ul><ul><li>0% de opacidad: transparente </li></ul></ul><ul><ul><li>100% de opacidad: opaco </li></ul></ul><ul><li>Byte de opacidad: Canal Alfa </li></ul><ul><ul><li>Alpha channel </li></ul></ul><ul><li>RGBA: (R,G,B,A) </li></ul><ul><li>32 bits (24 RGB + 8 de alpha) </li></ul>
  9. 9. VBScript para Colores <ul><li>Función RGB(Red,Green,Blue) </li></ul><ul><ul><li>Devuelve un número que representa un color </li></ul></ul><ul><li>Dim i,j </li></ul><ul><li>Document.Write &quot;<Table Border=0>&quot; </li></ul><ul><li>For i = 0 To 255 Step + 5 </li></ul><ul><li>Document.Write &quot;<TR>&quot; </li></ul><ul><li>For j = 0 To 255 Step + 5 </li></ul><ul><li>Document.Write &quot;<TD BGColor=#&quot; & Hex(RGB(i,0,j)) & &quot; Width=5 Height=5></TD>&quot; </li></ul><ul><li>Next </li></ul><ul><li>Document.Write &quot;</TR>&quot; </li></ul><ul><li>Next </li></ul><ul><li>Document.Write &quot;</Table>&quot; </li></ul>ej064.html
  10. 10. Raster Images <ul><li>Mapas de Bits </li></ul><ul><li>Guardan información de color </li></ul><ul><ul><li>De todos los pixeles </li></ul></ul><ul><li>Formatos: </li></ul><ul><ul><li>BMP, JPEG (JPG), GIF, PNG, etc. </li></ul></ul><ul><li>Problema: </li></ul><ul><ul><li>Al agrandarlos: aparecen los “alias” </li></ul></ul>ej060.html
  11. 11. Problema de Alias <ul><li>Aparecen por la digitalización de una imagen </li></ul><ul><li>Alias </li></ul><ul><ul><li>“ Graditas” en la imagen </li></ul></ul><ul><li>Patrones de Moiré: </li></ul><ul><ul><li>Texturas que no están en el original </li></ul></ul>
  12. 12. Vector Images <ul><li>Imágenes vectorizadas </li></ul><ul><li>No guardan pixeles </li></ul><ul><li>Guardan información de construcción de imagen </li></ul><ul><ul><li>Los vectores </li></ul></ul><ul><li>No pierden detalle al agrandarlos </li></ul><ul><li>Formatos: WMF, DRW </li></ul>
  13. 13. La Rueda de Color <ul><li>Para combinación de colores </li></ul><ul><ul><li>Análogos </li></ul></ul><ul><ul><ul><li>Adyacentes en la rueda de colores </li></ul></ul></ul><ul><ul><li>Complementarios </li></ul></ul><ul><ul><ul><li>Opuestos en la rueda de colores </li></ul></ul></ul><ul><ul><li>Monocromáticos </li></ul></ul><ul><ul><ul><li>Tintas y sombras del mismo color </li></ul></ul></ul><ul><ul><ul><li>Tintas: blanco y el color </li></ul></ul></ul><ul><ul><ul><li>Sombras: negro y el color </li></ul></ul></ul>
  14. 14. Problema <ul><li>Construír la rueda de colores </li></ul><ul><li>Tomar como base el programa del círculo </li></ul><ul><li>Fecha de entrega: Miércoles 14 de marzo de 2007 </li></ul>
  15. 15. Referencias <ul><li>Patrones de Moiré y Alias: </li></ul><ul><ul><li>http://www.wfu.edu/~matthews/misc/DigPhotog/alias/index.html </li></ul></ul><ul><li>Manejo de color para programadores: </li></ul><ul><ul><li>http://www.sitepoint.com/article/color-for-coders </li></ul></ul><ul><li>Imágenes por computadora: </li></ul><ul><ul><li>http://www.rw-designer.com/computer-image </li></ul></ul>

×