Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Upcoming SlideShare
Curso: Diseño de apps y webs móviles - Parte 2
Next
Download to read offline and view in fullscreen.

3

Share

Download to read offline

Taller Diseno de apps móviles

Download to read offline

En este taller se cubren las etapas clave en el diseño de aplicaciones móviles: la concepción de una idea, la definición de objetivos y el público usuario, hasta la definición de funcionalidades y las primeras pantallas. Asimismo se presentarán algunas consideraciones importantes al crear apps móviles.

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all

Taller Diseno de apps móviles

  1. 1. Text Diseño de apps móviles @juaneladio
  2. 2. Cosas que NO debes hacer en móviles No intentes esto en casa
  3. 3. No están haciendo una sábana
  4. 4. Tampoco es una pantalla fija
  5. 5. No sólo muestres información
  6. 6. No reinventes la rueda
  7. 7. No hagas apps para ingenieros
  8. 8. No debes resolver TODO
  9. 9. No debes elegir una plataforma (o quizá sí)
  10. 10. Lean UX Sólo como dato
  11. 11. Lean UX Declarar supuestos Retroalimentación e investigación Crear un MVP Correr un experimento
  12. 12. Ahora sí El taller
  13. 13. Parte práctica 1 • Formación de grupos de trabajo • Concepción de una app • ¿Qué problema soluciona? • ¿Cuál es su objetivo? • ¿Cuál es su valor agregado / diferenciador?
  14. 14. Ejemplo • Concepción de una app: Vías de Lima • Soluciona el problema de uso de transporte público en una ciudad • Busca ofrecer información confiable de las rutas de transporte de una ciudad • Se diferencia de las demás porque se apoya en información del usuario y reporta los puntos más congestionados
  15. 15. Parte práctica 2 • Concepción del usuario de la app: proto-persona • Cara y nombre • Información demográfica / comportamiento • Puntos de dolor y necesidades • Posibles soluciones
  16. 16. Ejemplo • Usuario de Vías de Lima • Nombre: José Pasquel • Información demográfica / comportamiento: 19 años, estudiante universitario, vive en San Juan de Miraflores, presupuesto reducido, clase media
  17. 17. Ejemplo • Usuario de Vías de Lima • Puntos de dolor / necesidades: Hay horas límite para tomar buses, debe llegar a tiempo a clases (en la UNI) o a recoger a su enamorada (vive en San Borja), debe aprovechar el medio pasaje en transporte público • Posibles soluciones: Ahorrar en pasajes, recibir avisos de otros usuarios acerca de estado de rutas o paraderos
  18. 18. Parte práctica 3 • Concepción de funcionalidades de la app • Función - Para qué sirve • Categorizarlas entre principales y secundarias • Concepción del diagrama de arquitectura de información • ¿Cómo se distribuyen las pantallas? • ¿Cómo se relacionan entre sí?
  19. 19. Patrones de diseño móvil Una guía rápida
  20. 20. Patrones: Navegación
  21. 21. Patrones: Navegación (2)
  22. 22. Patrones: Formularios
  23. 23. Patrones: Tablas y listas
  24. 24. Patrones: Búsquedas
  25. 25. Patrones: Ordenamiento
  26. 26. Patrones: Filtrado
  27. 27. Patrones: Barras de herramientas
  28. 28. Patrones: Gráficos
  29. 29. Patrones: Invitaciones
  30. 30. Patrones: Retroalimentación
  31. 31. Patrones: Interacción
  32. 32. Patrones: Ayuda
  33. 33. Un modelo de interacción buildingfirefoxos.com
  34. 34. Firefox OS Building Blocks
  35. 35. Parte práctica 4 • Concepción de las pantallas de la app • ¿Cuáles son las pantallas principales? • ¿Cuáles permiten seguir una tarea completa?
  36. 36. Más patrones - lovelyui.com
  37. 37. Más patrones - pttrns.com
  38. 38. Más - mobile-patterns.com
  39. 39. Android: google.com/design
  40. 40. iOS: developer.apple.com/library/ios/design/
  41. 41. ¿Qué sigue? • Prototipado • Que las pantallas tengan la secuencia lógica • Test de usabilidad • Que sea probado por terceros, sin guía pero con seguimiento
  42. 42. Y una última cosa más O quizá dos
  43. 43. Quizá no necesitas elegir una plataforma
  44. 44. Mozilla Appmaker apps.webmaker.org/designer
  45. 45. ¡Gracias! • Juan Eladio Sánchez Rosas • @juaneladio • Mozilla Perú • @mozillaperu
  • 3lc0nd31

    Feb. 23, 2015
  • morpheus_co

    Feb. 23, 2015
  • NikooDBaldeon

    Feb. 22, 2015

En este taller se cubren las etapas clave en el diseño de aplicaciones móviles: la concepción de una idea, la definición de objetivos y el público usuario, hasta la definición de funcionalidades y las primeras pantallas. Asimismo se presentarán algunas consideraciones importantes al crear apps móviles.

Views

Total views

1,907

On Slideshare

0

From embeds

0

Number of embeds

50

Actions

Downloads

69

Shares

0

Comments

0

Likes

3

×