Introducción al Diseño

1

Bienvenidos al Curso de Fundamentos de Diseño

2

¿Qué es el diseño?

3

El objetivo del diseño

Principios del Diseño

4

Comunicación efectiva en el diseño

5

¿Qué es el contraste?

6

¿Qué es el concepto?

7

Diseño universal

8

Qué es diseño atemporal

9

El boceto

10

¿Qué son los elementos visuales?

11

¿Qué es la alineación en diseño?

12

¿Qué es la síntesis gráfica?

Composición

13

La composición y su función

14

Unidad visual y principios de la Gestalt

15

Balance o equilibrio visual

16

Dirección Visual

17

Tipos del balance visual

18

Aplicación de elementos de composición

19

Movimiento

20

Estructuras naturales

21

Patrones de lectura

22

¿Qué es el ritmo?

23

Ejercicios de composición

Jerarquía

24

¿Qué es la Jerarquía?

25

Herramientas de jerarquización

26

Espacio en blanco en el diseño

Formatos

27

¿Qué es el formato?

28

Retículas y guías

Imagen Digital

29

Análogo vs. Digital

30

Pixel y resoluciones

31

Mapas de Bits y Vectores

Color

32

Qué es círculo cromático: usa la rueda de color

33

Sistemas de color

34

Tipos de paletas de colores: ¿qué son y cuál elegir?

35

Color en interfaces

36

Psicología del color

37

3 Errores comunes en el uso del color

Tipografía

38

Tipografía en el diseño

39

Selección tipográfica

40

Manejo y edición de textos

41

Cómo crear composición con texto

42

Identificar problemas en composición de texto

Proyectos de Fundamentos de Diseño

43

Proyecto: Portada de disco

44

Diseño de la portada de disco

45

Conclusiones del proyecto: Portada de disco

46

Proyecto: Poster de película

47

Diseño del poster de película

48

Conclusiones del proyecto: Poster de película

Rutas Profesionales en Diseño

49

Cómo ser un Diseñador de Producto

50

Cómo ser Diseñador de Marca

51

Afina tu composición visual

No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Convierte tus certificados en títulos universitarios en USA

Antes: $249

Currency
$209

Paga en 4 cuotas sin intereses

Paga en 4 cuotas sin intereses
Suscríbete

Termina en:

19 Días
7 Hrs
46 Min
25 Seg

Mapas de Bits y Vectores

31/52
Recursos
  • Mapas de bits: Cualquier fotografía. Es una retícula, una consecución de píxeles que juntos dan una apariencia de imagen. Busca en la pestaña de enlaces el Curso Básico de Photoshop que tenemos.

  • Vectores: Un vector está hecho de nodos, cada nodo está conectado, la conexión es el trazo. Podemos cambiar el tamaño y no se pierde calidad. Busca en la pestaña de enlaces el Curso de Illustrator que tenemos.

Contribución creada por: Gabriela Mogrovejo y Giu Ramirez

Aportes 149

Preguntas 12

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

ALGUNOS FORMATOS POPULARES

VECTOR

  • Las imágenes en mapa de bits, están hechas para una resolución determinada, por lo que si es cambiado su tamaño la calidad de las imágenes se pierde.

  • Las imágenes vectoriales, son formadas por nodos que al unirse forman trazos. No están hechas para una resolución en específico gracias a esto se puede modificar su tamaño sin perder su calidad.

Un vector, es un elemento que esta compuesto por nodos, la principal ventaja es que estos elementos no se distorcionan.

un nodo es también es un punto de ancla , y cada punto de ancla tiene manejadores, para poder dirigir en que dirección se desplazara la forma.

PIXEL

VECTOR

El curso de ilustrator lo tomare despuesde terminar este curso

Los mapas de bits son aquellos que están conformados por cuadriculas de pixeles, que tienen la información necesaria para transmitir y dar la sensación de que estamos viendo realmente una figura, pero realmente su base, son pixeles muy pequeños con información para transmitir cierto color, los mapas de bits los solemos encontrar en todas las fotografías, como JPG, PNG, etc.
Los mapas de Bits son elementos que al escalar o al hacer zoom, se pueden distorsionar debido a que los pixeles son constantes.
Los vectores, son formas que están conformadas por nodos que siempre tienen una relación con otro nodo, a diferencia de los mapas de bits, un vector puede ser escalable a todo tipo de tamaño y no perderá su calidad, debido a que siempre mantendrá su relación matemática con el otro nodo, los vectores se suelen encontrar en todas las herramientas de diseño, como en Illustrator.

Mapa de Bits

Vectores

Un archivo vectorial generalmente se puede describir como una imagen pequeña, escalable y editable que proporciona a los diseñadores una libertad infinita en lo que respecta al diseño gráfico y la ilustración. Como tal, las imágenes vectoriales son ideales para gráficos como logotipos de empresas, anuncios publicitarios y otras imágenes de diseño que a menudo requieren escala. Por ello es de suma de importancia, que en el diseño de logos por ejemplo, estos sean vectorizados para evitar la perdida de la resolución cuando se escale a diferentes tamaños.

Para los que usan SO Linux, las herramientas serian:
GIMP -> Mapas de bits
INKSCAPE -> Vectores

El curso de Illustrator de @unavacaverde es muy bueno, se los recomiendo!!

Existen 2 formas en las que se crea una imagen Digital:
Mapa de Bits: (Fotografía). Es una consecución de pixeles que tienen un color, cuando los vemos juntos crean una imagen. Se encuentran formatos como JPG, PNG y programas como Photoshop.
Vectores: Esta hecho de Nodos a su vez los nodos están conectados a otros nodos, esta conexión se llama Trazo, los vectores no pierden calidad si se manipula su forma o tamaño, caso contrario con los Mapas de Bits. Las Tipografías también están hechas de vectores.

Existen dos técnicas diferentes para crear, almacenar y procesar imágenes digitales: los mapas de bits y los gráficos vectoriales. En Internet, la gran mayoría de los archivos de imagen presentan formatos como JPEG, GIF y PNG, y corresponden a la primera categoría; mientras que otros, en formatos como SVG o PDF, pertenecen a la segunda.

MI RESUMEN:
La diferencia entre mapa de bits y vectores es:

  • En el mapa de bits los pixeles se van modificando poco a poco para ir obteniendo el color siguiente dentro de una imagen

  • En el vector es una imagen compuesta por diferentes formas, cada una con un color distinto y delimitadas, por esta razón aunque la imagen crezca o se enfoque no se distorsionará ya que todo esta delimitado.

=)

mapa de bits…

vectores…

![](

Yo siento que ilustrador te limita algunas cosas, por ejemplo yo trabajo mucho con desenfoque y sombras difuminadas, en ilustrador solo permite sombras solidas y si quieres difuminadas te toca hacer un procedimiento super largo, malla, desenfoques que saben cargar mucho el documento, creo que ilustrador queda mejor para hacer logos que ilustraciones realistas, photoshop ayuda más para lo que es ilustración ayuda a dar más realismo de una manera más rápida

Software para trabajar con mapas de bits:

  • De pago: Photoshop

  • Gratuito: Gimp

Software para trabajar con vectores:

  • De pago: Illustrator

  • Gratis: Inkscape

Mapa de Bits / Cualquier fotografía es la referencia mas clara. Para entender como está hecho un mapa de bits, hacemos un zoom a los detalles de la fotografía. Cuando le damos acercamiento al mapa de bits podemos ver de que está hecho.

  • El mapa de bits es una retícula, una gran consecución de pequeños pixeles, que cada uno de ellos tiene un color, cuando los vemos juntos, nos crea una ilusión de una imagen.

  • Al final tenemos unos pequeños cuadritos donde cada uno tiene una información de color diferente.

  • Conocemos los formatos populares como:

    • jpg

    • png

    • tif (para impresión)

  • Photoshop es un programa que trabaja principalmente con el mapa de bits.

Vectores / Tiene otras propiedades, está hecho de nodos los cuadraditos son los nodos, cada nodos se encuentra conectado a otro nodo.

  • La conexión entre esos nodos se conoce como trazos. Hay una relación entre un nodo y otro. No importa que tanto escale de tamaño una figura. Al escalarlo mas grande no perdemos calidad en la imagen como sucede en el Mapa de Bits.

  • Cada uno de estos nodos tiene unos controladores que son estas lineas con círculos. Con estos nodos puedo manipular la forma del vector. Cuando manipulo un nodo estoy cambiando la dirección del trazo, como estoy conectando un punto con el otro.

  • Podemos modificar su tamaño sin perder calidad.

  • Cuando hablamos de vectores, también estamos hablando de tipografía, Todas las tipografías están hechas de la misma forma. También cuando escalamos el tamaño de una tipografía tampoco perdemos calidad.

  • Illustrator es un programa especialmente para trabajar con vectores.

  • En Vectores podemos crear excelentes ilustraciones. Cuando trabajamos con vectores podemos crear formas. Creamos una forma con un color.

No me quedo claro que son los vectores

Excelente 😃
me caen muy bien los dos profesores del curso.

Sketch app para vectores
Affinity photo para mapa de bits

  1. Mapas de bits: Cualquier fotografía. Es una retícula, una consecución de píxeles que juntos dan una apariencia de imagen.

  2. Vectores: Un vector está hecho de nodos, cada nodo está conectado, la conexión es el trazo. Podemos cambiar el tamaño y no se pierde calidad.

📌| En resumen:


Los mapas de bits son imágenes que utilizan una cuadrícula de colores (píxeles) para representar la fotografía o dibujo.

Y los vectores permiten la creación y edición de gráficos mediante vectores, lo que permite que los gráficos se puedan ampliar o reducir todo lo deseado, sin que pierda calidad ni aparezcan pixelados.

ejemplo

MARIO BROS PIXEL

MEGA MAN PIXEL

Y LINK PIXEL

Y SUS VERSIONES MEJORADAS

Cuando trabajas con fotografías estarás trabajando con un mapa de bits, mientras que en un diseño de un logo o tipografía estarás trabajando con vectores.

Las imágenes para proyectos que se redimensionan o son responsivos deben realizarse como un vector, de esa manera el aspecto diseñado visual no pierde calidad la imagen.

Mapa de bits: Hechos de pixeles

Vectores: Hecho de nodos y trazos. Los nodos se relacionan unos con otros.

Mapas de Bits y Vectores
Hay dos formas en las cuales se crea una imagen digital, Mapa de bits y los Vectores

Mapa de bits, aquí estamos hablando de cualquier fotografía, al final un mapa de bits es una gran consecución de pequeños pixeles (retícula de pequeños cuadros) que cada uno de ellos tiene un color y que juntos nos crean una ilusión de imagen. (JPG, PNG, TIFF).

Vectores, un vector esta hecho de nodos y estos se encuentran conectados a otro nodo, la conexión de estos es un trazado o trazo. El poder manipular los trazos sin perder calidad es una característica de los vectores. Cuando trabajamos con vectores creamos formas.

En Autocad y ArcGIS (programas para crear mapas, etc). Usan Vectores para crear elmentos.

Mapa de bits: Consecución de pixeles, en donde cada pixel tiene una información de color distinta. Ej. Fotografía. Formatos: JPG, PNG.
Cada que tomamos una fotografía creamos un mapa de bits.

Vectores: Un vector está hecho de nodos y cada nodo está conectado a otro. La conexión entre nodo y nodo se conoce como trazado. Al ampliar una imagen vectorial esta no se “pixelea” o pierde calidad, dado que existe una relación matemática entre los nodos que la componen. Los “manejadores” nos permiten cambiar la dirección de nuestro trazado, con lo cual manipulamos la forma del vector.

Palabras Claves
Imagen Digital
Mapa de bits - Pixeles
Vectores - Nodos

Las fotografías son hechas con mapas de bits y los diseños digitales como los logotipos son creados con vectores.

Con esta clase me di cuenta que me estafaron, hace un tiempo contrate a un diseñador para que me haga un logo y parte del servicio que prometía era dar el archivo vectorial del logo, pero nunca me lo paso, y como tampoco sabia que era, no dije nada 😃

En resumen:
Mapas de bits: Cualquier fotografía. Es una retícula, una consecución de píxeles que juntos dan una apariencia de imagen. Busca en la pestaña de enlaces el Curso Básico de Photoshop que tenemos.

Vectores: Un vector está hecho de nodos, cada nodo está conectado, la conexión es el trazo. Podemos cambiar el tamaño y no se pierde calidad. Busca en la pestaña de enlaces el Curso de Illustrator que tenemos.

Que buena que estuvo esta clase.
Empece a utilizar Phostop a partir de tutoriales, pero no entendia como funcionaba y habia preguntas que me pasaban por la mente pero que no sabia preguntarlas.
Ahora que estoy utilizando Illustrator (siendo ademas una herramienta que me gusto mucho mas) me empezaron a surgir dudas similares, y ahora que explicaste como funciona cada una de estas dos aplicaciones toda mi cabeza hizo click, buenisimo.

Diferencia entre mapa de bits y vectores:

Mapas de bits = Una retícula donde cada pixel tiene un color diferente que en escala normal nos da una ilusión de una imagen.

Vectores = Un conjunto de nodos o puntos conectados por líneas.

Tomado de la clase de Vectores vs. Mapas de bits del
Curso de Illustrator.

Comparaciones

PIXEL / VECTOR

Siempre me preguntaba que eran los vectores y como funcionaban, un amigo me lo repetía bastante (Estudia programación) pero me daba pena preguntarle jeje, al fin logre saber que es, graciaaas.

Es mucho mejor el uso de vectores, da mejor presentación para las ilustraciones.
Tomare el curso de illustrator.
Gracias.

• En los mapas de bits lo que se produce es que al momento de crear fotografías las computadoras dan la cantidad de pixeles para la imagen. Generalmente, se suele usar los formatos: JPG, PNG, etc. Y también Photoshop.
• En los vectores no hay pixeles para la imagen, además de eso los vectores se utilizan en ilustraciones y diseños. El programa predilecto para los vectores es Illustrator.

Las imagenes digitales tienen 2 formas de generacion, la primera y mas clasica siendo el Mapa de Bits, en donde una imagen queda simplificada a bits en sus cimientos pero que alejada y sin acercarse mucho, da la ilusion de ser real y la otra siendo mediante Vectores, una herramienta de edicion que permite mediante el uso de Nodos, cambiar las proporciones matematicas de la imagen sin hacer que esta pierda calidad.

RECORDE UN EJEMPLO PROPIO DE MAPAS DE BITS Y VECTORES

Cuando jugaba Super Mario Bros como eran los gráficos de movimiento.

MAPAS DE BITS

VECTORES

EVOLUCION DE MARIO BROS BASADO EN MAPAS DE BITS Y VECTORES

Los vectores nos permiten aumentar tamaño sin perder calidad .la diferencia entre los vectores y los pixeles son las siguientes:
los vectores crean forma en cambio los pixeles le dan color a cada uno de los pixeles y juntos forman una imagen.

Bits=pixeles que al manipular pierde calidad. Ej: Fotografía
Vectores=nodos que al manipular NO pierde calidad. Ej: Tipografía

En pocas palabras…

  • Mapas de bits se componen en esencia por pixles y se deforma al hacer un zoom. Son los JPG, PNG, etc
  • Vectores son formulas matemáticas que ajustan las imágenes a nodos y estas no pierden calidad son las SVG

los formatos que se usan para un trabajo de vectorizacion son:
.AI
.EPS
.SVG este se utiliza mas para paginas web.
.PDF
Fuente: canal de youtube sobre diseño grafico “Marco Creativo”.

Que genial!! Muero por hacer el curso de ilustración!

Diferencia entre el utilizo de pixeles que representan un imagen, los vectores son formas con sus proprios colore, nodos, trazados y controladores los cuale en su conjunto forman una determinada imagen la cual no pierde definiciòn como en el caso de los bits.

Muy interesante como funcionan los vectores que aumente su dimensión sin perder la calidad de color a diferencia de los mapas de bits que al aumentar la dimensión pierden su calidad 👌.

estupendo, no tenia mucha claridad en mapa de bits

muy bueno el video explicativo!!! repaso conceptos viendolo por segunda vez

Genial! nunca habia entendido con profundidad la diferencia

MAPA DE BITS: Imágenes como fotografías, al acercarnos muchisimo a una imagen de mapa de bits podemos ver los pixeles (JPG,PNG), photoshop es un programa que trabaja con este tipo de imágenes

VECTORES: Imágenes hechas por nodos, al acércame muchísimo no se pierde calidad (Tipografías). Illustrator trabaja con este tipo de imágenes

Programas en los que se trabaja cada uno:
°Mapa de bits: Photoshop
°Vectores: Illustrator

Gracias por la explicación

Para realizar imágenes digitales encontramos:

Mapa de bits: fotografía (retículas de pixeles)
Vectores: nodos conectados, que son los trazos, los cuales permiten cambiar la dirección de la forma por medio de los manipuladores. Trabajar con vectores editables nos da una gran ventaja, no se pierde resolución

Básicamente un vector se puede aumentar y disminuir sin ningún problema pero con los pixeles no pasa lo mismo. Es verdad que uno puede “estirar” (no es recomendable hacerlo) en ocasiones una imagen pero si obvio va a perder legibilidad.

waow es muy buena la funcion de los nodos en el procedo de armar la forma de ltrabajo

cuando trabajamos con vectores lo que hacemos es crear formas y cada una de estas formas tiene sus propios nodos, trazados y sus propios controladores.

Mapas de Bits y Vectores

  • Los mapa de bits son comúnes en la fotografía.
  • Un mapa de bits es un gran grupo de pixeles.

  • Los vectores son grupos de nodos que no pierden calidad.

mapa de bits y vectores
mapa de bits: cualquier fotografia, es una reticula de pequeños pixeles que tienen un color y cuando lo vemos juntos creemos que es una imagen.

vectores.
Esta hecho de “nodos”, y trazos, y no se pierde calidad, cambiamos la direccion del trazado, tipografias, son vectores.

los trabajamos en ilustrador.
para trabajar con vectores.

con los vectores creamos formas que tendran colores.

Sin duda explican muy bien

Excelente clase

Soy nueva en esto, así que no sé si sea una pregunta muy básica, pero pareciera que los vectores son mucho más geniales que los mapas de bits. ¿Por qué se siguen utilizando los mapas de bits?

mapa de bits

Mapas de Bits y Vectores

Hay 2 formas en los que se crea una imagen digital:

  1. Mapa de bits → Una retícula de varios píxeles con distintos colores.
  2. Vectores → Está hecho de nodos, los cuales están relacionados. Son ecuaciones matemáticas, lo mejor es que nunca pierde calidad, por más zoom que le hagamos.

Vectores

Mapas de Bits

Illustrator y Phoshop

Hay dos formas en las que se crea una imagen digital, dos caminos diferentes. Una es el mapa de bits y la otra son los vectores.

Cuando hablo de mapas de bits, estoy hablando de básicamente cualquier fotografía. Cuando nos acercamos muchísimo a un mapa de bits, podemos ver de qué está hecho. Podríamos ver en detalle los diferentes pixeles.

Los vectores tienen otras propiedades, están hechos de nodos, y cada nodo esta conectado a otro nodo, La conexión entre esos nodos se conoce como trazados o trazo.
Con los nodos puedo manipular la forma de mi vector.

Cuando estamos hablando de vectores, estamos hablando también de tipografía, lo que hacemos es crear formas, Entonces creamos una forma que va a tener color

Mapas de Bits vs Vectores (Resumen práctico)

Mapa de Bits:
Cualquier imagen que está compuesta por píxeles, cada píxel contiene una información de color,comúnmente llamado hexadecimal o RGB.

Vectores:
Son figuras creadas a partir de cálculos matemáticos que no sufren una deformación independientemente la distancia, se hacen a partir de nodos y trazados.

Mapa de bits: pixeles los cuales tienen diferentes colores para crear una imagen.

Vectores: crea formas y cada una tendrá un color.

Mapa de bits y vectores!

Las imágenes hechas desde los vectores no pierden calidad al aumentar disminuir su tamaño

El vector es infinito creado a partir de líneas y puntos, mientras que el bit son cuadritos que sí pierden resolución al depender del número de los mismos en una pulgada.