PERÍODO 2021-A

DISEÑO DIGITAL
SEXTO SEMESTRE

DOCENTE:

MARZO 2021

1
Contenido
Pág.
Presentación …………………………………………………………………………………….. 3
Bloque I. Introducción y edición de gráficos (vectoriales y mapa de
4
bits)…………………………………….……………………………………………………………
Propósito del bloque ………………………………………………………………. 4
Aprendizajes esperados ………………………………………………………….. 4
Evaluación diagnóstica …………………………………………………………… 4
Actividades de aprendizaje ……………………………………………………... 5
Calendario de Actividades………..………………….………………………….. 7
Fuentes de consulta ………………………………………………………………... 8
Anexos …………………………………………………………………………………… 9

2
Presentación
¡Bienvenido al sexto semestre de bachillero!

En este semestre trabajaras con la asignatura de Diseño digital, y en esta guía encontraras todas
las actividades que debes realizar en la asignatura.

La tecnología hace referencia a las herramientas que son fáciles de usar para la administración e
intercambio de la información, desde un principio era utilizada para el desarrollo, ahora es
empleada para la resolución de problemas o hacer más fácil las actividades diarias y adaptarse a
su entorno.

Lo que inició como un complemento se ha convertido en una necesidad, pues estamos rodeados
por la tecnología y, aunque sea de una manera sencilla siempre, está presente en nuestro día a día.
Pero, esto también ha mejorado el nivel de vida y satisface con mayor facilidad todas las
necesidades creando nuevas fuentes de empleo.

Las llamadas Tecnologías de la Información y la Comunicación son los recursos y herramientas que
se utilizan para el proceso, administración y distribución de la información a través de elementos
tecnológicos, como: ordenadores, teléfonos, televisores, etc.

A través del paso del tiempo la utilización de este tipo de recursos se ha incrementado y
actualmente presta servicios de utilidad como el correo electrónico, la búsqueda y el filtro de la
información, descarga de materiales, comercio en línea, entre otras.

La gran mayoría de empresas se han visto afectadas, en los últimos años, por la revolución digital.
Ésta ha cambiado por completo las técnicas de marketing y de publicidad utilizadas por los
negocios. Por lo tanto, el diseño y las herramientas digitales y conocimientos que éstos requieren
deben formar parte de la estrategia digital de cualquier empresa que desee estar presente en
internet. En la actualidad, el diseño digital está presente en todos los elementos de publicidad y
marketing de cualquier empresa que cuenta con una página web, una red social, o cualquier tipo
de anuncio online. A medida que más empresas se van digitalizando, el diseño digital aumentará y
ganará todavía más importancia. Es por este motivo que, para destacar frente a la competencia,
tanto en el presente como de cara al futuro, una empresa debe contar con una estrategia digital
adecuada, creativa e innovadora.

¡Éxito en este nuevo semestre!

3
Bloque I. Introducción y edición de
gráficos (vectoriales y mapa de bits)
PROPÓSITO DEL BLOQUE:

Diseño digital a través de Software de edición de gráficos vectoriales, mapa de bits y

editorial, para generar animaciones multimedia, productos de comunicación y publicidad
en el ámbito laboral y comunitario, favoreciendo el desarrollo ético, creativo e intercultural
del entorno.

APRENDIZAJES ESPERADOS:

 Ilustra ideas publicitarias y de comunicación a través de diseño de imágenes digitales,

utilizando diferentes herramientas de las aplicaciones de software de diseño, en un
ambiente responsable y creativo.

EVALUACIÓN DIAGNÓSTICA:

Para iniciar este bloque, lee cuidadosamente y responde honestamente la siguiente evaluación
diagnóstica.

4. Tipo de imágenes formada por diminutos

1. Este es un ejemplo de un puntos llamados pixeles.
a) Video animado a) Imágenes de mapa de bits
b) Cartel publicitario b) Imágenes Vectoriales
c) Logotipo c) Videos y animaciones
d) Texto d) Videos y sonidos

2. Son dibujos compuestos por líneas, figuras

geométricas, y otros gráficos y que mediante 5. Es un modo de color basado en la
funciones matemáticas definen los contornos combinación de colores lumínicos primarios
y rellenos de los dibujos (rojo, verde y azul) para obtener el resto de
a) Imágenes de mapa de bits colores.
b) Imágenes Vectoriales a) Cmyk
c) Videos y animaciones b) Escala de grises
d) Videos y sonidos c) Monocromático
d) Rgb
3. Identifica algunas extensiones de imágenes
a) .jpg, .cdr, .bmp, .png 6. Son ejemplos de software para la edición de
b) .pdf, .xls, .pptx, .doc gráficos.
c) mp3, mp4, .avi, mpeg a) Flash, Inkscape, Scribus
d) jpg,, .xls, .mp4, .mp3 b) Inkscape, gimp, Photoshop
c) Paint, Dreamweaver, gimp.
d) Photoshop, scribus, Flash
4
ACTIVIDADES DE APRENDIZAJE:

En este primer bloque vamos a realizar 5 actividades de aprendizaje. En cada actividad

encontrarás la explicación detallada de lo que debes hacer para cumplir con los criterios
de evaluación establecidos.

Actividad 1. Investigación
Realiza una investigación en diversos medios sobre aspectos del diseño digital y
edición de gráficos vectoriales y mapa de bits, en word. (Mínimo 4 fuentes distintas).

1. Introducción al Diseño Digital:

 Tipos de gráficos: Mapas de bits y vectoriales.
 Formatos de gráficos.
 Modos de color.
 Tipos de software de diseño y que ofrecen.
2. Software para edición de gráficos vectoriales:
 Entorno.
 Herramientas básicas.
 Dibujo de objetos.
 Texto creación y edición.
 Transformación y propiedades.
 Edición y efectos de objetos.
3. Software para edición de gráficos de mapa de bits.
 Entorno.
 Herramientas básicas.
 Efectos de imagen.

Actividad 2. Cuestionaro
Resuelve correctamente las preguntas que a continuación se detallan.
1. ¿Qué es el diseño digital?
2. ¿Qué es un gráfico de mapa de bits?
3. ¿Qué es un gráfico vectorial?
4. ¿Cuál es la diferencia entre un gráfico vectorial y un mapa de bits?
5. ¿Qué formatos de gráfico o imagen hay?
6. ¿Cuál de los formatos de gráficos es el de menor calidad?
7. ¿Cuál de los formatos de gráficos es de mayor calidad?
8. ¿Qué tipo de formato gráfico es animado?
9. ¿Cuál de todos los formatos gráficos es el más usado en diseño?
10. ¿Cuál es el formato gráfico considerado como estándar?
11. ¿Qué es un modo de color?
12. ¿Cuántos y cuáles son los modos de colores que podemos encontrar?
13. ¿Cuáles son los dos modos de color más utilizados?
14. ¿Cuál es la diferencia principal entre los modos de color más utilizados?
15. ¿Mencione por lo menos 5 programas que sirvan para el diseño y que
diferencia principal existe entre ellos?
5
Actividad 3. Mapa conceptual.
Pasos a seguir:
1. Con la información que se te presenta sobre el tema de introducción al diseño
digital (Anexo 1), elabora un mapa conceptual en tu cuaderno, en una hoja anexa
o a computadora.
Para complementar tu actividad, en caso de que tengas disponible el servicio de
Internet, te recomendamos revisar los enlaces señalados.
2. Observa las siguientes imágenes de ejemplos de mapas conceptuales, para que
puedas desarrollar el tuyo.

Actividad 4. Practica 1. Diseño en App vectorial.

Pasos a seguir:
1. De acuerdo al dispositivo electrónico con el que cuentes para tus actividades
escolares (computadora, tableta, celular, entre otros), elige un software para la
edición de gráficos vectoriales. Si dispones de equipo de cómputo se sugiere
Inkscape. En caso de disponer de un teléfono celular se sugiere adobe illustrator
draw, ibis Paint X.
2. Instala la aplicación elegida a tu dispositivo. Puedes revisar el anexo 2, para
conocer los pasos de instalación de un software.
3. Explora la aplicación empleando cada una de las herramientas con las que
cuenta. Puedes revisar el Anexo3 o el libro impreso.
4. Elabora un Dibujo utilizando las herramientas con las que dispone el software o
aplicación. El dibujo que crearas es completamente libre.

6
Actividad 5. Practica 2. Diseño en App mapa de bits
Pasos a seguir:
1. De acuerdo al dispositivo electrónico con el que cuentes para tus actividades
escolares (computadora, tableta, celular, entre otros), elige un software para la
edición de gráficos mapa de bits. Si dispones de equipo de cómputo se sugiere
Gimp. En caso de disponer de un teléfono celular se sugiere Pixlr, Xgimp.
2. Instala la aplicación elegida a tu dispositivo. Puedes revisar el anexo 4, para
conocer los pasos de instalación de un software.
3. Explora la aplicación empleando cada una de las herramientas con las que
cuenta. Puedes revisar el anexo 4.
4. Elabora un Fotomontaje utilizando las herramientas con las que dispone el
software o aplicación. El fotomontaje es libre.

Las actividades que desarrolles en esta guía conformarán tu Portafolio de evidencias,

mismas que deberás guardar y subir a donde se le indique. Todo esto formará parte de
tu evaluación.
Calendario de Actividades.
BLOQUE I. “NOMBRE DEL BLOQUE”
Actividad Fecha límite de Porcentaje
entrega
1. Investigación Lun12Abr2021 20%
2. Cuestionario Vie 17Mar2021 10%
3. Mapa conceptual Mier 22Mar2021 15%
4. Pract. 1. Diseño con App vectorial. Lun 16Abr2021 25%
5. Práct. 2. Diseño con App de mapa de Jue 23Abr2021 30%
bits.
Porcentaje total 100%

7
FUENTES DE CONSULTA:
Libro versión impresa
 Dzul, F. E. (2020). Tecnologías de la Información y Comunicación IV. CDMX, México:
Klik

Sitios web
https://www.4rsoluciones.com/blog/bitmaps-y-graficos-vectoriales-cuales-
son-las-diferencias-2/
https://baetica.com/formatos-graficos-imagenes/
https://www.fotonostra.com/grafico/rgb.htm
https://www.adobe.com/mx/products/illustrator.html
https://www.seoptimer.com/es/blog/que-es-gimp-y-para-que-sirve/
https://blackbeast.pro/diccionario/photoshop/
https://www.mancomun.gal/es/artigo-tic/inkscape-disenos-vectoriales/
https://www.offidocs.com/index.php/android-imagenes-graficos-es-
es/andropainter-android-imagenes-editor-es-
es#:~:text=AndroPainter%20es%20un%20editor%20de,y%20crear%20fotos
%20e%20im%C3%A1genes.

Video tutoriales
https://www.youtube.com/watch?v=TKpchk09Rqg
https://www.youtube.com/watch?v=ukrfv8o1TUo
https://www.youtube.com/watch?v=XPBTKO2VUmE
https://www.youtube.com/watch?v=Oek4i9230rc
https://www.youtube.com/watch?v=bFOeUf7gMD
https://www.youtube.com/watch?v=ov4XxWJUkQE

Nota Final: Recuerde expresar sus dudas con tiempo o anticipación. Como han de saber,
ustedes como parte de su responsabilidad de estudiantes y poder realizar las actividades,
están obligados a leer o estudiar los temas, entonces las dudas que se estarán resolviendo
será sobre los temas específicamente. Así mismo sobre si no comprenden parte de las
instrucciones de las actividades.
Cualquier otra duda o situación no prevista, deberá preguntar o exponerla con anticipación,
más no en fecha límite de entrega.
Se le recomienda nuevamente, ser honestos y no dar o pedir copia del trabajo, todo
documento copia que se detecte será eliminado en automático, quedando nula la
calificación correspondiente.
En esta ocasión no habrá puntos por puntualidad en los trabajos, del mismo modo,
todo trabajo que tenga más de tres días de atraso, no será considerado para su
ponderación.

8
ANEXOS:

ANEXO 1: INTRODUCCION

El Diseño Digital es aquella forma de Informar, Expresar algo a través de un lenguaje visual. Es
decir, que un diseñador en esta categoría posee las habilidades o competencias para poder
desempeñarse en el medio profesional de la animación, producción de digitales o incluso combinar
el medio fotográfico con el diseño digital.

El diseño digital es con claridad una rama del Diseño Gráfico, con la cual podemos crear cualquier
clase de objeto animado, o producir un trabajo de manera profesional.
Es todas nuestras creaciones entorno a un Pc, ordenador personal, convirtiéndola en nuestra
principal herramienta de trabajo, además de nuestra creatividad y percepción artística.

Diseño gráfico es todo aquello que comunica un mensaje visual. Así, su máxima es obtener
manifestaciones o mensajes gráficos.Su auge actual se debe a la gran expansión de todo tipo de
mensajes visuales a través de nuestros diversos dispositivos digitales y tecnológicos.
Esta disciplina se sirve de imágenes, vídeos y elementos textuales, todos ellos elementos
imprescindibles para la comunicación gráfica y visual. Es, a partir de ellos, como el diseño gráfico
consigue trasmitir los mensajes e ideas necesarias.

Un diseñador gráfico es un especialista en la configuración de mensajes visuales. Por ello, debe

tener habilidades como la de ser ordenado, creativo y expresivo. Por muchas dotes que tenga de
una de estas opciones, si no cuenta con las otras, es probable que no obtenga el resultado deseado.

TIPOS DE GRÁFICOS: MAPAS DE BITS Y VECTORIALES

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.

Mapa de bist (bitmaps)

Los mapas de bits (bitmaps) son agrupaciones rectangulares de pequeños puntos llamados píxeles.
Un píxel puede verse como un diminuto e indivisible cuadrado de luz, que puede presentar
cualquier color y nivel de brillo. Grupos de píxeles adyacentes asumen distintos colores y de esa
manera «forman» la imagen en la pantalla, en una ilusión similar a la de un cuadro de estilo
puntillista. Haciendo suficiente zoom sobre un mapa de bits podremos ver «agrandados» los
píxeles individuales que lo componen. Por eso, los mapas de bits se distorsionan cuando se los
expande.

Gráficos vectoriales
9
Los gráficos vectoriales se construyen sobre figuras geométricas (líneas, círculos, polígonos, etc.)
generados por un conjunto de vectores. En matemática, un vector es un elemento abstracto con
una dirección, un sentido y una longitud; geométricamente, es representado con una flecha que
parte de un punto de origen y apunta a un punto de destino. Los programas de edición de gráficos
vectoriales (como Photoshop) generan una serie de vectores que apuntan a distintos «puntos de
control» en los contornos de la imagen. De esta manera, si la imagen se expande, los contornos no
se distorsionan, ya que los vectores se mantienen aferrados a sus puntos de control. Cuando un
gráfico vectorial se expande, las formas se agrandan proporcionalmente y no se «pixelan».

Gráficos de mapas de bits vs gráficos vectoriales

La calidad de un mapa de bits queda atada a su resolución original, mientras que los gráficos
vectoriales conservan las formas ante cualquier cambio de tamaño. Sin embargo, los gráficos
vectoriales presentan serias limitaciones para describir imágenes geométricamente imperfectas
(como un paisaje), ya que es prácticamente imposible reconstruir con exactitud formas irregulares
a partir de agrupaciones de figuras geométricas. Por eso, las cámaras digitales utilizan formatos de
mapa de bits como JPEG.

FORMATOS DE GRÁFICOS

1. JPG / JPEG (Joint Photographic Expert Group)

JPG es un tipo de archivo que fue desarrollado por el Joint Photographic Experts Group (JPEG)
para que fuese el estándar para las imágenes hechas por fotógrafos.
 Ideal para mostrar fotografías en la web dado que no suele ocupar mucho espacio.
 Genera pixelación aún configurándola con la mayor calidad.
 No es adecuado para ilustraciones, dibujos, ni textos.

2. PNG (Portable Network Graphics)

Permite almacenar imágenes con una mayor profundidad de contraste.
 Soporta fondos transparentes y semitransparentes.
 Ideal para el desarrollo de logotipos, botones y otro tipo de imágenes que necesiten
conservar una buena resolución.
 Incompatibilidad con navegadores antiguos.
 Imágenes con muchos elementos y colores pueden pesar mucho más que su equivalente
en jpg.

3. RAW («bruto» o «en crudo»)

Formato que contiene toda la información que la cámara capta al realizar la captura sin realizar
ningún tipo de procesado posterior y sin compresión alguna.
 Incluye toda la información captada por la cámara.
 Proceso de postproducción «engorroso».

4. GIF (Graphics Interchange Format)

Se utilizan, normalmente, para crear animaciones o imágenes en movimiento.
 Soporta animaciones y fondos transparentes.
 Baja calidad respecto a otros formatos.

10
5. BMP (Bitmap)
Imágenes en forma de mapa de bits propias del sistema operativo Microsoft Windows.
 Muy usado para imágenes pequeñas.
 Soporta millones de colores.

6. TIF / TIFF (Tagged Image File Format)

Formato favorito a la hora de almacenar o utilizar imágenes en alta resolución y estupenda
calidad, ya sea en la industria del diseño o la publicidad.
 Compatible con los programas de diseño.
 Permite manejar varias imágenes y metadatos en un único archivo.
 Gran tamaño por imagen, llegando incluso a los cientos de megas.
 Algunos visores de pc y móvil pueden tener problemas para procesar este tipo de
imagen.

Nota: todos los anteriores son formatos de mapa de bits. Los formatos de imagen vectorial son AI,
EPS, SVG, PDF, etc.

MODOS DE COLOR.
Todas las imágenes digitales tienen un modo de color. 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.

La luz blanca del sol es la responsable de los colores que somos capaces de percibir en el entorno.
Al descomponer esa luz blanca, obtenemos los diferentes colores que forman el espectro visible:
rojo, naranja, amarillo, verde, cian, azul y violeta, los colores del arcoiris.

A partir de la luz blanca del sol y los diferentes colores en los que se descompone, podemos
conseguir una gran variedad de tonalidades de dos maneras diferentes, que se corresponden con
los modos de color más ampliamente utilizados: a partir de luz y a partir de pigmentos.
Para entender cómo funcionan los colores luz, imagina un escenario con diferentes focos de
colores. Si un foco verde y un foco azul apuntan hacia el mismo punto del escenario, la mezcla de
esos dos focos tendrá como resultado cian. Hemos sumado dos rayos de luz ya descompuesta en
dos ondas más simples (verde y azul) para conseguir un rayo de luz diferente (cian). Así funcionan
los colores de los píxeles que ves en todas las pantallas.

11
Los colores pigmento tienen que ver no con cómo se mezclan los diferentes rayos de luz de color,
sino con cómo reciben esa luz los objetos que nos rodean, pues estos no tienen un color propio,
sino que son del color de la luz que reciben. Cuando un rayo de luz blanca o natural llega a un
objeto, el material del que este está hecho absorbe una parte de esa radicación y refleja otra. La
parte del espectro visible que refleja resulta en el color del que lo percibimos. Si un objeto refleja
solo las ondas rojas y absorbe todas las demás, lo veremos rojo. Si absorbe toda la luz que recibe,
lo veremos negro. Por el contrario, si refleja toda la luz, será percibido como blanco.

La existencia de los dos modos de color RGB y CMYK se corresponde con estas dos diferentes
maneras de obtener colores. El primero corresponde a los colores luz y está ligado al mundo digital;
el segundo, a los pigmentos y al mundo analógico

Entonces. ¿Qué sería del diseño gráfico sin los colores? Hablaremos sobre un aspecto un poco más
técnico, enfocándonos en los modos de color más utilizados, sus ventajas, desventajas y usos
correctos. Si te interesa conocer un poco más sobre esto te invitamos a continuar leyendo.
Lo primero será conocer ¿Qué es un modo de color? 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 la
variedad de los modos de color ampliamente utilizados.

12
Monocromático
El modo monocromático se corresponde con un profundidad de color de 1 bit, es decir que la
imagen contiene únicamente un solo bit por pixel, dejando la imagen a dos colores siendo
conformada únicamente por pixeles blancos y negros usando la menor información de esta, con
esto se logra que el archivo sea de un peso muy bajo pero con una calidad muy limitada.
Escala de grises
Las imágenes en escala de grises contienen 8 bits por pixel, con el valor 0 correspondiendo al negro
y el valor 255 al blanco nos permite tener 1-254 tonos de grises, los que nos da un total de 256
niveles de grises, más que aceptables para ver o imprimir una imagen en blanco y negro con calidad
suficiente.
Es uno de los modos de color más populares para contenido web y principalmente con fines
artísticos, siendo muy utilizados en fotografías y dibujos, ya que al trabajar una imagen de esta
manera se le puede agregar cierto toque de melancolía, elegancia y minimalismo.
Color indexado
Se denomina color indexado porque contiene un solo canal de color de 8 bits, por lo que solo se
puede obtener con él un máximo de 256 colores al igual que la escala de grises. En este modo, la
gama de colores de la imagen se adecua a una paleta con un número restringido de colores, por lo
que en muchos casos resulta muy útil para trabajar con formatos que permiten únicamente colores
del sistema en que se trabaja al momento de reducir imágenes para su publicación web. Su
principal inconveniente es que la mayoría de las imágenes del mundo real se componen de más de
256 colores.
RGB
Es un modo de color basado en la combinación de colores lumínicos primarios (rojo, verde y azul)
para obtener el resto de colores. Las imágenes RGB contienen 24 bits por pixel y usan 3 canales de
información, uno por cada color. El modo RGB suele usarse para imágenes y trabajos que no van a
ser impresos, en otras palabras es de los modos de color óptimo para trabajar en medios digitales,
para pantallas y el propio de la luz en base a la síntesis aditiva.

CMYK
Este se basa en la sustracción del blanco usando para ello como colores primarios el cian, magenta,
amarillo y negro (éste último para aportar el cuerpo, fuerza, acentuar rasgos o dar profundidad a
la imagen).
En este modo lo que se hace es combinar los colores sustractivos primarios para dar lugar al resto
de colores. Suele usarse para imágenes y trabajos que serán impresos, por lo tanto es otro que es
ampliamente utilizado. El modo CMYK contiene 32 bits por píxel utilizando 4 canales de
información (uno por cada color).

13
Pantone
El sistema de color Pantone es un catálogo de códigos unívocos elaborados por la compañía del
mismo nombre especializada en tecnología gráfica.
La principal importancia del sistema Pantone es que sin importar el sistema operativo o pantalla,
programa de edición de imágenes o gráficos vectoriales que se utilice, el color de salida digital o
impreso, ya sea en Plotter o en Offset, el color sea siempre el mismo. Esto se logra gracias a que los
colores son creados a partir de barnices y no de lo que se ve en pantalla.
LAB
El modelo de color Lab se basa en el modelo propuesto en 1931 por la CIE (Commission
Internationale d’Eclairage) como estándar internacional para medir el color. En 1976, este modelo
se perfeccionó y se denominó CIE Lab.
El CIE Lab es el modelo cromático usado normalmente para describir todos los colores que puede
percibir el ojo humano. Los tres parámetros en el modelo representan la luminosidad del color, su
posición entre magenta y verde y entre amarillo y azul. Las imágenes Lab suelen tener una
profundidad de 24 bits por pixel.
Hexadecimal (HEX)
El modelo hexadecimal es muy útil cuando se orientan trabajos a web ya que trabaja en lenguaje
html y permite correlacionar los colores RGB a código web.
El código HEX representa los colores RGB a través de seis números hexadecimales (aquellos que
toman valor del 0 al 9 y de la A a la F) divididos en 3 pares. El primer par corresponde al rojo, el
segundo al verde y el tercero al azul (#RRGGBB).
Multicanal
Posee múltiples canales de 256 niveles de grises, descomponiendo la imagen en tantos canales alfa
como canales de color tuviera el original (Una imagen RGB quedaría descompuesta en 3 canales,
una por color). Se utiliza en impresiones de muy alta calidad ya que cada tinta es un canal que al
momento de imprimirse se superpondrá sobre las otras tintas en el orden que se determine.
Habiendo presentado los modos de color más utilizados en el mundo del diseño gráfico cabe
destacar que en cierta medida ninguno es mejor que otro ya que todos cumplen con funciones
específicas. Esperamos te haya sido de utilidad este artículo ya que consideramos que es
importante que conozcas las características de cada uno de ellos, te invitamos a suscribirte para
que no te pierdas más temas de gran importancia relacionados al mundo del marketing digital.

14
Ahora vamos hablar más a fondo de dos modos de color.

1. ¿Qué es el modo de color RGB?

Como ya hemos dicho, el modo de color RGB es el que se corresponde con los colores luz. Es el
modo de color que utilizan todas las pantallas, desde la de tu televisión hasta la de tu móvil.
Cada píxel de cada pantalla es capaz de emitir los tres colores primarios de los colores luz: rojo,
verde y azul. De hecho, “RGB” son las siglas de estos tres colores en inglés: red, green, cyan.

2. ¿Qué es el modo de color CMYK?

El modo de color CMYK se corresponde con los colores pigmento, y por lo tanto, con el mundo
analógico. CMYK son unas siglas que significan Cyan, Magenta, Yellow, Black (cian, magenta,
amarillo y negro en castellano), que son los tres colores primarios cuando estamos tratando con
pigmentos, más el negro. Estos son los colores a través de lo que se componen imágenes analógicas,
ya sean cuadros hechos con pintura o las que imprimes desde tu impresora en casa. Este modo de
color también se llama cuatricromía.

15
¿Cuándo utilizar el modo de color RGB y cuándo el modo de color CMYK?
El espectro de color, es decir, los colores y el número de colores que puede reproducir cada modo
son diferentes, siendo más amplio el modo RGB que el CMYK, por lo que es importante que tengas
esto en cuenta a la hora de tratar tus imágenes. El modo de color que utilices dependerá del medio
final en el que se vaya a ver la imagen.
Si se trata de una imagen que solo se va a ver en pantallas (creatividades para redes sociales,
anuncios para una página web…), selecciona siempre el modo RGB.
Si tu imagen va a ser impresa, selecciona el modo de color CMYK. La pantalla de tu ordenador
simulará cómo se vería tu imagen al ser impresa en cuatricromía, para que te hagas una idea más
aproximada del resultado final que obtendrías.
Esto no significa que si tratas una imagen en RGB y luego la mandas a imprimir, la impresora no
vaya a poder hacerlo. Significa que, de hacerlo así, será la impresora quien se haga cargo de la
transformación de un modo hacia a otro, y tú no tendrás control sobre el resultado final. Para evitar
sorpresas, trabaja desde el principio en CMYK si vas a imprimir tus imágenes.
Por lo tanto, si vas a utilizar cualquier programa de diseño o tratamiento de imagen como Adobe
Photoshop o Adobe Illustrator recuerda que debes cambiar el modo de color según tus objetivos
para controlar el resultado final.

16
TIPOS DE SOFTWARE DE DISEÑO Y QUE OFRECEN.

CorelDRAW es un programa de software para editar gráficos vectoriales creado y lanzado al

mercado por la compañía Corel Corporation en 1989. Es una suite de gráficos robusta, que
proporciona muchas funciones para que los usuarios puedan editar gráficos. Como editor de
gráficos vectoriales, CorelDraw se utiliza principalmente para empresas de marketing y
publicidad, especialmente para aquellas que se especializan en el desarrollo de publicidad impresa.
Aparte de los logotipos, CorelDraw es un programa utilizado en el espacio profesional para crear
folletos, boletines y otros documentos imprimibles utilizando sus funciones de diseño de página.
Además, los usuarios utilizan el programa para crear dibujs complejos.

Adobe illustrator es el software de gráficos vectoriales estándar del sector te permite crear de todo,
desde gráficos en el sitio web y dispositivos móviles hasta logotipos, iconos, ilustraciones para
libros, paquetes de productos y afiches. Ahora puedes experimentar la libertad y la flexibilidad de
Illustrator en escritorio e iPad.

GIMP es un programa de edición de imágenes digitales en forma de mapa de bits, tanto dibujos
como fotografías. Es un programa ideal para retocar, componer y editar imágenes. Muchas
pequeñas empresas lo utilizan para crear logotipos o gráficos de forma gratuita. Algunas de sus
prestaciones no tienen nada que envidiar a otras licencias comerciales. De hecho, se ha convertido
en alternativa a Photoshop en algunos casos. La primera versión del programa se ideó para
GNU/Linux. En la actualidad, también existen adaptaciones propias para Windows y Mac OS X.

Photoshop es el nombre de una más que conocida herramienta de edición de imágenes y fotografía,
un programa que se utiliza en PC para retocar fotos y hacer montajes de carácter profesional,
aunque también accesible para usuarios que llevan poco tiempo experimentando en ese terreno.
Para el diseñador gráfico, es muy útil para crear logotipos, flyers, tarjetas y otros. Para el ilustrador,
sirve para crear dibujos digitales sin necesidad de utilizar una imagen previa. Y para el fotógrafo,
Photoshop se ha convertido en un completo laboratorio fotográfico donde puede editar, corregir y
retocar las fotos antes de mandarlas a impresión.

Inkscape es un editor libre de gráficos vectoriales con características profesionales y

multiplataforma (disponible para GNU/Linux, Windows y Mac OS). Inkscape es usado por
diseñadores profesionales (en empresas de publicidad o de imagen corporativa, ingeniería/CAD,
gráficos web o diseño de cómics) y aficionados de todo el mundo para crear una gran variedad de
gráficos como ilustraciones, iconos, logos, diagramas, mapas y diseños web.

AndroPainter es un editor de imágenes para dispositivos Android que incluye la aplicación GIMP
proporcionada por OffiDocs. Permite editar y crear fotos e imágenes. Es un programa para retocar
fotos, convertir formatos de imagen, modificar iconos, logotipos, diagramas, ilustraciones y
cualquier pintura compleja.

Pixlr es un editor de imágenes con funciones muy avanzadas que permite añadir filtros, textos o
recortar fotografías desde un sitio web o tu smartphone.

17
XGimp es una adaptación para Android de la aplicación GIMP (GNU Image Manipulation), que es
un programa de distribución gratuita para tareas como retoque fotográfico, composición de
imágenes y creación de imagen. Como resultado de ello, la aplicación XGimp proporciona muchas
capacidades. Puede ser utilizado como un simple programa de dibujo, editor de imágenes, un
programa de retoque fotográfico profesional, como un generador de imágenes, o un conversor de
formatos de imagen.

Moldiv es una app destinada a realizar collages, fotomontajes e imágenes de estilo “revista”. Cuenta
con un completo editor a través del cual redimensionar, recortar o cambiar la forma de las
imágenes antes de añadirlas al montaje. Cientos de pegatinas, estampados, filtros, plantillas,
diseños de revista y tipografías te están esperando para que crees con ellos los mejores
fotomontajes.

ANEXO 2: INSTALACION (INSKCAPE E IBIS PAINT X)

INSKCAPE

Para instalar Inkscape en Windows antes de nada necesitas descargar inkscape para Windows en
su versión de 32 o 64 bits. Una vez descargado el programa, el siguiente paso es ejecutar el archivo
que has bajado.
Una vez abierto el instalador, este tiene una interfaz muy amigable que te irá guiando a través de
la instalación. Los pasos a realizar son:

PASO 1: Escoge el idioma de la instalación: Selecciona lenguaje español o el que tu prefieras.

PASO 2: Verás una pantalla que te dará la bienvenida a la instalación del programa.

PASO 3: A continuación, una pantalla te mostrará la Licencia del programa y la versión que estás a
punto de instalar.

18
PASO 4: La siguiente pantalla será la selección de componentes a instalar. Puedes escoger entre
distintos tipos de instalaciones, yo te recomiendo la instalación óptima.

PASO 5: Debes indicar el directorio de destino donde quieres que se instale este fantástico
programa de diseño vectorial. Si deseas cambiar la ruta que te ofrece el instalador simplemente
debes clicar en el botón Examinar. Una vez indicada la ruta pulsa en Siguiente y comenzará la
instalación de Inkscape.

PASO 6: Una vez completada la instalación, que apenas llevará unos pocos minutos, un mensaje te
informará que la instalación se ha completado correctamente. Marca la opción "Ejecutando
inkscape" para que al pulsar sobre el botón Terminar, abra inkscape inmediatamente al cerrarse
la ventana de instalación.

IBIS PAINT X

19
Lo primero que deberás hacer para proceder con la instalación, será ir a la Play Store y buscar
“Ibis Paint X”. La primera opción que te saldrá será este resultado:

La aplicación Ibis Paint X es nuestra principal opción cuando vamos a hacer nuestros retratos
vectoriales.
Una vez ahí, pulsamos el botón “Instalar”, y se comenzará a descargar nuestra app favorita. Y así
de fácil, cuando acabe de procesar la descarga y la posterior instalación podremos acceder al
menú principal de nuestro teléfono móvil o tablet y encontraremos allí la aplicación Ibis Paint X,
¡Ya puedes empezar a usarla!

ANEXO 3: USANDO IBIS PAINT X

Una vez abierta, aparecerá esta pantalla:

Esto es lo primero que nos saldrá en pantalla una vez abramos Ibis Paint X.
Dentro de la pantalla de la captura anterior, le deberás dar a “Mi galería”. Esto te llevará al lugar
donde se guardarán todos los retratos, dibujos e ilustraciones digitales que crees. Sin límites.

20
Una vez entremos en “Mi galería” veremos todos los diseños que hemos realizado y guardado
anteriormente.
Una vez dentro de este menú, puedes fijarte que en la parte central superior hay un símbolo de
“+”, es el icono que Ibis Paint X usa para que lo utilices cuando quieras crear un nuevo
proyecto. Pulsa el icono y te dará varias opciones de tamaños que te enseño en la siguiente
imagen.

Cada vez que quieras crear un nuevo diseño, el programa te dará a elegir entre los formatos más
utilizados o crear el tuyo propio.
En este menú que te brinda esta aplicación para hacer dibujos digitales, te facilitará muchísimo el
trabajo, cuando lo tengas abierto, deberás elegir el tamaño idóneo o tu preferido, el cual deberá
ser el que querrás utilizar para la ilustración que estás a punto de crear.

21
  Si estás buscando algo a pantalla completa, podrás utilizar
la relación 9:16 (720×1280)
 En cambio, si lo que deseas es hacer una publicación
para Instagram, la más idónea será la medida 1:1
(768×768).
 Puede que tu objetivo sea crear un diseño digital para subir
en una web, entonces lo más probable es que elijas entre
Tamaño SD, Tamaño HD o 3:4. Para que quede claro, las
imágenes que salen de este programa no pesan nada
comparado con otras, por lo que se puede conseguir una
buena calidad de imagen con un peso mínimo, por lo que el
rendimiento del tiempo de carga tu web no se verá
afectado.
 Por último, si no te va bien ninguna de las opciones
preformateadas, puedes crear una relación personalizada
con la opción que sale en el medio del menú. Ibis Paint X te
lo pone muy fácil.

Ya has configurado todo, esta es una plantilla completamente vacía en la que daremos rienda suelta
a nuestra creatividad e imaginación.

1. Antes de todo, necesitarás un dibujo o una foto sobre la que querrás dibujar. Una vez
elegida la imagen, dale a importar foto y elige la foto que desees. Seguramente se te abrirá
un cuadro que ponga si quieres extraer el dibujo, ahí debes clicar en “Cancelar”.

2. Baja la opacidad. Una vez importada la foto, deberías seleccionar la capa en la que está la
imagen elegida y bajarle la opacidad como mínimo hasta la mitad (50-60%) Este dibujo
no es parte del resultado final, simplemente te estará ayudando a tener una mayor precisión
y una mejora en la fidelidad de tu retrato digital.

3. Agrega una segunda capa. Cuando ya tengas la opacidad de la base bien configurada, el
siguiente paso será crear una capa adicional. Ésta será donde hagas el lineart.
PD: Puedes cambiar el nombre de las capas para aclararte mejor las veces que quieras.

4. Llega el momento de hacer las líneas. Ha llegado el momento de tomar acción, ahora sí
que sí deberás poner toda la carne en el asador y sacar a la luz toda la creatividad que llevas
dentro. Para ello deberás elegir una pluma para hacer los primeros trazos de tu diseño. No
tengas miedo de probar, debes probarlas todas para saber cual te va mejor en cada
momento.

5. Configura el estabilizador. Ibis Paint X, para evitar líneas temblorosas o no lo rectas que
deberían, tiene una opción de estabilizador, para que así puedas despreocuparte en cierta
manera de tener un mal pulso. Lo más habitual es tenerlo configurado en el nivel 2 o el nivel
3, pero hay quien tiene peor pulso y debe ponerlo al 8 e incluso al 10. Nada está mal aquí,
debes elegir la opción que mejor se adapte a ti.

22
 6. ¡A trazar! Selecciona la capa del lineart que hemos creado (para saber si está
seleccionada, debe aparecer resaltada en color azul) y a tirar líneas. No te desanimes si no
te sale a la primera, deberías haberme visto a mi al principio… Hay que tener consistencia,
acaba teniendo tus resultados, lo prometo.

7. Elimina la imagen base. Ya tenemos todos los trazos realizados, por lo que ya podemos
borrar la Capa 0, donde importamos la foto original. Una vez realizado esto, agrega otra
capa y muévela abajo del todo.

8. Colorea para darle amor al dibujo. En el paso número 8 empezarás a colorear la

ilustración en Ibis Paint X para darle una expresión preciosa. Para esto, debes usar
sobretodo colores que no sean muy brillantes, y con una opacidad baja, así lograrás que se
integre en la imagen y le dé un toque natural.

9. Que no se te olviden las sombras. Para ellas, crea una capa nueva, pero esta vez la podrás
encima de la capa de colores. Ahí agrega las sombras y otros detalles que quieras añadir. Si
lo prefieres, puedes separar todas las capas que quieras para ir haciendo todo por partes,
aunque cuidado, porque hay un límite de capas.

10. Añade tu toque personal. Si hay algo por lo que vas a sobresalir, eso será por hacer tus
propios diseños y no copiar los de otro. Por ello, te invito a que pruebes, te equivoques,
rectifiques, mejores y vayas creando poco a poco esa marca personal que acabará
caracterizándote.

ANEXO 4: INSTALACIÓN (GIMP Y PIXLR)

GIMP
Paso 1: Ve a la página de GIMP www.gimp.org.es. Presiona el botón de descargas.

Paso 2: Abre el archivo de instalación .exe de tu carpeta de descargas. Elige tu idioma y haz clic en
OK para iniciar la instalación.

Paso 3: Haz clic en 'Customize' para más opciones, como el destino de instalación, componentes
opcionales etc. Haz clic en 'Install' para empezar la instalación con la configuración estándar.

23
Paso 4: Una vez la instalación completada, haz clic en 'Finish'. El programa ya está instalado y listo
para usar.

PIXLR

Lo primero que deberás hacer para proceder con la instalación, será ir a la Play Store y buscar
“Pixlr”. La primera opción que te saldrá será este resultado:

Una vez ahí, pulsamos el botón “Instalar”, y se comenzará a descargar nuestra app. Y así de fácil,
cuando acabe de procesar la descarga y la posterior instalación podremos acceder al menú
principal de nuestro teléfono móvil o tablet y encontraremos allí la aplicación Pixlr, ¡Ya puedes
empezar a usarla!

ANEXO 5: USANDO PIXLR

Una vez abierto aparecerá la siguiente pantalla:
24
Consta de 5 herramientas principales o secciones troncales:

Herramientas
El menú “Herramientas” está orientado a los retoques. Desde aquí puedes cortar, rotar la imagen,
desenfocarla a partir de cierto eje, aplicar correcciones automáticas de tono y contraste etc. Desde
aquí también podremos quitar los malditos ojos rojos de aquellas fotos que lo necesiten.

Ejemplo de uso práctico

Una herramienta muy interesante es la doble exposición. Esta técnica te permite superponer una
imagen y ajustar su opacidad. Aquí tenéis la imagen de una niña, y a continuación la misma imagen
con una doble exposición.

Pinceles

25
Este apartado hace las funciones del clásico lápiz. Podemos hacer un garabato, pixelar ciertas
partes de una imagen o iluminar/oscurecer aquellas zonas por donde pasemos el dedo.

Filtros y efectos
Uno de los puntos fuertes de Pixlr. Tiene 25 efectos, más de 30 filtros y 11 tipos de estilizado. Todos
los filtros y efectos son de muy buena calidad y se nota. Se pueden obtener resultados realmente
interesantes si se combina más de un efecto. Perfecto para sacar a lucir tu lado creativo.

Ejemplo de uso práctico

Efecto de estilizado «silk«. A partir de ahí a una le he puesto el efecto «dean» (derecha) y a otra la
superposición «burn» (centro) logrando así un efecto distinto para cada una de las imágenes.

Marcos

26
Además de efectos también podemos poner marcos y stickers a las imágenes. Modificando los
bordes de una imagen podemos darle un toque antiguo, añadir flores o convertir una foto en el
fotograma de una película.

Ejemplo de uso práctico

En esta imagen he aplicado 2 marcos distintos. Uno ha sido un marco de tipo naturaleza llamado
«Lotus«, y un segundo marco de tipo «ripped paper«.

Texto
La última herramienta es la dedicada a la escritura. Puedes añadir texto a una imagen o foto y para
ello tienes a tu disposición decenas de fuentes distintas, pudiendo también elegir el color que
queramos y la alineación del texto.
Además, una vez elegido el texto podemos moverlo.

Interfaz de navegación
Para redondear las potentes herramientas de edición Autodesk ha creado una interfaz de
navegación muy sencilla:

27
 Pantalla de inicio o “Home”: Es la pantalla principal y desde donde elegimos la imagen
que queremos tratar. Podemos elegir entre tomar una foto con la cámara o seleccionar
alguna imagen de nuestro smartphone o incluso seleccionar varias imágenes para hacer
un collage.
 Guardar imagen: Una vez hayamos terminado de tratar una imagen podemos
simplemente guardarla, compartirla (Facebook, Twitter, Instagram etc.) o subirla a la
nube. Basta con pulsar el botón “Listo” de la parte superior derecha de la pantalla.
 Deshacer: Tranquilos, también existe la opción de “deshacer”. Si en algún momento nos
equivocamos en algún aplique disponemos de un botón de deshacer en la parte superior
centrar de la pantalla.

28
INSTRUMENTOS DE EVALUACIÓN

COLEGIO DE BACHILLERES DEL ESTADO DE CAMPECHE

DISEÑO DIGITAL

PRIMER PARCIAL

RÚBRICA PARA EVALUAR UN MAPA CONCEPTUAL

ALUMNO: GRUPO:
DOCENTE:

Criterios de Excelente Bueno Regular Insuficiente Total

Evaluación (0) (8) (6) (5)
El concepto principal es
adecuado, pertinente El concepto principal El concepto principal
Concepto No identifica el
con el tema y se es relevante dentro pertenece al tema
Principal concepto
presenta como el tronco del tema pero puede pero puede ser de
1 Puntos principal.
de donde salen las ser secundario. tercer o cuarto nivel.
demás ramificaciones.
Incluye la mayoría de
Incluye todos los los conceptos
conceptos importantes importantes que Los conceptos
Conceptos Falta la mayoría de
que representan la representan la no tienen
secundarios los conceptos
información principal información principal relación con el
3 Puntos importantes.
del tema y los enmarca del tema y los tema.
en figuras geométricas. enmarca en figuras
geométricas.
La mayoría de las
Todas las palabras
palabras enlace son Pocas palabras No contiene
Palabras Enlace enlace son apropiadas y
apropiadas y le dan enlace son palabras
1 Punto le dan sentido lógico a
sentido lógico a las apropiadas. enlace.
las proposiciones.
proposiciones.
El mapa conceptual
El mapa conceptual
contiene muchos
contiene algunos
El mapa conceptual se conceptos que no En el mapa
conceptos que no
encuentra presentado están presentados de conceptual los
están presentados de
Organización de manera ordenada, manera ordenada, conceptos no
manera ordenada,
3 Puntos jerárquica y lógica con jerárquica y lógica, lo presentan una
jerárquica y lógica
conectores que hacen cual hace que la organización
con conectores que
fácil su comprensión. información no se en las ideas.
hacen confusa su
muestre de manera
comprensión.
adecuada.
Tiene más de 5
errores de
ortografía y/o
Tiene muy pocos
Ortografía y No tiene errores de Tiene errores de no tiene
errores de ortografía
Gramática ortografía y gramáticos ortografía (de 4 a 5) limpieza el
(máximo 3) y/o
2 Puntos y no presenta borrones. y/o muchos borrones. trabajo (Hecho
algunos borrones.
a la carrera,
manchado,
etc.).
Total

29
 COLEGIO DE BACHILLERES DEL ESTADO DE CAMPECHE
DISEÑO DIGITAL

LISTA DE COTEJO
INVESTIGACIÓN
ACADEMIA ESTATAL 2021 - A

PRIMER PARCIAL
LUGAR DE IMPARTICIÓN FECHA:

NOMBRE DEL PARTICIPANTE NOMBRE DEL INSTRUCTOR

No. EVIDENCIAS A ENTREGAR PUNTOS SI Ptos. Obt.

Incluye en su diseño de portada elaborada Datos personales, de escuela
1 materia y un título coherente al trabajo de investigación. (Tipografía 10
adecuada, con texto artístico, ilustraciones, formas, colores)
Destaca en su documento los títulos (uso de estilos) de los temas y
2 10
subtemas a investigar e integra tabla de contenido.
En su investigación incluye todos los elementos, temas y/o conceptos
3 10
solicitados.
Describe de forma clara cada uno de los elementos, temas y/o conceptos
4 20
solicitados.
Incluye en su investigación elementos o ejemplos visuales (imágenes,
5 15
tablas) de los temas y/o conceptos para enriquecer su información.
6 Denota el empleo de herramientas básicas de diseño, edición y formato. 15
7 Denota el empleo de herramientas ortográficas y gramáticas. 10
8 Denota organización (información e ilustración) y limpieza en su trabajo. 10

TOTAL DE PUNTOS ACUMULADOS 100

FIRMA DEL PARTICIPANTE FIRMA DEL INSTRUCTOR/EVALUADOR

30
 PRIMER PARCIAL

LISTA DE COTEJO PARA EVALUAR UN DIBUJO

ALUMNO: GRUPO:
DOCENTE:

ASPECTOS A EVALUAR Puntos SI NO SUGERENCIAS

1. Esta creado a base de objetos 1
vectoriales.
2. Muestra creatividad. 2

3. Presenta originalidad. 2

4. Presenta un texto. 1

5. Muestra un uso adecuado de colores. 1

6. Da realce al dibujo empleando efectos. 1

7. Presenta una adecuada distribución de 1
elementos.
8. Se entrega de forma puntual. 1
Total

PRIMER PARCIAL

LISTA DE COTEJO PARA EVALUAR UN FOTOMONTAJE

ALUMNO: GRUPO:
DOCENTE:

ASPECTOS A EVALUAR Puntos SI NO SUGERENCIAS

1. Esta creado a base de imágenes mapa 1
de bits.
2. La sobreposición de las imágenes es 2
realizada a través de las herramientas
de recorte, fusión, selección, borrador,
etc.
3. La imagen resultante muestra una 3
calidad excelente que permite verla
como si fuera una imagen real.
4. El fotomontaje presenta gran 2
creatividad.
5. Se entrega de forma puntual. 2

Total

31