Ux moviles

  • View
    96

  • Download
    0

  • Category

    Design

Preview:

DESCRIPTION

Buenas prácticas y elementos a tener en cuenta a la hora de trabajar la experiencia de usuario en móviles y tabletas

Citation preview

M Ó V I L , P E R S O N A L E I N T E R M I T E N T E

UX dispositivos móviles

2014

1

gemafuentesanchez@gmail.com

No disponible en la App Store

2014gemafuentesanchez@gmail.com

2

In

2014gemafuentesanchez@gmail.com

3

El smartphone es el centro de la vida digital.

España esta por encima de la media europea

P A R A Q U É

gemafuentesanchez@gmail.com 2014

4

Objetivos

Funciones básicas

2014gemafuentesanchez@gmail.com

5

Nuestro Smartphone es:

2014gemafuentesanchez@gmail.com

6

• Teléfono• Calendario• Reloj / despertador• Agenda• Libreta• Cámara de fotos• Álbum de fotos• Reproductor música (walkman)• GPS• Video juego• Solucionador de dudas• Linterna• Chat

Entretenimiento

2014gemafuentesanchez@gmail.com

7

Entretenimiento

2014gemafuentesanchez@gmail.com

8

• Llenar los tiempos muertos

• Leer, charlar, jugar

Estatus y pertenencia

2014gemafuentesanchez@gmail.com

9

Estatus y pertenencia

2014gemafuentesanchez@gmail.com

10

• Estar siempre disponible en RRSS

• No estar desfasado

Ayuda a la compra

2014gemafuentesanchez@gmail.com

11

Ayuda a la compra

2014gemafuentesanchez@gmail.com

12

• Encontrar donde comprar

• Comprar precios

• Conocer características

• Compartir

Pago desde un APP

2014gemafuentesanchez@gmail.com

13

Pago con el móvil

2014gemafuentesanchez@gmail.com

14

Móvil como TPV

2014gemafuentesanchez@gmail.com

15

Realidad aumentada

2014gemafuentesanchez@gmail.com

16

Móvil como llave

2014gemafuentesanchez@gmail.com

17

Q U I E N Y C O M O

gemafuentesanchez@gmail.com 2014

18

Usuarios

Intuitivo

2014gemafuentesanchez@gmail.com

19

Intuitivo

2014gemafuentesanchez@gmail.com

20

• Interacción con las manos es más natural que con el ratón

• Crecimiento mucho mas rápido y popular

• Más atractivo para personas poco expertas en tecnología

Nuevos inputs

2014gemafuentesanchez@gmail.com

21

Nuevos inputs

2014gemafuentesanchez@gmail.com

22

• Sin intermediarios (ratón)

• Más naturales

• Implicando más elementos del cuerpo

• Inconscientes

• Tridimensionales

• Voz

Inmediatez

2014gemafuentesanchez@gmail.com

23

Inmediatez

2014gemafuentesanchez@gmail.com

24

• Siempre encima

• Siempre localizado

• Comunicación instantánea

• Información instantánea

Conciso y frecuente

2014gemafuentesanchez@gmail.com

25

Conciso y frecuente

2014gemafuentesanchez@gmail.com

26

• Entre 1 y 10 min por sesión

• Muchas veces al día

• Navegación más dirigida

Local

2014gemafuentesanchez@gmail.com

27

Local

2014gemafuentesanchez@gmail.com

28

• GPS

• Encontrar un lugar

• Acompaña al usuario

D O N D E Y C U A N D O

gemafuentesanchez@gmail.com 2014

29

Contexto

Donde

2014gemafuentesanchez@gmail.com

30

Movimiento

2014gemafuentesanchez@gmail.com

31

Relax

2014gemafuentesanchez@gmail.com

32

Intimidad

2014gemafuentesanchez@gmail.com

33

Atención dividida

2014gemafuentesanchez@gmail.com

34

Donde y cuando

2014gemafuentesanchez@gmail.com

35

• Contextos polarizados

• Atención dividida o interrumpida

• Interacción física limitada

W E B M O V I L O A P P

gemafuentesanchez@gmail.com 2014

36

Tecnología

Sitios web móviles v.s Aplicaciones nativas

2014gemafuentesanchez@gmail.com

37

Sitios web móviles v.s Aplicaciones nativas

2014gemafuentesanchez@gmail.com

38

Web móvil

2014gemafuentesanchez@gmail.com

39

• Mismo desarrollo para todos los sistemas operativos: .

• Inmediato (no es necesario descargar ni actualizar)

• Sencillo, rápido y barato desarrollar

• No acceso a componente nativos (cámara)

• Problemas compatibilidad navegadores

• No funcionan offline

App nativa

2014gemafuentesanchez@gmail.com

40

• Acceso a componentes nativos

• Mejor rendimiento

• Modo offline

• Mercado

• Costoso de desarrollar

• Actualizaciones

• Distintas versiones para distintos sistemas operativos

Híbridas (Mashup)

2014gemafuentesanchez@gmail.com

41

Híbridas

2014gemafuentesanchez@gmail.com

42

• Utilizan un sistema u otro en función del contenido/funcionalidades a mostrar

D I S P O S I T I V O S P E Q U E Ñ O S

E L E M E N T O S G R A N D E S

gemafuentesanchez@gmail.com 2014

43

Diseño

Escribir es difícil

2014gemafuentesanchez@gmail.com

44

Elementos grandes

2014gemafuentesanchez@gmail.com

45

• Botones grandes

• Letra grande

• Espacio grandes para hacer scroll

• Mejor elegir que escribir

Posiciones de las manos

2014gemafuentesanchez@gmail.com

46

Donde tocar

2014gemafuentesanchez@gmail.com

47

Posiciones de las manos

2014gemafuentesanchez@gmail.com

48

Donde tocar

2014gemafuentesanchez@gmail.com

49

Responsive

2014gemafuentesanchez@gmail.com

50

Responsive

2014gemafuentesanchez@gmail.com

51

• Mismo contenido adaptado a distintos dispositivos

• Simplificar mantenimiento

Mobile First

2014gemafuentesanchez@gmail.com

52

Mobile First

2014gemafuentesanchez@gmail.com

53

• Dispositivo más usado

• Reducir tiempos de carga

• Ayuda a poner el foco en lo importante

gemafuentesanchez@gmail.com 2014

54

Herramientas

Software

2014gemafuentesanchez@gmail.com

55

• Aplicaciones híbridashttp://phonegap.com/https://trigger.io/

• Emuladorhttps://chrome.google.com/webstore/detail/ripple-emulator-beta/geelfhphabnejjhdalkjhgipohgpdnoc

• Accesibilidad para móvileshttp://www.w3.org/Mobile/

• Responsivehttp://niravigad.com/responsive_man/http://quirktools.com/screenfly/http://www.responsinator.com/

gemafuentesanchez@gmail.com 2014

56

Bibliografía

L I B R O S

W W W

Bibliografia

2014gemafuentesanchez@gmail.com

57

• Mobile First Luke Wroblewski

• http://www.slideshare.net/shoobe01/40min-how-peopleholdtouchconveys-30874671

• http://www.slideshare.net/mobile/Fate/dia-de-la-usabillidad-2013-clnica-de-ux-para-apps

• http://www.ideup.com/blog/interaccion-en-dispositivos-moviles-i

• http://www.uxabilidad.com/inspiracion/sitios-web-moviles-v-s-aplicaciones-nativas.html

• http://static.googleusercontent.com/external_content/untrusted_dlcp/www.google.com/es//events/thinkmobile2011/files/preso-laura.pdf

• http://static.googleusercontent.com/external_content/untrusted_dlcp/www.google.com/es//events/thinkmobile2011/files/alberto-knapp.pdf

• http://mobiforge.com/files/dotMobi%20Mobile%20Web%20Developers%20Guide.pdf

• http://www.slideshare.net/slashmobility/sesion-1-slash-mobility-mobile-apps-testing

• http://www.acens.com/blog/videografia-sie13.html

• http://www.uxed.org/2014/02/interaccion-en-dispositivos-moviles-mas-alla-de-pulsar-botones/