doc.resistro android market

8/17/2019 Doc.resistro Android Market

1/155

Nuevos medios de interacción aplicados al

desarrollo de productos multimedia.

Enero 2013

Más allá del clic


2/155

Objetivo

• "#$%$&'(# &)$*(% +,#-(% .$ /&'$#(00/1&(23/0(.(% ( 3,% 2#,.)0',% -)34-$./(5

•

6,%'#(# 3(% 7(%$% .$3 8$%(##,33, .$ )& 2#,9$0',-)34-$./( /&'$#(04*, 9 3,% :$%)3'(.,% .$;2#$&./


3/155


4/155

Clic / Touch


5/155

Multitouch / Gesture


6/155

Clic / Touch / Multitouch


7/155


8/155

Te veo

@& 2#/-$# 2(%, A(0/( 3( /&'$>#(0/1& .$ 3(% 2$#%,&(%

0,& 3,% .$%(##,33,% -)34-$./( $% B)$ 3( /&'$#(00/1&

0,& $%'(% (23/0(0/,&$% 9 0,& 3,% */.$,=)$>,% %$

2)$.( A(0$# %/& '$&$# B)$ ',0(#3(% C%/0(-$&'$5D%'(-,% A(E3(&., .$ .$'$00/1& .$ -,*/-/$&',5

F( G$E0(- $% #$(3-$&'$ $3 -(&., .$ &)$%'#(

(23/0(0/1& 9( B)$ $% B)/$& .$'$0'( 3, B)$ A(0$-,%9 %$ 3, '#(&%-/'$ ( 3( (23/0(0/1&5


9/155

Expositores interactivos


10/155

Rural Games


11/155


12/155


13/155


14/155


15/155


16/155

La innovación a tu alcance

F( /&&,*(0/1& &, $% %13, 0,&0$E/# &)$*(% +,#-(% .$

/&'$#(0')(#H '(-E/I& $% /&&,*(0/1& 0(-E/(# 3( +,#-(

$& B)$ )%(-,% 3(% B)$ 9( '$&$-,% 9 0,&,0$-,%5

6)0A,% .$ 3,% $%2(0/,% -)34-$./( B)$ /&0,#2,#(&

>#(&.$% .$%(##,33,% 9 >#(&.$% /&+#($%'#)0')#(%

4$&$& 3)>(# $& )&( )E/0(0/1& C%/0( 0,&0#$'( 9 3(%

2$#%,&(% B)$ 3,% */%/'(& %$ 33$*(& .$ $33,% #$0)$#.,%9 %$&%(0/,&$%5


17/155

Códigos QR. Información Ubicua


18/155


19/155

Cada vez más fácil


20/155

Fases de un Proy. Mult. Interactivo


21/155

El cómo y el cuándo


22/155

Primero los objetivos

D3 ./%$J, .$ )& 2#,9$0', -)34-$./( /&'$#(04*,

$% )& 2#,0$%, %$0)$&0/(3 B)$ %$ .$%(##,33(

2$&%(&., -K% $& 3(% 2$#%,&(% B)$ 3, *(& (

)43/


23/155

Ahora unas consideraciones generales

F( 0,&0$20/1& .$ )& 2#,9$0', -)34-$./(H %$ .$E$&

'$&$# 2#$%$&'$% 0#/'$#/,%L

• !"#$%$&'#(%)

•

+%$%,%-%.).• /0'1%$%,%-%.).

• 230'#.%4)5'

•

6''.,)(7


24/155

Un proyecto multimedia …

MN !" $"%" $&!"'() *+ &+,")-(." /)0(+&1($/ 2 "!,)*.,*)($/ $/+$"

3/! "3"4"+,/! 5"+" !&"46)" "3 4&!4/ !&0+&7.($/ 2 (6()"."+ "+

3(! 4&!4(! 6/!&.&/+"!8 9(.&"+$/ :*" "3 6)/."!/ $" (6)"+$&1(;"

$" 3/! *!*()&/! 6()( 6/$") &+,")(.,*() ./+ 3( (63&.(.&


25/155

Proceso de Diseño Proy. Mult. Interactivo


26/155

Fase I: Maqueta

D%'( +(%$ *( -K% (33K .$ )& $%B)$-( ( -(&,

(3


27/155

Fase I: Maqueta! Wireframing

DP/%'$& -)0A(% (23/0(0/,&$% B)$ 2$#-/'$&

./%$J(# )& E,0$', $& +,#-(', ./>/'(3H

=762>6$:7)-H 9 .(#3$ */.(H 2)./$&., A(0$# B)$

3,% ,E=$',% '$&>(& 0,-2,#'(-/$&',% 9#$%2,&.(& ( $*$&',% .$ 3( -/%-( +,#-( $& 3(

B)$ 3, A(#K& $3 2#,9$0', Q&(35


28/155

Fase I: Optimización con Wireframing

•

6$=,#(# .$ 3( 0,-)&/0(0/1& $&'#$ 3(%

$-2#$%(% .$%(##,33(.,#(% 9 3,% 03/$&'$%H

A(0/I&.,3( -K% R)/.( 9 03(#(H 2$#-/4$&., *$#

#$%)3'(.,% .$%.$ 3( 2#/-$#( #$)&/1&5• 6$=,#(# 3( 0,-)&/0(0/1& $&'#$ 3,% ./%4&',%

2$#Q3$% 2#,+$%/,&(3$% /&*,3)0#(.,% $& 3(

0#$(0/1& .$3 2#,.)0', .$&'#, .$ )&( $-2#$%(

-)34-$./( %$( -K% K>/3 9 $+$04*(5


29/155

Fase I: Plantilla Wireframing (ai, eps)


30/155

Fase I: Soluciones Wireframing


31/155

Fase I: Maqueta


32/155


33/155

Fase II: Optimización de Recursos


34/155

Fase II: No todo vale

S, '$&$-,% +,#-(',% &/ %,2,#'$% T&/0,% 9 3(-KP/-( $& $3 (00$%, ( 3( /&+,#-(0/1& $%'K $& %)./%2,&/E/3/.(. '(&', ( &/*$3 .$ A,#(#/,%H .$)E/0(0/1& 2(#( $3 (00$%, 9 .$3 ./%2,%/4*,)43/


35/155

Fase II: Contenidos


36/155


37/155

Fase III: Como anillo al dedo

D& )& 2#,9$0', -)34-$./( /&'$#(04*,H-)34./%0/23/&(# 2,# &(')#(3$#/.(. 9 3( 0,&Q.$&0/(3/.(. .$ 3,% $3$-$&',%&$0$%(#/,% 2(#( 0(.( +(%$ .$3 2#,9$0',5


38/155

Fase III: Repositorio


39/155


40/155

Fase IV: La varita mágica

@&( (23/0(0/1& -)34-$./( $% )& 0,3$00/1& .$,E=$',% B)$ 4$&$ 2#,2/$.(.$% $%2$0?Q0(% 9 B)$#$%2,&.$& ( 3( /&'$#(00/1& 0,& $33,% ( '#(*I% .$3( #$%2)$%'( ( $*$&',% 5

F(% $%2$0/Q0(0/,&$% .$Q&$& 3(% 2#,2/$.(.$% 9

3,% $*$&',% B)$ %$ .$E$& (%/>&(# ( 0(.( ,E=$',H%/$&., +)&0/1& .$3 ./%2,%/4*, $& $3 B)$ %$ *(& (

)43/


41/155

Fase IV: Programación


42/155


43/155

Fase V: Cerrando el ciclo

V,., 3, B)$ &,% #,.$( 4$&$ )& 0/03, .$ */.( B)$

0)3-/&( $& )& 2#,.)0', , $& )& %$#*/0/,5

–

@& $B)/2, .$Q&$ )& $%'#('$>/( 9 %$ 2#$2(#(

.)#(&'$ ',.( 3( %$-(&( 2(#( $3 2(#4., .$3 .,-/&>,5V,.,% %(E$& 3, B)$ 4$&$ B)$ A(0$# 9 0,-, '#(E(=(#

$& $B)/2,5

– @& 0,0/&$#, %(E$ $3 23(', *( ( 2#$2(#(# 9 E)%0( 3,%

/&>#$./$&'$% -K% (.$0)(.,%H 3,% 2#,0$%( 9 ',.,% =)&',% 0#$(& &)$*(% $P2$#/$&0/(% 2(#( $3 2(3(.(#5


44/155

Fase V: Proyecto


45/155


46/155

Listos para interactuar


47/155

Diciembre 2012

Innovaciones en el desarrollo de

aplicaciones Web.

Movilidad y portabilidad


48/155


49/155

Información Ubicua

2(('$" 9: ; <

2(('$" 9: ; < ; =,%()(%>#

2(('$" 9: ; < ; =,%()(%># ; ?%$3"$%@1"

A"$ 8$8)0%"$ B8'0'C"$ )(('.'0 ) -)

%#D"0C)(%># (8)#." B8'0)C"$E ."#.'

B8'0)C"$ F ("# '- .%$3"$%@1" B8' B8'0)C"$G


50/155

HI8J ("#$8C" K)('C"$ .'("#&'#%."$ L',M

Información Ubicua


51/155


52/155

e, m, t, u …. *-learning

D-2$


53/155

Serious Game

F,% U$#/,)% W(-$ %,& )&( &)$*( +,#-( .$

(2#$&.$#H -K% /&'$#(04*( 9 ./&K-/0( B)$

0,&%/%'$ $& 3( 0#$(0/1& .$ $&',#&,% .$

$&'#$'$&/-/$&', (23/0(.,% (3 %$0',# $.)0(4*,5230'#.'0 K)(%'#." NO 230'#.'0 58P)#."


54/155

Simulador de entrevistas


55/155

Soluciones para Serious Game


56/155


57/155


58/155

Códigos QR. Requisitos

Q'-JD"#" C>1%-

!RC)0) %#&'P0).)

S"TL)0' -'(&"0 .' !>.%P"$ IU

2(('$" V#&'0#'& WX3(%"#)-Y


59/155

Códigos QR. Acceso a la información


60/155

Códigos QR. Acceso a la información (II)


61/155

Códigos QR. Acceso a la información (III)


62/155

Códigos QR. Creando contenidos (I)

ZXINGhp://code.google.com/p/zxing/


63/155

Códigos QR. Creando contenidos (II)



64/155

Códigos QR. Creando contenidos (III)



65/155

Códigos QR. Turismo


66/155

Códigos QR. Marketing Viral


67/155

Códigos QR. Decoración QR


68/155


69/155

Geoposicionamiento

F,0(3/


70/155

Geoposicionamiento. Ejemplo (I)


71/155

Geoposicionamiento. Ejemplo (II)


72/155

Geoposicionamiento yRealidad Aumentada. Museística


73/155

Realidad Aumentada

F( U')-%.). 28C'#&).) , ;)>-$&'$. :$(3/'90,&%/%'$ $& )& 0,&=)&', .$ ./%2,%/4*,% B)$

(J(.$& /&+,#-(0/1& */#')(3 ( 3( /&+,#-(0/1&

C%/0( 9( $P/%'$&'$5 D% )&( '$0&,3,>?( /&&,*(.,#(

#$3(0/,&(.( 0,& 3( :$(3/.(. X/#')(3 .$ 3( B)$ %$

./+$#$&0/( $& B)$ 3( :$(3/.(. ;)-$&'(.( &,

%)%4')9$ ( 3( #$(3/.(. C%/0(H %/&, B)$ 3,%

$3$-$&',% */#')(3$% %$ /&'$>#(& $& $3 -)&.,#$(3Y %$ %,E#$/-2#/-$&5


74/155

RA. Video Comercial


75/155

RA. Aplicación Comercial


76/155

RA. Herramientas


77/155


78/155

¿Quién manda en la Red?

2.",' 6-)$K

Z%(0"$"T S%-1'0-%PK&

[QZA\]!!S^


79/155


80/155

Adobe Flash Platform


81/155


82/155

Microsoft Silverlight


83/155


84/155

HTML5

?'$.' 9__`E '- #8'1" 08C," 3)0) '- .'$)00"--"

.' 3RP%#)$ F ("#&'#%."$ L',G

ZR;%C) .%D8$%># P0)(%)$ ) 233-' F $8$

.%$3"$%@1"$ C>1%-'$GS' 3-)#&') B8' $') '- a$8$@&8&"b .' 2.",'

6-)$K ("C" '$&)#.)0 .' -) L',G

2.",' 3"#' '# '- C'0()." 2.",' c.P'


85/155

HTML5. Novedades

Z(-2, .$ *, (&. 8#,2;)./, 9 X/.$, V(>%

]$E +,&'%

F,0(3 U',#(>$N


86/155

HTML5. Geoposicionamiento


87/155

HTML5. Geoposicionamiento (Código)


88/155

HTML5. x-webkit-speech

O 1'0$%># dd


89/155

HTML5+CSS3


90/155

HTML5. Adobe Edge


91/155

HTML5. Adobe Edge


92/155


93/155

Multidispositivo - Multiespecificaciones


94/155

www.thecrazytable.com

Caso práctico. Especificaciones:

• WEB QUE PERMITA INTERACTIVIDAD •

QUE SE AJUSTE AL TAMAÑO DE LAS PANTALLAS • QUE SE AJUSTE A LA ORIENTACIÓN DE LOS DISPOSITIVOS •

QUE SE VEA EN TODOS LOS DISPOSITIVOS MÓVILES•

QUE SOLO CARGUE LO NECESARIO •

QUE CARGUE RÁPIDO


95/155

Usuarios de escritorio: Desktop


96/155

Usuarios móviles = 320x480


97/155



98/155



99/155



100/155

Usuarios móviles = Otros


101/155

www.thecrazytable.com

MEDIA QUERIES


102/155

Dreamweaver. Webs MultiScreen

l d d b l d d


103/155

Movilidad y Portabilidad

La clave del éxito es dimensionar el

proyecto correctamente yajustarse a las especificacionesestablecidas en la fase de diseño.


104/155

Diciembre 2012

Desarrollo de aplicaciones de

entretenimiento.

Juegos y multimedia


105/155

No hay excusa para no crear

U,& -)0A,% 9 *(#/(.,% 3,% $&',#&,% .$ .$%(##,33, .$*/.$,=)$>,%H 2$#, ',.,% 4$&$& $& 0,-T& $3 A$0A, .$B)$ 2$#-/'$& .$%(##,33(# 2#,.)0',% 2(#( ./%4&',% 42,%.$ */.$,0,&%,3(%H 2(#( ,#.$&(.,#$% .$ %,E#$-$%( 9-)0A,% .$ $33,% '(-E/I& 2(#( ./%2,%/4*,% -1*/3$%5

"(#( (B)$33,% B)$ B)/$#$& .$%(##,33(# =)$>,% .$ +,#-(

,0(%/,&(3 $P/%'$& 3/E#$#?(% 2(#( >$%4,&(# $%'$ 42, .$$3$-$&',% 9 2(#( >$%4,&(# 3,% -(&.,% .$ 3(%

*/.$,0,&%,3(% 9 (2#,*$0A(# %)% 2#$%'(0/,&$%5

d b


106/155

Entornos de trabajo

J AS3


107/155

Juegos con AS3

C T bl P ll


108/155

Crazy Table – Pantalla acceso

C T bl P t ll ú


109/155

Crazy Table – Pantalla menú

C T bl P t ll l


110/155

Crazy Table – Pantalla colorear


111/155


112/155

ESPECIFICACIONES


113/155

ESPECIFICACIONES

^; B)/I& *( .$%4&(., $%'$ =)$>,_

^Z1-, %$ =)$>(_ ^U$ >)(#.( /&+,#-(0/1& .$ 0(.( =)$>,_

^81&.$ *( ( $%'(# ./%2,&/E3$_ "3('(+,#-(H 8/%2,%/4*,H N

^Z1-, %$ *( ( 0,-$#0/(3/


114/155

Especificaciones

Ad b Fl h P f i l


115/155

Adobe Flash Professional

Confi a ión d s ifi a ion s (I)


116/155

Configuración de especificaciones (I)

8$%\',2 ;23/0(0/,&$% ;`:

Configuración de especificaciones (II)


117/155

Configuración de especificaciones (II)

/aU ;&.#,/.


118/155

Bocetos Menú


119/155

Bocetos - Menú

Bocetos Pintura 1


120/155

Bocetos – Pintura 1

Bocetos Pintura 2


121/155


Bocetos Pintura 3


122/155


Bocetos – Volver a pintar


123/155

Bocetos – Volver a pintar


124/155

Fase de adecuación de medios


125/155

Fase de adecuación de medios

W$&$#( 9 (.(2'( -1.)3,% .$ /&+,#-(0/1&-)34-$./( /&'$>#(&., +)$&'$% .$ /-(>$& Q=(

b/3)%'#(0/1& 9 +,',>#(C(cH /-(>$& $& -,*/-/$&',

b*?.$, 9 (&/-(0/1&cH %,&/., 9 '$P',H

#$3(0/,&(&., 3( -,.(3/.(. &(##(4*( .$ 3,%

2#,9$0',% -)34-$./( 0,& $3 (=)%'$ .$ 3(%

0(#(0'$#?%40(% 'I0&/0(% 9 +,#-(3$% .$ 3(% +)$&'$%

9 -1.)3,% .$ /&+,#-(0/1&5

Formato gráfico


126/155

Formato gráfico

X$0',#/(3 2(#( 8$%\',2

•

Z(2(0/.(. .$ $%0(3(.,5

:(%'$# 2(#( 6,E/3$• a24-/


127/155

Galería gráfica

Galería de componentes


128/155

Galería de componentes

Diseñando para cada dispositivo


129/155

Diseñando para cada dispositivo


130/155

Fase de creación y gestión repositorio


131/155

Fase de creación y gestión repositorio

Z('(3,>( 3(% +)$&'$% 9 -1.)3,% .$ /&+,#-(0/1&-)34-$./( (&(3/


132/155

Repositorio de contenidos


133/155

Fase de programación de interactividad


134/155

Fase de programación de interactividad

W$&$#( 3,% $3$-$&',% /&'$#(04*,% .$ )&2#,9$0', -)34-$./(H /&'$>#(&., +)$&'$% .$

(&/-(0/1&H /-(>$&H %,&/., 9 '$P', (&(3/


135/155

Programación para 1 figura


136/155

Fase de creación del proyecto/producto


137/155

Fase de creación del proyecto/producto

W$&$#( 9 %/&0#,&/)/1&5

Programación para “n” figuras


138/155

Programación para n figuras


139/155

Especificaciones AIR


140/155

Especificaciones AIR

Especificaciones Android (I)


141/155

Especificaciones Android (I)

Especificaciones Android (II)


142/155

Especificaciones Android (II)

Especificaciones iOS (I)


143/155

Espec ficac o es OS ( )

Especificaciones iOS (II)


144/155

p ( )


145/155

Iconos para publicación


146/155

p p

Iconos para Android


147/155

p

Especificaciones Android Market


148/155

p

Pantalla promocional Android


149/155

p

Iconos para Apple


150/155

p pp

Apple Store


151/155

pp

Ad2Lee.$*$3,2$#5(223$50,-

Gestión Apps en Apple Store


152/155

pp pp

Pantallas registro App en Apple Store


153/155

Listos para interactuar


154/155


155/155

W:;Z`;U

%$#(Q& (3*(#$

doc.resistro android market

Documents