Epicurious: evaluando una aplicación para smartphones

Epicurious app
(Android)
Análisis estructura e interfaz

http://jordisan.net
@jordisan

05/03/2012 Epicurious app (Android)
2

• Introducción

• Estructura y funcionalidades
• Interacción

• Puntos fuertes
• Puntos débiles
• Posibles mejoras
• Líneas de trabajo propuestas

• Conclusiones

3 Introducción

Epicurious App

 Aplicación
móvil para
acceder a las recetas
del sitio
www.epicurious.com

 Disponible para
iPhone, iPad, Android, Nook, Windows
Phone, Kindle Fire
 Más de 30.000 recetas de comida y bebida
clasificadas por diferentes criterios
 También:
 creación de listas de la compra; recetas favoritas;
búsqueda por voz; valoraciones de usuarios

4 Introducción

¿Qué tiene de interesante?

 No es la típica versión limitada de una aplicación
de escritorio

 Gran cantidad de información con múltiples
criterios de búsqueda y clasificación

 Muchas posibilidades de mejora y de ampliación

5

• Introducción

• Interacción

• Puntos fuertes
• Puntos débiles

• Conclusiones

6 Estructura y funcionalidades

Búsqueda y consulta de
recetas (comida y bebida)
 Por
categorías
(página inicial)


 Listade recetas
(resúmenes)

 Acciones
 Ver receta
 Añadirla a
favoritas
 Crear lista
de la compra
 Enviar por email


Una receta

 Receta
 Detalles
 Ingredientes
 Preparación
 Imagen
 Valoraciones


Una receta

 La receta, paso a paso
 Al colocar el dispositivo en posición apaisada
 ¡Para usarla mientras se cocina!


Una receta

 Valoraciones


 Comidas por:
 ingrediente principal
 hora del día
 origen geográfico
 dietética
 tipo de plato
 estación o
acontecimiento


 Bebidas por:
(alcohólico)
(no alcohólico)
 origen geográfico
 tipo de bebida
 estación o
acontecimiento


Consulta y búsqueda de
 Búsquedas libres
y por voz


Lista de recetas favoritas


Lista de la compra

 A partir de
una receta


Navegación global

Recetas y listas
Búsquedas / de recetas
Inicial navegación facetada

Favoritas
Listas de la
compra

17

• Introducción

• Interacción

• Puntos fuertes
• Puntos débiles

• Conclusiones

18 Interacción

Estructura de pantallas
Atrás Título Acc.
 Excepción:
Contenido /
navegación interna

Navegación global

19 Interacción

Estructura de pantallas
Atrás Título Acc.
 Excepción:
Contenido /
navegación interna

Todas las pantallas siguen la misma
estructura, excepto las que aparecen
automáticamente al colocar el dispositivo en
Navegación global

posición apaisada.

20 Interacción

Eventos de interacción

 Tap / click  Orientación (modo
 Activar controles: apaisado)
botones, enlaces, …  Recetas en modo
 Arrastrar / deslizar “paso a paso”
Scroll vertical
  Teclas hardware
 Navegación horizontal  : lista de acciones
(listas) en recetas (añadir a
 Teclado
favoritos; lista compra;
enviar por e-mail)
 Introducción de
 : pantalla anterior
términos de búsqueda (equivalente al botón
 Voz “Back” de la interfaz)
 Dictado de términos de
búsqueda

21

• Introducción

• Interacción

• Puntos fuertes
• Puntos débiles

• Conclusiones

22 Puntos fuertes

Riqueza de información

 Mucha información
disponible, accediendo
a la que existe en el sitio
web
 “En la variedad está el
gusto”
 Múltiples
modos de
búsqueda
y navegación;
navegación facetada

23 Puntos fuertes

En la imagen se ve que es posible realizar una
Riqueza de información
búsqueda/navegación facetada, seleccionando
criterios de múltiples categorías: ingrediente
principal, geografía, tipo de plato, etc.
 Mucha información
disponible, accediendo
a la que existe en el sitio
web
 “En la variedad está el
gusto”
 Múltiples
modos de
búsqueda
y navegación;
navegación facetada

24 Puntos fuertes

Adaptación a (algunas)
características del dispositivo
 Nohay pantallas
sobrecargadas

 Lainformación compleja
se muestra de manera
estructurada

 Búsquedas por voz

25 Puntos fuertes

Adaptación a (algunas)
Las páginas equivalentes del sitio web están
mucho más sobrecargadas dedispositivo
características del información.
 No hay pantallas
sobrecargadas

 La información compleja
se muestra de manera
estructurada

 Búsquedas por voz

26 Puntos fuertes

Necesidad y público muy
amplio
 Cualquierpersona con un móvil y que
cocine (o quiera cocinar)

 Un móvil (o una tablet) es fácilmente
utilizable en una cocina (más que un
portátil)
 Modo “paso a paso”

27 Puntos fuertes

Necesidad y público muy
amplio
 Cualquier persona con un móvil y que
cocine (o quiera cocinar)

 Un móvil (o una tablet) es fácilmente
utilizable en una cocina (más que un
portátil)
 Modo “paso a paso”

El modo “paso a paso” es especialmente indicado
para utilizar el dispositivo en la cocina, mientras se
sigue la receta.

28

• Introducción

• Interacción

• Puntos fuertes
• Puntos débiles

• Conclusiones

29 Puntos débiles

Sistemas de navegación /
búsqueda confusos
 Diversos sistemas que no son evidentes

? ?

La navegación llega a ser confusa: 30 Puntos débiles
- Las categorías disponibles son, al menos, “peculiares”, sin seguir un criterio
claro.
Sistemas de navegación /
- Diversos modos de llegar a la pantalla de búsqueda.

búsqueda confusos
- La pantalla de búsqueda tiene un funcionamiento no evidente: aparte
del cuadro de búsqueda inferior, se puede utilizar la navegación
facetada.
- El acceso a las recetas de bebidas está en un lugar poco identificable;
 Diversos sistemas que no son evidentes
además puede parecer que se trata de bebidas relacionadas con las
recetas seleccionadas (no es así).

? ?

31 Puntos débiles

Algunas funcionalidades
“ocultas”

?

32 Puntos débiles

Algunas funcionalidades
“ocultas”

?

El modo apaisado es interesante, pero no existe ninguna
indicación de que existe esa posibilidad.

33 Puntos débiles

¿El nombre?

 “Epicurious”

 Adecuado para los conocedores del sitio
web

 Juego de palabras interesante, pero…
difícil de asociar a una aplicación de
recetas

34 Puntos débiles

Información disponible

 Se
echan en falta algunos datos básicos
habituales:
 Dificultad
 Tiempo de preparación
 Comensales

35 Puntos débiles

Algunas características
poco aprovechadas
 O, lo que es lo mismo…

36

• Introducción

• Interacción

• Puntos fuertes
• Puntos débiles

• Conclusiones

37 Posibles mejoras

Recetas “paso a paso”

 En la cocina se suelen tener las manos
ocupadas, sucias, etc.
 ¿Por qué no implementar otras
interacciones? Siguiente
 Por voz
(input; output)
 Gestos

38 Posibles mejoras

Recetas “paso a paso”
El usuario podría moverse entre los pasos diciendo
“siguiente” o “anterior”; o moviendo la mano por
encima En la cocina se(sin llegar a tocarla).
 de la pantalla suelen tener las manos
ocupadas, sucias, etc.
 ¿Por qué no implementar otras
interacciones? Siguiente
 Por voz
(input; output)
 Gestos

39 Posibles mejoras

Valoraciones (red social)

 Ahora sólo se pueden leer
las opiniones de otros usuarios

 Podría
implementarse un sistema simple
para opinar sobre una receta (por
ejemplo, justo después de hacerla)

40 Posibles mejoras

Lista de la compra

 Buscar asociaciones /
convenios con tiendas on-
line que permitieran hacer
la compra directamente a
partir de la lista

41 Posibles mejoras

Mayor integración con
web
 Permitirusar el usuario y
contraseña del sitio web
para acceder a las
mismas recetas
personalizadas,
favoritas, etc.

 Acceder al sitio web desde la aplicación
(por ej., para ampliar información)

42

• Introducción

• Interacción

• Puntos fuertes
• Puntos débiles

• Conclusiones

43 Líneas de trabajo propuestas

Con más tiempo

 Esta
presentación se ha realizado después
de una evaluación de pocas horas

 Para obtener información más fiable y
realista, sería necesario aplicar otras
técnicas de DCU…


Evaluación heurística

 Revisión
sistemática de la interfaz por parte
de un experto, para ver si cumple con
determinados principios:
 Heurísticas genéricas
 Heurísticas específicas para dispositivos
móviles/táctiles
 Directrices de interfaz específicas para el sistema
http://developer.android.com/guide/practices/ui_guidelines/i
ndex.html


Tests con usuarios

 Selección de usuarios representativos;
por ej.:
 Usuarios habituales de aplicaciones móviles con
destreza media o baja en la cocina.
 Usuarios poco habituales de aplicaciones
móviles, con interés y experiencia elevados en
cocina.
 Definición de tareas realistas
 Buscando una receta para hacerla más tarde
 ¡Incluso mientras realmente cocinan!
 Ejecución y análisis de los tests


Rediseño / prototipado

Dos ejemplos de protipos rápidos que muestran alternativas a
algunas pantallas de la aplicación:
- La pantalla inicial, mostrando un conjunto reducido de categorías
Rediseño / prototipado
en función de la época del año. Además, posibilitando y
separando (comida vs. Bebida) la búsqueda de recetas desde el
inicio, y dando un acceso rápido a la última receta guardada
como “favorita”.
- Opción para valorar rápidamente una receta (posiblemente justo
después de elaborarla).

48

• Introducción

• Interacción

• Puntos fuertes
• Puntos débiles

• Conclusiones

49 Conclusiones

Objetivos (hipótesis)

 Mantener una interfaz parecida a la
actual, para los usuarios existentes de la
aplicación
 Mostrar claramente las opciones
disponibles, para conseguir nuevos usuarios
 Integración con la web, potenciando
mutuamente su utilización por parte de los
usuarios
 Potenciar el uso de la aplicación como
algo más que una herramienta de consulta

50 Conclusiones

Objetivos (hipótesis)
Suponemos que estos podrían ser objetivos de una
evaluación y posible rediseño de esta aplicación.
 Mantener una interfaz parecida a la
actual, para los usuarios existentes de la
aplicación
 Mostrar claramente las opciones
disponibles, para conseguir nuevos usuarios
 Integración con la web, potenciando
mutuamente su utilización por parte de los
usuarios
 Potenciar el uso de la aplicación como
algo más que una herramienta de consulta

51 Conclusiones

Fortalezas y debilidades

 Aplicación interesante; público potencial muy
amplio
 Gran cantidad de información; múltiples
sistemas de búsqueda
 Páginas simples sin sobrecarga de información

- Navegación algo confusa
- Algunas características poco aprovechadas
- Integración con la web

52 Conclusiones

Recomendaciones

 Hacer más clara y coherente la
navegación en diferentes pantallas
 Mejorar y potenciar aspectos clave
 Receta “paso a paso”
 Valoración de recetas
 Listas de la compra
 Mayor integración con la web
 Incorporar determinada información básica
 Dificultad; comensales; tiempo de preparación
 Realizar estudios/técnicas más completos
 Evaluación heurística; tests con usuarios; …

Epicurious: evaluando una aplicación para smartphones

Recommandé

Recommandé

Contenu connexe

En vedette

En vedette (14)

Similaire à Epicurious: evaluando una aplicación para smartphones

Similaire à Epicurious: evaluando una aplicación para smartphones (6)

Dernier

Dernier (20)

Epicurious: evaluando una aplicación para smartphones