Guía breve para diseñar para el sistema operativo Windows Phone

1. Ulises Urban 14/12/2012

2. Antes de comenzar…

3. Fight!

4. Windows Phone es un
sistema operativo móvil
desarrollado por Microsoft
como sucesor de la
plataforma Windows
Mobile.
http://es.wikipedia.org/wiki/Windows_Phone

5. Para crear
hay que usar

7. Dispositivos WP8
Nokia Lumia 920 Nokia Lumia 820 Windows Phone 8S by HTC

8. Dispositivos WP7
Nokia Lumia 900 Nokia Lumia 800 Nokia Lumia 710 Nokia Lumia 610

14. Rincón infantil

15. Hub de contactos

16. Grupos

23. Hub de Office

24. Música + Videos

25. Aplicaciones + Juegos

26. Correo + Mensajería

27. Fotos + Cámara

28. Etiquetado fácil de caras

31. Tenlo en tus manos

32. Go!

34. Volume up Power/slee
and p
volume
down
Camera
Back Start Search

36. Tamaño de pantalla
480 px
800 px

37. 32 px

38. 72 px

39. 48 px
48 px

42. Tipografía
Segoe

43. Gestos

44. Atención en el detalle
12px
12px

45. Atención en el detalle

46. Panorama control

47. Pivot control

48. Alineación

49. Elementos

50. Espaciado

51. Jerarquías

52. Ponle estilo

53. Ponle estilo

54. Menos es más

55. Multiplataforma

56. Tiles

57. Lock Screen

58. Proceso de
creación

59. Concepto

60. Piensa en el usuario

61. ¿Para quiénes diseñamos?: Ana + Miles
Ana
Profesionista de medio tiempo y mamá
“Mi vida es balancear mi trabajo, familia, amigos,
y mis propias necesidades.”
Miles
Desarrollando su propio negocio de arquitectura
“Me encanta manejar mi vida en tiempo real
porque puedo sacar inspiración de cualquier
cosa… ya sea un nuevo proyecto, un juego
o un momento con Ana.”

62. Video: meet Anna

64. Estructura

65. Navegación

66. Navegación

67. Diseño

68. Ejemplos Halo Waypoint

69. Ejemplos Halo Waypoint

70. Ejemplos Zara

71. Ejemplos Zara

72. Ejemplos Zara

73. Ejemplos Zara

74. Documentación

76. INFORM ATION M AP
contoso news
latest video most popular
news LIVE FROM THE STUDIO
Watch Contoso News live
1 Lorem ipsum dolor sit amet,
consectetur adipiscing elit.
live tv NAM BIBENDIUM
2 Dolor sit amet, consectetur
Vestibulum ante ipsum primis in
contact us 3 Lorem ipsum dolor sit amet,
consectetur adipiscing elit.
SED EU NEC IPSUM
Lorem ipsum dolor sit amet, ectetur FAUCIBUS PHARETA 4 Adipiscing elit. Lorem ipsum
Duis sit amet volutpat diam. Duis Watch Contoso News live dolor sit amet, consectetur .
tempus risus auctor augue facilisis at
LOREM IPSUM
Watch Contoso News live
BREAKING NEW S
Rape Row: ‘Clarke should be
sacked’
Queen visits Dublin’s iconic
Croke Park
LIVE TV
Start Tile
01 02 03 11 06
NEWS NEWS NEWS CONTACT US
top stories uk new uk news sport pol sport politics business world celebrity Name
BREAKING NEW S BREAKING NEW S Lorem ipsum dolor sit amet,
Email
Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, consectetur adipiscing elit.
consectetur adipiscing elit. consectetur adipiscing elit.
Aliquam congue vehicula Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, VIDEO PLAYER Phone
diam eu gravida. consectetur adipiscing elit. consectetur adipiscing elit.
Sed adipiscing, nibh a Lorem ipsum dolor sit amet, Lorem ipsumdolor sit amet, Location
tincidunt aliquam, purus mi consectetur adipiscing elit. consectetur adipising elit Current Show
BREAKING NEW S Comments
Lorem ipsum dolor sit amet, Lorem ipsumdolor sit amet, LOW M ED HIGH
Congue vehicula diam eu consectetur adipiscing elit. consectetur adipising elit
gravida.
Pin to start Toggle Button: Radio Buttons to adjust
Lorem ipsumdolor sit amet, Lorem ipsumdolor sit amet, Lorem ipsumdolor sit amet, screen the streaming quality
consectetur adipising elit consectetur adipising elit Play and Stop
consectetur adipising elit
A tincidunt aliquam, purus Lorem ipsumdolor sit amet, Lorem ipsumdolor sit amet,
mi molestie enim consectetur adipising elit consectetur adipising elit
refresh refresh refresh send attach cancel
Standard attach picture
experience
09 10 15 12 13 14
BREAKING NEW S Congue vehicula diam eu CONTACT US YOURmessage
Close REPORT CONTACT US Delete attachment
YOUR REPORT
Congue vehicula diam eu gravida. Your report comments
Are you sure you wish to remove photoname
Your report message?
Name Discard from this comments
gravida. Name
This message will be deleted Name Name photo name photo name
yes
remo no
ve
Email Cancel
Email Email Email
Return to the message for further editing
Phone
Phone Phone Phone
Last updated 12:30 17/ 05/ 2011 Sending to Contoso New
Location
Last updated 12:30 17/ 05/ 2011 Location Location
Lorem ipsum dolor sit amet, consectetur Location
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus libero leo,
adipiscing elit. Vivamus libero leo, ullamcorper ac blandit in, pretium ac Comments Only displayed If the user has entered
ullamcorper ac blandit in, pretium ac dolor. In laoreet porta aliquet. Comments Comments
dolor. In laoreet porta aliquet.
text into any of the fields Comments
Cum sociis natoque penatibus et magnis
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus photo name
dis parturient montes, nascetur ridiculus mus. Praesent elit urna, sodales quis remove photo name photo name photo name
mus. Praesent elit urna, sodales quis gravida vehicula, scelerisque vitae orci. remove remove remove
gravida vehicula, scelerisque vitae orci.
Aliquam vitae tortor et velit porta Aliquam vitae tortor et velit porta
tincidunt. tincidunt. Cras eros nisi, tincidunt vitae
back refresh share forward back refresh share forward send attach cancel send attach cancel send attach cancel send attach cancel
11 16 17
YOUR REPORT
Error
There was a problem sending this message to
Your report comments
Contoso News Channel
Name
Retry Cancel
Email
VIDEO PLAYER
Phone
SUCCESS
return to
Location
previous screen
Comments
18 18
photo name
remove SETTINGS
SETTINGS
Refresh Rate
facebook 5 minutes
1 minutes
0
twitter Facebook and Twitter web
1 minutes
5
authentication
send attach cancel
version
email Standard choose email
account screen 1.1.2.3
support
support@contosonews.com
online content
terms of use
privacy statement
settings
refresh
panorama application bar
Windows Phone Depth Partner Support Team

78.  ¡Gracias!
Ulises Urban
@ulises_urban
ulises.urban@tesseractspace.com