DISEÑO GRÁFICO

Grado en Comunicación

Prof. José Miguel Arce

28/11/2023
Diseño Gráfico
Dr. D. José Miguel Arce
Tema 3
DISEÑO DIGITAL:
experiencia de usuario, usabilidad y diseño de interfaces.
28/11/2023
TEMA 3: Diseño digital: experiencia de usuario,
usabilidad y diseño de interfaces.

3.1. Diseño gráfico asistido por ordenador.

3.1.1 Breve historia del diseño gráfico por ordenador.
3.1.2 Tipos de imágenes por ordenador.
3.1.3 Programas de tratamiento infográfico
3.2. La Web.
3.2.1 El formato virtual o multiformato.
3.2.2 Tipos de estructuras de los sitios web.
3.2.3 Partes del interface de la página.
3.2.4 Estilos visuales web.
3.2.5 El banner y sus tamaños.
3.2.6 El avatar, la imagen social y sus adaptaciones
3.2.7 Formatos de archivo web.
3.3. Net-Art y metalenguajes. *Learning by doing.
28/11/2023
28/11/2023

3.1. Diseño gráfico (asistido)

por ordenador.

El Diseño Gráfico es una disciplina que se encarga de la creación

de imágenes, textos y otros elementos visuales para comunicar
un mensaje a un público específico.
El diseño gráfico por ordenador es el uso de software
especializado para crear diseños gráficos en una computadora
OJO otra acepción: El diseño asistido por ordenador (CAD) es un
software que se utiliza para la creación, modificación, análisis y
documentación de modelos y representaciones gráficas
bidimensionales (2D) y tridimensionales (3D) de componentes u
objetos físicos.
28/11/2023
28/11/2023

Tipos de programas para diseño gráfico

Adobe Photoshop: Es uno de los programas de diseño gráfico

más populares y ampliamente utilizados en todo el mundo. Es
una herramienta de edición de imágenes que se utiliza para crear
y editar gráficos, fotografías y otros tipos de imágenes.

Adobe Illustrator: Es un programa de diseño gráfico vectorial que

se utiliza para crear gráficos vectoriales, como logotipos,
ilustraciones y diseños de impresión.

28/11/2023
28/11/2023

CorelDRAW: Es un programa de diseño gráfico vectorial que se

utiliza para crear gráficos vectoriales, ilustraciones y diseños de
impresión. Es una alternativa popular a Adobe Illustrator.

Inkscape: Es un programa de diseño gráfico vectorial de código

abierto que se utiliza para crear gráficos vectoriales, ilustraciones
y diseños de impresión. Es una alternativa gratuita a Adobe
Illustrator y CorelDRAW.

28/11/2023
28/11/2023

GIMP: Es un programa de edición de imágenes de código abierto

que se utiliza para crear y editar gráficos, fotografías y otros tipos
de imágenes. Es una alternativa gratuita a Adobe Photoshop.

Canva: Es una herramienta de diseño gráfico en línea que se

utiliza para crear diseños de redes sociales, presentaciones,
carteles y otros tipos de diseños. Es una herramienta fácil de usar
que no requiere experiencia en diseño gráfico.

28/11/2023
28/11/2023

Sketch: Es un programa de diseño gráfico vectorial que se utiliza

para crear diseños de aplicaciones móviles y web. Es una
herramienta popular entre los diseñadores de aplicaciones
móviles y web.

Figma: Es una herramienta de diseño gráfico en línea que se

utiliza para crear diseños de aplicaciones móviles y web. Es una
herramienta colaborativa que permite a los equipos trabajar juntos
en un solo diseño.

28/11/2023
28/11/2023

Affinity Designer: Es un programa de diseño gráfico vectorial que

se utiliza para crear gráficos vectoriales, ilustraciones y diseños
de impresión. Es una alternativa popular a Adobe Illustrator y
CorelDRAW.

Blender: Es un programa de modelado y animación 3D de código

abierto que se utiliza para crear animaciones, efectos visuales y
otros tipos de contenido 3D. Es una alternativa gratuita a
programas comerciales como Autodesk Maya y 3ds Max

28/11/2023
28/11/2023

Programas IA de Diseño Gráfico

Designs.ai: Esta herramienta utiliza la inteligencia artificial para

crear diseños personalizados en segundos. Ofrece una amplia
variedad de diseños, desde logotipos hasta presentaciones, y es
fácil de
Adobe Sensei: Adobe Sensei es una plataforma de inteligencia
artificial que se integra en varios productos de Adobe, como
Photoshop, Illustrator y Premiere Pro. Ofrece funciones de
automatización y mejora de la productividad para los diseñadores

28/11/2023
28/11/2023

Uizard: Uizard es una herramienta de diseño que utiliza la

inteligencia artificial para convertir bocetos en diseños digitales.
Es una herramienta útil para aquellos que prefieren dibujar a
mano alzada antes de crear diseños digitales.
Fronty: Fronty es una herramienta de diseño gráfico que utiliza la
inteligencia artificial para crear diseños personalizados en
segundos. Ofrece una amplia variedad de diseños, desde
logotipos hasta presentaciones, y es fácil de usar.
Khroma: Khroma es una herramienta de diseño que utiliza la
inteligencia artificial para ayudar a los diseñadores a encontrar
combinaciones de colores únicas y atractivas. Es una herramienta
útil para aquellos que buscan inspiración para sus diseños.

28/11/2023
28/11/2023

Programas de creación de imágenes por IA

Artguru: Artguru es un generador de imágenes en línea que utiliza
la inteligencia artificial para crear imágenes personalizadas en
segundos. Ofrece una amplia variedad de estilos, desde retratos
hasta paisajes, y es fácil de usar.
DALL·E 2: DALL·E 2 es un modelo de inteligencia artificial
desarrollado por OpenAI que puede generar imágenes a partir de
descripciones de texto.
Nightcafe: Nightcafe es una herramienta de creación de imágenes
que utiliza la inteligencia artificial para crear imágenes
personalizadas en segundos. Ofrece una amplia variedad de
estilos, desde retratos hasta paisajes, y es fácil de usar.

28/11/2023
28/11/2023

Programas alternativos a Midjourney

Stable Diffusion

Una de las mejores alternativas a Midjourney. Completamente

gratis y de código abierto, Puede mejorar con respecto al
fotorrealismo.

28/11/2023
28/11/2023

DALL-E 3
El producto más famoso de OpenAI sea ChatGPT, DALL -E3 es
su gran apuesta en creación de imágenes. Esta versión de DALL
a día de hoy es lo más competitivo con respecto al Midjourney y
Stable Diffusion. Opción de pago para lograr avances.
Produce cuatro variaciones para que puedas elegir.

28/11/2023
28/11/2023

Creador de imágenes de Bing

Microsoft se ha aliado con OpenAI. El motor de búsqueda Bing
integra GPT-4 y DALL -E3, la versión avanzada de DALL.
El procedimiento es bastante sencillo: una vez entras en Bing con
tu cuenta, dispones de 100 créditos que se reponen cada
semana.

28/11/2023
28/11/2023

Ideogram AI

Integra bien las ordenes de texto. Apariencia casi como

Midjourney y poco que envidiar a Stable Diffusion.
Es gratis y está disponible desde su página web, por lo que no
necesitas mucho para hacerlo funcionar. Muy intuitiva de manejo.

28/11/2023
28/11/2023

Openjourney
Si te gusta experimentar y ya tienes cierta experiencia en
creación de imágenes mediante prompts, Openjourney es una
fantástica opción para ti completamente gratis gracias a que se
trata de un proyecto de código abierto.
Se vale de la capacidad de procesamiento de nuestro equipo
(mejor un PC con buena gráfica tipo gaming. Emplea el mismo
sistema de Midjourney aunque con la versión anterior (dientes y
manos mejorables).

28/11/2023
28/11/2023

Leonardo AI
Leonardo AI es una herramienta de mucha calidad y
competencia. Destaca por sus filtros, pudiendo pasarle una foto y
aplicarle IA.
El proceso de registro es algo tedioso. Es recomendable para
recrear personas o ilustraciones a nivel profesional.

28/11/2023
28/11/2023

Adobe Firefly

Tiene el crédito de Adobe y el prestigio de su trayectoria.

Cuenta con el modo estándar de pasar texto a imagen y modo
“Photo Generative Fill”, que sirve para editar objetos dentro de
una foto o incluso recrearlos aunque no existan. A destacar, su
intuitiva interfaz, posibilidades dentro de su suite y facilidad de
uso.
Gratis con 25 créditos mensuales, o 4,99 dólares mensuales para
conseguir más extras y 100 créditos.

28/11/2023
28/11/2023

Wombo Dream
Wombo inicialmente conocida por permitir subir una foto y
convertirnos en estrellas de la música y otras celebrities, pero que
permite mucho más con una interfaz sorprendentemente sencilla.
Así, solo tienes que entrar a su web Wombo o descargar la
aplicación para móviles con iOS y con Android, escribir tu prompt.
Se costea mediante el servicio de imprimir abajo coste las
imágenes que generamos.

28/11/2023
28/11/2023

Starryai
Muy sencillo entrada de texto y una selección de más de mil
estilos estilos para la imagen que quieres generar. Está disponible
tanto desde la web starryai.com como en aplicación.
Tiene un Prompt Builder un estilo biblioteca para que puedas
guardar y seleccionar otros estilos para tus proyectos. Cinco
créditos diarios gratis. De pago para más operaciones.

28/11/2023
28/11/2023

Craiyon
Esta herramienta se llamaba DALL-E Mini, pero OpenAI solicitó
los derecho del nombre.
Gratuito y sin restricciones a la hora de generar contenido, cuenta
con una base de datos inferior a DALL-E, por lo que caben
esperar resultados menos precisos para detalles finos. No solo
entiende textos, sino también señales visuales.
Tres niveles de pagos que afectan a la velocidad de generación,
la cantidad de imágenes y la privacidad.

28/11/2023
28/11/2023

BlueWillow
BlueWillow posee una interface intuitiva y de fácil manejo que
puede generar cuatro imágenes con solo cinco sencillos pasos.
25 prompts gratis al día (bastante), y hay una suscripción
mensual.
Funciona muy rápido aunque no sea Midjourney..
.

28/11/2023
3.1.0 Breve historia del diseño gráfico (analógico)

El diseño gráfico es una disciplina que ha evolucionado a lo largo de la historia de la

humanidad. Desde las pinturas rupestres hasta la era digital ha desempeñado un
papel crucial en la comunicación visual.

28/11/2023
Los manuscritos ilustrados se iniciaron en el Antiguo Egipto, hacia el 2000 a. C. Con
el denominado Libro de los Muertos. En ellos se representaban los momentos más
importantes del ritual de entierro, embalsamamiento, el pesaje simbólico del alma y la
presentación ante Osiris.

28/11/2023
En la Edad Media, por ejemplo, se
encontraron los primeros textos
adornados con imágenes y
decoraciones, acompañando textos de
corte religioso.

Los libros ilustrados y manuscritos a

menudo contenían miniaturas, que eran
pinturas o dibujos de figuras, incluidas o
no en escenas o composiciones de
carácter sacro o profano. Se utilizaban
para decorar los libros y para ilustrar los
textos. Giulio Clovio fue uno de los
grandes maestros del diseño miniado.

28/11/2023
La invención de la imprenta en 1440 sería
de vital importancia para el fomento del
trabajo gráfico y la investigación de
materiales que colaboraran con la
evolución del diseño gráfico. Surgirían
especialidades y oficios específicos.

Los copistas, tipógrafos y cajistas,

alcanzarían cierta relevancia, consiguiendo
darle a las artes gráficas y a la escritura un
lugar fundamental en el desarrollo de las
sociedades. Durante el siglo XVIII, durante
la Revolución Industrial, surgió toda una
industria mecanizada que sirvió para
sembrar los rudimentos de las artes
gráficas 1. En la actualidad, el diseño
gráfico es una disciplina que se aplica en
muchos campos, desde la publicidad hasta
la creación de logotipos y marcas

28/11/2023
3.1.1 Breve historia del diseño gráfico por ordenador

El diseño gráfico por ordenador es una

disciplina relativamente nueva que se
originó en la década de 1960.

El primer sistema de diseño gráfico por

ordenador fue el Sketchpad,
desarrollado por Ivan Sutherland en el
MIT en 1963.

Se creaban dibujos y gráficos en una

pantalla de ordenador utilizando un
lápiz óptico. El diseño gráfico por
ordenador técnicamente a evolucionado
en función de los avances tecnológicos
del momento. 28/11/2023
En la década de 1970, el diseño gráfico por ordenador se popularizó gracias a la
introducción de las computadoras personales. Los diseñadores podían crear diseños en
sus propias computadoras, lo que les permitía trabajar de manera más rápida y
eficiente. En la década de 1980, la introducción de las impresoras láser permitió a los
diseñadores imprimir diseños de alta calidad directamente desde sus computadoras.

28/11/2023
En la década de 1990, el diseño gráfico por ordenador se expandió aún más con la
introducción de la World Wide Web. Los diseñadores comenzaron a crear diseños para
sitios web, lo que llevó a la creación de nuevas herramientas y tecnologías para el
diseño web. En la actualidad, el diseño gráfico por ordenador es una disciplina
omnipresente en nuestra sociedad digital. Desde los sitios web que visitamos hasta los
logotipos que reconocemos al instante, el diseño gráfico influye en nuestra vida diaria de
formas que a menudo pasan desapercibidas.

28/11/2023
Etapas del Diseño Web:

1989: El inicio. La época oscura del diseño web.

1995: Diseño con tablas.
1995: JavaScript llegó para resolver varias de las limitaciones del HTML.
1996: La era de Flash, y la libertad del diseño.
1998: El auge del CSS.
2003: La web 2.0.
2007: Diseño de grilla y framework.
2010: Diseño web adaptable, adaptado o responsivo.

28/11/2023
Es importante destacar que el diseño gráfico por ordenador no ha reemplazado
completamente el diseño gráfico tradicional. Muchos diseñadores todavía utilizan
técnicas de diseño gráfico tradicional, como la ilustración y la tipografía, para crear
diseños únicos y atractivos. Sin embargo, el diseño gráfico por ordenador ha ampliado
enormemente las posibilidades creativas de los diseñadores y ha permitido la creación
de diseños más complejos y detallados

(404) QUÉ TABLETA GRÁFICA COMPRAR 2023-2024 / Mejores Tabletas Gráficas en Todos Los Precios - YouTube

28/11/2023
Una tableta gráfica o tableta
digitalizadora es un periférico que
permite trasladar dibujos o diseños
realizados a mano y en tiempo
real al ordenador, mediante una
conexión por cable (USB) o
inalámbrica (Bluetooth)

28/11/2023
28/11/2023

3.1.2. Tipos de imágenes por ordenador

Las imágenes digitales se pueden clasificar en dos tipos:

imágenes vectoriales e imágenes de mapa de bits.
Las imágenes de mapa de bits (también denominadas imágenes
raster) son imágenes pixeladas, es decir que están formadas por
un conjunto de puntos (píxeles) contenidos en una tabla.

(404) TODOS LOS FORMATOS DE IMAGEN EXPLICADOS EN 5 MINUTOS - YouTube

28/11/2023
28/11/2023

Formatos de imágenes por ordenador.

28/11/2023
28/11/2023

JPEG (Joint Photographic Experts Group, por sus siglas en

inglés) es un método de compresión con pérdida. imágenes
escala de grises de 8 bits e imágenes de color de 24 bits.
Padecen degradación generacional cuando son repetidamente
editados y guardados

TIFF (Tagged Image File Format) es un formato flexible de mayor

calidad que usualmente usa la extensión TIFF o TIF. TIFF no es
ampliamente soportado en navegadores de web.

GIF (Formato de intercambio de gráficos) es un formato creado

por CompuServe en 1987 que codifica los colores con 8 bits. GIF
utiliza una compresión sin pérdidas denominada LZW. Debido a
sus capacidades de animación, es utilizado para proporcionar
efectos de animación de imagen sencillos
28/11/2023
28/11/2023

BMP (Windows bitmap) maneja archivos gráficos dentro de

Microsoft Windows. Típicamente, los archivos BMP aplican
compresión sin pérdida, y por tanto son archivos de gran tamaño

PNG (de Portable Network Graphics, Gráfico de Red Portátil) fue

creado como una alternativa de fuente abierta a GIF. PNG acepta
paletas de colores de 8 bits, 24 bits o 48 bits.

28/11/2023
28/11/2023

PDF (siglas en inglés de Portable Document Format, 'formato de

documento portátil') es un formato de almacenamiento para
documentos digitales independientes de plataformas de software
o hardware. Este formato es de tipo compuesto (imagen vectorial,
mapa de bits y texto).

Inicialmente desarrollado por la empresa Adobe Systems, fue

oficialmente lanzado como un estándar abierto el 1 de julio de
2008 y publicado por la Organización Internacional de
Estandarización (ISO) como ISO 32000-1

AI son el tipo de archivo vectorial nativo de Adobe Illustrator. Con

ellos, los diseñadores pueden ampliar sus gráficos, dibujos e
imágenes de forma infinita sin que ello afecte a la resolución.

28/11/2023
28/11/2023

AI son el tipo de archivo vectorial nativo de Adobe Illustrator. Con

ellos, los diseñadores pueden ampliar sus gráficos, dibujos e
imágenes de forma infinita sin que ello afecte a la resolución.

PSD (PhotoShop Document), PDD: formato estándar de

Photoshop con soporte de capas.

EPS es una versión de PostScript. Se utiliza para situar imágenes

en un documento. Es compatible con programas vectoriales y
de autoedición.

28/11/2023
28/11/2023

3.1.2. Tipos de imágenes por ordenador

Las imágenes digitales se pueden clasificar en dos tipos:

imágenes vectoriales e imágenes de mapa de bits.
Las imágenes de mapa de bits (también denominadas imágenes
raster) son imágenes pixeladas, es decir que están formadas por
un conjunto de puntos (píxeles) contenidos en una tabla.

28/11/2023
Imagen vectorial y mapa de bits

28/11/2023
Imagen vectorial

28/11/2023
Imagen mapa de bits
y vectorial

28/11/2023
CARTELES VECTORIALES

Dibujo vectorial

28/11/2023
Dibujo vectorial

28/11/2023
Dibujo de mapa de bits y dibujo vectorial

28/11/2023
28/11/2023

Las imágenes vectoriales son representaciones de entidades

geométricas. Están representadas por fórmulas matemáticas (un
rectángulo está definido por dos puntos; un círculo, por un centro
y un radio, etc.
Una imagen de mapa de bits, compuesta por píxeles, no podrá
ser sometida a dichas transformaciones sin sufrir una pérdida o
cuando se la amplía) se denomina pixelación (también conocida
como efecto escalonado).
Las imágenes vectoriales permiten definir una imagen con muy
poca información, por lo que los archivos son bastante pequeños.
Por otra parte, una imagen vectorial solo permite la
representación de formas simples. Si bien es verdad que la
superposición de varios elementos simples.

28/11/2023
28/11/2023

3.1.3. Programas de tratamiento infográfico

¿Qué es una infografía?

- Una infografía es una representación visual de información.
- El tratamiento infográfico remite a toda imagen modificada,
alterada o procesada mediante programas informáticos.

28/11/2023
28/11/2023

28/11/2023
28/11/2023

Photoshop
28/11/2023
28/11/2023

Lightroom es un estándar de
la industria para simplificar el
flujo de trabajo de los
fotógrafos profesionales y
aficionados.
Filtros especiales rápidos.
Además, el nuevo desenfoque
de lente te permite crear
efectos de retrato
espectaculares al instante.

Lightroom
28/11/2023
28/11/2023

GIMP es un programa de
diseño gráfico de uso
sencillo, gratis y además en
español. Es el editor de
imágenes libre y gratuito por
excelencia, disponible para
Sistemas Operativos
Windows, Linux y Mac. Con
GIMP se puede diseñar
logos, banners, crear iconos,
dibujar, colorear tus
creaciones.

Gimp
28/11/2023
28/11/2023

Photo MAC
28/11/2023
28/11/2023

Adobe Bridge es un potente

gestor de activos creativos de
diferente formato. Se puede abrir
en él múltiples archivos, con alta
compatibilidad. Puedes añadir a
los activos palabras clave,
etiquetas y calificaciones.
También puedes colaborar con
Bibliotecas Creative Cloud y
publicar en Adobe Stock
directamente desde Bridge.

Bridge
28/11/2023
28/11/2023
28/11/2023

3.2. La Web

28/11/2023
28/11/2023

3.2.1 El formato virtual o multiformato.

Requerimientos de diseñar sobre la pantalla:

- Equilibrio: El equilibrio visual significa asegurarse de que ninguno de

los elementos de una misma composición sea demasiado
predominante.
- Contraste: El contraste se refiere a la disposición de elementos
opuestos de manera que se destaquen sus diferencias: oscuro y claro,
suave y áspero, grande y pequeña.
- Coherencia: El diseño debe estar adaptado a la imagen de la
empresa.

28/11/2023
28/11/2023

- Estructura de navegación: Una estructura que facilite la

navegación de los usuarios.
- Dinamismo: Un correcto uso de los elementos dinámicos.
- Tiempo: Un tiempo de carga realmente bajo.
- Adaptabilidad: El diseño debe ser adaptable a diferentes
tamaños de pantalla y dispositivos.
- SEO: El diseño debe ser optimizado para motores de búsqueda
para mejorar la visibilidad de la página web.

28/11/2023
Estructura y funcionamiento de los sitios web (yumpu.com)

28/11/2023
28/11/2023
28/11/2023
28/11/2023
28/11/2023
28/11/2023

3.2.3 Partes del interface de la página

1. Cabecera o header: Se encuentra en la parte superior de la página y

generalmente contiene el logo de la marca, el título de la página y
algunos botones de navegación. A veces, en el header se utiliza un
pequeño banner publicitario.
2. Cuerpo o body: Contiene todo el contenido visible de la página, es
decir, todo lo que se muestra en pantalla cuando se accede a la misma.
Se encuentra entre la sección de head y el footer. Su contenido puede
incluir texto, imágenes, videos…
3. Pie o footer: Es la parte inferior de la página web. Generalmente,
contiene enlaces a otras secciones del sitio web, información de
contacto, derechos de autor, etc.

28/11/2023
Estructura “clásica” de la apariencia gráfica externa o interface.

28/11/2023
28/11/2023
Diseño estático: es un tipo de diseño y programación frontend totalmente en desuso.
Diseño elástico: se adapta en cuanto al tamaño del texto cuando el usuario lo requiera,
pero no cuando se cambie el dispositivo.
Diseño fluido o líquido: se adapta al tamaño de la pantalla del dispositivo.
Diseño polivalente (responsivos): se adapta a cualquier tamaño de pantalla,
independientemente del dispositivo. Espero que esto te haya ayudado.

(330) Funcionamiento del diseño web fluido, adaptativo y responsivo - YouTube

28/11/2023
28/11/2023

3.2.4 Estilos visuales web.

*Algunos de los mejores diseños web*

Home - Eat Genesis.
Chef | Jean François Bury | Nanterre (jeanfrancoisbury.com)
Home | ametscontese
Active Theory / Work
La Galería Poco Convencional (ruinart.com)
KPR | Story (kprverse.com)
Descubre Cevitxef Bilbao
Netflix | The Witcher | Welcome to the Continent
(witchernetflix.com)
28/11/2023
21 tendencias de diseño web que
no debes perder de vista en 2023
(hubspot.es)

28/11/2023
21 tendencias de diseño web que
no debes perder de vista en 2023
(hubspot.es)

28/11/2023
28/11/2023

3.2.5 El banner y sus tamaños o nombres

Banners estáticos: Son una imagen inmóvil de un tamaño
particular, con un mensaje comercial fijo junto con una llamada a
la acción (CTA).
GIF animados: Son conjuntos de imágenes en formato .gif que
se reemplazan continuamente dentro del área del anuncio,
simulando así movimiento.
Anuncios HTML: Este es el tipo de anuncio gráfico más
avanzado que ha expulsado casi por completo al resto de los
competidores del mercado. En esencia, un banner HTML5 es un
sitio web en miniatura.

28/11/2023
28/11/2023

28/11/2023
28/11/2023

28/11/2023
28/11/2023

Robapáginas: El más usado en internet. Se inserta dentro del

contenido de texto o al final de los artículos.
Leaderboard o banner de 728x90: Alargado y estrecho, funciona
bien cuando se sitúa sobre el contenido principal (en la parte
superior de la web) o en los foros.
Skyscrapper: Este banner tiene un diseño vertical, muy
adecuado para ser colocado en los laterales de las páginas web.
Intersticiales: Este tipo de banner se utiliza para los anuncios de
pantalla completa. Solo es compatible con aplicaciones para
móviles y de que percibe como muy invasivo por los usuarios.
Botones: Pueden ser de diferentes tamaños, como 125x125,
120x60 o 88x31. Se adaptan a espacios pequeños pero son muy
simples en el diseño y solo pueden admitir texto e imágenes no
animadas.

28/11/2023
28/11/2023

3.2.5 El avatar, la imagen social y sus adaptaciones.

AVATAR: Representación gráfica que se asocia a un usuario para su

identificación en el mundo virtual. Fotografías, dibujos o incluso
representaciones tridimensionales.
Una imagen virtual similar a la humana que nos representa en el
ciberespacio.
Estilos: gráfico vectorial, gif (animado o no), ilustrativo, artístico,
pixelart, manga, comic, realista, icónico, fotográfico, 3D, etc.
Según estudios psicológicos las imágenes que elegimos refuerzan
nuestra identidad interna y seguridad. Puede influir en nuestros
comportamientos y decisiones
En redes sociales y plataformas, se usan como fotos de perfil,
sticker e, incluso, como modo de hacer llegar un mensaje
desde el anonimato.
28/11/2023
28/11/2023

Tipos de avatares

En videojuegos: Han sido creados por los desarrolladores de juegos

para representar la figura principal de cada jugador. Avatares 3D de
Second Life. En multiversos se emplean avatares que nos representan
de modo realista o simbólico.
En foros de discusión: Son imágenes de dimensiones reducidas en
formatos jpg, png o gif.
En mensajería instantánea: Son imágenes personales como la gran
mayoría utiliza en el WhatsApp.
Gravatar: Es una imagen que aparece junto a tu nombre cuando
escribes comentarios o noticias en un blog. Los avatares ayudan a
identificar tus mensajes en los blogs y los foros. De uso común en
páginas webs WordPress.

28/11/2023
28/11/2023

28/11/2023
28/11/2023

Programas para la creación del AVATAR

PhotoDirector con tecnología IA y efectos artísticos.

Lensa con efectos de magia, filtros y stickers.
Picsart, creador de avatares con opciones de dibujo y collage.
Prequel, con arte IA y efectos de realidad amplificada.
Facetune, editor IA de foto-video para mejorar tu aspecto.
Photoleap: editor IA de fotos que te permite combinar imágenes muy personalizados.
Dawn AI: Crea avatares con IA a partir de tus selfies o fotos.
Avatar Sizer: Crea un avatar simple para Windows. Se especializa en el tamaño.

28/11/2023
28/11/2023

3.2.6 Formatos de archivo en el diseño web

HTML (HyperText Markup Language): Es el lenguaje estándar para documentos mostrados en un navegador
web. Se utiliza para estructurar el contenido en la página.
CSS (Cascading Style Sheets): Este lenguaje para describir la apariencia o el estilo de un documento escrito en
HTML. Cuida el diseño y el aspecto visual del sitio web.
JavaScript: Lenguaje de programación para lograr interactividad en la web.
JPEG, PNG, GIF: Son formatos de imagen comunes en la web. JPEG imágenes y GIF animaciones.
SVG (Scalable Vector Graphics): Formato de gráficos vectoriales que puede escalar a cualquier tamaño sin
perder calidad. Es útil para iconos y gráficos de alta calidad.
WebM, MP4: Son formatos de video que se utilizan en la web. MP4 es un formato de video compatible con la
mayoría de los navegadores.
WAV, MP3: Son formatos de audio utilizados en la web. WAV, mientras que MP3 comprimido.
JSON (JavaScript Object Notation): Formato de intercambio de datos ligero que es fácil para los humanos leer y
escribir. Transmite datos entre un servidor y una página web.
XML (eXtensible Markup Language): Es un lenguaje que define reglas para codificar documentos de manera que
sean legibles y procesables por el sistema.
PHP, ASP, JSP: Son lenguajes de programación del lado del servidor utilizados para generar contenido web
dinámico.

28/11/2023
28/11/2023

3.2.7 Net-Art y metalenguajes.

28/11/2023
28/11/2023

Qué es el NET ART

Net.art, conocido como arte.en.red o simplemente Net art –sin punto-, es un género de
piezas artísticas realizadas exclusivamente para internet.
Movimiento artístico introducido por artistas de origen europeo en la década de los
noventa, que cohetáneos con la eclosión de la World Wide Web.
Es una forma de arte sea interactivo o no, realizada por sus autores los net.artistas
El Net.art usa internet como medio, fin o eje conceptual que articula la obra.
La pieza toma los recursos o datos de la red para producir la obra: desde información
del usuario, uso de programación en el servidor, formularios, correo electrónico, etc.

OBSERVACIÓN: No todo lo artístico en internet es NetArt. Todo caso que emplee

internet como medio de difisión secundario y que no es la obra de arte por si misma no
es NETART. (webs de museos, galerías…).

28/11/2023
28/11/2023

Piezas Net.art y Net.artistas

“My Boyfriend Came Back From The War” de Olia Lialina.
Net Art: Cinco Obras De Olia Lialina Que Debes Conocer – Equltura

“Code Up” de Giselle Beiguelman.

Zomm_RGB_UP - Built with Processing (meiac.es)

“ASCII-Art Zebra Image” de Leonid Peshkin.

“Moon” de Olafur Eliasson.

Studio Olafur Eliasson

“Cine interactivo en 3D en Internet” de David Blair.

Cómo se hizo 'Bandersnatch', la película interactiva de Netflix (hipertextual.com)

Creacion Hibrida | NET ART EL ARTE EN RED 28/11/2023

28/11/2023

Piezas Net.art y Net.artistas

Artistas destacados en Net.Art:

Olia Lialina
Jodi
Mark Amerika
Gustavo Romano
Brian Mackern
Arcángel Constantini

28/11/2023
GRACIAS

28/11/2023