Text

Diseo de apps mviles

@juaneladio
Cosas que NO
debes hacer en mviles
No intentes esto en casa
No estn haciendo una sbana
Tampoco es una pantalla fja
No slo muestres informacin
No reinventes la rueda
No haas apps para inenieros
No debes resolver TODO
No debes eleir una plataforma
!o qui" s#$
%ean &'
(lo como dato
%ean &'
Declarar
supuestos
Retroalimentacin
e investigacin
Crear un
MVP
Correr un
experimento
)hora s#
*l taller
+arte prctica ,

Formacin de grupos de trabajo

Concepcin de una app

u! problema soluciona"

Cu#l es su objetivo"

Cu#l es su valor agregado $ di%erenciador"

*jemplo

Concepcin de una app: Vas de Lima

&oluciona el problema de uso de transporte

p'blico en una ciudad

(usca o%recer in%ormacin con)able de las rutas

de transporte de una ciudad

&e di%erencia de las dem#s por*ue se apo+a en

in%ormacin del usuario + reporta los puntos m#s
congestionados
+arte prctica -

Concepcin del usuario de la app:

proto-persona

Cara + nombre

,n%ormacin demogr#)ca $ comportamiento

Puntos de dolor + necesidades

Posibles soluciones
*jemplo

-suario de V.as de /ima

0ombre1
2os! Pas*uel

,n%ormacin demogr#)ca $ comportamiento1

34 a5os6
estudiante universitario6
vive en &an 2uan de Mira7ores6
presupuesto reducido6
clase media
*jemplo

-suario de V.as de /ima

Puntos de dolor $ necesidades1

8a+ 9oras l.mite para tomar buses6
debe llegar a tiempo a clases :en la -0,; o a
recoger a su enamorada :vive en &an (orja;6
debe aprovec9ar el medio pasaje en transporte
p'blico

Posibles soluciones1
<9orrar en pasajes6
recibir avisos de otros usuarios acerca de estado
de rutas o paraderos
+arte prctica .

Concepcin de funcionalidades de la app

Funcin = Para *u! sirve

Categori>arlas entre principales + secundarias

Concepcin del diagrama de arquitectura de

informacin

Cmo se distribu+en las pantallas"

Cmo se relacionan entre s."

+atrones de diseo mvil
&na u#a rpida
+atrones/ Naveacin
+atrones/ Naveacin !-$
+atrones/ 0ormularios
+atrones/ Tablas 1 listas
+atrones/ 23squedas
+atrones/ Ordenamiento
+atrones/ 0iltrado
+atrones/ 2arras de herramientas
+atrones/ 4rfcos
+atrones/ 5nvitaciones
+atrones/ 6etroalimentacin
+atrones/ 5nteraccin
+atrones/ )1uda
&n modelo de interaccin
building)re%oxos?com
0irefo7 O( 2uildin 2loc8s
+arte prctica 9

Concepcin de las pantallas de la app

Cu#les son las pantallas principales"

Cu#les permiten seguir una tarea completa"

:s patrones ; lovel1ui<com
:s patrones ; pttrns<com
:s ; mobile;patterns<com
)ndroid/ oole<com=desin
iO(/ developer<apple<com=librar1=ios=desin=
>?u@ siueA

Prototipado

ue las pantallas tengan la secuencia lgica

Test de usabilidad

ue sea probado por terceros6 sin gu.a pero con

seguimiento
B una 3ltima cosa ms
O qui" dos
?ui" no necesitas eleir una
plataforma
:o"illa )ppma8er
apps<Cebma8er<or=desiner
D4raciasE

2uan @ladio &#nc9e> Rosas

Ajuaneladio

Mo>illa Per'

Amo>illaperu