Top Banner
Desarrollo ágil enfocado en UX Evento: Fintech http://banregiolabs.startupmexi. co / Revisión: 1.0.0 Original: https://goo.gl/Yo04kk
44

Desarrollo ágil enfocado en ux 1 0 0

Apr 12, 2017

Download

Software

Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Desarrollo ágil enfocado en ux 1 0 0

Desarrollo ágil enfocado en UXEvento: Fintech

http://banregiolabs.startupmexi.co

/Revisión: 1.0.0

Original: https://goo.gl/Yo04kk

Page 2: Desarrollo ágil enfocado en ux 1 0 0

¿Y que son los métodos agiles?Manifiesto por el Desarrollo Ágil de Software

Estamos descubriendo formas mejores de desarrollarsoftware tanto por nuestra propia experiencia comoayudando a terceros. A través de este trabajo hemos

aprendido a valorar:

Individuos e interacciones sobre procesos y herramientasSoftware funcionando sobre documentación extensiva

Colaboración con el cliente sobre negociación contractualRespuesta ante el cambio sobre seguir un plan

Esto es, aunque valoramos los elementos de la derecha,valoramos más los de la izquierda.

http://agilemanifesto.org/iso/es/

Page 3: Desarrollo ágil enfocado en ux 1 0 0

Consideraciones y experiencia.• En el evento de Fintech eran equipos de 3 personas.• Un proyecto debía estar en una de las siguientes categorías: Verificación

de identidad, Bankification, Finanzas personales.• El proyecto a desarrollar de nuestro equipo fue sobre Finanzas personales.• Algo que sucedió y no se nota mucho en un startup weekend fue que

varios proyectos eran muy similares, al estar acotado a ciertas categorías las soluciones tendían a ser similares, por lo que habría que prestar mas atención al estudio de mercado y al diferenciador con respecto a productos similares.

• No se anoto sobre una libreta o en un rotafolio, todo se anoto sobre posticks.

• Al momento de armar el pitch y la diapositiva, no se paso al proceso de realizar la diapositiva hasta no tener el pitch definido.

• Si se observan pantallas duplicadas al momento de votar, se deja solo una para tener pantallas diferentes.

Page 4: Desarrollo ágil enfocado en ux 1 0 0

2 a 5 días, 40 horas

https://developers.google.com/design-sprint/http://www.gv.com/sprint/

Monday: Unpack

Tuesday: Sketch

Wednesday: Decide

Thursday: Prototype

Friday: Test

Page 5: Desarrollo ágil enfocado en ux 1 0 0

El Sprint provee a los equipos un atajo para validar y aprender rápidamente sin necesidad de construir y lanzar un producto de manera inicial.

Page 6: Desarrollo ágil enfocado en ux 1 0 0

El equipoCon perfiles diferentes

Page 7: Desarrollo ágil enfocado en ux 1 0 0

El materialSugerido

Page 8: Desarrollo ágil enfocado en ux 1 0 0

El materialUsado en el

FintechHojas de papel

y Lápiz

Posticks de colores Tijeras y cinta de papel

Page 9: Desarrollo ágil enfocado en ux 1 0 0

6 etapas

Page 10: Desarrollo ágil enfocado en ux 1 0 0

Analiza

Page 11: Desarrollo ágil enfocado en ux 1 0 0

Objetivos y métricas

Page 12: Desarrollo ágil enfocado en ux 1 0 0

Capacidad técnica y retos

Page 13: Desarrollo ágil enfocado en ux 1 0 0

Soluciones actuales

Page 14: Desarrollo ágil enfocado en ux 1 0 0

Define

Page 15: Desarrollo ágil enfocado en ux 1 0 0

Define tus usuarios meta

Page 16: Desarrollo ágil enfocado en ux 1 0 0
Page 17: Desarrollo ágil enfocado en ux 1 0 0
Page 18: Desarrollo ágil enfocado en ux 1 0 0
Page 19: Desarrollo ágil enfocado en ux 1 0 0

Diverge

Page 20: Desarrollo ágil enfocado en ux 1 0 0
Page 21: Desarrollo ágil enfocado en ux 1 0 0

8 ideas5 minutos

Page 22: Desarrollo ágil enfocado en ux 1 0 0

1 idea 5 minutos

Page 23: Desarrollo ágil enfocado en ux 1 0 0

1 storyboard 5 minutos

Page 24: Desarrollo ágil enfocado en ux 1 0 0

Decide

Page 25: Desarrollo ágil enfocado en ux 1 0 0

Agrupavota

Page 26: Desarrollo ágil enfocado en ux 1 0 0

Construye

Page 27: Desarrollo ágil enfocado en ux 1 0 0

https://www.google.com/design/spec/material-design/introduction.html#https://www.google.com/design/spec/style/color.html#color-color-palette

Page 28: Desarrollo ágil enfocado en ux 1 0 0
Page 29: Desarrollo ágil enfocado en ux 1 0 0
Page 30: Desarrollo ágil enfocado en ux 1 0 0

Valida

Page 31: Desarrollo ágil enfocado en ux 1 0 0
Page 32: Desarrollo ágil enfocado en ux 1 0 0
Page 33: Desarrollo ágil enfocado en ux 1 0 0
Page 34: Desarrollo ágil enfocado en ux 1 0 0
Page 35: Desarrollo ágil enfocado en ux 1 0 0

Proceso Fintech.1. Poner en posticks las características de nuestra aplicación para saber en que enfocarnos y saber

que deberían de contener las pantallas al momento de diseñarlas.2. Doblar una hoja en 6 partes, 2 en horizontal y 3 en vertical.3. Proponer 6 pantallas máximo cada quien.4. Secuencia de pantallas de izquierda a derecha para el flujo y de abajo hacia arriba para las

opciones, dejando arriba la opción por defecto y abajo si es opcional.5. Reducir pantallas, las que son iguales o similares para no duplicar pantallas.6. Votar por las que mas nos gustan, tenemos 6 votos cada quien.7. Armar un story board con las pantallas y ver si existe alguna pantalla que se pudiera mejorar.8. Generación del prototipo con el material de color, en 2 versiones.9. Retroalimentación de los prototipos y anotación de las mejoras.10. Validar con nuestros usuarios el prototipo en papel y la idea con un pequeño pitch.11. Obtener retroalimentación sobre el prototipo y ajustar o pivotear si es necesario.12. Generación del prototipo ya en una aplicación real sin funcionalidad.13. Definición del pitch y ensayo.14. Trabajo en la diapositiva del pitch.

Page 36: Desarrollo ágil enfocado en ux 1 0 0

Paso 1.

Page 37: Desarrollo ágil enfocado en ux 1 0 0

Paso 2 al 6.

Page 38: Desarrollo ágil enfocado en ux 1 0 0

Paso 8, 9 y 10.

Page 39: Desarrollo ágil enfocado en ux 1 0 0

Paso 8, 9 y 10.

Page 40: Desarrollo ágil enfocado en ux 1 0 0

Paso 8, 9 y 10.

Page 41: Desarrollo ágil enfocado en ux 1 0 0

Paso 8, 9 y 10.

Page 42: Desarrollo ágil enfocado en ux 1 0 0

Paso 8, 9 y 10.

Page 43: Desarrollo ágil enfocado en ux 1 0 0

Siguiente secuencia de pasos a implementar.

Sección A) Selección de la idea y análisis del mercado-------------------------------------------------------------------------Paso 0.1) Lluvia de ideas de diferente tipo o seleccionar un tema y proponer soluciones para la problemática (No aplicado en este ciclo).Paso 0.2) Votar por una idea o aplicación a desarrollar(No aplicado en este ciclo).

-------------------------------------------------------------------Paso 1.1) Poner en posticks las características de nuestra aplicaciónPaso 1.2) Definir quien es nuestro usuario de preferencia con una imagen o si son varios quienes son.Paso 1.2) Hacer un cuadro comparativo con respecto a otras aplicaciones para conocer cual es el diferenciador nuestro o poner hacer un listado de lo que nos diferencia

-------------------------------------------------------------------------Sección B) Diseño de la idea, prototipo básico-------------------------------------------------------------------------Paso 2.1) Doblar una hoja en 6, 2 en horizontal y 3 en vertical y proponer 6 pantallas máximo, cada quien y votar por las que mas nos gustan, secuencia de izquierda a derecha y de abajo hacia arribaPaso 2.2) Reducir pantallas, las que son iguales o similares para no duplicar pantallasPaso 2.3) Votar por las pantallas y seleccionar 6 máximoPaso 2.4) Armar un story board con las pantallas y ver si existe alguna característica que se pudiera mejorar

-------------------------------------------------------------------Paso 3.1) Definición del story board y votar (No aplicado en este ciclo)Paso 3.2) Definir el modelo canvas o ir trabajando en el (No aplicado en este ciclo)Paso 3.2) Definir el pitch o ir trabajando en el

-------------------------------------------------------------------------Sección C) Diseño de la idea, prototipo medio-------------------------------------------------------------------------Paso 4.1 Generación del prototipo con el material de color, en 2 versionesPaso 4.2 Validar con nuestros usuarios el prototipo y la idea con un pequeño pitchPaso 4.3 Obtener retroalimentación sobre el prototipo y ajustar o pivotear si es necesario

-------------------------------------------------------------------------Sección D) Diseño de la idea, prototipo alto-------------------------------------------------------------------------Paso 4.1 Generación del prototipo ya en una aplicación real sin funcionalidad todo mockeadoPaso 4.2 Validar con nuestros usuarios el prototipo y la idea con un pequeño pitchPaso 4.3 Obtener retroalimentación sobre el prototipo y ajustar o pivotear si es necesario

-------------------------------------------------------------------------Sección E) Diseño de la idea, prototipo avanzado-------------------------------------------------------------------------Paso 4.1 Generación del prototipo ya en una aplicación real con funcionalidad con pruebas betas (No aplicado en este ciclo).Paso 4.2 Validar con nuestros usuarios el prototipo y la idea con un pequeño pitch (No aplicado en este ciclo).Paso 4.3 Obtener retroalimentación sobre el prototipo y ajustar o pivotear si es necesario (No aplicado en este ciclo).

Page 44: Desarrollo ágil enfocado en ux 1 0 0

Puntos de mejora sugeridos.• Trabajar en un sprint para la parte del canvas.• Trabajar en un sprint para la parte del análisis de la competencia y el

comparativo.• Usar el software origami de facebook para los prototipos.• https://facebook.github.io/origami/• Diseño de pruebas de laboratorio comparativas de aplicación

competencia vs propuesta.• Mejoraría la ux si una revisión es echa únicamente por diseñadores??• Usar caratulas de dispositivos hechos de cartón para simular un

smartphone o tablet de una forma mas completa, de tal manera que los mockups los podamos poner dentro de la caratula y ya tengamos rápidamente una aplicación y smartphone hechos de papel y cartón.