INSTITUTO TECNOLÓGICO SUPERIOR

“REPÚBLICA FEDERAL DE ALEMANIA”

ESCUELA DE DISEÑO GRÁFICO

TÍTULO DEL PROYECTO DE APLICACIÓN DE

CONOCIMIENTOS:

“Elaboración de una plataforma digital para la proyección y promoción de

eventos culturales y artísticos independientes mediante herramientas de diseño
gráfico en la Ciudad de Riobamba en el período de noviembre 2023- marzo 2024.”

TRABAJO DE TITULACIÓN PREVIO A LA OBTENCIÓN DEL

TÍTULO DE TECNÓLOGO EN DISEÑO GRÁFICO

AUTOR:

Rommel Sebastian Izurieta Muñoz

TUTOR:

Tlgo. Andrés Pozo Rodríguez

RIOBAMBA – ECUADOR

2023 - 2024
 RESUMEN

El presente proyecto es un trabajo de aplicación de los conocimientos adquiridos durante la

carrera de Diseño gráfico dentro del cual se aplican algunos de las ramas más importantes

dentro del área, tal como es el diseño web, el diseño editorial, Publicidad, etc. El proyecto

tiene como finalidad la creación de una plataforma digital cuyo objetivo es la proyección y

promoción de eventos artísticos y culturales independientes dentro de la ciudad de Riobamba

y la provincia de Chimborazo. Para lo cual se trabaja en la creación de un espacio donde los

artistas y gestores puedan difundir sus trabajos, expresiones y manifestaciones de arte y de esta

manera lograr un crecimiento y propagación del arte y cultura dentro de la ciudad y la provincia.
 SUMMARY

The present project is an application of the knowledge acquired during the Graphic Design

degree, in which some of the most important branches within the field are applied, such as web

design, editorial design, advertising, etc. The project's aim is to create a digital platform with

the objective of projecting and promoting independent artistic and cultural events within the

city of Riobamba and the province of Chimborazo. For this purpose, we are working on

creating a space where artists and organizers can disseminate their work, expressions, and

artistic manifestations, thereby achieving growth and propagation of art and culture within the

city and the province.

 APROBACIÓN DEL TUTOR

En mi calidad de Tutor del trabajo de aplicación de conocimientos “Elaboración de una

plataforma digital para la proyección y promoción de eventos culturales y artísticos

independientes mediante herramientas de diseño gráfico en la Ciudad de Riobamba en el

período de noviembre 2023- marzo 2024”, elaborado por el estudiante IZURIETA MUÑOZ

ROMMEL SEBASTIAN, de la Carrera de Diseño Gráfico y Multimedia, del INSTITUTO

TECNOLÓGICO SUPERIOR REPÚBLICA FEDERAL DE ALEMANIA de la ciudad de

Riobamba, previo a la obtención del título de tecnólogo en diseño gráfico y multimedia, me

permito declarar que luego de haber orientado, estudiado, revisado, apruebo en todas sus partes.

Atentamente.

__________________________________

TLGO. ANDRÉS POZO RODRÌGUEZ

TUTOR
 AUTORÍA DE TESIS

Yo, IZURIETA MUÑOZ ROMMEL SEBASTIAN, portador de la cédula de ciudadanía

Nº 0604543884, Egresado de la Escuela de Diseño Gráfico y Multimedia.

Declaro que soy el autor del presente trabajo de aplicación de conocimientos, el mismo que es

original, auténtico y personal.

Todos los aspectos académicos y legales que se desprendan del presente trabajo son

responsabilidad exclusiva del autor.

__________________________________

IZURIETA MUÑOZ ROMMEL SEBASTIAN

C.I. Nº 0604543884
 TRIBUNAL DE GRADO

_____________________________________

PRESIDENTE DEL TRIBUNAL

___________________________________

PRIMER VOCAL

_____________________________________

SEGUNDO VOCAL
 DEDICATORIA

Dedico este proyecto principalmente a los artistas y gestores culturales dentro de la

provincia, que son las personas que permiten que el espíritu del arte a nivel local se mantenga

vivo, también me gustaría dedicar este esfuerzo a mis padres y hermanas que han sido las

personas que han sido me compañía y apoyo incondicional en este camino de crecimiento

profesional.
 AGRADECIMIENTO

En primer lugar, me siento muy agradecido con Dios que me brinda la oportunidad de

experimentar la vida y en este caso me ha sido posible llegar a cumplir este logro de crecimiento

académico y profesional, también hago extensivo el agradecimiento especial a mis padres que

han sido mi apoyo invaluable dentro de este caminar. Agradezco también a todos los docentes

de la carrera de diseño gráfico que han sido una guía y una fuente de conocimientos y sabiduría

en cada materia impartida y en especial un efusivo agradecimiento a mi tutor al Tlgo. Andres

Pozo el cual ha sabido entregar a cada estudiante la herramienta mas importante que es el

conocimiento, además de ser una guía y un apoyo invaluable para la realización de este

proyecto.
 Contenido

Contenido
RESUMEN ...................................................................................................................... II

SUMMARY .................................................................................................................. III

APROBACIÓN DEL TUTOR ....................................................................................... IV

AUTORÍA DE TESIS ..................................................................................................... V

TRIBUNAL DE GRADO .............................................................................................. VI

DEDICATORIA .......................................................................................................... VII

AGRADECIMIENTO................................................................................................. VIII

Contenido ....................................................................................................................... IX

CAPITULO I .................................................................................................................... 1

1. Problematización...................................................................................................... 1

1.1. Tema ......................................................................................................................... 1

1.2. Descripción del problema ........................................................................................ 2

1.3. Formulación del problema ...................................................................................... 3

1.4. Objetivos ................................................................................................................... 4

1.4.1. Objetivo general. .......................................................................................... 4

1.4.2. Objetivos específicos. ................................................................................... 4

1.5. Justificación ............................................................................................................. 5

CAPITULO II .................................................................................................................. 6

2. Marco teórico ............................................................................................................ 6

2.1. Antecedentes ............................................................................................................. 6

2.2. Fundamento teórico ................................................................................................. 8

2.2.1. Diseño Gráfico .................................................................................................. 8

2.2.2. Diseño Andino ..................................................................................................... 35

CAPITULO III ............................................................................................................... 42

3. Marco metodológico ............................................................................................... 42

3.1. Diseño y tipo de investigación ............................................................................... 42

3.1.1. Diseño de investigación .............................................................................. 42

3.1.2. Tipo de investigación.................................................................................. 42

3.2. Población y muestra............................................................................................... 43

3.2.1. Población ..................................................................................................... 43

3.2.2. Muestra ....................................................................................................... 43

3.3. Métodos, técnicas e instrumentos. ......................................................................... 44

3.3.1. Métodos ....................................................................................................... 44

3.3.2. Técnicas ....................................................................................................... 44

3.3.3. Instrumentos ............................................................................................... 45

3.4. Tratamiento de los resultados ................................................................................ 48

3.5. Marco administrativo ............................................................................................. 58

3.5.1. Talento Humano ......................................................................................... 58

3.5.2. Recursos físicos, técnicos y económicos .................................................... 58

1.1. Cronograma ......................................................................................................... 61

CAPITULO IV ............................................................................................................... 62

4. Marco Propositivo ...................................................................................................... 62

4.1. Titulo ....................................................................................................................... 62

4.2. Objetivos ................................................................................................................. 62

4.2.1. Objetivo general ............................................................................................. 62

4.2.2. Objetivos específicos ..................................................................................... 62

4.3. Desarrollo de la propuesta ..................................................................................... 64

4.3.1. Crear la marca y diseño global de la plataforma digital mediante software

de diseño gráfico como Adobe Illustrator. ...................................................... 64
5. CONCLUSIONES .................................................................................................. 82

6. RECOMENDACIONES ......................................................................................... 83

7. BIBLIOGRAFIA .................................................................................................... 84

8. ANEXOS ................................................................................................................ 86
Indice de imágenes

Imagen 1. En esta imagen se muestra un collage de diseño gráfico. Recuperado de:

http:[Link] ........................................................................................................ 8
Imagen 2 Historia del diseño gráfico. Recuperado de: Historia del diseño gráfico Parte 1 –
Nerade ...................................................................................................................................... 10
Imagen 3. En esta imagen se muestra el proceso de creación de una marca. Recuperado de:
http:[Link] ................................................................................................ 12
Imagen 4. En esta imagen se un ejemplo de diseño web. Recuperado de:
http:[Link] ...................................................................................................... 15
Imagen 5. Estilo visual, recuperado de: Most Trendy Types of Visual Art in 2021 | Fine Art
Shippers.................................................................................................................................... 16
Imagen 6. Escala cromática, recuperado de: Paleta De Colores Rgb Y Cmyk Color Codes -
[Link] .......................................................................................................................... 17
Imagen 7. Ejemplo de diseño web, recuperado de: diseño web - Búsqueda Imágenes ([Link])
.................................................................................................................................................. 24
Imagen 8. En esta imagen se muestra un ejemplo de diseño editorial. Recuperado de:
http:[Link] ...................................................................................................... 25
Imagen 9. Ejemplos de diseño editorial, recuperado de: Diseño editorial.
([Link]) ................................................................................................ 26
Imagen 10. Reticula de una columna en Adobe Indesign, recuperado de: La retícula en el diseño
UX/UI: qué es y cómo se utilizan ([Link]) .............................................................. 28
Imagen 11. Ejemplo de retículas en Adobe Indesign, recuperado de: [Link] .................. 29
Imagen 12. Reticula modular en Adobe Indesign, recuperado de: reticula modular adobe
indesign - Búsqueda Imágenes ([Link]) .............................................................................. 30
Imagen 13, Sistema de reticula jerarquico en Adobe Indesign, recuperado de: reticula de una
coluna adobe indesign - Búsqueda Imágenes ([Link])........................................................ 31
Imagen 14. En esta imagen se muestra una persona haciendo marketing. Recuperado de:
http:[Link] ...................................................................................................... 31
Imagen 15. En esta imagen se muestran ejemplos de diseño andino. Recuperado de:
http:[Link] ...................................................................................................... 36
Imagen 16. Iconología geométrica, recuperado de: Abstract geometric symbol, isolated on
white background. Sacred geometry sign. Concept of imagination, magic, religion, creativity.
Linear logo Stock Vector Image & Art - Alamy ..................................................................... 37
Imagen 17. Captura de documento investigativo ..................................................................... 64
Imagen 18. Captura dentro de Adobe Illustrator ..................................................................... 64
Imagen 19. Captura de bocetos para marca ............................................................................. 65
Imagen 20. Captura de paleta de colores ................................................................................. 65
Imagen 21. Portada del manual de marca ................................................................................ 66
Imagen 22. Descripción del logotipo. ...................................................................................... 66
Imagen 23. Captura de layouts en Adobe Illustrator ............................................................... 67
Imagen 24. Captura de pantalla dentro de Adobe Illustrator. .................................................. 67
Imagen 25. Captura de último layout en Adobe Illustrator ..................................................... 68
Imagen 26. Tratamiento de imágenes dentro de Adobe Photoshop......................................... 68
Imagen 27. Tratamiento de imágenes dentro de Adobe Photoshop......................................... 69
Imagen 28. Creación de página maestro en Adobe Muse ........................................................ 69
Imagen 29. Maquetación de sección 1 en Adobe Muse ........................................................... 70
Imagen 30. Maquetación de los elementos en sección 1 en Adobe Muse ............................... 70
Imagen 31. Creación de widgets para galería fotográfica ........................................................ 71
Imagen 32. Enlace de hipervínculos a botones en elementos de la página.............................. 71
Imagen 33. Maquetación de sección 2 de la página web ........................................................ 72
Imagen 34. Maquetación de sección 3 de la página web ......................................................... 72
Imagen 35. Maquetación sección Quienes somos en la página web. ...................................... 73
Imagen 36. Maquetación de sección contactos ........................................................................ 73
Imagen 37. Maquetación de primer evento en la página web.................................................. 74
Imagen 38. Maquetación de segundo articulo de la página web. ............................................ 74
Imagen 39. Maquetación de tercer articulo de la página. ........................................................ 75
Imagen 40. Creación de puntos de ruptura en página maestra. ............................................... 75
Imagen 41. Reorganización de elementos en puntos de ruptura .............................................. 76
Imagen 42. Creación de menú de hamburguesa en el punto de ruptura 420. .......................... 76
Imagen 43. Creación de puntos de ruptura en sección 1.......................................................... 77
Imagen 44. Creación de puntos de ruptura en sección 2.......................................................... 77
Imagen 45. Creación de puntos de ruptura en sección 3.......................................................... 78
Imagen 46. Reorganización de elementos en puntos de ruptura de 420 .................................. 78
Imagen 47. Exportación de proyecto ....................................................................................... 79
Imagen 48. Publicación del proyecto en internet ..................................................................... 79
Imagen 49. Configuración del host. ......................................................................................... 80
Imagen 50. Verificación del funcionamiento........................................................................... 80
Imagen 51. Verificación del funcionamiento........................................................................... 81
Imagen 52. Verificación del funcionamiento........................................................................... 81

Índice de tablas

Tabla 1 ..................................................................................................................................... 48
Tabla 2 ..................................................................................................................................... 49
Tabla 3 ..................................................................................................................................... 50
Tabla 4 ..................................................................................................................................... 51
Tabla 5 ..................................................................................................................................... 52
Tabla 6 ..................................................................................................................................... 53
Tabla 7 ..................................................................................................................................... 54
Tabla 8 ..................................................................................................................................... 55
Tabla 9 ..................................................................................................................................... 56
Tabla 10 ................................................................................................................................... 57
Tabla 11 ................................................................................................................................... 58
Tabla 12 ................................................................................................................................... 58
Tabla 13 ................................................................................................................................... 59
Tabla 14 ................................................................................................................................... 60
 INSTITUTO TECNOLÓGICO SUPERIOR
1
“REPUBLICA GENERAL DE ALEMANIA”

CAPITULO I

1. Problematización

[Link]

Creación de una plataforma digital para la proyección y difusión de eventos

culturales y artísticos independientes, mediante el diseño de marca, creación de medios

digitales, y diseño global, en la ciudad de Riobamba en el periodo mayo 2023,

noviembre 2023.
 INSTITUTO TECNOLÓGICO SUPERIOR
2
“REPUBLICA GENERAL DE ALEMANIA”

[Link]ón del problema

Riobamba, también conocida como San Pedro de Riobamba, es una

ciudad ecuatoriana; cabecera cantonal del Cantón Riobamba y capital de la provincia

de Chimborazo, así como la urbe más grande y poblada de esta, Riobambase encuentra

en un momento en donde las expresiones culturales y artísticas se hanvisto cada vez de

formas más diversas, y en mayor cantidad, que con el paso del tiempo han ido

evolucionando conjuntamente con el desarrollo cultural y artístico del ser humano, sin

embargo estas expresiones se han visto un poco limitadas por la falta de comunicación

de las mismas que hace que estas no logren potenciarse y obtener el lugar que merecen

dentro de la sociedad.

El presente proyecto propone la creación de una plataforma digital la cual estará

enfocada en la proyección, comunicación y difusión de proyectos artísticos y culturales

independientes mediante la creación de una marca de comunicación digital, en donde

el diseño gráfico juega el papel más importante y fundamental para el desarrollo de la

misma, dicha plataforma tendrá su punto de partida en la creación de marca, así también

como todos lo que esta requiere, además se trabajaráen la creación de medios digitales

como página web, redes sociales, dentro de las cuales partiendo de una investigación se

concrete una medio consolidado que pueda promocionar, crear y difundir las

manifestaciones de arte y cultura independientes que estén relacionados con la música,

arte, cine, y demás expresiones en la ciudad de Riobamba.

 INSTITUTO TECNOLÓGICO SUPERIOR
3
“REPUBLICA GENERAL DE ALEMANIA”

[Link]ón del problema

¿De qué manera se puede potenciar y difundir efectivamente los eventos

culturales y artísticos independientes que se desarrollan en la ciudad de Riobamba?

 INSTITUTO TECNOLÓGICO SUPERIOR
4
“REPUBLICA GENERAL DE ALEMANIA”

[Link]

1.4.1. Objetivo general.

Crear una plataforma digital para la proyección y difusión de eventos culturales

y artísticos independientes, mediante el diseño de marca, creación de medios digitales,

y diseño global.

1.4.2. Objetivos específicos.

• Investigar las diferentes plataformas de comunicación digital, características,

funciones, elementos, etc. Para obtener un conocimiento sólido y poder

estructurar el proyecto.

• Realizar una investigación sobre diseño y creación de marca, así como las ramas

del diseño gráfico que se aplicarán dentro del proyecto, para de esta manera

poder ejecutar las que más se adapten a los intereses del mismo.

• Realizar una investigación y análisis de las manifestaciones culturales y

artísticas que se desarrollan dentro de la ciudad de Riobamba.

• Crear la marca, brandig, diseño global y contenido para la plataforma digital.

 INSTITUTO TECNOLÓGICO SUPERIOR
5
“REPUBLICA GENERAL DE ALEMANIA”

[Link]ón

Las manifestaciones culturales y artísticas que surgen en la ciudad de Riobamba

cada vez son en mayor cantidad y de maneras más diversas, dentro de la ciudad se ha

podido evidenciar un desarrollo cultural y artístico importante , por lo tanto se ha podido

evidenciar una evolución y aparición en distintas disciplinas artísticas como la música,

la expresión plástica, el cine, la fotografía, la danza, el teatro, entre otras, sin embargo

estas manifestaciones de arte y cultura en la actualidad no han podido llegar a tener la

visibilidad que deberían tener y poder asi lograr crear un impacto positivo en la

sociedad, esto debido a diversas causas o motivos, siendo una de las principales la falta

de difusión y comunicación de estas expresiones.

El presente proyecto propone la creación de una plataforma digital de

comunicación desde la cual mediante el diseño gráfico y la comunicación, se parte de

diseño y elaboración de una marca para el proyecto, siendo la base una página web en

donde el usuario pueda redireccionarse a redes sociales, revista digital, y contenido

multimedia, las principales herramientas para la creación del proyecto requieren el uso

del diseño gráfico sin embargo se hará uso de recursos de comunicación escrita y la

colaboración de los protagonistas de este proyecto, que serían los artistas o gestores

independientes de la ciudad de Riobamba.

 INSTITUTO TECNOLÓGICO SUPERIOR
6
“REPUBLICA GENERAL DE ALEMANIA”

CAPITULO II

2. Marco teórico

2.1. Antecedentes

Riobamba, también conocida como San Pedro de Riobamba, es una ciudad ecuatoriana;

cabecera cantonal del Cantón Riobamba y capital de la provincia de Chimborazo, así como la

urbe más grande y poblada de esta. Se localiza al centro de la región Interandina del Ecuador,

cerca del centro geográfico del país, rodeada de varios volcanes como el Chimborazo,

el Tungurahua, el Altar y el Carihuairazo; en la hoya del Río Chambo, en la orilla izquierda del

río Chibunga, a una altitud de 2750 m s. n. m. y con un clima frío andino de 12 °C en promedio.

Es llamada «cuna de la nacionalidad ecuatoriana», «Sultana de los Andes» y «Ciudad de las

Primicias». De acuerdo con el censo de 2022, la ciudad tenía una población de 177.213

habitantes, lo que la convierte en la duodécima ciudad más poblada del país. La ciudad es el

núcleo del área metropolitana de Riobamba, que está constituida, además, por ciudades y

parroquias rurales cercanas. El conglomerado alberga a más de 370.000 habitantes, siendo una

de las principales conurbaciones de Ecuador.

La capital de la provincia de Chimborazo se destaca por sus manifestaciones culturales,

tradiciones, vestimenta, costumbres, religiosidad, festividades, bailes y coloridos personajes

que por cientos de años han forjado la identidad de sus pueblos, comunidades y
 INSTITUTO TECNOLÓGICO SUPERIOR
7
“REPUBLICA GENERAL DE ALEMANIA”
nacionalidades como una ciudad multiétnica y pluricultural convirtiéndose en un punto

de atracción para visitantes de todo el país.

Gran parte del potencial patrimonial y arquitectónico de Riobamba se ubica en el Núcleo

Histórico conformado por sus 453 edificaciones patrimoniales entre iglesias, conventos,

viviendas, edificios y museos que datan del siglo XIX y XX. Además, sus parques y plazas,

que se diferencian por su composición y entorno, convierten a la ciudad en un mágico escenario

de la época colonial.

La tradición y costumbres de sus festividades resaltan los 1.000 Pases del Niño que

durante noviembre hasta febrero recorren diariamente las calles de Riobamba, esta importante

tradición posee una herencia religiosa y cultural. Sus personajes denominados: el diablo

sonajero, el sacha runa, el perro, el payaso, el curiquingue y el danzante, son únicos en el país

y simbolizan la rebeldía y la alegría representada en su tradición y folclore, siendo así parte del

Patrimonio Cultural Inmaterial del Ecuador.

La riqueza y entorno natural y cultural de sus comunidades ubicadas en las parroquias

rurales mantienen vivas e intactas las costumbres, creencias, leyendas y la relación del hombre

con las montañas. Estas experiencias de turismo comunitario se las puede disfrutar en Palacio

Real y La Moya ubicados en la parroquia Calpi y Pucará Tambo que prestan servicios de

alojamiento, restaurante, senderos interpretativos, ceremonias ancestrales y centro de

artesanías.
 INSTITUTO TECNOLÓGICO SUPERIOR
8
“REPUBLICA GENERAL DE ALEMANIA”

2.2. Fundamento teórico

2.2.1. Diseño Gráfico

Imagen 1. En esta imagen se muestra un collage de diseño gráfico. Recuperado de: http:[Link]

El diseño gráfico es una profesión, disciplina académica y arte aplicada, cuya actividad

consiste en proyectar comunicaciones visuales destinadas a transmitir mensajes específicos

a grupos sociales con objetivos determinados, donde es habitual el uso de texto y gráficos para

comunicarse visualmente. Se basa en el principio de «la forma sigue a una función específica.

El diseño gráfico es una rama interdisciplinaria del diseño y de las bellas artes, cuyos

fundamentos y objetivos giran en torno a la definición de problemas y determinación de

objetivos para la toma de decisiones a través de la creatividad, la innovación y el pensamiento

lateral junto con herramientas manuales o digitales, transformándolos para su debida

interpretación. Esta actividad ayuda a la optimización y al mejoramiento de la comunicación

gráfica. También es conocido como diseño de la comunicación visual y diseño visual.

 INSTITUTO TECNOLÓGICO SUPERIOR
9
“REPUBLICA GENERAL DE ALEMANIA”
El rol que cumple el diseñador gráfico en el proceso de comunicación es el de

codificador o intérprete del mensaje. Trabaja en la interpretación, planeación y presentación de

los mensajes visuales. Por lo general, el diseño gráfico utiliza la estética de la tipografía y la

disposición compositiva del texto, la ornamentación y las imágenes para transmitir ideas,

sentimientos y actitudes más allá de lo que expresa el lenguaje por sí solo. El trabajo de diseño

puede partir de la demanda de un cliente, demanda que se establece lingüísticamente, ya sea de

manera oral o escrita, es decir, que el diseño gráfico transforma un mensaje en una

manifestación gráfica.

El diseño gráfico tiene, como campo de aplicación, diferentes áreas del saber enfocadas

a cualquier sistema de comunicación visual. Por ejemplo, puede aplicarse en estrategias

publicitarias, o también, aplicarse en el mundo de la aviación o la exploración espacial. En este

sentido, en algunos países se relaciona el diseño gráfico como únicamente asociado a la

elaboración de bocetos y dibujos, esto es incorrecto, ya que la comunicación visual es una

pequeña parte de un enorme abanico de tipos y clases donde puede aplicarse.

Con orígenes en la antigüedad y la Edad Media, el diseño gráfico como arte aplicada

estuvo inicialmente vinculado al auge de la imprenta en Europa en el SIGLO XV y al crecimiento

de la cultura de consumo en la Revolución Industrial. A partir de allí surgió como una profesión

diferenciada en Occidente, muy asociada a la publicidad en el SIGLO XIX13 y su evolución

permitió su consolidación en el SIGLO XX. Dado el crecimiento veloz y masivo en el

intercambio de información en la actualidad, la demanda de diseñadores experimentados es

mayor que nunca, particularmente a causa del desarrollo de nuevas tecnologías y de la

necesidad de prestar atención a los factores humanos que escapan a la

 INSTITUTO TECNOLÓGICO SUPERIOR
10
“REPUBLICA GENERAL DE ALEMANIA”

competencia de los ingenieros que las desarrollan.

[Link]. Historia del diseño gráfico

Imagen 2 Historia del diseño gráfico. Recuperado de: Historia del diseño
gráfico Parte 1 – Nerade

La definición de la profesión del diseñador gráfico es más bien reciente, en lo que se

refiere a su preparación, su actividad y sus objetivos. Aunque no existe consenso sobre una

fecha exacta en la que nació el diseño gráfico, algunos lo datan durante el período de

entreguerras. Otros entienden que comienza a identificarse como tal para finales del SIGLO XIX.

Puede argumentarse que comunicaciones gráficas con propósitos específicos tienen su

origen en las pinturas rupestres del Paleolítico y en el nacimiento del lenguaje escrito en el

tercer milenio a. C. Pero las diferencias de métodos de trabajo, ciencias auxiliares y formación

requerida son tales que no es posible identificar con claridad al diseñador gráfico actual con el

hombre de la prehistoria, con el xilógrafo del SIGLO XV o con el litógrafo de 1890.

 INSTITUTO TECNOLÓGICO SUPERIOR
11
“REPUBLICA GENERAL DE ALEMANIA”
La diversidad de opiniones responde a que algunos consideran como producto del

diseño gráfico a cualquier manifestación gráfica y otros solamente a aquellas que surgen como

resultado de la aplicación de un modelo de producción industrial; es decir, aquellas

manifestaciones visuales que han sido "proyectadas" contemplando necesidades de diversos

tipos: productivas, simbólicas, ergonómicas, contextuales, entre otros.

Sin embargo, la evolución del diseño gráfico como práctica y profesión ha estado

estrechamente ligada a las innovaciones tecnológicas, las necesidades sociales y la imaginación

visual de los profesionales. El diseño gráfico se ha practicado de diversas formas a lo largo de

la historia; de hecho, los buenos ejemplos de diseño gráfico se remontan a los manuscritos de

la antigua China, Egipto y Grecia. A medida que la impresión y la producción de libros se

desarrollaron en el SIGLO XV, los avances en el diseño gráfico se desarrollaron a lo largo de los

siglos posteriores, y los compositores o tipógrafos a menudo diseñaban las páginas según

establecían el tipo.
 INSTITUTO TECNOLÓGICO SUPERIOR
12
“REPUBLICA GENERAL DE ALEMANIA”
[Link]. Ramas del diseño gráfico

[Link].1. Diseño de marca

Imagen 3. En esta imagen se muestra el proceso de creación de una

marca. Recuperado de: http:[Link]

El diseño de marca es un concepto que engloba varios elementos y cuya misión es darle

una identidad definida y personalizada a la marca, muy en línea con la identidad corporativa

visual. Se inicia desde la elección del nombre comercial y llega a todos los detalles, grandes o

pequeños, con los que se pretende construir una identidad.

Es crucial que este aspecto sea trabajado de manera consciente y con mucha calma.

Tanto el nombre comercial, colores, logotipos, incluso tipografías, van a formar parte de la

imagen global que la empresa proyecta a los clientes.

Para entender un poco mejor el concepto del diseño de marca, tienes que comprender

en primera instancia lo que significa la marca de una organización.

Como marca se debe concebir algo más que un simple nombre: la marca es el sello, el

espíritu, el símbolo identificativo de la organización, o una combinación de todo ello, a través

 INSTITUTO TECNOLÓGICO SUPERIOR
13
“REPUBLICA GENERAL DE ALEMANIA”
de la cual, los usuarios perciben una imagen válida de ella, en términos de calidad, fiabilidad y

unicidad.

➢ Características del diseño de marca

Uno de los elementos con mayor importancia dentro de una marca es la calidad de sus

diseños. Puesto que es lo que mostramos al público y con ello logramos establecer cuál será la

meta de la empresa. Es sustancial tener en cuenta varias características tales como:

o Tener un estilo bien definido

Lo ideal es siempre definir el estilo que se utilizará en los diseños, para que todo esté

unificado y en cuanto sea visto se sepa a qué marca pertenece.

o Tener una paleta de colores

Contar con una paleta de colores predefinida ayuda a que nuestro diseño sea fácil de

identificar y que se unifique.

o Establecer un concepto

Antes de empezar a diseñar se tiene que establecer el mensaje o idea que deseas transmitir

para que sea más sencillo plasmar lo que tienes en mente.

o
 INSTITUTO TECNOLÓGICO SUPERIOR
14
“REPUBLICA GENERAL DE ALEMANIA”
o Investiga

Si establecer el concepto te resulta difícil, investiga el tema del que quieres hablar para que

entiendas mejor sobre él, y si tú lo entiendes, él público receptor también lo hará.

o Establecer un público meta

No es lo mismo realizar un diseño para un producto de belleza que para uno de alimentos,

por lo que es esencial establecer a quiénes irá dirigido nuestro diseño. Una recomendación sería

establecer tu Buyer Persona y así podrás tener una mejor idea de a quién le quieres vender.

o Creatividad

Tomar referencias para un diseño no está mal, inclusive te puede ayudar más a aterrizar la

idea, pero trata de siempre ser auténtico e innovar para que tu diseño sea único.

o Simplicidad

En el diseño siempre es muy recomendable ser simple con lo que creamos.

Recuerda que lo que vayas a crear, en especial si es publicitario, es bueno mantener como

prioridad la imagen, por ende, el texto debe ser el mínimo. Esto ayudará a que tu diseño luzca

más limpio y sea más aceptado.

[Link].2. Diseño Web

 INSTITUTO TECNOLÓGICO SUPERIOR
15
“REPUBLICA GENERAL DE ALEMANIA”

Imagen 4. En esta imagen se un ejemplo de diseño web. Recuperado

de: http:[Link]

El diseño web es una actividad creativa enfocada en realizar la parte visual de entronos y

materiales digitales. Se encarga de layouts e interfaces de plataformas digitales como un sitio

web o una app y realiza una configuración visible y funcional para el usuario al distribuir y

conceptualizar diversos elementos.

o Elementos de diseño de un sitio web

Ahora bien, para que el sitio web de tu empresa sea un éxito debe cumplir con varios

requisitos: la navegación debe ser fácil; los tiempos de carga, mínimos. Además, el diseño debe

adaptarse a la personalidad del negocio; es decir, de tu marca por medio de conceptos visuales.

Utilizar a favor los elementos de diseño web que te presentamos a continuación; verás

que lograrás crear el estilo que mejor represente a tu empresa.

 INSTITUTO TECNOLÓGICO SUPERIOR
16
“REPUBLICA GENERAL DE ALEMANIA”

o Estilo visual

Imagen 5. Estilo visual, recuperado de: Most Trendy Types of Visual Art in

2021 | Fine Art Shippers

El estilo visual de tu sitio web dependerá de lo que quieras transmitir y dar a conocer

acerca de tu empresa, por lo que tendrá que estar alineado a la identidad corporativa. Usa el

manual de estilo para destacar los detalles que la conforman y apóyate en los siguientes

elementos:

o Colores
 INSTITUTO TECNOLÓGICO SUPERIOR
17
“REPUBLICA GENERAL DE ALEMANIA”

Imagen 6. Escala cromática, recuperado de: Paleta De Colores

Rgb Y Cmyk Color Codes - [Link]

Elegir una combinación de colores adecuada es clave a la hora de presentar el

contenido de tu sitio web. Los colores claros facilitan la visualización, generan un aspecto

limpio y organizado y, lo más importante, no cansan al usuario. Por su parte, los tonos oscuros

dan una apariencia elegante que puede contribuir a la imagen de tu marca.

El color puede ayudarte a aumentar el reconocimiento de la marca: según sea la

paleta de color que adoptes, puedes incitar a los visitantes de tu sitio web a tomar

decisiones. Incluso es un factor que puede aumentar las conversiones si lo usas

coherentemente, ya que el color incrementa en un 80 % el reconocimiento de marca, la cual

se vincula directamente a la confianza que genera.

o Tipografía
 INSTITUTO TECNOLÓGICO SUPERIOR
18
“REPUBLICA GENERAL DE ALEMANIA”

Las fuentes tipográficas que decidas utilizar para el sitio web de tu empresa deben ser

atractivas y fáciles de leer. Recuerda que buscas que los usuarios lean tu contenido, así que no

los canses con fuentes adornadas que puedan distraer o confundir.

Entre las fuentes más recomendadas por su personalidad clara y sencilla son Times New

Roman, Arial y Cambria.

Eso sí, no dudes en emplear tipografías más audaces, elegantes o románticas en algunos sitios

clave, como el encabezado de cada página.

o Imágenes

Las imágenes complementan el contenido del sitio y le dan dinamismo y contraste. Es

importante que elijas imágenes de buena calidad y que sean relevantes. Existen muchos bancos

de imágenes gratuitos con una enorme variedad de propuestas. También puedes generar tus

propias fotografías si quieres presentar tus productos de forma atractiva. Esto le dará

claridad a tus clientes, ya que sabrán muy bien qué es lo que ofreces. Las imágenes son parte

importante para atraer la atención de los usuarios.

Un claro ejemplo de lo que no se debe hacer: son las imágenes que los restaurantes de

comida rápida utilizan para promocionar sus platillos. Cuando ves las hamburguesas en

fotografía, lucen grandes, jugosas y deliciosas; pero cuando visitas el establecimiento no se

parecen a la imagen del menú. Es válido retocar las imágenes de tus productos, pero
 INSTITUTO TECNOLÓGICO SUPERIOR
19
“REPUBLICA GENERAL DE ALEMANIA”
cuida que lo que proyectes no se aleje de la realidad.

o Componentes interactivos

Este es otro elemento importante del diseño web. Agrega animaciones, botones de

CTA (llamadas a la acción) y otros elementos visuales donde los visitantes puedan hacer

clic. Piensa en la jerarquía y nivel de relevancia para que destaques aquellos componentes que

consideres más útiles. Te recomendamos destacar los elementos que hablen de tu oferta y

también aquellos que indiquen cómo podrías resolver los problemas de tus clientes.

También puedes añadir GIF o iconos, siempre con una distribución armónica, con el

fin de que cada página tenga una apariencia más dinámica. Es importante que consideres este

aspecto, ya que hoy en día los visitantes esperan que los sitios web cuenten con componentes

interactivos.

De hecho, hay estudios que demuestran que un visitante en un sitio web tardará

solamente 50 milisegundos en decidir si seguirá navegando o abandona tu página web.

Recuerda que todo proyecto debe respetar los principios básicos de diseño web para que sea

funcional, compatible y vistoso.

 INSTITUTO TECNOLÓGICO SUPERIOR
20
“REPUBLICA GENERAL DE ALEMANIA”
o Características del diseño web

Un buen diseño web debe contar con varias características para que sea vistoso y

funcional; la conjugación de estas características garantizará el éxito del proyecto. Es

fundamental conocer los estándares de diseño web para crear proyectos espectaculares. Estas

son las características fundamentales que debes tener en cuenta para tu diseño web:

o Es visual

El diseño web es ante todo visual para que sea atractivo, por lo que se vale

de elementos gráficos y textuales, imágenes, videos, colores y todos los aspectos que en

armonía van a crear un espacio agradable en el que los visitantes querrán navegar. Aquí tienes

algunos fondos interesantes para utilizar en tus páginas web.

o Permite una carga veloz

El sitio web debe cargar rápidamente y no ofrecer obstáculos para la navegación. El

diseño web se encarga en gran parte de esto al utilizar un lenguaje de programación adecuado,

imágenes que se vean bien sin comprometer la cantidad de datos, entre otros aspectos. ¿Cómo

puede afectar la velocidad? Según un estudio de Amazon, por cada 0,1 segundos que tardaba

su sitio web, implicaba una pérdida del 1 % en el total de ventas.

o Es responsivo
 INSTITUTO TECNOLÓGICO SUPERIOR
21
“REPUBLICA GENERAL DE ALEMANIA”

El diseño web debe crear proyectos que se adapten perfectamente a cualquier

dispositivo en el que navegue un usuario. De hecho, hoy es más importante que se le dé

prioridad al diseño móvil, porque más del 64 % de las búsquedas en Internet se hacen por

medio de un teléfono móvil.

Con la implementación de este tipo de diseño brindarás una mejor experiencia de

usuario, ya que ofrece comodidad en cualquier resolución y dispositivo. Es importante que

consideres una paleta de colores para páginas web, ya que los colores seleccionados serán la

guía para todo lo que hagas en tu diseño web.

Incluso Google valora mucho este diseño, ya que:

• Evita los contenidos duplicados.

• Aumenta la posibilidad de que el contenido sea viral.

• Reduce el tiempo de desarrollo.

• Mejora la analítica web.

• Facilita la indexación en los motores de búsqueda.

• Aumenta la difusión en redes sociales.

• Se adapta a cualquier pantalla.

• Carga el sitio más rápido.

o Es intuitivo
 INSTITUTO TECNOLÓGICO SUPERIOR
22
“REPUBLICA GENERAL DE ALEMANIA”
El diseño web debe ser simple y presentar una lógica clara que cualquier persona pueda

entender; esto implica que no debe haber ningún elemento sin que cumpla un papel dentro del

conjunto.

o Está optimizado

La labor del diseñador web, actualmente, va de la mano con el desarrollo web y los

generadores de contenido, porque juntos serán responsables de optimizar un sitio web para

que gane posiciones en los motores de búsqueda.

o Presenta una estructura

El diseño web es orden, armonía y distribución de elementos. Así que esta es una

característica esencial para que se puedan generar proyectos efectivos, ya que un sitio web

requiere una estructuración específica.

o Mantiene la coherencia

El diseño web no es caprichoso ni está aislado de un contexto, así que responde a guías

como a quién se dirige, los lineamientos de la voz de marca y quizá ciertas solicitudes

específicas para cumplir con objetivos claros. Así que debe ser coherente con todo esto.

o Es interactivo
 INSTITUTO TECNOLÓGICO SUPERIOR
23
“REPUBLICA GENERAL DE ALEMANIA”
Al ser web, lo interactivo es parte de su ADN. Así que un diseño web debe estar

pensado para conectarse y vincularse al mundo de la red, por medio de hipervínculos o enlaces

hacia el interior del mismo sitio o hacia el exterior.

o Es comunicativo

El diseño web sin intención solamente es una buena imagen, por eso esta característica

le da sentido a lo que hagas. Todos los elementos en particular y en su conjunto

deben comunicar, informar, proponer o promover, desde los contenidos hasta la imagen.

Por eso se utilizan elementos como llamadas a la acción, formularios web, banners y otros

aspectos que permitan crear un puente entre los usuarios y una marca.

o Es altamente funcional

La usabilidad que hoy es tan buscada es una característica que no puedes olvidar para

el diseño web. De nada sirve ser atractivo si no es efectivo. La usabilidad permite la

funcionalidad de todos los elementos que integran un sitio web, lo cual permite que los usuarios

naveguen fluidamente.

Lograr un diseño web eficiente y efectivo es posible. Además, un diseñador cuenta

con diversas herramientas que le ayudan en su labor, las cuales sirven para optimizar

cualquiera de sus proyectos.

 INSTITUTO TECNOLÓGICO SUPERIOR
24
“REPUBLICA GENERAL DE ALEMANIA”
o Para qué sirve el diseño web

Imagen 7. Ejemplo de diseño web, recuperado de: diseño web -

Búsqueda Imágenes ([Link])

El diseño web profesional es una herramienta esencial para crear una identidad de

marca sólida, especialmente en la parte visual del branding. Además, desempeña un papel

crucial en el marketing digital, ya que permite crear landing pages que conviertan visitantes

en potenciales clientes, así como otros materiales en diversos formatos para su publicación en

entornos digitales como redes sociales, correos electrónicos y anuncios.

El diseño web es útil para la atracción y retención de la atención de los usuarios y

visitantes de un sitio web. Además, mediante sus composiciones facilita la navegación en las

diferentes partes y páginas de un sitio web.

Actualmente, es una pieza clave para impulsar el ecommerce al transmitir un mensaje

visual, alineando la imagen de la marca de manera efectiva. El diseño de páginas web,

 INSTITUTO TECNOLÓGICO SUPERIOR
25
“REPUBLICA GENERAL DE ALEMANIA”
además, es fundamental para generar una gran experiencia de usuario y aumentar la interacción

con la audiencia de interés.

También su función es decisiva para el posicionamiento SEO de un sitio web, ya que

su manejo correcto de una estructura web ayudará a los motores de búsqueda para que los

contenidos del sitio web se encuentren de mejor forma.

[Link].3. Diseño Editorial

Imagen 8. En esta imagen se muestra un ejemplo de diseño editorial.

Recuperado de: http:[Link]

El diseño editorial es la rama del diseño gráfico (actividad que consiste en proyectar

comunicaciones visuales destinadas a transmitir mensajes específicos a grupos sociales, con

 INSTITUTO TECNOLÓGICO SUPERIOR
26
“REPUBLICA GENERAL DE ALEMANIA”
objetivos determinados y que ayuda a optimizar las comunicaciones gráficas) dedicada al

diseño, maquetación y composición de publicaciones (impresas o digitales) tales

como revistas, periódicos, libros o arte de tapa en discos.

Otra manera simple de acotarlo es considerarlo como una forma de periodismo visual,

en la medida en que esa etiqueta lo distingue más fácilmente de otros procesos de diseño

gráfico, como el marketing o el diseño de packaging, que suelen orientarse exclusivamente a

la promoción de un punto de vista o de un producto. Una publicación editorial, por el contrario,

puede entretener, informar, instruir, comunicar, educar o desarrollar una combinación de todas

estas acciones.

Las publicaciones editoriales tienen como objetivo principal el comunicar o transmitir

una idea o narración mediante la organización y presentación de imágenes y palabras. También

puede desempeñar diversas funciones, por ejemplo, dotar de expresión y personalidad al

contenido, atraer y retener la atención de los lectores o estructurar el material de una manera

nítida.

Imagen 9. Ejemplos de diseño editorial, recuperado de: Diseño editorial.

([Link])
 INSTITUTO TECNOLÓGICO SUPERIOR
27
“REPUBLICA GENERAL DE ALEMANIA”

El diseño editorial incluye muchos términos técnicos que pueden resultar confusos y

complejos.

El profesional debe tener en cuenta el impacto e innovación de los diseños de tapas,

dándole importancia a la síntesis semántica para que dentro de una gran gama de productos su

creación resalte en cuestión de segundos. Antes de realizar un trabajo de diseño editorial se

tiene que seguir un orden de reglas para la ejecución del trabajo, las cuales pueden ser:

Definir el tema (sobre la base de este que es lo que se quiere comunicar).

Definir el objetivo de comunicación del diseño a realizar.

Conocer el contenido (en caso de publicaciones especializadas).

Cuáles son los elementos más adecuados.

Realizar un proceso de bocetación (pequeños dibujos que lleven a definir un buen

concepto, tanto de composición como del desarrollo del tema y de su posible evolución).

Realizar una retícula, ya que por ejemplo en la creación de una revista u otro impreso que

contenga varias páginas, estas tienen que tener una homogeneidad.

Legibilidad tipográfica (comprensible de leer).

La maquetación, parte importante en el estilo y creatividad de revistas, periódicos y

libros, está basada en una rejilla base, sirve para delimitar los márgenes del área y donde se

justifica el texto y las imágenes.

 INSTITUTO TECNOLÓGICO SUPERIOR
28
“REPUBLICA GENERAL DE ALEMANIA”

Dentro de la maquetación existen diferentes tipos de retículas que se pueden tomar en

cuenta, para que la lectura sea más armoniosa, por ejemplo:

o Retícula de una columna:

Imagen 10. Reticula de una columna en Adobe Indesign, recuperado

de: La retícula en el diseño UX/UI: qué es y cómo se utilizan

([Link])

Esta estructura presenta una única hilera de información, esto para dar una continuidad

y aprovechar al máximo el espacio en textos largos y persistentes. Posee márgenes amplios y

evita que se pierda el punto de lectura, transmite calma y tranquilidad. Los libros o informes

utilizan este tipo de retícula.

o Retícula a dos columnas:

 INSTITUTO TECNOLÓGICO SUPERIOR
29
“REPUBLICA GENERAL DE ALEMANIA”

Imagen 11. Ejemplo de retículas en Adobe Indesign, recuperado de: [Link]

Este tipo organiza la información en dos columnas, esto usualmente es con el objetivo

de presentar datos subsecuentes enfrentados o textos con la información separada. Las

dimensiones pueden ser del mismo tamaño o si se necesita ser de diferente tamaño, se debe

procurar que una sea el doble de ancho que la otra. Se usa frecuentemente en diccionarios o

textos con definiciones.

o Retícula de múltiples columnas:

Este sistema es uno de las más utilizados, ofrece una flexibilidad y versatilidad amplia,

puesto que se puede combinar e intercalar texto con imágenes u otros cuerpos, el número de

columnas puede variar dependiendo, pero usualmente se mantiene en tres o cuatro, las cuales

deben ser proporcionales. Si se tiene una gran cantidad de información se puede

optar por un mayor número de columnas (los periódicos tienen hasta seis). Es fácil

encontrarlas en revistas o folletos informativos.

 INSTITUTO TECNOLÓGICO SUPERIOR
30
“REPUBLICA GENERAL DE ALEMANIA”
o Retícula Modular:

Imagen 12. Reticula modular en Adobe Indesign, recuperado de: reticula

modular adobe indesign - Búsqueda Imágenes ([Link])

Esta estructura muestra módulos del mismo tamaño abarcados en todo el espacio, es

más compleja, pero gracias a su menor división del espacio permite dar más flexibilidad,

movilidad y creatividad a los contenidos. Se puede ver en los diseños de anuncios, carteles o

folletos cortos.

o Sistema Jerárquico:
 INSTITUTO TECNOLÓGICO SUPERIOR
31
“REPUBLICA GENERAL DE ALEMANIA”

Imagen 13, Sistema de reticula jerarquico en Adobe Indesign, recuperado de:

reticula de una coluna adobe indesign - Búsqueda Imágenes ([Link])

Como su nombre lo dice, tiene la finalidad de mostrar los contenidos de acuerdo a su

importancia y relevancia, por ello es muy utilizado en sitios web o información digital, en lo

que primero que se observa es lo que captará la atención.

[Link].4. Marketing estratégico

Imagen 14. En esta imagen se muestra una persona haciendo

marketing. Recuperado de: http:[Link]

 INSTITUTO TECNOLÓGICO SUPERIOR
32
“REPUBLICA GENERAL DE ALEMANIA”

El marketing estratégico es un método que utilizan las organizaciones para diferenciarse

de la competencia centrándose en sus puntos fuertes, y ofrecer un mejor servicio al cliente.

En pocas palabras, el objetivo del marketing estratégico es aprovechar al máximo la

diferenciación positiva de una organización con respecto a su competencia desde la perspectiva

de los consumidores.

o Fases del marketing estratégico

Estas son las fases que se deben implementar para crear una estrategia de marketing estratégico:

o Fase de planificación: En esta fase se evalúan los distintos aspectos de una

organización, como sus puntos fuertes, sus puntos débiles y su tecnología. También se

presenta a la dirección el estado general de la organización. Esta fase consta de cuatro

componentes, que incluyen:

o Análisis FODA: Este método analiza los puntos fuertes, débiles, las oportunidades y

las amenazas relacionadas con la organización. Los resultados de este análisis ayudan

a desarrollar una propuesta estratégica de marketing para la organización.

o Estrategia de marketing mix: Una vez realizado el análisis FODA, se prepara una
 INSTITUTO TECNOLÓGICO SUPERIOR
33
“REPUBLICA GENERAL DE ALEMANIA”
estrategia de marketing adecuada. La estrategia de marketing mix consiste en combinar

y analizar una serie de componentes que ayudan a reforzar la marca de una empresa y

a vender sus productos o servicios.

o Establece objetivos de producto y de marketing: Establecer los objetivos del

producto es uno de los mejores métodos para obtener el éxito con los nuevos productos.

El producto debe comercializarse de forma que se convierta en imprescindible para los

consumidores.

o Las cuatro P del marketing: Una vez fijados los objetivos del producto, entran en

escena las cuatro P del marketing: Precio, plaza, producto y estrategia de promoción.

o Fase de ejecución: En esta fase se ejecuta el plan estratégico de marketing, que consta

de cuatro componentes:

o Recolección de recursos: Reunir el capital necesario para desarrollar y promocionar

nuevos productos.

o Jerarquía de marketing: Debe establecerse una jerarquía de marketing para garantizar

la correcta ejecución de los planes:

 INSTITUTO TECNOLÓGICO SUPERIOR
34
“REPUBLICA GENERAL DE ALEMANIA”

o Formulación de calendarios: Preparar calendarios en los que se asignen períodos de

tiempo específicos a las tareas.

o Ejecución del plan: Debe realizarse de forma muy eficiente.

o Fase de evaluación: En esta fase, el plan se enfoca en los objetivos del producto para

determinar si están alineados. Si no es así, el equipo de marketing tendrá que editar y

mejorar el plan hasta que no haya desviaciones entre el plan y los objetivos.

Algunas de las directrices que te ayudarán a garantizar el éxito de tu proceso de

planificación estratégica de marketing son:

Establecer objetivos que sean alcanzables y puedan medirse.

Preparar el plan después de realizar un análisis exhaustivo del mercado y un análisis de

la competencia.

Los planes preparados deben ser concisos y fáciles de entender.

Asegúrate de que el plan y los objetivos fijados están en sintonía con las necesidades

de los consumidores.
 INSTITUTO TECNOLÓGICO SUPERIOR
35
“REPUBLICA GENERAL DE ALEMANIA”

Al preparar un plan de marketing estratégico, es importante ser consciente de algunos de

los problemas que pueden surgir. Entre ellos se encuentran:

• Falta de mano de obra cualificada.

• Asumir las necesidades de los consumidores sin realizar una investigación exhaustiva.

• Cambio demográfico de los consumidores.

• Problemas de gestión.

• Problemas de coordinación.

• Análisis FODA incorrecto.

• Problemas en la realización de la investigación de marketing.

• Información confusa sobre la comercialización obtenida.

• Problemas de presupuesto.

2.2.2. Diseño Andino

 INSTITUTO TECNOLÓGICO SUPERIOR
36
“REPUBLICA GENERAL DE ALEMANIA”

Imagen 15. En esta imagen se muestran ejemplos de diseño andino.

Recuperado de: http:[Link]

A medida que se profundiza en el estudio del Arte Precolombino, se puede distinguir una serie

de constantes estructurales en la composición, la diversidad de estas resulta de la formación de

un número limitado de esquemas principales.

Debido al carácter tradicional y religioso, se puede deducir que la constante presencia de la

geometría simbólica dentro del arte precolombino responde a una forma de ritualización

iconológica de la imagen del Mundo, es así que las concepciones del Orden se vieron

expresadas mediante signos.

A continuación, conceptos básicos dentro del diseño andino como tal:

[Link]. La iconología geométrica

 INSTITUTO TECNOLÓGICO SUPERIOR
37
“REPUBLICA GENERAL DE ALEMANIA”

Imagen 16. Iconología geométrica, recuperado de: Abstract

geometric symbol, isolated on white background. Sacred geometry

sign. Concept of imagination, magic, religion, creativity. Linear

logo Stock Vector Image & Art - Alamy

Esta expresa los conceptos espaciales de la cosmología andina, mediante una serie de signos

geométricos. Dentro de estos signos se puede identificar dos

grupos principales. El primer grupo integra a los signos que corresponden a las estructuras de

orden y proporcionalidad del plano como forma de representar la unidad, la dualidad, la

tripartición y las variantes de cada una. El otro grupo mencionado incluye a los signos que

representan la definición de las formas, como el cuadrado, la diagonal, el triángulo, el

escalonado, las cruces y las espirales. El conjunto de signos que componen la Iconología

Geométrica, constituye un sistema estructurado a partir de leyes de formación basadas en el

signo de la cruz cuadrada. Dentro de los signos geométricos se puede distinguir tres formas

como estructuras básicas, estas son el cuadrado la diagonal y la espiral, siendo todas las demás

estructuras, derivaciones de estas tres (conceptos definidos anteriormente)

[Link]. El trazado armónico

 INSTITUTO TECNOLÓGICO SUPERIOR
38
“REPUBLICA GENERAL DE ALEMANIA”

Para lograr el ordenamiento armónico del espacio dentro del diseño, se desarrollaron formas

de organización rítmica de los trazos simétricos usando procedimientos de construcción

proporcional del diseño, esto tiene la finalidad de lograr proporciones armónicas y relaciones

simbólicas entre las partes, se busca también el equilibrio en las diferencias y movimiento en

lo permanente. Sus sistemas de creación potencializan la capacidad compositiva y creativa del

diseño, convirtiéndose en un lenguaje de composición oculta.

[Link]. Proporciones estáticas

A más de las proporciones armónicas en donde basan su sistema de medidas (mencionado en

el gráfico III-3), se ha analizado la equipartición de un cuadrado un rectángulo o un círculo

define la modulación estática del espacio, esto da lugar a la cuadrícula o red de construcción,

dentro de la cual se determina específicamente cada ley de formación armónica. La serie

proporcional estática del diseño andino presenta las siguientes relaciones de medidas entre los

lados de los espacios cuadrados y rectangulares:

2.3. Marco conceptual

Alineación: La disposición y posición precisa de elementos en un diseño para lograr coherencia

visual y estructural.
 INSTITUTO TECNOLÓGICO SUPERIOR
39
“REPUBLICA GENERAL DE ALEMANIA”

Boceto: Representación visual rápida y esquemática de una idea o concepto, generalmente

realizada a mano con trazos ligeros y rápidos.

CMYK: Modelo de color basado en cian, magenta, amarillo y negro, utilizado en impresión.

Contraste: Diferencia visual entre elementos, como color, forma o tamaño.

DPI: Puntos por pulgada, medida de resolución de una imagen impresa o en pantalla.

Escala: El ajuste proporcional del tamaño de los elementos en un diseño para lograr equilibrio
y armonía visual.

FODA: Es un acrónimo que proviene del análisis estratégico y se utiliza para evaluar las
Fortalezas, Oportunidades, Debilidades y Amenazas relacionadas con un proyecto, empresa o
situación específica.

Formato de archivo: Extensión que indica el tipo de archivo, como .jpg, .png, etc.

Gradiente: Transición suave entre dos o más colores.

Hipervínculo: Elemento interactivo en un documento digital, como una página web o un

documento de texto, que permite a los usuarios acceder rápidamente a otro recurso, ubicación
o página web relacionada.

Ilustración: Gráficos, dibujos o imágenes creados digitalmente.

Indexación: Se refiere al proceso de organizar y catalogar información para facilitar su

recuperación y búsqueda eficiente.

JPEG: Formato de compresión de imágenes común en diseño gráfico.

 INSTITUTO TECNOLÓGICO SUPERIOR
40
“REPUBLICA GENERAL DE ALEMANIA”

Layout: Estructura visual y organización de elementos en una página.

Mockup: Representación visual de un diseño en un contexto realista.

Módulo: Se refiere a una unidad básica y repetitiva que se utiliza para construir una estructura
visual coherente y armoniosa

Negativo/Positivo: Relación entre la figura y el fondo en un diseño.

Opacidad: Grado de transparencia de un elemento gráfico.

Pantone: Sistema de identificación de colores utilizado en diseño gráfico.

Píxel: Unidad más pequeña de una imagen digital.

RGB: Modelo de color basado en rojo, verde y azul, utilizado en pantallas.

Resolución: Detalle y claridad de una imagen, medida en píxeles o DPI.

Sans Serif: Tipo de fuente sin adornos en los extremos de las letras.

Serif: Tipo de fuente con adornos en los extremos de las letras.

Sombra (Drop Shadow): Efecto visual que simula sombras detrás de un elemento.

Tamaño de Archivo: Peso digital de un archivo, medida en kilobytes o megabytes.

Tipografía: Estilo y diseño de letras en un diseño gráfico.

UI (Interfaz de Usuario): Es el aspecto visual de una interfaz de usuario.

 INSTITUTO TECNOLÓGICO SUPERIOR
41
“REPUBLICA GENERAL DE ALEMANIA”
Vectorial: Gráficos creados con vectores matemáticos para escalabilidad.

Watermark: Marca de agua, a menudo utilizada para proteger imágenes.

 INSTITUTO TECNOLÓGICO SUPERIOR
42
“REPUBLICA GENERAL DE ALEMANIA”

CAPITULO III
3. Marco metodológico

[Link]ño y tipo de investigación

3.1.1. Diseño de investigación

En el presente proyecto se hace uso principalmente del diseño de investigación

cualitativo ya que la recopilación de datos que se requiere para el desarrollo del proyecto

no necesariamente son datos numéricos si no que están enfocados en métodos de

recolección de datos en procedimientos que tienen su base en la comunicación, este

diseño de investigación es el más idóneo para el presente proyecto ya que este tiene un

enfoque en el individuo, las sociedades y las culturas.

3.1.2. Tipo de investigación

El tipo de investigación que se aplica para el presente proyecto es la

investigación aplicada ya que el proyecto presenta un problema ya establecido y es

conocido por el investigador, la investigación aplicada hace énfasis en la resolución

practica de problemas existentes, sin embargo, la característica que más se destaca de

este tipo de investigación es su interés en la aplicación y consecuencias prácticasde los

conocimientos que se han obtenido.

 INSTITUTO TECNOLÓGICO SUPERIOR
43
“REPUBLICA GENERAL DE ALEMANIA”

[Link]ón y muestra

3.2.1. Población

Se incluye como población a todos los ciudadanos residentes en la ciudad de

Riobamba, los cuales conforman una población de 260.882 habitantes.

3.2.2. Muestra

[Link].Cálculo de la muestra

n= Tamaño de la muestra
N= Población
P= Probabilidad de ocurrencia
Q= Probabilidad de no ocurrencia
E¡ Margen de error
Z= Nivel de confianza
 INSTITUTO TECNOLÓGICO SUPERIOR
44
“REPUBLICA GENERAL DE ALEMANIA”

[Link]. Selección de la muestra

Después de aplicar la formula correspondiente se obtuvo el resultado de quela

población a encuestar es de 399 personas.

3.3.Métodos, técnicas e instrumentos.

3.3.1. Métodos

Para el proceso de investigación dentro del presente proyecto se hace uso del método

inductivo ya que se parte de premisas menores, es decir de temáticas más particulares hasta

llegar a un punto en específico que abarque todas las anteriormente abordadas de manera

general a través de la creación del canal digital

3.3.2. Técnicas

Dentro del presente proyecto se hace uso de la encuesta como técnica de

recopilación de datos dentro de la cual se pretende recopilar la mayor información

posible que nos sea útil para el desarrollo de nuestro proyecto.

 INSTITUTO TECNOLÓGICO SUPERIOR
45
“REPUBLICA GENERAL DE ALEMANIA”

3.3.3. Instrumentos

1. ¿Qué características consideras más importantes en un sitio web?

a) Navegación sencilla

b) Diseño atractivo

c) Carga rápida de páginas

d) Interactividad

e) Otras (especificar)

__________________________________________________________

2. De las siguientes paletas de colores cual seria de su preferencia observar dentro de un

sitio web de comunicación de eventos artísticos y culturales?

a) b) c) d)

3. Cuál de las siguientes corrientes o estilos del diseño conoce o ha escuchado en algún

momento.

a) Minimalismo
 INSTITUTO TECNOLÓGICO SUPERIOR
46
“REPUBLICA GENERAL DE ALEMANIA”
b) Diseño andino

c) Y2k

d) Ninguna de las anteriores

4. Si es de su conocimiento, de las anteriores corrientes o estilos del diseño ¿Cuál es de su

preferencia?

a) Minimalismo

b) Diseño andino

c) Y2k

d) Ninguna de las anteriores

5. ¿Prefiere que los sitios web tengan una opción de inicio de sesión o que sea accesible

sin necesidad de registrarse?

a) Prefiero tener una cuenta para acceder a funciones personalizadas

b) Prefiero navegar sin necesidad de registrarme

6. Cuál de las siguientes palabras según su criterio es mas atractiva para el nombre de la

plataforma digital.

a) Willak (Comunicar)

b) Ecos

c) Tiyana (existir)

7. ¿Consideras importante la presencia de una sección de preguntas frecuentes (FAQ) en

un sitio web?

a) Sí, siempre la consulto

 INSTITUTO TECNOLÓGICO SUPERIOR
47
“REPUBLICA GENERAL DE ALEMANIA”
b) A veces la reviso

c) No, raramente la uso

8. ¿Cuál es el dispositivo que frecuentemente usas para acceder a sitios web?

a) Teléfono inteligente

b) Tableta

c) Computadora portátil

d) Otro (especificar)

9. ¿Prefieres recibir notificaciones sobre eventos a través de correos electrónicos,

mensajes de texto u otras plataformas?

a) Correo electrónico

b) Mensajes de texto

d) Redes sociales

e) Otras (especificar)

10. ¿Qué funcionalidades adicionales te gustaría ver en un sitio web de eventos culturales

y artísticos?

a) Calendario personalizado para guardar eventos

b) Integración con mapas para direcciones

c) Enlaces a la compra de boletos

d) Sección de fotos y videos de eventos anteriores

e) Otras (especificar)
 INSTITUTO TECNOLÓGICO SUPERIOR
48
“REPUBLICA GENERAL DE ALEMANIA”

3.4. Tratamiento de los resultados

1. ¿Qué características consideras más importantes en un sitio web?

Tabla 1
Pregunta1
Opciones Porcentaje
Navegación sencilla 35%
Diseño atractivo 32.5%
Carga rápida de páginas 15%
Interactividad 12.5%
Otras (especificar) 2.5%
En esta tabla se muestran los porcentajes obtenidos en la
pregunta número uno de la encuesta.

Gráfico 1. En este gráfico se muestra el porcentaje total de personas que si

conocen un medio de comunicación enfocado en el arte y cultura y también el
porcentaje de personas que no lo conocen.

Análisis: De los resultados arrojados en esta pregunta podemos observar que la mayor
parte de las personas encuestadas considera que el elemento mas importante en un sitio
web es una navegación sencilla por lo que será un punto importante a tomar en cuenta
al elaborar la plataforma digital
 INSTITUTO TECNOLÓGICO SUPERIOR
49
“REPUBLICA GENERAL DE ALEMANIA”

2. De las siguientes paletas de colores cual sería de tu preferencia apreciar

dentro de un sitio web de comunicación de eventos artísticos y culturales.?

a) b) c) d)

Tabla 2
Pregunta 2
Opciones Porcentaje
a 37.5%
b 40%
c 10%
d 12.5%
En esta tabla se muestran los porcentajes obtenidos en la
pregunta número dos de la encuesta.

Gráfico 2. En este gráfico se muestra el porcentaje que obtuvo cada una de las
opciones de paletas de colores que se proponen.

Análisis: De los resultados arrojados en esta pregunta podemos observar que gran parte de
los encuestados eligió la segunda opción dentro de las paletas de colores propuestas, sin
embargo, la opción “C” tambien alcanza un porcentaje considerable dentro de las distintas
opciones.
 INSTITUTO TECNOLÓGICO SUPERIOR
50
“REPUBLICA GENERAL DE ALEMANIA”

3. ¿Cuál de las siguientes corrientes o estilos del diseño conoce o

ha escuchado en algún momento?

Tabla 3
Pregunta 3
Opciones Porcentaje
Minimalismo 47.5%
Diseño andino 10%
Y2k 15%
Pop art 20%
Ninguna de 7.5%
las anteriores
En esta tabla se muestran los porcentajes obtenidos en la
pregunta número tres de la encuesta.

Gráfico 3. En este gráfico se muestra el porcentaje que obtuvo cada uno de los
estilos y corrientes de diseño gráfico que los encuestados conocen.

Análisis: De los resultados arrojados en esta pregunta podemos observar que la mayor parte
de los encuestados tiene conocimiento sobre el minimalismo por lo que será un factor
importante a tomar en cuenta al desarrollar el sitio web.
 INSTITUTO TECNOLÓGICO SUPERIOR
51
“REPUBLICA GENERAL DE ALEMANIA”

4. Si es de su conocimiento, de las anteriores corrientes o estilos del diseño

¿Cuál es de su preferencia?

Tabla 4
Pregunta 4
Opciones Porcentaje
Minimalismo 66.7%
Diseño andino 15.4%
Y2k 23.1%
Pop art 33.3%
En esta tabla se muestran los porcentajes obtenidos en la
pregunta número cuatro de la encuesta.

Gráfico 4. En este gráfico se muestra el porcentaje total que obtuvo como

preferencia cada uno de los estilos de diseño.

Análisis: De los resultados arrojados en esta pregunta podemos observar que la mayor
parte de las personas encuestadas prefiere observar un estilo minimalista dentro del sitio
web por lo que será un factor importante al desarrollar el sitio.
 INSTITUTO TECNOLÓGICO SUPERIOR
52
“REPUBLICA GENERAL DE ALEMANIA”
5. ¿Prefiere que los sitios web tengan una opción de inicio de sesión o que sea
accesible sin necesidad de registrarse?

Tabla 5
Pregunta 5
Opciones Porcentaje
Prefiero tener 47.5%
una cuenta
para acceder
a funciones
personalizada
s
Prefiero 10%
navegar sin
necesidad de
registrarme

En esta tabla se muestran los porcentajes obtenidos en la

pregunta número cinco de la encuesta.

Gráfico 5. En este gráfico se muestra el porcentaje total que obtuvo cada una
de las opciones en la pregunta número 5.

Análisis: De los resultados arrojados en esta pregunta podemos observar que la mayor parte
de las personas encuestadas con un 80% prefiere no tener que realizar un registro previo para
poder navegar en un sitio web por lo que es de vital importancia no colocar este tipo de
herramientas dentro de la plataforma digital.
 INSTITUTO TECNOLÓGICO SUPERIOR
53
“REPUBLICA GENERAL DE ALEMANIA”
6. ¿Cuál de las siguientes palabras según su criterio es más
atractiva para el nombre de la plataforma digital??

Tabla 6
Pregunta 6
Opciones Porcentaje
Willak 42.5%
(Comunicador)

Ecos 40%

Tiyana (existir) 17.5%

En esta tabla se muestran los porcentajes obtenidos en la
pregunta número seis de la encuesta.

Gráfico 6. En este gráfico se muestra el porcentaje total que obtuvo cada opción
que se propone para el nombre de la marca de la plataforma digital.

Análisis: De los resultados arrojados en esta pregunta podemos observar que los encuestados
tuvieron una opinión dividida, sin embargo, el nombre con mayor cantidad de preferencia
resulto ser la palabra Quichua “Willak” con su traducción al español como “Comunicador”.
 INSTITUTO TECNOLÓGICO SUPERIOR
54
“REPUBLICA GENERAL DE ALEMANIA”
7. ¿Consideras importante la presencia de una sección de preguntas frecuentes
(FAQ) en un sitio web?

Tabla 7
Pregunta 7
Opciones Porcentaje
Sí, siempre la 25.6%
consulto
A veces la 28.2%
reviso
No, raramente 46.2%
la uso
En esta tabla se muestran los porcentajes obtenidos en la
pregunta número siete de la encuesta.

Gráfico 7. En este gráfico se muestra el porcentaje total que obtuvo cada opción
dentro de la pregunta número siete.

Análisis: De los resultados arrojados en esta pregunta podemos observar que la mayor parte
de los encuestados no usa sección de preguntas frecuentes dentro de un sitio web, por lo que
se considera el no colocar esta herramienta dentro de la plataforma digital.
 INSTITUTO TECNOLÓGICO SUPERIOR
55
“REPUBLICA GENERAL DE ALEMANIA”
8. ¿Cuál es el dispositivo que frecuentemente usas para acceder
a sitios web?

Tabla 8
Pregunta 8
Opciones Porcentaje
Teléfono 76.9%
inteligente
Tableta 0%
Computadora 20.5%
portátil
Otro 2.6%
En esta tabla se muestran los porcentajes obtenidos en la
pregunta número ocho de la encuesta.

Gráfico 8. En este gráfico se muestra el porcentaje que obtuvo cada opción

dentro de la pregunta número ocho.

Análisis: De los resultados arrojados en esta pregunta podemos observar que un gran
porcentaje de los encuestados usa únicamente el teléfono inteligente para acceder a las
plataformas web por lo que es importante enfocar en un diseño atractivo para este tipo de
dispositivo.
 INSTITUTO TECNOLÓGICO SUPERIOR
56
“REPUBLICA GENERAL DE ALEMANIA”
9. ¿Prefieres recibir notificaciones sobre eventos a través de correos
electrónicos, mensajes de texto u otras plataformas?

Tabla 9
Pregunta 9
Opciones Porcentaje
Correo 17.9%
electrónico
Mensajes de 7.7%
texto
Redes sociales 58.4%
Ninguna 15.4%
En esta tabla se muestran los porcentajes obtenidos en la
pregunta número nueve de la encuesta.

Gráfico 9. En este gráfico se muestra el porcentaje que obtuvo cada opción

dentro de la pregunta número nueve.

Análisis: De los resultados arrojados en esta pregunta podemos observar que un poco mas de
la mitad del total de los encuestados prefiere recibir notificaciones de eventos culturales y
artísticos mediante las redes sociales, por lo que es importante la creación de estos medios
para poder difundir la información.
 INSTITUTO TECNOLÓGICO SUPERIOR
57
“REPUBLICA GENERAL DE ALEMANIA”

10. ¿Qué funcionalidades adicionales te gustaría ver en un sitio web de eventos

culturales y artísticos?

Tabla 10
Pregunta 10
Opciones Porcentaje
Calendario personalizado para 27.5%
guardar eventos

Integración con mapas para 22.5%

direcciones
Enlaces a la compra de boletos 10%
Sección de fotos y videos de 37.5%
eventos anteriores
Todas las anteriores 1%
Gráfico 10. En este gráfico se muestra el porcentaje que obtuvo cada
opción dentro de la pregunta número diez.

Gráfico 10. En este gráfico se muestra el porcentaje total de personas que si

conocen un medio de comunicación enfocado en el arte y cultura y también el
porcentaje de personas que no lo conocen.

Análisis: De los resultados arrojados en esta pregunta podemos observar que la opción con
mayor cantidad de preferencia es la de sección de fotos y videos de eventos anteriores, sin
embargo, se considera que todas las opciones son importantes para la plataforma digital.
 INSTITUTO TECNOLÓGICO SUPERIOR
58
“REPUBLICA GENERAL DE ALEMANIA”

[Link] administrativo

3.5.1. Talento Humano

En la siguiente tabla se especifican todas las personas que han sido necesarias para el
desarrollo del proyecto.

Tabla 11
Talento humano
Talento humano Nombres
Investigador Rommel Izurieta
Tutor Ing. Andrés Pozo
Diseñador Rommel Izurieta
Comunicador Nicol Izurieta
Encuestados Población de la ciudad de Riobamba
En la presente tabla se muestra todo el talento humano requerido para el desarrollo del proyecto

3.5.2. Recursos físicos, técnicos y económicos

[Link]. Recursos físicos y técnicos

[Link].1. Recursos físicos

Tabla 12
Recursos físicos
Recurso Cantidad Precio Precio total
unitario

Lápices 3 $0,50 $1,50

Bocetero 1 $3,00 $3,00

Marcadores 1 $3,00 $3,00

Caja de Lápices de 1 $3,00 $3,00

color
Total $10,50
La presente tabla muestra los detalles de los recursos físicos utilizados para el desarrollo del
proyecto.
 INSTITUTO TECNOLÓGICO SUPERIOR
59
“REPUBLICA GENERAL DE ALEMANIA”

[Link].2. Recursos técnicos

Tabla 13
Recursos técnicos
Recurso Cantidad Precio Precio total
unitario

Laptop 1 $1000 $1000

Impresora 1 $350 $350

Cámara fotográfica 1 $300 $300

Total $1650

La presente tabla muestra los detalles de los recursos técnicos utilizados para el desarrollo del
proyecto.
 INSTITUTO TECNOLÓGICO SUPERIOR
60
“REPUBLICA GENERAL DE ALEMANIA”

[Link]. Recursos económicos

Tabla 14
Recursos económicos
Recursos técnicos
Recurso Cantidad Precio Precio total
unitario

Laptop 1 $1000 $1000

Impresora 1 $350 $350

Cámara fotográfica 1 $300 $300

Recursos físicos

Recurso Cantidad Precio Precio total

unitario

Lápices 3 $0,50 $1,50

Bocetero 1 $3,00 $3,00

Marcadores 1 $3,00 $3,00

Caja de Lápices de 1 $3,00 $3,00

color

Logística de
actividades

Transporte 10 $2 $20,00

Alimentación 20 $1,00 $20,00

Total $1700

La presente tabla muestra los detalles de los recursos técnicos y físicos utilizados para el desarrollo del
proyecto y un total de sus precios.
 61

1.1. Cronograma

Tabla 15
Cronograma

La presente tabla muestra las actividades que se desarrollan para la evolución y ejecución del proyecto.
 INSTITUTO TECNOLÓGICO SUPERIOR
62
“REPUBLICA GENERAL DE ALEMANIA”

CAPITULO IV
4. Marco Propositivo

4.1. Titulo

Elaboración de una plataforma digital para la proyección promoción de eventos

culturales y artísticos mediante herramientas de diseño gráfico en la Ciudad de Riobamba en

el período de noviembre 2023- marzo2024.

4.2. Objetivos

4.2.1. Objetivo general

Crear una plataforma digital para la proyección promoción de eventos culturales y

artísticos mediante herramientas de diseño gráfico.

4.2.2. Objetivos específicos

• Crear la marca y diseño global de la plataforma digital mediante software de

diseño gráfico como Adobe Illustrator.

• Crear un layout del sitio web dentro del software Adobe Illustrator para tener una

base que fundamente el diseño del proyecto.

 INSTITUTO TECNOLÓGICO SUPERIOR
63
“REPUBLICA GENERAL DE ALEMANIA”

• Editar el contenido multimedia mediante software de edición como Adobe

Photoshop para su posterior uso dentro de la plataforma digital.

• Maquetar el sitio Web mediante el uso de software de diseño web Adobe Muse.

• Generar un Hosting y realizar la publicación del sitio web mediante los diferentes

servicios web.
 INSTITUTO TECNOLÓGICO SUPERIOR
64
“REPUBLICA GENERAL DE ALEMANIA”

4.3. Desarrollo de la propuesta

4.3.1. Crear la marca y diseño global de la plataforma digital mediante software de

diseño gráfico como Adobe Illustrator.

• Exploración de iconografía dentro del diseño andino

Imagen 17. Captura de documento investigativo

• Abstracción de elementos del icono escogido

Imagen 18. Captura dentro de Adobe Illustrator

 INSTITUTO TECNOLÓGICO SUPERIOR
65
“REPUBLICA GENERAL DE ALEMANIA”

• Diseño de marca y elección de la opción más adecuada

Imagen 19. Captura de bocetos para marca

• Prueba de paletas de colores previo a la elección definitiva para la marca

Imagen 20. Captura de paleta de colores

 INSTITUTO TECNOLÓGICO SUPERIOR
66
“REPUBLICA GENERAL DE ALEMANIA”

• Creación de la portada del manual de marca

Imagen 21. Portada del manual de marca

• Descripción del logotipo de la marca

Imagen 22. Descripción del logotipo.

 INSTITUTO TECNOLÓGICO SUPERIOR
67
“REPUBLICA GENERAL DE ALEMANIA”

4.3.2. Crear un layout del sitio web dentro del software Adobe Illustrator para tener una
base que fundamente el diseño del proyecto.

Imagen 23. Captura de layouts en Adobe Illustrator

• Diseño de layout para secciones de la plataforma web dentro del software Adobe
Illustrator

Imagen 24. Captura de pantalla dentro de Adobe Illustrator.

• Diseño de la tercera ventana que contendrá información dentro de Adobe

 INSTITUTO TECNOLÓGICO SUPERIOR
68
“REPUBLICA GENERAL DE ALEMANIA”
Illustrator

Imagen 25. Captura de último layout en Adobe Illustrator

4.3.3. Tratamiento del contenido multimedia mediante software de edición como Adobe
Photoshop para su posterior uso dentro de la plataforma digital.

Imagen 26. Tratamiento de imágenes dentro de Adobe Photoshop

 INSTITUTO TECNOLÓGICO SUPERIOR
69
“REPUBLICA GENERAL DE ALEMANIA”

Imagen 27. Tratamiento de imágenes dentro de Adobe Photoshop

4.3.4. Maquetar el sitio Web mediante el uso de software de diseño web Adobe Muse.
• Dentro del software Adobe Muse se realiza el diseño de página maestra que
contiene encabezado y pie de página del sitio web.

Imagen 28. Creación de página maestro en Adobe Muse

• Maquetación de la primera sección del sitio web perteneciente a la sección de

inicio.
 INSTITUTO TECNOLÓGICO SUPERIOR
70
“REPUBLICA GENERAL DE ALEMANIA”

Imagen 29. Maquetación de sección 1 en Adobe Muse

• Colocación de imágenes y elementos textuales.

Imagen 30. Maquetación de los elementos en sección 1 en Adobe Muse

 INSTITUTO TECNOLÓGICO SUPERIOR
71
“REPUBLICA GENERAL DE ALEMANIA”

• Asignación de funciones a las imágenes con la herramienta widgets, dentro del

software Adobe Muse.

Imagen 31. Creación de widgets para galería fotográfica

• Asignación de enlaces e hipervínculos dentro de las herramientas que ofrece el

software

Imagen 32. Enlace de hipervínculos a botones en elementos de la página.

 INSTITUTO TECNOLÓGICO SUPERIOR
72
“REPUBLICA GENERAL DE ALEMANIA”

• Maquetación de la segunda sección del sitio web correspondiente a arte y cultura

Imagen 33. Maquetación de sección 2 de la página web

• Maquetación de la segunda sección del sitio web correspondiente a arte y cultura

Imagen 34. Maquetación de sección 3 de la página web

 INSTITUTO TECNOLÓGICO SUPERIOR
73
“REPUBLICA GENERAL DE ALEMANIA”

• Maquetación de la cuarta sección del sitio web correspondiente a la sección “Quienes

somos”.

Imagen 35. Maquetación sección Quienes somos en la página web.

• Maquetación de la quinta sección del sitio web correspondiente ea la sección

“Contáctos”.

Imagen 36. Maquetación de sección contactos

 INSTITUTO TECNOLÓGICO SUPERIOR
74
“REPUBLICA GENERAL DE ALEMANIA”

• Maquetación y cración de articulo informativo para la sección “evento 1”

Imagen 37. Maquetación de primer evento en la página web

• Maquetación y cración de articulo informativo para la sección “evento 2”

Imagen 38. Maquetación de segundo articulo de la página web.

 INSTITUTO TECNOLÓGICO SUPERIOR
75
“REPUBLICA GENERAL DE ALEMANIA”

• Maquetación y cración de articulo informativo para la sección “evento 3”

Imagen 39. Maquetación de tercer articulo de la página.

• Creación de puntos de ruptura en los puntos 768px y 240px de ancho dentro de la hoja
maestra.

Imagen 40. Creación de puntos de ruptura en página maestra.

 INSTITUTO TECNOLÓGICO SUPERIOR
76
“REPUBLICA GENERAL DE ALEMANIA”

• Organización de elementos dentro de los puntos de ruptura que sean necesarios.

Imagen 41. Reorganización de elementos en puntos de ruptura

• Creación de menú de acordeón usando el widget correspondiente.

Imagen 42. Creación de menú de hamburguesa en el punto de ruptura 420.

 INSTITUTO TECNOLÓGICO SUPERIOR
77
“REPUBLICA GENERAL DE ALEMANIA”

• Creación de puntos de ruptura en las páginas restantes además de organizar los

elementos para que cuadren de manera correcta dentro de la página web.

Imagen 43. Creación de puntos de ruptura en sección 1

Imagen 44. Creación de puntos de ruptura en sección 2

 INSTITUTO TECNOLÓGICO SUPERIOR
78
“REPUBLICA GENERAL DE ALEMANIA”

Imagen 45. Creación de puntos de ruptura en sección 3

Imagen 46. Reorganización de elementos en puntos de ruptura de 420

 INSTITUTO TECNOLÓGICO SUPERIOR
79
“REPUBLICA GENERAL DE ALEMANIA”

4.3.5. Generar un Hosting y realizar la publicación del sitio web mediante los diferentes
servicios web.

• Exportación del proyecto en formato HTML para su publicación en internet.

Imagen 47. Exportación de proyecto

• Publicación del proyecto en HTML dentro de un servicio de alojamiento web

(Netlify).

Imagen 48. Publicación del proyecto en internet

 INSTITUTO TECNOLÓGICO SUPERIOR
80
“REPUBLICA GENERAL DE ALEMANIA”

• Realización de la configuración y métodos de pago del dominio del sitio web

Imagen 49. Configuración del host.

• Verificación del correcto funcionamiento del sitio web en internet.

Imagen 50. Verificación del funcionamiento.

INSTITUTO TECNOLÓGICO SUPERIOR
81
“REPUBLICA GENERAL DE ALEMANIA”

Imagen 51. Verificación del funcionamiento.

Imagen 52. Verificación del funcionamiento.

 INSTITUTO TECNOLÓGICO SUPERIOR
82
“REPUBLICA GENERAL DE ALEMANIA”

5. CONCLUSIONES

• Se concluye que una comprensión detallada de las diversas plataformas de

comunicación digital así como sus características, funciones y elementos,

asegura una elección informada y estratégica para la implementación de la

plataforma en el proyecto.

• Se puede concluir que la investigación sobre diseño y creación de marca

proporciona un marco claro para el desarrollo de una identidad visual

coherente y atractiva.

• Se concluye que al obtener una comprensión profunda sobre las

manifestaciones artísticas y culturales en la ciudad y la provincia permite

integrar elementos culturales autóctonos en el diseño de la marca y desarrollo

de la plataforma, fortaleciendo su identidad y relevancia.

• Se puede concluir que en base a la investigación previa se logra desarrollar un

diseño de marca que refleja los valores e identidad del proyecto, aportando asi

también a la creación de una plataforma digital intuitiva y atractiva.

 INSTITUTO TECNOLÓGICO SUPERIOR
83
“REPUBLICA GENERAL DE ALEMANIA”

6. RECOMENDACIONES

• Se recomienda mantenerse constantemente actualizado e informado ya que las

plataformas digitales en la actualidad evolucionan rápidamente y hay que

adaptarse a las nuevas tecnologías.

• Es recomendable asegurar una coherencia visual en la creación de la marca

tomando en cuenta todos los aspectos como logotipo, colores, tipografías, etc.

Para lograr una marca que se adapte a las necesidades del proyecto.

• Se recomienda la búsqueda de colaboración de artistas y lideres culturales para

garantizar un correcto proceso de diseño y autenticidad, además de mantener un

registro actualizado de las manifestaciones de arte y cultura que se presenten en la

zona.

• Es recomendable priorizar la experiencia de usuario en el diseño de la plataforma

digital, creando una marca y una plataforma atractiva y que se adapte al publico

al que está dirigido el proyecto.

 INSTITUTO TECNOLÓGICO SUPERIOR
84
“REPUBLICA GENERAL DE ALEMANIA”

7. BIBLIOGRAFIA

• Vise, K. (2021). An Interdisciplinary Approach to Graphic Design [Un enfoque

interdisciplinario del diseño gráfico]. College of Liberal Arts. Archivado desde el

original el 14 de abril de 2021. Consultado el 13 de octubre de 2021.

• Kloss, G. (2014). Algunos apuntes históricos sobre las escuelas de diseño.

Asociación Mexicana de Escuelas de Diseño Gráfico. Archivado desde el original

el 3 de octubre de 2014. Consultado el 10 de junio de 2023.

• Emprende Causa. (n.d.). ¿Qué es el diseño de marca? Definición y características.

Emprende Causa. Recuperado de [Link]

el-diseno-de-marca-definicion-y-caracteristicas-369020

• HubSpot. (n.d.). Diseño web. HubSpot. Recuperado el 20 de marzo de 2024, de

[Link]

• Zappaterra, Y. (2008). Diseño editorial: Periódicos y revistas (1ª ed.). Barcelona,

España: Gustavo Gili, SL. ISBN 978-84-252-2148-4.

 INSTITUTO TECNOLÓGICO SUPERIOR
85
“REPUBLICA GENERAL DE ALEMANIA”

• QuestionPro. (n.d.). Marketing estratégico. QuestionPro. Recuperado el 8 de abril

de 2024, de [Link]

• Gentile, M. E. (2010). Tocapu: Escritura y textilería incaica. Espéculo. Revista de

estudios literarios. Universidad Complutense de Madrid. Recuperado de

[Link]
INSTITUTO TECNOLÓGICO SUPERIOR
86
“REPUBLICA GENERAL DE ALEMANIA”

8. ANEXOS