1

SENA CENTRO DE COMERCIO Y SERVICIOS REGIONAL BOLIVAR

TECNÓLOGO EN PRODUCCIÓN DE MULTIMEDIA
FICHA 234873

AP3-AA7-EV6: Conceptos básicos de interfaz gráfica

Presentado a la Instructora: Aura Beleño

Presentado por:
Helena Yurani Galeano González
Yesica Lorena Hinojosa Caicedo
Sara Catalina Serna Betancur
Christian David Ramírez Sánchez
Larry Guillermo Valencia Chara
Freddy Pacheco Baquero

Bogotá Febrero 18 de 2022

 2

Introducción:

El siguiente trabajo corresponde a la fase de planeación en donde seguimos creando el

documento para la estructura y creación de producto multimedia y en el cual estamos
asociados como grupo de estudio GAES y somos una agencia de producción multimedia a
la cual nos ha sido encomendado un trabajo de posicionamiento de marca por medio de un
video y de su página web en Instagram, nuestro cliente Indigo Jeans al que ya en la fase de
análisis le hemos venido desarrollando todo este proceso de posicionamiento de un
producto moda en un mercado especifico en donde ella interactúa desde ya hace algún
tiempo y quiere expandir su negocio a un target más objetivo y joven con una colección
moda moderna.

En este trabajo vamos a hablar específicamente sobre la interfaz del ´producto creado por
nosotros como agencia de publicidad y producción multimedia para ellos, presentamos aquí
todos los recursos necesarios para que el cliente entienda como y de donde han salido las
ideas que como equipo hemos venido consolidando y desarrollando a lo largo del proceso
de análisis y ahora en la etapa de planeación.

Una interfaz de usuario es un medio a través del cual una persona puede controlar un
software o hardware específico. Lo ideal es que las interfaces de usuario sean fáciles de
usar para que la interacción sea lo más instintiva e intuitiva posible. En el caso de los
programas informáticos, esto se denomina interfaz gráfica de usuario.

La interfaz gráfica de usuario (Graphical User Interface) es la interfaz más utilizada en la

mayoría de las aplicaciones de software modernas. Se refiere a la ventana que contiene
todos los elementos del software. La interacción del usuario se produce a través del ratón y
el teclado. También se pueden utilizar botones y menús en la ventana del software. Esta
ventana es la interfaz entre el usuario y el software. Los elementos típicos, como las barras
de herramientas, también son comunes. Tales elementos también permiten un proceso algo
similar a través de diferentes sistemas operativos para interacciones comunes. El diseño de
una interfaz gráfica de usuario puede determinarse con la ayuda de un diseño de pantalla.
 3

AP3-AA7-EV6: Conceptos básicos de interfaz gráfica

Interfaz de usuario o UI: ¿qué es y cuáles son sus características?

La interfaz de usuario o UI (User Interface) es un concepto que abarca arquitectura de

información, patrones y diferentes elementos visuales que nos permiten interactuar de
forma eficaz con sistemas operativos y Softwares de diversos dispositivos

Imagen extraída de https://www.google.com/search?

q=que+es+la+interfaz+de+un+proyecto+multimedia&tbm=isch&source=iu&ictx=1&fir=PYU9__IUn
FFvPM%252CKVSp2fyKN81KyM%252

¿Qué sería de nuestra vida sin la interfaz de usuario? Se trata del medio que nos permite
interactuar y comunicarnos con nuestra laptop, teléfono inteligente, tableta y muchos otros
dispositivos que forman parte del día a día de ciudadano del siglo XXI.

En esta época de transformación digital, resulta muy importante conocer de qué se trata este
elemento y cuáles aspectos lo caracterizan.

¿Qué es la interfaz del usuario o UI?

 4

De forma sencilla, podemos definirla como el medio a través del cual el

usuario interactúa con un dispositivo tecnológico. Esto abarca todos los
puntos de contacto entre la persona y el equipo. Para comprenderlo mejor,
debemos estar conscientes de que cada vez que abrimos el correo
electrónico, realizamos una transferencia electrónica, enviamos un emoticón
o cualquier otra acción similar estamos comunicándonos con un software y
sistema operativo. Básicamente, transmitimos o señalamos lo que deseamos
hacer y este responde. Esto lo permite la interfaz del usuario. (Juan Andres
Corrales, 2019)

Existen 3 tipos de interfaz de usuario según su diseño y propósito:

Interfaz de hardware

Engloba todos aquellos elementos que permiten ingresar, procesar y entregar datos, como
los famosos teclados y “ratones”, así como las pantallas.

Interfaz de software

Es aquella que brinda información sobre los procesos y herramientas de control, la cual
puede ser observada fácilmente por el usuario en la pantalla de su dispositivo.

Interfaz software-hardware

Dentro de la interfaz del usuario, esta es la que sirve de puente entre la máquina y las
personas. Genera un círculo virtuoso en el cual el dispositivo comprende las instrucciones
del individuo y, a su vez, este entiende la información del aparato, a través de la traducción
del código binario a elementos simples. Además, la interfaz del usuario puede clasificarse
de acuerdo a la forma en que interactúa con el hombre.

Bajo este esquema, podemos afirmar que existen interfaces de línea de comandos, gráficas
de usuario y natural de usuario.
 5

La interfaz de línea de comandos es alfanumérica, es decir, solo presenta texto, mientras

que las interfaces de gráficas del usuario representan visualmente los elementos de control
y medida para optimizar la comunicación con el usuario y, en general, la experiencia de
este.

En cuanto a la interfaz natural de usuario, son aquellas que conectan de manera directa al
hombre y la máquina. Las pantallas táctiles y las herramientas de reconocimiento del habla,
como Siri y el Asistente de Google, son muy buenos ejemplos.

Características de la interfaz de usuario?

Ahora que sabes qué es la interfaz del usuario y cuáles son sus tipos, llegó el momento de
que eches un vistazo a sus principales características y valores:

Claridad

Una buena interfaz transmite la información de manera precisa para evitar que el usuario
cometa errores durante la interacción.

Concisión

Se trata de darle al usuario solo la información que necesita y pide.

Coherencia

Esta característica es la que hace intuitiva una interfaz, permitiéndole a la persona crear
patrones de uso de manera sencilla y práctica.

Flexibilidad

Una buena interfaz también se caracteriza por permitir que el usuario restaure elementos y
deshaga acciones.

Atractivo visual

Cuando se trata de experiencia del usuario, nunca puede subestimarse la importancia del
atractivo visual. Además de tener grandes funcionalidades, una buena interfaz es agradable
a la vista.
 6

A través de estas características se logra que el usuario realmente tenga una conexión
con algún dispositivo tecnológico y, por supuesto, lo prefiera ante otras alternativas
similares.

¿Cómo funciona el diseño de una interfaz de usuario?

El diseño de la interfaz del usuario debe estar desarrollado bajo altos estándares de calidad.
De hecho, existen parámetros internacionales y mundiales sobre las buenas prácticas para
desarrollar este elemento.

Quizás, el estándar más conocido y seguido es la norma ISO 9241, que se centra en la
ergonomía de la interacción entre la persona y el sistema, específicamente en aspectos
como la facilidad de la comunicación y el dinamismo.

Dentro de una página web, aplicación o cualquier herramienta digital, el diseño de la

interfaz del usuario debe garantizar tolerancia a los errores, personalización, control,
adecuación al aprendizaje y, sobre todo, conformidad con las expectativas del usuario.

Además, el diseño de una interfaz busca la adecuación a la tarea y la auto descripción.

Asimismo, existen principios de coherencia y calidad gráfica que deben seguirse para
desarrollar una interfaz, como emplear códigos de colores para apoyar las tareas de los
usuarios, minimalismo y estandarización.

¿Cómo se relacionan la interfaz de usuario y la experiencia del usuario?

La experiencia del usuario hace referencia a la manera en que una persona percibe y siente
su interacción con algún canal online, principalmente una página web o blog.

Entre otras cosas, este concepto es esencial para las estrategias de marketing digital
Además de genera contenidos de calidad y tácticas de atracción, esta metodología debe
estar acompañada de diseños y programaciones agradables, intuitivas y eficientes.

Precisamente, esto es lo que relaciona la experiencia del usuario con la interfaz del usuario
y lo que en la creación como grupo GAES hemos tenido en cuenta para la creación de
contenido gráfico de la firma Indigo Jeans
 7

Si la interfaz no es de calidad y carece de las características que hemos explicado en este

material, lamentablemente la experiencia no será gratificante.

No olvidemos que es a través de una buena interfaz que la experiencia e interacción resulta
satisfactoria e, incluso, natural.

Imagenes extraída de: https://www.google.com/search?

q=interfaz+de+usuario+ejemplos&tbm=isch&hl=es-
419&sa=X&ved=2ahUKEwiL2pSco8T0AhWjfN8KHaDqA6kQrNwCKAB6BQgBEOUB&b
 8

“Estamos en una época de transformación digital, donde resulta importante conocer la

interfaz de usuario, de qué se trata, cuáles son los aspectos principales que lo caracterizan”.
(Anabel Castro, 2021)

La interfaz de usuario, también conocida como User interface (UI) abarca los recursos,
sistemas y metodologías que facilitan la interacción de las personas con computadoras,
dispositivos y otras máquinas. El objetivo es que el usuario pueda comunicarse de una
forma más sencilla, amigable e intuitiva, ofreciendo una experiencia positiva. Sea quien sea
el usuario, cuanto más intuitivo y accesible sea el diseño, mucho mejor y por ello como
agencia de publicidad y producción GAES hemos diseñado una interface que sea amigable
con el usuario y target de la marca Indigo Jeans que fue quien nos contrato para realizar su
posicionamiento de marca en redes sociales en su caso específico Instagram en donde
ofreceremos con la interfaz de usuario una experiencia única y agradable con el cliente de
la marca actual y con los clientes potenciales que están afuera esperando una experiencia
única de compra a traves de la red y de sus tiendas físicas en los mercados en los cuales
esta interactúa.
 9

Imagen extraída de: https://interfaz.io/tips-para-desarrollar-una-buena-interfaz-de-usuario/

Cuando las personas escuchan hablar sobre la interfaz de usuario, muchos

desconocen que es sencillamente algo que se encuentra entre dos caras
pensada como terminales de comunicación de un sistema, y se utiliza para
hacer que este se comunique con el otro. Conceptualmente puede ser un
intérprete, un traductor simultáneo, un mediador cultural; pero técnicamente
es un dispositivo que hace que un sistema sea compatible con el otro, al
menos en el punto de contacto en los dos lados de la interfaz. (Digital, 2020)

Las funciones principales de una interfaz del usuario son básicamente las siguientes:

Comunicación con otros sistemas

Configuración de la propia interfaz y entorno

Intercambio de datos entre aplicaciones

Control de las funciones manipulables del equipo

 10

Manipulación de archivos y directorios

Puesta en marcha y apagado

Control de acceso

Información de estado

Sistema de ayuda interactivo

Herramientas de desarrollo de aplicaciones

Imagen extraída de: https://blog.hubspot.es/marketing/interfaz-usuario

 11

Imagen extraída de https://blog.hubspot.es/marketing/interfaz-usuario

Los 3 tipos de interfaces de usuario que existen

Una interfaz de usuario consta de dos componentes: el lenguaje de presentación, que se

refiere a la transacción de la computadora hacia la persona, y el lenguaje de acción, que se
caracteriza por ser la interacción de la persona con la computadora. Existen tres tipos de
interfaces comunes:

1. Interfaz de lenguaje natural

Las interfaces de lenguaje natural son el sueño de los usuarios no especializados, ya que
permiten la comunicación entre humanos y máquinas mediante un lenguaje cotidiano o
natural. Es decir, el usuario no requiere habilidades especiales para controlarla. Un ejemplo
es Alexa, que cuenta con un software basado en modelos acústicos y del lenguaje.
 12

2. Interfaz de preguntas y respuestas

Esta es una de las interfaces más utilizadas por los usuarios. En ella, la pantalla muestra una
pregunta al usuario. Para interactuar, este ingresa una respuesta (a través del teclado o
haciendo clic con el mouse), y la computadora actúa sobre esa información de una manera
reprogramada, generalmente pasando a la siguiente pregunta.

Los asistentes que se usan para instalar software son un ejemplo común de una interfaz de
pregunta y respuesta. El usuario responde las preguntas acerca del proceso de instalación,
tales como dónde instalar el software o sus características.

3. Interfaz gráfica de usuario:

Conocida también como GUI (del inglés Graphical User Interface), utiliza imágenes,
iconos y menús para mostrar las acciones disponibles en un dispositivo, entre las que el
usuario puede escoger.

La interfaz gráfica de usuario de escritorio de Windows o Mac OS son ejemplos muy

populares de GUI, que reemplazaron la comunicación mediante comandos de texto y
código binario por elementos gráficos, hoy generalizada en la mayoría de equipos.

¿Cuál es la relación entre el diseño y una interfaz gráfica?

 13

Por lo general, el diseño de interfaces de usuario es una actividad multidisciplinar que

involucra varias áreas, tales como el diseño gráfico, el diseño industrial, el diseño web, el
diseño de software y la ergonomía.

La interfaz gráfica de usuario está totalmente presente en nuestro día a día: cuando
visitamos una página web, cuando abrimos un programa en nuestro ordenador o una app en
nuestro Smartphone.

Un buen diseño de interfaz gráfica debe adaptarse a la experiencia y seguir como modelo
los diseños de otras aplicaciones que han tenido éxito y han sido comúnmente aceptadas.

Por ello como agencia de publicidad GAES hemos tenido en cuenta para el desarrollo de la
imagen y posicionamiento de nuestro cliente Indigo algunas recomendaciones que les
permitirán como marca mantenerse por delante de su competencia inmediata en el mercado
de moda nacional y que ella como marca comprenda a sus consumidores para que cree con
nuestra ayuda en su página de Instagram una experiencia de navegación agradable para su
target que se centre en resolver sus necesidades para que los usuarios quieran volver.

1. Como agencia y en acuerdo con nuestro cliente elegimos un diseño adecuado:

Ya sabemos lo que dicen: de la vista nace el amor. Tal vez la marca registraste una gran
cantidad de tráfico en su sitio, pero ¿de qué sirve si los visitantes no están impresionados y
deciden irse?

Podemos reducir esta tasa de rebote si optimizamos las landing pages. Esto implica
implementar páginas fáciles de navegar y con un tiempo de carga rápido. El 70 % de los
usuarios de una app la abandonan si no carga rápidamente y 53 % abandonan una página
web si tarda más de tres segundos en cargarse. En la actualidad, las personas no tienen la
paciencia ni la disposición para esperar a que se cargue una página lenta.

La coherencia es otro punto importante. Por ello debemos vincular el contenido de su sitio
y no saturar las paginas con material innecesario. Se debe Mantener sencillo y fácilmente
accesible.

2. Incluir llamados a la acción (CTA)

 14

El llamado a la acción tiene un alto impacto en la tasa de conversión, por eso es importante
optimizarlo. Es la forma más efectiva y directa de pedirle a un usuario que dé el paso
siguiente.

Los detalles son importantes al diseñar un llamado a la acción convincente. El uso de

ciertos colores y fuentes tipográficas son factores esenciales para que tenga éxito.
Asegurarnos de que sea claro y distintivo para que capte la atención del usuario.

3. Comprender a nuestro cliente

Para mejorar la experiencia del usuario es esencial contar con una buena optimización del
sitio en todos los dispositivos y un diseño web bien pensado. Las estrategias y objetivos de
nuestra empresa deben construirse teniendo en cuenta al consumidor y usuario final.

Es esencial que conozcamos a nuestro cliente, qué busca y cómo lo obtiene. Herramientas
como Google Analytics proporcionan información útil sobre lo que quieren nuestros
usuarios. Utilizar estos datos para comprender mejor el recorrido del cliente y las partes que
nuestro sitio está resolviendo con éxito.

4. Adoptar estrategias omnicanal

Es fundamental que nuestra marca optimice su sitio web para las capacidades de canales
cruzados, especialmente para dispositivos móviles, si queremos mantenernos a flote en el
mundo digital.

Adoptar una perspectiva omnicanal y crear una experiencia fluida en todos los canales. De
este modo aseguramos que la experiencia del usuario sea lo más fácil posible, e
impulsamos la tasa de retorno del cliente y, en última instancia, la conversión, ósea clientes
fieles a la marca en este caso Indigo Jeans.

5. Añadir formularios

Simplificar los formularios. Los usuarios de dispositivos móviles buscan comodidad y si

requieren 5 minutos de su tiempo para completar un formulario, los perderás. Es mejor que
utilicemos cuestionarios breves y con elementos gráficos que permitan su comprensión y
una respuesta fácil.
 15

6. Brindar apoyo al usuario

Optimizar la experiencia del usuario les traerá resultados gratificantes. Es fundamental estar
presente para sus consumidores desde el principio hasta el final. Localizar los puntos
débiles que sus clientes puedan encontrar en el viaje por el sitio. Brindar apoyo durante y
después de su visita; esto les dice a sus clientes que nos preocupamos por ellos y que
pueden confiar en nuestra marca y su sitio web.

Una buena interfaz permite a los usuarios alcanzar aquello que buscaban cuando llegaron a
nuestro sitio web; el propósito de su sitio es que lo obtengan con facilidad y sin
confundirse. Para evaluar si una interfaz de usuario es buena debe considerar si es
visualmente atractiva con una experiencia intuitiva y directa que es en lo que Agencia de
publicidad GAES lo orientara.

CONCEPTO DE INTERFAZ GRÁFICA PARA LA MARCA INDIGO:

Por qué nos gusta la interfaz de usuario de Nike:

Muestra los productos de una forma atractiva. Además de presentar el producto, ofrece
combinaciones con otros artículos que invitan a comprar un atuendo completo.
 16

Da información para comprender mejor cómo lucen sus prendas, al ofrecer puntos de
referencia como la estatura de los modelos y las tallas que visten en la fotografía.

Es sencillo seleccionar tallas y colores para ir rápido a la cesta de compra.

Concepto de Diseño para la Marca Indigo Jeans:

Esta imagen representa un ejemplo de las tantas que podríamos crear para la marca en letra
Arial o Colibrí sobre un fondo morado a lila casi indigo de una forma muy orgánica que
impacta por su estructura y sobre ella el nombre o logo de la marca Indigo y abajo en letra
blanca una frase que hace alusión a la combinación de colores. Esta seria puesta en
Instagram como ustedes lo piden y se renovaría de acuerdo a cada temporada.
 17

En este caso creamos un anuncio para Instagram en el cual nueva mente el encabezado es el
Nombre de la Marca en color Azul, en el centro el nombre de la campaña y a un costado en
letra azul mayúscula el slogan de marca para esta campaña. Como botón de la interface se
colocara el carrito de compra u otro icono relevante que nos lleve a mas fotos de esta
campaña o directamente a la compra en la tienda online.

Encabezado:

En el encabezado tendremos el nombre de la empresa “INDIGO JEANS” que se ubicara en

la parte superior o inferior de acuerdo a la campaña, ósea el logo.

Barra de navegación:

Contendrá toda la información requerida por el cliente a cerca de la empresa, misión,

visión, valores, etc. En el caso de los anuncios una imagen interactiva que llevara al cliente
a la historia de la marca y al video promocional de la campaña en moda y lo más
importante a la compra interactiva en la tienda online.
 18

Servicios:

Se muestra el portafolio de servicios de Indigo Jeans y sus valores corporativos y

empresariales como visión, misión y valores. Estos serán presentados en un botón con el
cual el cliente al hacer click podrá desplegar toda la información en la página web.

Consejos:

Consejos para mejores resultados al construir imagen de marca y del producto hacia el
cliente

Búsqueda:

El cliente tendrá la opción de buscar por frases o una palabra dentro de la página web.
Galería de imágenes. Slide que muestran imágenes de actualidad en Indigo Jeans.

Vídeos:

Se mostrarán algunos procesos de la empresa y temas de actualidad. Mensajes que ayuden

al cuidado del medio ambiente y de las prendas.

Esta será una interfaz por el cual será fácil de navegar y brindará al visitante toda la
información de manera sencilla, se trabajará con un modelo sencillo (minimalista) y
elegante. Elementos de identificación: la ubicación de estos elementos ayudan a identificar
fácilmente el sitio web de la marca.

Logotipo de la marca:

Al situarse en la parte superior izquierda de la página, generará relación con el nombre el

cual estará de forma llamativa con una tipografía de mayor tamaño, esto ayudará a generar
una recordación y relación entre logo y nombre. Como lo vemos en los ejemplos de videos
y anuncios. Además incluimos un documento en el que se analizan las diferentes formas de
hacer anuncios de marca sus tipografías y mensajes según el recurso gráfico en la moda. La
tipografía se acondicionara de acuerdo a cada tendencia e la moda y a cada colección de la
marca.

Elementos de navegación:
 19

Estratégicamente ubicados en la parte superior, estos ayudan a que el visitante se desplace

fácilmente por las secciones de la página encontrando de esta manera el contenido de su
interés. Barra de menú horizontal agrupaciones secciones de la página a la cual se puede
acceder con un clic, de esta manera se resalta la usabilidad de la página.

Hipervínculo e hipertexto:

Permite que al dar clic en una imagen o un texto, este redireccione al usuario para obtener
más información relacionada con la colección de su interés o de la organización como tal.

Elementos de interacción:

estos permitirán que el usuario se comunique con INDIGO JEANS brindando la confianza
deseada por el cliente, también brindarán mayor comodidad a la hora de buscar contenido
en la página logrando cautivar su atención y siempre esta página será renovada de forma
muy creativa, por ejemplo, la barra de búsqueda dentro de la página permitirá que la
persona busque contenido, se centre o siga con una palabra o frase completa que lo
direccionen en su búsqueda; la opción de ayuda brindará la posibilidad de despejar dudas
con respecto a la búsqueda dentro de la página y mucho más. Estos permitirán que el
usuario se comunique con Indigo Jeans brindando la confianza deseada por el cliente,
también brindarán mayor comodidad a la hora de buscar contenido en la página, por
ejemplo, la barra de búsqueda dentro de la página permitirá que la persona busque
contenido de moda.

Relación en una palabra o frase completa

La opción de ayuda brindará la posibilidad de despejar dudas con respecto a la búsqueda

dentro de la página y mucho más. Estos permitirán que el usuario se comunique con Indigo
brindando la confianza deseada por el cliente y resolviendo dudas sobre su producto o sobre
una pieza especifica de la colección que se esté mostrando y sea del interés del consumidor
o target de marca, también brindarán mayor comodidad a la hora de buscar contenido en la
página, por ejemplo, la barra de búsqueda dentro de la página permitirá que la persona
busque, pregunte o aprenda, relacione en una palabra o frase completa una pregunta y esta
le sea respondida al instante; la opción de ayuda brindará la posibilidad de despejar dudas
 20

con respecto a la búsqueda dentro de la página y mucho más intereses que tenga su
audiencia objetivo con respecto a la marca.

Organización de contenido:

el contenido de la página estará organizado por interés y fecha de creación. Etiquetado y

navegación: hipervínculos e hipertextos que brindarán acceso fácil al contenido.
CONCEPTOS BÁSICOS DE INTERFAZ GRAFICA

Objetivos

Crear mayor interacción y por ende mayor comunicación entre el cliente y la empresa, crear
una comunicación bidireccional en donde su target y cliente objetivo sea el centro y eje y
motor de su marketing digital

Hacer que sus productos y servicios lleguen a más clientes y de esta manera posicionarse en
el sector de la moda regional y nacional.

Crear facilidad de acceso a la información, productos y servicios.

Brindar información sobre el uso de materiales adecuados y de calidad en el sector de la

moda y de su producto estrella el jean y sus diferentes posibilidades de uso en los diferentes
segmentos de la moda.

Se presenta y resalta la importancia de crear un sitio web de acuerdo a los requerimientos

del cliente; y que este sitio web logre una comunicación o interacción de acuerdo al
objetivo de la organización y que represente fielmente sus valores corporativos y que
nosotros como agencia de producción multimedia estaremos retroalimentando cada
semestre o cada que la empresa lo determine de acuerdo a sus expectativas de mercado,
aumentar de esta manera la confianza y lograr mayor acercamiento entre la empresa y el
público objetivo. Es muy importante que la página cumpla con todos los requisitos de
usabilidad e interactividad para que sea fácilmente entendida por el usuario. Recordamos

Que desde un inicio el requerimiento principal de nuestro cliente es su posicionamiento en

redes sociales y la creación de un video de marca.
 21

Aquí los videos que hemos construido para la marca Indigo y su análisis de interfaz:

Nuestro primer video de Marca lo puedes ver en el siguiente link:

https://vimeo.com/preview/OUAFawMUSiAsBBhgCzE?container=draft_manager_grid

Análisis de la interfaz del video:

Este video inicia con la

frase Nuestra nueva
colección, sobre un
fondo azul al color de la
tela indigo del jean
 22

La segunda escena muestra a unos

jóvenes universitarios, el enfoque
se hace desde su cintura hacia
abajo para ver los jeans de la marca
que son el personaje principal del
video de marca, todo sobre base de
tonos azules y blancos y sobre la
imagen la letra blanca con el
nombre de la colección.

En esta escena se observa en el

fondo las manos creadoras de una
operaria de la confección en el
proceso de ensamblado del jean, el
enfoque se da en las manos y en el
pie y aguja de la máquina y sobre
este una frase que dice Jeans nueva
Colección.
 23

En este recuadro de imagen se

observa un joven sentado y se
centra la imagen en el proceso que
tiene y al que fue sometido el jean
en lavandería y resalta el diseño en
prenda de este.

Como agencia de publicidad Multimedia Gaes hemos creado para nuestro cliente Indigo
Jeans varios videos y anuncios a lo largo de todo este proceso de posicionamiento de marca
y los presentamos para su discusión y aprobación, en este caso analizamos algunos de ellos,
en los cuales podemos observar tipografía, logo, marca y slogan de marca.

En esta parte del video solo se deja

un fondo azul indigo de la marca y
ya la frase de envió gratis para
hacer que el cliente se motive a
hacer click sobre el botón de
compra en la tienda online a donde
será redireccionado por la interfaz.
 24

En este recuadro observamos la

siguiente escena en donde vemos la
frase TREAT YOURSELF que dice
date un gusto un capricho, con ella
se quiere cambiar la percepción del
cliente para que ejecute la compra
de una manera muy sutil.

A diferencia de los anuncios que se pueden volver más interactivos y en donde con un
codigo QR podremos redireccionar al cliente a la página de Instagram en el video
vemos más el aprovechamiento de slogan marca y contenido de marca según los
requerimientos de nuestro cliente y los análisis del mercado realizados para este y por ello
desglosamos este video para que se entienda de una forma clara y sencilla como se pretende
posicionar la marca en la mente del consumidor objetivo.

En esta escena podemos ver

una tienda de la marca en una
perspectiva de un maniquí y
al lado un rap con unos jeans
y un cliente observando
cuidadosamente las prendas.
 25

Una escena en donde el fondo se

contrasta en color y forma y
aparece la frase un nuevo look, un
nuevo jean, una nueva mirada a la
moda del consumidor marca moda
y específicamente jean el rey de las
prendas, quién no usa un jean.

En este recuadro observamos como

una modelo alegre salta con un
outfit Indigo Jean, juvenil
descomplicado y muy adaptable al
entorno en el que se encuentra,
como la marca Indigo, asi cierra
este video.

https://vimeo.com/preview/aEBCN1ZbQDs3RR9hCzE?container=draft_manager_grid

En este link otro video creado para la marca.

 26

Del anterior video cabe resaltar de la interfaz creada en el y en la posibilidad en la que este
interactúe con el cliente la parte del botón de compra que lo llevara a ejecutar la compra en
la tienda online de la marca, así mismo el cliente o consumidor final de la marca podrá con
los controles de su teclado pc o de su móvil interactuar detener o pausar el video para verlo
mejor.
 27

En esta imagen del video

podemos observar claramente en
donde podrá hacer click el
cliente para ser llevado a la
tienda online de la marca.
 28

Ejemplo de publicidad interactiva que crearemos para la marca de acuerdo a los

requerimientos del cliente y que al volver interactiva nos llevara a las páginas de redes
sociales de la marca y nos llevara a la tienda online de la marca en este caso enlazamos la
marca indigo ene este poster publicitario con un codigo qr que nos direcciona
inmediatamente al drive donde esta contenido el video que hicimos para la marca moda
indigo en donde se promociona su producto estrella el jean al escanear el codigo qr nos
remite inmediatamente al video de la marca a uno de los que hemos realizado como
ejercicio y muestra del proceso de posicionamiento de marca y requerimientos de marca
según nuestro cliente moda.
 29

Aquí algunos de los posters que se han creado para la marca para ser colocados en
Instagram y en la we y en publicidad exterior:
30
31
32
33
 34

En este caso podemos observar el poster de una Campaña de marca con la Colección

Premium de la marca y se destaca en color Rojo y sus textos en Inglés.

 35

Botón Interactivo de la página

Que te llevara a la colección

 36

NOMBRE DE LA MARCA Y

SLOGAN DE CADA COLECCIÓN

CODIGO QR

Que te llevará a la página de la marca

 37

LOGO DE MARCA Y PUBLICIDAD DE APERTURA DE TIENDA

 38

Poster creado para la marca en donde esta el botón interactivo que te lleva a su página web
 39

Poster de marca en Ingles ya que en la web la marca esta al alcance global

 40

Poster creado con el ADN de Marca y un slogan muy sugestivo que conecta al usuario con la
marca.
 41

Conclusiones:
La navegación en un sitio web es realizada por el usuario. El usuario elige la ruta a través
de la estructura de la página. En una GUI, el desarrollador de software puede controlar las
opciones que tiene el usuario en un momento determinado. Si una función no está
disponible, el desarrollador puede elegir hacer que el software oculte esta opción en ese
momento en particular. En el caso de un cuadro de diálogo que se extiende a varias
ventanas, el software se puede diseñar de tal manera que no permita al usuario navegar
hacia atrás. En un sitio web, la página anterior siempre se puede ver en cualquier momento.
Por lo tanto, la navegación también debe tenerse en cuenta a la hora de diseñar un sitio
web.

Se le conoce como la interfaz de usuario al medio que hace posible que una persona pueda
comunicarse con una máquina, está compuesta por los puntos de contacto entre un usuario
y una computadora, es decir, se genera una conexión entre dos máquinas de cualquier tipo y
se les da un soporte para generar comunicación entre los distintos estratos.

Generalmente es la forma en la cual se conectan el hardware con el software, que

comprende las aplicaciones, programas y herramientas, su finalidad es que un usuario
pueda realizar una acción determinada en la forma que se desea, teniendo eficacia,
rendimiento y seguridad en cada proceso, lo que involucra que:

La acción efectuada sea la que el usuario tiene intenciones de hacer. La orden se debe
realizar de forma eficaz y precisa. La acción debe afectar solamente al componente de
Hardware o a la aplicación que se tenía considerada utilizar, esto sin afectar a otros
componentes.

Este conjunto de elementos, que se reflejan en la pantalla y que permiten al usuario llevar a
cabo acciones bien definidas, se compone de elementos de acción, alternativas de
navegación, identificación y contenidos. La usabilidad trata las recomendaciones que se
 42

deben tener en cuenta al diseñar un sitio web. Siempre, en lo referente a la facilidad de

acceso para los usuarios.

Se trata de que un sitio web sea fácilmente navegable, es decir, que un usuario no se pierda
en los contenidos, que encuentre fácilmente los menús y que llegue a cumplir los objetivos
del sitio web: comprar, descargar, subscribirse, etc. (SENA, 2017)
 43

Referencias:

Anabel Castro. (06 de Agosto de 2021). Interfaz. Obtenido de https://interfaz.io/tips-para-

desarrollar-una-buena-interfaz-de-usuario/

Digital, P. (30 de Julio de 2020). Pinguino Digital. Obtenido de

https://pinguinodigital.com/blog/interfaz-de-usuario/

Juan Andres Corrales. (2 de Agosto de 2019). Rockcontent Blog. Obtenido de

https://rockcontent.com/es/blog/interfaz-de-usuario/

SENA, S. N. (17 de Enero de 2017). Sofia Plus. Obtenido de FAVA - Formación en

Ambientes Virtuales de Aprendizaje:
https://sena.territorio.la/content/index.php/institucion/Titulada/institution/SENA/
Tecnologia/228101_1/Contenido/OVA/AP3/Sistemas_navegacion_multimedia/
docs/materi