Introducción y aspectos a considerar en el diseño web enfocado a experiencias de usuario concretas, ecommerce y marketing digital. Junio 2015. Parte del Diplomado de Marketing Digital de la Universidad INTEC.

1. Diseño
Web,
Experiencia
de
Usuario
y
Ventajas
Publicitarias.
Jueves
11
de
Junio
2015.

3. Ventajas
de
un
website
para
las
marcas:
• Visibilidad
en
buscadores.
(No
todo
lo
que
se
publica
en
redes
queda
bien
posicionado
en
buscadores)
• El
usuario
de
hoy
es
Mul7tasker
y
Mobile:
Quien
quiera
saber
de
tu
marca
se
enterará
mas
rapido.
• Tengas
o
no
página
web
tu
consumidor
posiblemente
ya
te
esté
buscando.
• En
las
redes
sociales
todo
pasa
muy
rapido.
La
información
importante
se
diluye.
• Contenido
que
perdura
en
el
7empo.
No
dependes
de
que
una
red
social
esté
de
moda.

8. Conocer
los
conceptos
para
luego
diferenciarlos:
UI
=
User
Interface
=
Interfaz
de
Usuario
Diseñar
un
siOo,
página
o
app
parOendo
de
la
creación
de
wireframes
y
mockups
para
después
alimentar
la
base
de
esa
construcción
con
color,
degradados,
cuadrados,
mulOmedia,
etc.
La
“Interfaz
de
Usuario”
es
aquello
con
lo
que
el
usuario
se
encontrará
en
su
llegada
al
siOo,
y
el
experto
en
UI
creará
un
diseño
visual
y
técnicamente
atracOvo.
UX
=
User
Experience
=
Experiencia
del
Usuario
Valorar
una
página
web
como
un
usuario
más.
¿Y
qué
hace
un
usuario
al
entrar
a
una
página
web?
Busca
información.
¿Dónde
está
el
botón
de
buscar?
¿Cómo
contacto
a
la
empresa?
¿Dónde
le
doy
play
para
jugar?
¿Cuáles
son
los
campos
requeridos
en
un
formulario?
¿Por
qué
mi
solicitud
no
se
envía?
Un
experto
en
UX
es
el
psicólogo
web
del
usuario,
decidirá
qué
es
lo
que
anima,
esOmula
o
frustra
en
el
website.

9. Conocer
los
conceptos
para
luego
diferenciarlos:

10. Diseña
para
obtener
información:
Para
diseñar
una
aplicación
o
siOo
web
que
sea
fácil
de
usar,
es
muy
importante
hacer
para
las
personas
más
fácil
encontrar
y
entender
el
contenido.
Los
menús
deben
ser
organizados
de
manera
lógica
y
usar
un
lenguaje
que
la
gente
reconozca.
Algunas
palabras
Oenen
más
de
un
significado,
así
que
tome
un
poco
de
Oempo
para
decidir
las
mejores
soluciones
de
diseño
para
los
elementos
críOcos
como
la
navegación
y
los
menúes.

11. Otros
consejos:
• Tu
página
Oene
que
ser
sencilla
y
fácil
de
usar.
• El
cliente
no
Oene
por
qué
registrarse
antes
de
hacer
la
compra.
Ya
lo
hará
cuando
vaya
a
comprar.
• Si
el
cliente
quiere
comprar
algo
en
tu
Oenda,
ponle
fácil
el
pago.
• Se
vende
a
cualquier
cliente,
esté
donde
esté.
• Ofrece
a
tus
clientes
productos
complementarios
en
la
misma
vista
que
está
su
producto
objeOvo.
(Lo
que
hace
Amazon
;)
)
• Si
el
pedido
se
va
a
retrasar,
contacta
con
el
cliente
y
explícale
la
situación.
• No
hay
cliente
pequeño.
• Ofrece
información
prácOca
y
valiosa
relacionada
con
tus
productos.
Desde
las
historias
de
las
grandes
figuras
hasta
consejos
sobre
el
cuidado
de
los
productos.

13. Conocer
los
conceptos
para
luego
diferenciarlos:

15. Conocer
los
conceptos
para
luego
diferenciarlos:

16. Caso
NORTIC
–
Portales
Gubernamentales.
Estandarización
del
diseño
con
miras
a
una
mejor
experiencia
de
usuario.

17. Caso
Digo
Network:
Estandarización
de
Espacios
Publicitarios
dentro
de
su
red
para
facilitar
el
“Run
of
Channel”

18. Caso
Seguros
Universal:
App
con
directorio
de
emergencias,
médicos
y
talleres
automotrices
afiliados.
(Y
de
paso,
perfil
de
sus
servicios)

19. Caso
Popular
en
Línea:
Ibanking,
Consulta
Geolocalizada
de
Cajeros
y
Ofertas
para
sus
clientes.
Deficiencias
de
diseño
(Letra
pequeña,
Dificultad
para
ubicar
los
números
de
contacto.)

20. Caso
Menú.com.do
VS
Nuevo
Site
Bocao:
Directorio
de
Restaurantes
con
recomendaciones,
raOngs,
argculos
generados
por
su
comunidad,
posibilidad
de
crear
y
comparOr
listas
de
lugares,
y
más.

21. Caso
Soy
CND:
Espacio
para
empleados
y
suplidores
donde
pueden
interactuar
con
la
marca
y
obtener
información
relevante.

22. Caso
Centro
Histórico
Ron
Barceló:
Espacio
para
conocer
la
historia
del
Ron
y
el
papel
de
la
marca
Barceló
dentro
de
la
misma.

23. Caso
Hospital
Vet.
Arroyo
Hondo:
Interacción
cliente
–
empresa
donde
puede
llevar
agenda
de
su
mascota
y
ordenar
en
línea.

24. Caso
Cocina
Nestlé.do:
Enfocado
en
insight
del
consumidor:
Recetas
de
Cocina.
El
producto
es
secundario.

26. Caso
Marca.com:
Uso
de
cookies
para
personalizar
experiencia.
App
donde
seleccionas
tu
equipo
y
Oenes
acceso
directo
a
contenido
relacionado.
Marcador
en
Oempo
real
de
parOdos.
Radio
Marca
y
Versión
en
Inglés.

27. Caso
Movieapp:
Cartelera
de
Cine
con
raOngs
IMDB,
Tarifas,
Trailers
y
NoOficaciones
“Push”
de
estrenos.

28. Caso
Bosque
Jurásico:
Información
del
evento
y
componente
“3D”
en
homepage.