Diseño digital

Ing. Víctor Arturo Guillen Cruz

Alumno:________________________________________________Grupo:__________
Lectura 1

Introducción al diseño digital

El diseño digital podría definirse como el uso de la tecnología aplicada al arte y al diseño para
crear elementos típicos del diseño gráfico, como del diseño interactivo o multimedia. Por ello,
los profesionales de esta área poseen una fuerte formación artística y, al mismo tiempo,
informática, que les permite combinar ambos saberes.

Las computadoras procesan y despliegan las imágenes de dos maneras diferentes los gráficos
digitales: gráficos vectoriales y los gráficos de mapas de bits o gráficos raster.
Gráficos de mapas de bits

Las imágenes de mapa de bits, son conocidas también como matriciales, bitmap, o ráster. Están
formadas por una matriz de puntos de color llamados pixels. Al estar formadas por puntos,
una mayor cantidad de puntos indica una mayor calidad de imagen.

Un píxel o pixel, plural píxeles (acrónimo del inglés picture

element, «elemento de imagen») es la menor unidad homogénea
en color que forma parte de una imagen digital, ya sea esta una
fotografía, un fotograma de vídeo o un gráfico.

La calidad de una imagen de mapa de bits se mide mediante su

resolución, es de decir, su tamaño en píxeles (puntos de color).

Las imagenes con un mayor número de ppp (pixel por pulgada)

permitirán ampliar la imagen con menor pérdida de calidad,
mientras que una con menos ppp aparecerá completamente
pixelada en cuanto intentemos ampliarla.

Ventajas

 Las imágenes pueden tener tantas tonalidades y degradados como se desee. Tienen una
gran capacidad para representar la realidad a la perfección.
 Se muestran como la mejor opción para imágenes como fotografías, ya que destacan por
el alto nivel de detalle que pueden alcanzar.
 Edición precisa, gracias a que podemos modificar, si así lo deseamos, pixel por pixel,
degradados, filtros, etc.
Desventajas
 Al hacer zoom sobre ellas o reducirlas es habitual que pierdan mucha calidad y acaben
pixelándose.
 Es posible que no tengan la calidad suficiente como para poder imprimirlas.
 Un mapa de bits BMP o en otro formato de mucha calidad, puede ocupar un espacio
excesivo.

Gráficos vectoriales

Las imágenes vectoriales están formadas por vectores, que son objetos formados
matemáticamente. Estos vectores están definidos por su posición, color, etc.

Las imágenes vectoriales tienen la ventaja de que pueden ser ampliadas o reducidas sin perder
calidad. Su visibilidad es la misma en pantalla o en formato impreso independientemente del
tamaño.

Este formato de imagen se emplea principalmente en gráficos, tipografías, diseño publicitario

o videojuegos.

La desventaja es que este formato no permite representar con realismo imágenes complejas
como una fotografía.
Ventajas
 Dependiendo de cada caso particular, las imágenes vectoriales pueden requerir menor
espacio de almacenamiento que un mapa de bits. Las imágenes formadas por colores
planos o degradados sencillos son más factibles de ser vectorizadas. A menor
información para crear la imagen, menor será el tamaño del archivo. Dos imágenes con
dimensiones de presentación distintas, pero con la misma información vectorial,
ocuparán el mismo espacio de almacenamiento.
 No pierden calidad al ser redimensionadas. En principio, se puede escalar una imagen
vectorial de forma ilimitada. En el caso de las imágenes matriciales, se alcanza un punto
en el que es evidente que la imagen está compuesta por píxeles.
 Los objetos definidos por vectores pueden ser guardados y modificados en el futuro.
 Algunos formatos permiten animación. Esta se realiza de forma sencilla mediante
operaciones básicas como traslación o rotación y no requiere un gran acopio de datos,
ya que lo que se hace es reubicar las coordenadas de los vectores en nuevos puntos
dentro de los ejes x, y, y z en el caso de las imágenes 3D.

Desventajas
 Los gráficos vectoriales, en general, no son aptos para codificar fotografías o vídeos
tomados en el «mundo real» (fotografías de la naturaleza, por ejemplo), aunque algunos
formatos admiten una composición mixta (vector + mapa de bits). Prácticamente todas
las cámaras digitales almacenan las imágenes en mapa de bits.
 Los datos que describen el gráfico vectorial deben ser procesados, es decir, el
computador debe ser suficientemente potente para realizar los cálculos necesarios para
formar la imagen final. Si el volumen de datos es elevado se puede volver lenta la
representación de la imagen en pantalla, incluso trabajando con imágenes pequeñas.
 Por más que se construya una imagen con gráficos vectoriales su visualización tanto en
pantalla, como en la mayoría de sistemas de impresión, en última instancia tiene que ser
traducida a píxeles.
Formatos de gráficos.
Cuando trabajamos con imágenes, ya sean mapas de bits o vectores, llega el momento de decir
que hacer con ellas y, en consecuencia, de preguntarnos en que formato las guardaremos o
exportaremos, Esta pregunta tiene que ser respondida desde el inicio del proyecto, es decir,
cuando decidimos si vamos a retocar una fotografía, hacer una composición de imágenes, etc.,
Siempre debemos tener el objetivo claro por ejemplo:

 Montar la imagen en una página web;

 Colocarla en un archivo para su posterior impresión;

 Enviarla por correo electrónico para su uso posterior
Si tenemos claro lo que vamos a hacer con nuestra imagen, podremos responder algunas
preguntas que nos servirán para escoger el mejor formato;

 ¿Necesitamos una resolución alta, media o baja?

 ¿El peso del archivo es un problema?

 ¿Necesitamos transparencias?

 ¿Vamos a necesitar una animación o la imagen será estática?

Para las imágenes de mapa de bits estos son los formatos más usados y algunas de sus
características a tomar en cuenta en el momento de decidir:

Formato “JPEG” o con extensiones “JPG” (es muy usado en cámaras fotográficas digitales)

1. Ofrece flexibilidad a la hora de ajustar el grado de compresión:

 Con un grado de compresión muy alta se genera un archivo muy ligero, pero a costa
de una pérdida significativa de calidad.

 Con un grado de compresión baja se obtiene una calidad de imagen muy parecida a
la del original, pero con un tamaño de archivo mayor.

2. La pérdida de calidad es acumulativa, es decir, aumenta cuando se comprime y

descomprime varias veces.

3. No admite transparencias (Canal alfa)

Formato “PNG” (ideal para imágenes formadas por grandes masas de color o con poca
variación de color y para web)

 Formato con compresión sin pérdida de calidad

 Mejor calidad y reducción de peso que el “GIF”;

 Soporta transparencias (Canal alfa).

Formato “GIF” (publicidad en tipo banners e imágenes animadas para páginas web)

 Formato de compresión sin perdida;


  Solo puede contener de 2 a 256 colores (paleta de colores restringida).

 Soporta animaciones

 Soporta transparencias (canal alfa)

Formato “BMP” (es un formato propio de Windows y se menciona como historia, ya que su
uso es casi nulo)

 Formato de compresión, pero aun así los archivos son muy pesados (más que cualquiera
de los otros formatos)

Para imágenes vectoriales, estos son los formatos más usados y algunas de sus características:

Formato “EPS” (enfocados en materiales impresos y en desuso)

 Archivos encapsulados “Post Script”

 Compatible entre Mac y PC.

 Problemas de exportación
Formato “PDF”

 Posibilita el uso de vectores.

 Sigue siendo editable (imagen y texto)

 Es importante marcar en el programa que estamos usando “preservar capacidad de

edición”

Formato “PSD”

 Archivo de Photoshop.

 Posibilidad el uso de vectores.

 Sigue siendo editable (capas, imágenes y texto).

 Podemos guardar desde ilustrador para seguir trabajando en Photosop

Formato “SVG”

 Gráficos vectoriales escalables.

 Su uso puede implementarse en diseño web para retina y responsiva.

 Es independiente de la resolución de pantalla

Puede abrirse en muchos programas de edición vectorial. Entre los de software libre, el más
popular es el Inkscape.
 Modos de color.

El modo de color expresa la cantidad máxima de datos de color que se pueden almacenar en un
determinado formato de archivo gráfico.

Los modos de color son representaciones del espectro visible, que se pueden considerar como el
contenedor en el que colocamos la información sobre cada pixel de una imagen, este nos permite
describir el color de cada pixel utilizando valores numéricos.

Dentro del diseño gráfico dependiendo del medio en el cual se va a representar la imagen, ya
sea digital o impresa la manera de trabajar los colores varía y a continuación te presentaremos
los modos de color más utilizados:

Existen varios modos de imagen y la principal diferencia entre ellos es cuántos canales usan para
representar un color y qué profundidad de bits tienen esos canales.

Entre los modos de color más básicos tenemos los siguientes:

Escala de grises: Es el más simple de todos ya que tiene un solo canal. Con ese canal representa
valores de grises del blanco al negro. Pueden tener una profundidad de 8 o de 16 bits por píxel.

Indexado: Las imágenes con color indexado tienen una gama de colores reducida para que sus
archivos sean más pequeños. Es habitual que las imágenes indexadas se usen en páginas web o
en gráficos con pocos colores. Solo cuentan con un canal de color de 8 bits.

Después de los modos de color más simples tenemos los más extendidos a día de hoy. Estos son
tres:
 RGB: RGB son las siglas en inglés de los colores rojo, verde y azul (Red, Green, Blue). Estos son
los tres canales de color que tiene el modo. Cada canal contiene 8 o 16 bits por píxel y por canal
lo que da como resultado imágenes con más de 16 millones de colores.

Es el modo más usado por la mayoría de los dispositivos que forman los colores de un modo
aditivo, es decir, sumando la luminosidad que emiten todos los objetos y sujetos.

CMYK: Es un modo de color de cuatro canales. Los valores representan el color cian, el
magenta, el amarillo y el negro. Al igual que el RGB puede tener 8 o 16 bits por canal. Este
modo compone los colores de manera sustractiva, es decir, parte del blanco y va restando
colores usando sus complementarios.

Este modo es el que usan habitualmente las impresoras. A la hora de retocar las fotos en el
ordenador nos servirá de gran ayuda para ver si los colores de la imagen que hemos trabajado
en RGB serán los mismos que los impresos en CMYK ya que a veces no coinciden. Esto ocurre
porque hay algunos colores RGB que no pueden conseguirse en CMYK.

LAB: El modo de color LAB es independiente del periférico que lo representa, tanto de los
monitores como de la impresora.
En este modo existen 3 canales, L, A y B. L representa la información tonal o luminancia y A y
B la información de color o crominancia, siendo A la que añade los colores en la línea del rojo
y el verde y B la que añade el contenido en amarillo o azul.

Instrucciones
1. Escribe dentro del recuadro una F si la afirmación es Falso o un V si es verdadero.

Enunciado F V
Un Byte es la menor unidad homogénea en color que forma parte de una imagen digital

Las imágenes de mapa de bits, son conocidas también como matriciales, bitmap, o ráster.

La calidad de una imagen de mapa de bits se mide mediante su resolución

Una ventaja de las imágenes vectoriales es que al hacer zoom sobre ellas o reducirlas es
habitual que pierdan mucha calidad y acaben pixelándose.

Un mapa de bits BMP o en otro formato de mucha calidad, puede ocupar un espacio
excesivo.

Las imágenes de mapas de bits tienen la ventaja de que pueden ser ampliadas o reducidas
sin perder calidad.

Las imágenes vectoriales pueden requerir menor espacio de almacenamiento que un

mapa de bits.

El Formato “GIF” puede ser usado en publicidad en tipo banners e imágenes

animadas para páginas web.

El formato JPG es usado mucho en cámaras fotográficas tradicionales

RGB: Es un modo de color de cuatro canales. Los valores representan el color cian, el
magenta, el amarillo y el negro.