1
00:00:00,000 --> 00:00:02,420
[Powered by Google Translate] [Seminario - Windows 8 - desarrollo de aplicaciones / juegos con HTML5]

2
00:00:02,420 --> 00:00:05,090
[Chris Bowen, Edwin Guarin - Universidad de Harvard]

3
00:00:05,090 --> 00:00:07,350
[Este es CS50. - CS50.TV]

4
00:00:07,350 --> 00:00:10,290
>> Hey, todo el mundo. Mi nombre es Edwin Guarin. Este es Chris Bowen.

5
00:00:10,290 --> 00:00:12,310
Dejaré que presentarse a sí mismo en un segundo.

6
00:00:12,310 --> 00:00:14,100
Sólo quiero hacer un anuncio rápido.

7
00:00:14,100 --> 00:00:18,340
En primer lugar, todo lo que los estudiantes CS50 Obtenga Windows 8 gratis.

8
00:00:18,340 --> 00:00:23,150
Así que si usted está pensando en realidad a usarlo para su proyecto final, es tuyo.

9
00:00:23,150 --> 00:00:25,740
Nate enviará un correo electrónico más tarde para obtener instrucciones.

10
00:00:25,740 --> 00:00:32,850
La segunda cosa es que si usted decide escribir una aplicación de Windows 8 para su proyecto final CS50,

11
00:00:32,850 --> 00:00:35,870
vamos a estar haciendo algunos regalos: una Xbox,

12
00:00:35,870 --> 00:00:38,870
podríamos ser capaces de dar una pizarra de distancia, cosas así.

13
00:00:38,870 --> 00:00:42,460
Así que si hay algo que te detiene, vamos a Chris o lo sé

14
00:00:42,460 --> 00:00:45,010
cómo podemos ayudarle a crear algo realmente bueno.

15
00:00:45,010 --> 00:00:48,580
Así que gracias de nuevo por venir hoy, y voy a entregarlo a Chris.

16
00:00:48,580 --> 00:00:50,500
>> Gracias, Edwin.

17
00:00:51,000 --> 00:00:52,740
Gracias a todos por estar hoy con nosotros.

18
00:00:52,740 --> 00:00:55,800
Soy Chris Bowen. Soy uno de los colegas de Edwin aquí en el noreste.

19
00:00:55,800 --> 00:00:58,310
Quería simplemente pasar un poco de tiempo con usted hablando

20
00:00:58,310 --> 00:01:03,730
cómo hacer una aplicación de Windows Store con HTML5, JavaScript y CSS

21
00:01:03,730 --> 00:01:07,310
y el tipo de conseguir todas las preguntas que pueda tener al respecto respondieron para usted

22
00:01:07,310 --> 00:01:12,920
como usted está mirando hacia pensando tal vez de usarlo para una fase final oportunidad CS50.

23
00:01:12,920 --> 00:01:14,980
>> Dicho esto, vamos a bucear a la derecha adentro

24
00:01:14,980 --> 00:01:17,190
Voy a ir más a las diapositivas aquí.

25
00:01:17,190 --> 00:01:19,440
Si usted tiene alguna pregunta, no dude en enviarme un correo electrónico.

26
00:01:19,440 --> 00:01:23,460
Estoy cbowen@microsoft.com, y no es mi blog y mi Twitter.

27
00:01:23,460 --> 00:01:26,330
Sin embargo, usted quiere ponerse en contacto conmigo, eso está bien.

28
00:01:26,330 --> 00:01:30,110
Tengo alrededor de una hora de cosas, y quiero llegar a sus preguntas en el camino,

29
00:01:30,110 --> 00:01:33,720
así que no tenga miedo de tener preguntas durante este.

30
00:01:33,720 --> 00:01:36,470
Ellos no pueden ver quién está haciendo las preguntas relativas al registro,

31
00:01:36,470 --> 00:01:39,090
por lo que será tan anónimo como usted quiere ser.

32
00:01:39,090 --> 00:01:42,780
>> Déjame bucear en derecho, sólo le dará una introducción rápida a Windows 8,

33
00:01:42,780 --> 00:01:47,400
y le mostrará algunas de las cosas acerca de Windows Store aplicaciones que usted podría considerar

34
00:01:47,400 --> 00:01:49,530
y cuando usted está pensando en desarrollar una aplicación.

35
00:01:49,530 --> 00:01:52,660
Estamos pensando en Windows 8. Hemos estado fuera por un par de semanas.

36
00:01:52,660 --> 00:01:55,810
Una gran cantidad de adopción firme por ahí ya.

37
00:01:55,810 --> 00:01:59,800
Es posible que haya visto ya las máquinas de superficie que tenemos también.

38
00:01:59,800 --> 00:02:03,730
Hay uno aquí realmente puedes echar un vistazo a si usted está aquí en persona.

39
00:02:03,730 --> 00:02:07,530
Tengo muchas ganas de hablar contigo, te enseñaré un poco acerca de Windows 8.

40
00:02:07,530 --> 00:02:10,759
La idea con Windows 8, lo que realmente se presentará toda la materia que usted sabe acerca de Windows

41
00:02:10,759 --> 00:02:16,840
en algunas nuevas experiencias - en particular, las cosas como en la máquina de la superficie con un toque,

42
00:02:16,840 --> 00:02:20,000
este tipo de dispositivos más móviles que están ahora en el mercado,

43
00:02:20,000 --> 00:02:22,360
pero también es de Windows en su núcleo.

44
00:02:22,360 --> 00:02:25,850
Así que esto significa que usted puede instalar realmente en cualquier cosa que funciona con Windows 7,

45
00:02:25,850 --> 00:02:30,770
de su mayor SLI triple plataforma de juegos a su ordenador portátil

46
00:02:30,770 --> 00:02:36,200
y para sus nuevos y relucientes otros dispositivos que se puede recoger en la actualidad.

47
00:02:36,200 --> 00:02:38,450
Las tareas se ejecutarán en Windows 8.

48
00:02:38,450 --> 00:02:40,530
Te voy a mostrar todo un poco,

49
00:02:40,530 --> 00:02:44,670
y todas las experiencias que usted ve aquí son cosas que se pueden crear.

50
00:02:44,670 --> 00:02:47,760
La idea es si es táctil, ratón, teclado,

51
00:02:47,760 --> 00:02:51,870
sea ​​cual sea el dispositivo es que usted está funcionando su aplicación sobre, que va a funcionar muy bien.

52
00:02:51,870 --> 00:02:55,180
Windows 8 va a ayudar con todos esos escenarios.

53
00:02:55,180 --> 00:02:59,600
>> Estas diapositivas a un lado, vamos a tener derecho a echar un vistazo por aquí.

54
00:02:59,600 --> 00:03:03,270
Déjame mostrarte mi pantalla de inicio. Este es mi pantalla de inicio.

55
00:03:03,270 --> 00:03:05,810
Sólo te voy a dar un poco de un tour aquí.

56
00:03:05,810 --> 00:03:09,610
Estoy en una máquina que no toque, por lo tanto como yo quiero tocar la pantalla de mi ordenador portátil,

57
00:03:09,610 --> 00:03:13,400
no va a hacer nada, así que voy a desplazarse por aquí un poco y mostrarle.

58
00:03:13,400 --> 00:03:17,950
Algunas cosas que usted puede notar es el hecho de que éstas lo son llamados live tiles

59
00:03:17,950 --> 00:03:21,470
realmente puede animar, y pueden proporcionar información a usted -

60
00:03:21,470 --> 00:03:24,750
tal vez las actualizaciones en las estadísticas de un juego

61
00:03:24,750 --> 00:03:30,970
o mostrarle noticias de algunas de las aplicaciones anteriores que están aquí en el lado izquierdo.

62
00:03:30,970 --> 00:03:35,350
Eso es. Estoy seguro de que es sólo positivo y fantásticamente gran noticia.

63
00:03:35,350 --> 00:03:38,450
Se puede ver aquí es realmente llamar su atención de nuevo a la aplicación, diciendo:

64
00:03:38,450 --> 00:03:43,010
"Oye, hay algo nuevo aquí. Echa un vistazo. Vuelve dentro y ver qué hay de nuevo para usted."

65
00:03:43,010 --> 00:03:45,320
Eso se llama live tile, y usted puede hacer las notificaciones

66
00:03:45,320 --> 00:03:47,070
ya sea desde la propia aplicación

67
00:03:47,070 --> 00:03:52,220
o si usted toma una mirada en más detalle, te darás cuenta de cómo escribir un servicio remoto

68
00:03:52,220 --> 00:03:54,340
que en realidad se puede insertar información de la baldosa,

69
00:03:54,340 --> 00:03:56,520
que es lo que está pasando con estas aplicaciones de noticias.

70
00:03:56,520 --> 00:04:00,080
Ellos en realidad están recibiendo noticias de la nube y la actualización de la baldosa allí

71
00:04:00,080 --> 00:04:03,710
que la gente sepa que hay una razón para abrir la aplicación y echar un vistazo

72
00:04:03,710 --> 00:04:06,950
cualquiera que sea la última noticia es en cualquiera de estos

73
00:04:06,950 --> 00:04:10,060
o si hay nuevas recetas o su nueva puntuación para vencer

74
00:04:10,060 --> 00:04:13,560
o un amigo de juego o lo que sea en estas aplicaciones.

75
00:04:13,560 --> 00:04:15,550
Es algo para atraerlo de vuelta pulg

76
00:04:15,550 --> 00:04:18,640
Así que eso es los azulejos en vivo, y podría ser una persona, que podría ser un sitio web también.

77
00:04:18,640 --> 00:04:20,790
Por lo general, se trata de una aplicación.

78
00:04:20,790 --> 00:04:25,320
>> Casi todas estas cosas que tengo aquí vinieron de la Tienda Windows. Me lanzaré eso.

79
00:04:25,320 --> 00:04:27,890
Es una de las aplicaciones que se obtiene de forma predeterminada

80
00:04:27,890 --> 00:04:30,350
en cualquier máquina que ejecuta Windows 8.

81
00:04:30,350 --> 00:04:33,040
Usted puede venir aquí para encontrar todo lo que quieras,

82
00:04:33,040 --> 00:04:37,240
de las cosas que se destacan a los juegos que no he visto antes.

83
00:04:37,240 --> 00:04:39,440
Oh, wow, tenemos un nuevo pinball aquí.

84
00:04:39,440 --> 00:04:41,580
Puede instalar estos aquí en la tienda,

85
00:04:41,580 --> 00:04:43,420
y hablaremos acerca de cómo desarrollar estos.

86
00:04:43,420 --> 00:04:45,670
Usted tiene un montón de opciones en la forma en que los crea.

87
00:04:45,670 --> 00:04:49,020
Nos enfocaremos en la historia en JavaScript con HTML y CSS,

88
00:04:49,020 --> 00:04:52,790
pero para el usuario, al comprador de la aplicación, no importa lo que estaba escrito pulg

89
00:04:52,790 --> 00:04:54,670
Ellos pueden seguir adelante y trabajar con él.

90
00:04:54,670 --> 00:04:57,870
Estoy intrigado por esta, así que tengo que abrir esto y echar un vistazo.

91
00:04:57,870 --> 00:05:02,310
Todas las aplicaciones, incluidos los que se pueden enviar y vender o regalar de forma gratuita,

92
00:05:02,310 --> 00:05:06,240
todo lo que quieres hacer en la tienda, obtendrá una página de inicio como este.

93
00:05:06,240 --> 00:05:10,750
Usted puede presentar con su solicitud un montón de capturas de pantalla - que se ve un poco de aquí -

94
00:05:10,750 --> 00:05:15,970
detalles sobre la aplicación, y con el tiempo irás acumulando ambas calificaciones -

95
00:05:15,970 --> 00:05:19,020
que son, básicamente, sólo el número de estrellas - y opiniones,

96
00:05:19,020 --> 00:05:20,690
que proporcionan un poco más penetración.

97
00:05:20,690 --> 00:05:24,380
En realidad, alguien tiene que escribir algo y te dicen lo maravilloso que eres,

98
00:05:24,380 --> 00:05:29,300
y que va a entrar en su sección de comentarios aquí, que yo no he mirado.

99
00:05:29,300 --> 00:05:33,890
Fantástico. "Ni siquiera voy a abrir." Qué grande.

100
00:05:33,890 --> 00:05:39,000
Bueno, para la gente para quien esta se abrió y correr, parece que realmente disfrutar de ella. [Risas]

101
00:05:39,000 --> 00:05:43,770
Tenga esto en cuenta. La Internet. Cualquiera puede decir lo que quieran acerca de su aplicación.

102
00:05:43,770 --> 00:05:45,780
Así que asegúrate de que estás haciendo un gran trabajo con él,

103
00:05:45,780 --> 00:05:49,030
asegurarse de que está haciendo lo más cómodo para el usuario como sea posible

104
00:05:49,030 --> 00:05:52,720
porque son un par de clics de distancia de proporcionar una opinión,

105
00:05:52,720 --> 00:05:55,870
y que se acumularán hasta que su valoración global de revisión.

106
00:05:55,870 --> 00:05:58,990
Y usted quiere hacer lo mejor porque vas a estar en contra de otras aplicaciones.

107
00:05:58,990 --> 00:06:01,830
Habrá miles de aplicaciones que ya están en la tienda,

108
00:06:01,830 --> 00:06:06,880
y las ocasiones son, puede haber algo que lo hace una funcionalidad similar a lo que estás haciendo.

109
00:06:06,880 --> 00:06:12,740
Así que si usted realmente puede destacar entre la multitud, que va a ser a su ventaja, por supuesto.

110
00:06:12,740 --> 00:06:15,300
>> Vamos a entrar en la tienda un poco más tarde.

111
00:06:15,300 --> 00:06:17,090
Realmente me quiero centrar en la creación de aplicaciones.

112
00:06:17,090 --> 00:06:20,760
Pero la versión corta de la tienda es de distribución mundial,

113
00:06:20,760 --> 00:06:25,430
es automáticamente parte de Windows 8, la gente simplemente disparan hacia arriba y miren diversas aplicaciones aquí,

114
00:06:25,430 --> 00:06:29,070
usted tiene el Sticker Book Dress-Up y todo tipo de aplicaciones diferentes.

115
00:06:29,070 --> 00:06:33,690
Pintura fresca, yo uso mucho esto - mal, pero lo uso mucho.

116
00:06:33,690 --> 00:06:36,080
Me está mostrando que ya poseo.

117
00:06:36,080 --> 00:06:41,280
Te voy a enseñar algo que no tengo - UVideos no tengo como nuevo.

118
00:06:41,280 --> 00:06:43,660
Aquí se puede apreciar que es gratis, así que usted puede instalarlo desde el almacén.

119
00:06:43,660 --> 00:06:46,430
Usted tiene opciones también. Por supuesto, puede dar a la basura.

120
00:06:46,430 --> 00:06:49,660
Usted puede poner publicidad en la aplicación o juego.

121
00:06:49,660 --> 00:06:54,770
También puede cobrar por él, y que podría proporcionar fácilmente un juicio para la aplicación, así

122
00:06:54,770 --> 00:06:58,220
por lo que puede dejar a la gente probarlo durante una semana o lo que quieras hacer.

123
00:06:58,220 --> 00:07:01,540
Eso es personalizable a través del portal. Usted no escribe ningún código para eso.

124
00:07:01,540 --> 00:07:03,990
Así que usted dice, "Usted puede utilizar esto para una semana y luego tienes que comprarlo"

125
00:07:03,990 --> 00:07:07,130
o usted podría hacer cosas como: "Usted podría jugar los 3 primeros niveles de este juego

126
00:07:07,130 --> 00:07:09,820
"Y entonces usted tiene que comprar para acceder a los demás."

127
00:07:09,820 --> 00:07:12,310
Usted podría incluso hacer compras en la aplicación, así que se puede decir,

128
00:07:12,310 --> 00:07:17,880
"Tenemos aventuras o juegos de gráficos o cosas que se desbloquean adicionales -

129
00:07:17,880 --> 00:07:21,430
"Más recetas que se desbloquean -. Si usted compra estos conjuntos extendidos"

130
00:07:21,430 --> 00:07:24,260
Y usted puede hacer que todos dentro de la aplicación o el juego en sí.

131
00:07:24,260 --> 00:07:26,070
Por lo tanto, totalmente de usted, su elección.

132
00:07:26,070 --> 00:07:28,070
Hay un montón de cosas que se pueden hacer en la tienda,

133
00:07:28,070 --> 00:07:31,660
y luego, básicamente, le vas a enviar a un canal de certificación.

134
00:07:31,660 --> 00:07:35,380
Podemos hablar de todo eso un poco más tarde, pero esta es la meta.

135
00:07:35,380 --> 00:07:40,410
Usted desea conseguir su visibilidad en todo el mundo de aplicaciones en la tienda aquí.

136
00:07:40,410 --> 00:07:44,170
>> De vuelta a la pantalla de inicio aquí, me gustaría que le muestre todo un poco más.

137
00:07:44,170 --> 00:07:50,580
Si lanzo estas aplicaciones, te voy a dar un ejemplo de funcionalidad cruzada aplicación aquí.

138
00:07:50,580 --> 00:07:53,070
Para hacer eso, yo lanzaré Fresh Paint.

139
00:07:53,070 --> 00:07:55,550
Una cosa que usted ve aquí es cada bit de la pantalla,

140
00:07:55,550 --> 00:07:58,040
todos los píxeles de la pantalla, vaya a su aplicación.

141
00:07:58,040 --> 00:08:01,990
Atrás han quedado los días en que usted tiene estas fronteras alrededor de las ventanas

142
00:08:01,990 --> 00:08:05,120
con un montón de botones que siempre están ahí ocupando espacio todo el tiempo.

143
00:08:05,120 --> 00:08:09,430
Ahora usted realmente quiere alejarse de eso y tener su contenido sea el enfoque.

144
00:08:09,430 --> 00:08:13,710
Podemos hacer cosas con Windows mediante el acceso a otros tipos de menús.

145
00:08:13,710 --> 00:08:16,840
Uno de ellos es en realidad lo que se llama la barra de encantos,

146
00:08:16,840 --> 00:08:18,870
y que sale desde el lado de la pantalla.

147
00:08:18,870 --> 00:08:21,270
En realidad se puede película desde el lado si tiene una pantalla táctil,

148
00:08:21,270 --> 00:08:24,840
usted puede hacer clic derecho si tiene un ratón, hay un atajo de teclado para que,

149
00:08:24,840 --> 00:08:29,490
siempre hay más de una manera de hacer algo en el ambiente aquí.

150
00:08:29,490 --> 00:08:31,680
Eso lleva a cabo una serie de cosas que usted puede hacer.

151
00:08:31,680 --> 00:08:33,870
La más obvia es que pueda volver a la pantalla de Inicio,

152
00:08:33,870 --> 00:08:36,780
pero los otros 4 son lo que se llaman encantos.

153
00:08:36,780 --> 00:08:41,059
Son contratos que se puede conectar a como un desarrollador de aplicaciones. Están muy bien.

154
00:08:41,059 --> 00:08:43,340
Buscar, estoy seguro de que eso es algo que vas a hacer,

155
00:08:43,340 --> 00:08:44,950
compartiendo Te voy a mostrar en un segundo,

156
00:08:44,950 --> 00:08:48,450
y Dispositivos y Configuración, estas son todas las cosas que su aplicación se puede insertar

157
00:08:48,450 --> 00:08:51,960
para aprovechar Windows, para decir: "Yo he hecho mi parte

158
00:08:51,960 --> 00:08:54,700
"Y quiero que Windows admite alguna otra funcionalidad,

159
00:08:54,700 --> 00:08:56,750
"Y yo no quiero escribir un montón de código para hacer que eso suceda."

160
00:08:56,750 --> 00:08:59,480
Eso es realmente un beneficio del uso de estas características.

161
00:08:59,480 --> 00:09:01,340
Te voy a enseñar una.

162
00:09:01,340 --> 00:09:05,170
Para hacer eso, voy a hacer una nueva pintura.

163
00:09:05,170 --> 00:09:08,240
También hablé sobre el uso de cada píxel para su aplicación.

164
00:09:08,240 --> 00:09:11,850
De forma predeterminada, esto es lo que la aplicación de la pintura se ve como cuando usted lo está utilizando.

165
00:09:11,850 --> 00:09:14,960
Es realmente acerca de lo que está dibujando, tu sitio.

166
00:09:14,960 --> 00:09:20,850
Podía hacer cosas horribles aquí. ¿Qué debo dibujar? No se.

167
00:09:20,850 --> 00:09:23,110
Garabatos? Oh, genial. Yo puedo hacer garabatos. Fantástico.

168
00:09:23,110 --> 00:09:25,130
Un pavo? [Risas]

169
00:09:25,130 --> 00:09:28,500
Este es el más abstracto del pavo verá.

170
00:09:28,500 --> 00:09:31,780
También puedo traer lo que se llama la barra de la aplicación,

171
00:09:31,780 --> 00:09:33,850
y esto es realmente una de las principales formas que se pueden utilizar

172
00:09:33,850 --> 00:09:37,210
ocultar lejos de todas las cosas que podría haber sido en su aplicación o juego antes

173
00:09:37,210 --> 00:09:39,570
simplemente ocupando espacio todo el tiempo.

174
00:09:39,570 --> 00:09:43,270
Así que ahora usted puede ponerlo aquí, y esto es realmente una de las más hermosas experiencias

175
00:09:43,270 --> 00:09:46,380
con la barra de la aplicación que he visto.

176
00:09:46,380 --> 00:09:48,800
Ponga las opciones aquí para seleccionar diferentes colores.

177
00:09:48,800 --> 00:09:54,310
Queríamos un pavo, así que vamos a poner un poco de café aquí, empezar a mezclar en un par de colores.

178
00:09:54,310 --> 00:09:58,790
Vamos a tomar un color intermedio aquí y luego vuelve aquí.

179
00:09:58,790 --> 00:10:02,990
Usted puede empezar a dibujar. Ahí está su pavo. Fantástico.

180
00:10:02,990 --> 00:10:07,660
No puedo dibujar, para empezar, pero hacerlo con un touchpad en frente de una audiencia es incluso mejor.

181
00:10:07,660 --> 00:10:09,640
Esto es impresionante.

182
00:10:09,640 --> 00:10:13,030
La idea, sin embargo, es todo lo que me importa es aquí mismo en la superficie.

183
00:10:13,030 --> 00:10:17,060
Digamos que estoy muy satisfecho con esto que tengo que compartirlo con alguien.

184
00:10:17,060 --> 00:10:19,680
Normalmente lo que se puede hacer con otras versiones de Windows,

185
00:10:19,680 --> 00:10:22,900
usted tal vez tomar una captura de pantalla, que le hace algo de copy-paste del texto

186
00:10:22,900 --> 00:10:24,950
o cosas por el estilo que desea compartir a cabo,

187
00:10:24,950 --> 00:10:27,260
y luego ir y abrir otra aplicación y lo puso en ella.

188
00:10:27,260 --> 00:10:28,630
Aquí no tiene que hacer eso.

189
00:10:28,630 --> 00:10:32,400
En realidad se puede poner de manifiesto la barra de encantos y decir: "Quiero compartir esto."

190
00:10:32,400 --> 00:10:35,000
En este punto se va a mostrar todas las aplicaciones

191
00:10:35,000 --> 00:10:38,080
que saben cómo trabajar con lo que está siendo compartida.

192
00:10:38,080 --> 00:10:41,590
En este caso se trata de una imagen, por lo que va a decir: "Veo que tienes una imagen."

193
00:10:41,590 --> 00:10:45,590
"¿Quieres compartir eso?" Usted puede ver que el email a mí mismo cosas todo el tiempo.

194
00:10:45,590 --> 00:10:49,420
Reconoce que, y me está ofreciendo que como un acceso directo,

195
00:10:49,420 --> 00:10:53,270
Pero también me mostró todas las aplicaciones que sabe cómo lidiar con la toma de una imagen

196
00:10:53,270 --> 00:10:55,520
y hacer algo con ella.

197
00:10:55,520 --> 00:10:57,890
Todos ellos han indicado a Windows que puedan hacer eso.

198
00:10:57,890 --> 00:10:59,240
En este punto se trata de Windows.

199
00:10:59,240 --> 00:11:01,680
El usuario simplemente elige lo que quiere hacer con ella.

200
00:11:01,680 --> 00:11:06,610
Voy a hacer mi habitual de PuzzleTouch. Se puede ver que he creado todo tipo de rompecabezas en el tiempo.

201
00:11:06,610 --> 00:11:11,790
Tomaré PuzzleTouch y decir: "Quiero compartir esta creación increíble con PuzzleTouch."

202
00:11:11,790 --> 00:11:16,670
Se va a seguir adelante y decir: "Muy bien. ¿Quieres compartir esto? Fantástico."

203
00:11:16,670 --> 00:11:19,260
"¿Quieres hacer un rompecabezas que es fácil, intermedio, lo que sea?"

204
00:11:19,260 --> 00:11:20,800
Voy a hacer una intermedia aquí.

205
00:11:20,800 --> 00:11:24,890
Esto hace que el rompecabezas. Va a ser un tremendo rompecabezas, porque es en su mayoría en blanco.

206
00:11:24,890 --> 00:11:28,100
Pero es listo, y de hecho es nuevo en la otra aplicación.

207
00:11:28,100 --> 00:11:32,360
Si vengo aquí, puedo buscarlo y lanzarlo.

208
00:11:32,360 --> 00:11:38,100
Ahora bien, si nos desplazamos durante sólo un poco aquí, deberíamos ver mi creación en alguna parte.

209
00:11:38,100 --> 00:11:42,930
¿Qué hice? ¿Qué tipo de rompecabezas lo hago? ¿He hecho que sea fácil?

210
00:11:42,930 --> 00:11:46,110
Oh, ahí está, ahí mismo.

211
00:11:46,110 --> 00:11:49,550
[Risas] Es el rompecabezas de pavo fácilmente reconocible que está aquí.

212
00:11:49,550 --> 00:11:52,360
Pero lo que quiero señalar a usted, lo bueno aquí

213
00:11:52,360 --> 00:11:54,710
se las aplicaciones no sabían nada el uno del otro.

214
00:11:54,710 --> 00:11:58,740
Sólo dijo: "Tengo una idea para compartir, y sé cómo tratar con las imágenes."

215
00:11:58,740 --> 00:12:01,420
Y usted, como desarrollador, usted no tiene que escribir ese código.

216
00:12:01,420 --> 00:12:05,350
Cuando alguien me pide que compartir, me voy a poner algunos datos en esta pequeña estructura de datos

217
00:12:05,350 --> 00:12:06,740
y he terminado.

218
00:12:06,740 --> 00:12:10,990
La otra aplicación se hace cargo, hace su cosa, y ese es el final de la experiencia de compartir.

219
00:12:10,990 --> 00:12:14,550
Eso es una cosa que usted puede hacer - muy, muy potente -

220
00:12:14,550 --> 00:12:17,570
y que va a ser una de esas cosas que realmente podría ayudar a diferenciar su aplicación

221
00:12:17,570 --> 00:12:20,090
y también su juego demasiado en la tienda.

222
00:12:20,090 --> 00:12:22,220
La gente va a ser capaz de decir: "Esto es realmente útil."

223
00:12:22,220 --> 00:12:25,430
"Yo uso este creador de rompecabezas todo el tiempo. Es fantástico."

224
00:12:25,430 --> 00:12:30,490
>> Eso es suficiente de una breve descripción de lo que está pasando aquí.

225
00:12:30,490 --> 00:12:33,670
Hay un par de otras características también que a lo mejor vamos a destacar a medida que avanzamos a través de código.

226
00:12:33,670 --> 00:12:37,710
Pero quiero bucear en las diapositivas, y para hacer eso, yo voy a ir a escritorio,

227
00:12:37,710 --> 00:12:40,940
que es a su vez otra ficha en vivo aquí.

228
00:12:40,940 --> 00:12:43,840
Puedo entrar en esto y, por supuesto, estoy en mis diapositivas,

229
00:12:43,840 --> 00:12:46,320
pero déjame que te enseñe realmente dónde estamos.

230
00:12:46,320 --> 00:12:48,460
En realidad estamos en el modo de escritorio.

231
00:12:48,460 --> 00:12:52,580
Esto es realmente donde lo que estaba diciendo antes acerca de Windows llevar adelante

232
00:12:52,580 --> 00:12:54,850
a nuevas experiencias se muestra.

233
00:12:54,850 --> 00:12:56,450
Este es el de Windows ya sabes.

234
00:12:56,450 --> 00:12:59,730
Aplicaciones de Windows se denominan aplicaciones de escritorio. Corren aquí.

235
00:12:59,730 --> 00:13:02,730
Si has aplicaciones existente y desea ejecutar en Windows 8,

236
00:13:02,730 --> 00:13:04,710
todo se puede hacer eso.

237
00:13:04,710 --> 00:13:07,590
Estas no son las mismas cosas que las aplicaciones de la tienda, que son de aquí,

238
00:13:07,590 --> 00:13:12,240
como pintura fresca y estas aplicaciones y cosas así NBC News. Aquellos provendrá de la tienda.

239
00:13:12,240 --> 00:13:14,450
Pueden conectarse a algunas de las características que me estaba mostrando que

240
00:13:14,450 --> 00:13:16,620
y otros que no te he mostrado aún.

241
00:13:16,620 --> 00:13:21,460
Pero así que tenlo en cuenta. Tenemos el apoyo para estas dos cosas también.

242
00:13:21,460 --> 00:13:27,000
Lo siento. ¿Hay algo que no aparece en la pantalla? He perdido por completo. Eso es raro.

243
00:13:29,000 --> 00:13:31,000
Okay. Gracias por señalarlo.

244
00:13:31,000 --> 00:13:34,770
Lo que no ha estado viendo durante un tiempo es mi mostrándole que el escritorio está aquí.

245
00:13:34,770 --> 00:13:37,540
¿Qué es lo último que has visto? ¿Has visto esto?

246
00:13:37,540 --> 00:13:39,490
Este es el escritorio. Usted ya sabe lo que parece.

247
00:13:39,490 --> 00:13:42,070
No es nada terriblemente inusual.

248
00:13:42,070 --> 00:13:46,940
Es nuestra experiencia que lleva adelante para usted y que le permite usar las cosas que usted ha tenido.

249
00:13:46,940 --> 00:13:50,460
Por ejemplo, voy a estar mostrando Visual Studio. Es una aplicación de escritorio.

250
00:13:50,460 --> 00:13:52,600
Se va a ejecutar en este modo.

251
00:13:52,600 --> 00:13:54,960
Se va a apoyar a un entorno más complejo

252
00:13:54,960 --> 00:14:01,470
con un montón de opciones y cosas por el estilo, por lo que se convierte en una buena opción como una aplicación de escritorio.

253
00:14:01,470 --> 00:14:04,810
>> Dicho esto, vamos a ir a las diapositivas para un poco

254
00:14:04,810 --> 00:14:09,720
y le dará algo de contenido introductorio y luego entrar en la realidad de codificación aquí.

255
00:14:09,720 --> 00:14:14,070
La buena noticia es que he oído que has estado enfocando en un montón de CSS y JavaScript, HTML.

256
00:14:14,070 --> 00:14:18,110
Todas esas cosas que has estado aprendiendo equipaje directamente en la fabricación de ventanas de la tienda de aplicaciones.

257
00:14:18,110 --> 00:14:22,920
Las cosas que has estado oyendo acerca de la aplicación de los selectores CSS y todas esas cosas

258
00:14:22,920 --> 00:14:27,180
es exactamente lo que hacer para crear una aplicación aquí para la tienda.

259
00:14:27,180 --> 00:14:29,640
Vamos a ir a través de estas cosas poco a poco.

260
00:14:29,640 --> 00:14:34,130
Básicamente, estoy construyendo en las cosas que ya se han tomado el tiempo para aprender.

261
00:14:34,130 --> 00:14:36,520
Esta es la carta general de las tecnologías que puede utilizar

262
00:14:36,520 --> 00:14:38,790
para hacer aplicaciones para Windows 8.

263
00:14:38,790 --> 00:14:42,840
La materia de la derecha, las aplicaciones de escritorio, es realmente lo que ya sabemos.

264
00:14:42,840 --> 00:14:46,840
Eso es algo que es realmente el mundo de Windows 7 se arrastró a Windows 8.

265
00:14:46,840 --> 00:14:51,920
Todas esas opciones se trasladan al futuro: C #, VB, Win32 tipo de desarrollo.

266
00:14:51,920 --> 00:14:54,450
Grande. No hay problema. El nuevo material está en el lado de la mano izquierda.

267
00:14:54,450 --> 00:14:58,220
Eso es de Windows para almacenar aplicaciones, que es cuando yo quiero hacer mi solicitud de cableado en Windows 8

268
00:14:58,220 --> 00:15:02,300
utilizando todas esas características, lo consigue en la tienda, y conseguir que la experiencia realmente genial

269
00:15:02,300 --> 00:15:05,260
de las aplicaciones de Windows Store.

270
00:15:05,260 --> 00:15:10,350
Para hacer eso, usted puede ver aquí tienes todas las opciones con XAML, C + +,

271
00:15:10,350 --> 00:15:14,100
C #, VB, usted podría hacer DirectX, cosas así, cosas que van más allá de la diapositiva.

272
00:15:14,100 --> 00:15:18,650
Pero para nosotros, nos vamos a centrar en la derecha en el hecho de que el HTML, CSS y JavaScript

273
00:15:18,650 --> 00:15:22,890
son realmente un ciudadano de primera clase para hacer aplicaciones para Windows 8

274
00:15:22,890 --> 00:15:24,960
y para la Windows Store.

275
00:15:24,960 --> 00:15:27,950
Así que esto es bueno para todo el mundo aquí y la gente viendo en vídeo

276
00:15:27,950 --> 00:15:30,760
ya que sólo puede aprovechar todas esas experiencias que tienes

277
00:15:30,760 --> 00:15:33,900
y realmente atar en lo que ofrece de Windows.

278
00:15:33,900 --> 00:15:37,870
Vas a hacer que a través de un conjunto de API, lo que debería ser una sorpresa.

279
00:15:37,870 --> 00:15:39,920
Cada sistema operativo tiene sus propias APIs.

280
00:15:39,920 --> 00:15:43,530
Exponemos lo que Windows puede hacer a través de lo que se llama WinRT.

281
00:15:43,530 --> 00:15:46,370
Es un conjunto de API que sólo lo hace todo por usted.

282
00:15:46,370 --> 00:15:51,650
Si usted necesita para abrir los archivos, necesita utilizar la cámara, geolocalización, cosas por el estilo,

283
00:15:51,650 --> 00:15:55,700
pasan por lo que Windows puede ofrecer a usted.

284
00:15:55,700 --> 00:15:59,370
Para acceder a esto, tenemos un poco más de JavaScript que va a hacer que sea aún más fácil

285
00:15:59,370 --> 00:16:02,510
para que usted haga eso. Vamos a llegar a eso en un momento.

286
00:16:02,510 --> 00:16:04,060
Pero por ahora, eso es, básicamente, su hoja de ruta.

287
00:16:04,060 --> 00:16:06,770
Las cosas que usted ya ha estado haciendo en la parte superior de algunas API

288
00:16:06,770 --> 00:16:11,280
que le ayudan a trabajar con Windows es igual a la tienda de aplicaciones.

289
00:16:11,280 --> 00:16:14,210
Y eso es realmente todo lo que tienes que saber del alto nivel.

290
00:16:14,210 --> 00:16:17,370
>> Vamos a sumergirnos en realidad trabajan con las cosas ahora.

291
00:16:18,940 --> 00:16:21,950
Las cosas que usted probablemente ha visto un montón de,

292
00:16:21,950 --> 00:16:26,760
con IE9 hace un rato nos introduce soporte para una gran cantidad de la, en ese momento,

293
00:16:26,760 --> 00:16:30,340
nuevos estándares en la Web, por lo que una gran cantidad de nuevas características de CSS,

294
00:16:30,340 --> 00:16:34,380
una gran cantidad de nuevo HTML, ECMAScript 5, que es realmente JavaScript.

295
00:16:34,380 --> 00:16:38,090
Así que todo lo necesario para que a excepción de modo estricto estaba en IE9.

296
00:16:38,090 --> 00:16:42,290
Sólo un montón de cosas con CSS, CSS3, todo ahí.

297
00:16:42,290 --> 00:16:45,300
Y todo esto lleva adelante en lo que estamos haciendo con Windows 8.

298
00:16:45,300 --> 00:16:49,350
Usted puede utilizar estas cosas, y se puede utilizar todo lo que hay de nuevo en IE10.

299
00:16:49,350 --> 00:16:54,640
Con IE10 introducimos el apoyo a todas estas cosas también.

300
00:16:54,640 --> 00:16:59,340
Son todos con aceleración por hardware, así que si estás en un equipo que tiene algún tipo de GPU,

301
00:16:59,340 --> 00:17:04,190
que es probablemente casi todas las máquinas que se podía conseguir en los últimos 8 años,

302
00:17:04,190 --> 00:17:07,609
usted va a ser capaz de tener la salida acelerada de hardware,

303
00:17:07,609 --> 00:17:11,770
salida visual con CSS, Canvas, SVG.

304
00:17:11,770 --> 00:17:14,339
Todas esas cosas van a ir a través de la aceleración de hardware

305
00:17:14,339 --> 00:17:16,060
y ser mucho más rápido y más eficiente.

306
00:17:16,060 --> 00:17:20,440
La versión corta de todo esto - yo no voy a ir a través de cada cosa aquí -

307
00:17:20,440 --> 00:17:23,200
si lo ves en esta lista, si puede hacerlo en IE10,

308
00:17:23,200 --> 00:17:25,650
si se trata de una aplicación web que se está ejecutando que funciona en IE10,

309
00:17:25,650 --> 00:17:28,640
que es algo que puede hacer como una aplicación de Windows Store.

310
00:17:28,640 --> 00:17:33,100
Y eso es prácticamente todo. Así que si funciona en IE10, que va a trabajar como una aplicación de Windows Store.

311
00:17:33,100 --> 00:17:36,370
Es en la mesa como algo que se puede utilizar.

312
00:17:36,370 --> 00:17:40,510
>> Hay mucho aquí. No tenemos hasta la medianoche, así que no puedo opinar sobre todo lo de aquí.

313
00:17:40,510 --> 00:17:44,060
Sin embargo, hay algunos sitios que le ayudarán a entender lo que estas cosas se pueden hacer,

314
00:17:44,060 --> 00:17:45,520
y yo te voy a mostrar una de ellas en un segundo.

315
00:17:45,520 --> 00:17:48,410
Yo sólo quería señalar algunas de las cosas claves que usted puede ver.

316
00:17:48,410 --> 00:17:51,560
Tal vez usted ya ha visto algunos de estos en sus estudios,

317
00:17:51,560 --> 00:17:56,610
pero estos son realmente útiles, en particular con el Windows Store aplicaciones, desde el lado CSS.

318
00:17:56,610 --> 00:18:02,420
Así que ser capaz de hacer las transformaciones y transiciones, proporcionar el movimiento con la animación -

319
00:18:02,420 --> 00:18:07,010
Todos ellos forman parte de la CSS ahora, y están todos soportados por los navegadores modernos,

320
00:18:07,010 --> 00:18:11,370
y IE10 e IE9 ha añadido soporte a través del tiempo para todas estas cosas.

321
00:18:11,370 --> 00:18:15,220
Y ¿por qué escribe usted mismo, ¿por qué ir por todos los problemas de hacer estas cosas con la mano

322
00:18:15,220 --> 00:18:19,970
cuando se podría utilizar un simple CSS transforman para crear un efecto 3D para su aplicación?

323
00:18:19,970 --> 00:18:22,740
Grande. Así es como funciona.

324
00:18:22,740 --> 00:18:24,530
No puedo hacer que sea más difícil que eso.

325
00:18:24,530 --> 00:18:28,330
Si usted sabe cómo hacerlo en CSS, ya sabes cómo hacerlo en la aplicación de Windows Store.

326
00:18:28,330 --> 00:18:32,080
>> Más allá de que para el diseño, incluso cosas como la App Store,

327
00:18:32,080 --> 00:18:35,350
pero va más allá de eso, mirando tal vez una aplicación de noticias que te está mostrando artículos

328
00:18:35,350 --> 00:18:40,160
o recetas o cosas por el estilo, estos otros tipos de características en CSS son realmente útiles:

329
00:18:40,160 --> 00:18:45,610
Cuadrícula, Flexbox CSS Regions es más de un bastante nuevo estándar también.

330
00:18:45,610 --> 00:18:51,190
Estas cosas están yendo para ayudar a usted presenta contenido y contenido entre secciones de flujo,

331
00:18:51,190 --> 00:18:55,470
ser capaz de hacer la paginación y división de palabras sin tener que escribir las cosas uno mismo.

332
00:18:55,470 --> 00:18:57,500
Usted acaba de decir: "Por favor, haga lo siguiente para mí"

333
00:18:57,500 --> 00:19:00,850
y como el espacio en pantalla es diferente en diferentes máquinas

334
00:19:00,850 --> 00:19:03,850
o como lo verá en un momento, como truena una aplicación

335
00:19:03,850 --> 00:19:07,920
tener una menor cantidad de espacio en la pantalla, eso no es problema para CSS.

336
00:19:07,920 --> 00:19:11,160
Se puede aprovechar - charla We'Ll acerca de las consultas de medios de comunicación en un segundo -

337
00:19:11,160 --> 00:19:15,880
que puede hacerse cargo de las cosas con el reposicionamiento de su contenido, que fluye el contenido de las regiones

338
00:19:15,880 --> 00:19:21,240
sólo con estas cosas que ustedes ya han visto con la tecnología web.

339
00:19:21,240 --> 00:19:25,470
>> Por el lado de HTML5, también hay un montón de cosas

340
00:19:25,470 --> 00:19:28,140
que será muy útil para usted con el Windows Store aplicaciones.

341
00:19:28,140 --> 00:19:30,980
Una vez más, no vamos a ir a través de todos ellos, pero son sólo aquí.

342
00:19:30,980 --> 00:19:35,470
Así que si hay que usarla, audio-video, si usted quiere hacer la validación de formularios,

343
00:19:35,470 --> 00:19:40,570
geolocalización, todas las cosas que puedes hacer en JavaScript con JavaScript o 5 ECMAScript 5,

344
00:19:40,570 --> 00:19:44,070
IndexedDB para almacenamiento local - estas son todas las opciones para usted.

345
00:19:44,070 --> 00:19:49,300
Si usted está buscando una respuesta, basta con ver a las tecnologías existentes con HTML5 y CSS

346
00:19:49,300 --> 00:19:53,880
y encontrará las respuestas más fácil que tener que sacar un montón de esas cosas a ti mismo.

347
00:19:53,880 --> 00:19:55,510
Te voy a enseñar todo un poco aquí.

348
00:19:55,510 --> 00:19:57,920
Tengo un sitio que podemos ir.

349
00:19:57,920 --> 00:20:01,590
Voy a dejar de salir de esta diapositiva por un segundo.

350
00:20:01,590 --> 00:20:06,450
>> Si salimos a IETestDrive.com,

351
00:20:06,450 --> 00:20:08,960
No voy a hacer mucho de una demo aquí.

352
00:20:08,960 --> 00:20:14,360
IETestDrive.com está realmente mostrando mucho de lo que hay de nuevo con IE10,

353
00:20:14,360 --> 00:20:16,220
las cosas que usted puede hacer.

354
00:20:16,220 --> 00:20:19,130
Me parece que esto es realmente útil porque en lugar de leer a través de un montón de libros blancos,

355
00:20:19,130 --> 00:20:23,020
un vistazo a un par de demos, y eso va a ayudar a poner en su propio radar personal

356
00:20:23,020 --> 00:20:26,620
acerca de si una tecnología tiene sentido incluso hacer más investigación con

357
00:20:26,620 --> 00:20:29,070
para que entiendas, "Veo lo que es esto."

358
00:20:29,070 --> 00:20:32,780
"Entiendo lo que hace trama de petición de Animación para mí."

359
00:20:32,780 --> 00:20:36,900
"Entiendo cómo podría utilizar Regiones o filtros SVG."

360
00:20:36,900 --> 00:20:40,190
Se les ve en acción, verlas en un ejemplo aquí,

361
00:20:40,190 --> 00:20:44,930
y decidir por ti mismo si eso va a ser útil para usted en sus propios proyectos y más allá

362
00:20:44,930 --> 00:20:47,840
a medida que continúe trabajando con la tecnología web.

363
00:20:47,840 --> 00:20:49,900
Aquí me gustaría simplemente animo a echar un vistazo.

364
00:20:49,900 --> 00:20:52,880
No creo que voy a pasar mucho tiempo que realmente ejecuta estos.

365
00:20:52,880 --> 00:20:56,030
Tenemos suficiente para mostrar con la escritura de código.

366
00:20:56,030 --> 00:21:01,640
Usted verá aquí las cosas de los efectos táctiles de juegos basada en el contacto de esa sección,

367
00:21:01,640 --> 00:21:06,050
animación, animación y acelerada de hardware muy rápido allí,

368
00:21:06,050 --> 00:21:11,230
algunas optimizaciones que se ven en algunas de estas muestras, así,

369
00:21:11,230 --> 00:21:12,770
y hay muchos, muchos más.

370
00:21:12,770 --> 00:21:15,330
Si usted se pasa de aquí y abre el mapa del sitio,

371
00:21:15,330 --> 00:21:19,070
sólo hay un número ridículo de muestras aquí.

372
00:21:19,070 --> 00:21:20,690
Puedes verlos todos aquí.

373
00:21:20,690 --> 00:21:22,900
Si usted está en busca de algo o se enteró de algo

374
00:21:22,900 --> 00:21:25,850
y usted se está preguntando tal vez esto sería algo genial para usar en la aplicación,

375
00:21:25,850 --> 00:21:31,720
Trate de buscar aquí, y es probable que haya una muy buena demostración de que ahorrar un poco de tiempo.

376
00:21:31,720 --> 00:21:35,980
>> ¿De acuerdo? Cualquier pregunta hasta el momento para la gente aquí?

377
00:21:35,980 --> 00:21:39,620
Okay. Nosotros seguiremos aquí.

378
00:21:39,620 --> 00:21:41,920
Una vez más, sólo comprobar que fuera.

379
00:21:41,920 --> 00:21:45,450
Son los estándares web, por lo que ir a cualquier otro sitio de escaparate, que usted sepa

380
00:21:45,450 --> 00:21:50,550
y ver si esas tecnologías tienen sentido para lo que estás tratando de hacer.

381
00:21:50,550 --> 00:21:53,190
>> Copia de las diapositivas.

382
00:21:53,190 --> 00:22:00,290
Dicho esto, si se desplaza de un mundo Web realmente un mundo de aplicación local instalada,

383
00:22:00,290 --> 00:22:01,850
así que hay algunas cosas que comentar aquí.

384
00:22:01,850 --> 00:22:03,690
En primer lugar, no hay ningún servidor web involucrada aquí.

385
00:22:03,690 --> 00:22:06,120
No hay Apache, no hay que ejecuta IIS aquí

386
00:22:06,120 --> 00:22:10,170
servir las páginas a un cliente remoto, a un agente de navegador remoto.

387
00:22:10,170 --> 00:22:13,000
En este caso, en realidad todo lo que se empaqueta para usted.

388
00:22:13,000 --> 00:22:16,630
Usted envía que, como su aplicación a la tienda, que se certificó,

389
00:22:16,630 --> 00:22:22,190
que está fuera de la tienda, y luego la gente por miles instalará el juego o la aplicación.

390
00:22:22,190 --> 00:22:24,780
Pero, básicamente, están tirando de ella hacia abajo a nivel local para su máquina.

391
00:22:24,780 --> 00:22:29,080
No hay necesidad de salir a la Web ya menos que tenga las llamadas que necesitan una API remota,

392
00:22:29,080 --> 00:22:31,790
y eso es perfectamente normal, así también.

393
00:22:31,790 --> 00:22:35,330
Pero no van a estar en ese modo en el que tienen que ir petición respuesta de un servidor

394
00:22:35,330 --> 00:22:37,910
para obtener la página siguiente de su contenido.

395
00:22:37,910 --> 00:22:41,380
Así que dicho esto, hay algunas diferencias de menor importancia de la API. Estos son increíblemente menor.

396
00:22:41,380 --> 00:22:46,850
Son poco probable que le golpeó en su codificación normal, pero son al menos documentados.

397
00:22:46,850 --> 00:22:50,030
Son una especie de primera línea de los casos allí.

398
00:22:50,030 --> 00:22:53,370
>> La otra cosa es de señalar las diferencias de confianza.

399
00:22:53,370 --> 00:22:58,070
Sólo menciono esto porque yo sólo quiero asegurarme de que lo dije

400
00:22:58,070 --> 00:23:01,580
así que si llegas a tener más tarde, usted pensará, "Chris dijo algo al respecto,

401
00:23:01,580 --> 00:23:04,890
"Así que tal vez, sí, está bien", y luego volver atrás y averiguar de qué se trataba.

402
00:23:04,890 --> 00:23:06,480
Los contextos son importantes.

403
00:23:06,480 --> 00:23:11,450
Por defecto tratamos de proteger al usuario de los vectores de ataque.

404
00:23:11,450 --> 00:23:13,400
Hay ciertas cosas que usted puede hacer por defecto

405
00:23:13,400 --> 00:23:16,130
y ciertas cosas que hay que cambiar el contexto para habilitar.

406
00:23:16,130 --> 00:23:19,860
Como usted está usando algunas bibliotecas por ahí - usted ya se ha estado trabajando con jQuery,

407
00:23:19,860 --> 00:23:23,650
pero si se mira de otras bibliotecas por ahí - que pueda estar utilizando algunas funciones

408
00:23:23,650 --> 00:23:28,000
ese tipo de va más allá de los usos locales, ¿tiene interacciones más dinámicas

409
00:23:28,000 --> 00:23:30,360
Peticiones XHR, cosas así.

410
00:23:30,360 --> 00:23:33,090
Algunas veces usted puede encontrar a los se desactivarán de forma predeterminada,

411
00:23:33,090 --> 00:23:37,790
y en ese caso, basta con hacer una búsqueda, busque contexto local y web,

412
00:23:37,790 --> 00:23:39,560
y encontrará la manera de arreglar eso.

413
00:23:39,560 --> 00:23:42,580
Sólo asegúrese de que usted sabía que a medida que comience a utilizar otros marcos,

414
00:23:42,580 --> 00:23:45,720
la cual, debo mencionar, eres perfectamente capaz de hacer.

415
00:23:45,720 --> 00:23:49,290
Así que si usted encuentra algún otro marco - charla We'Ll sobre esto en un segundo -

416
00:23:49,290 --> 00:23:54,000
para los juegos y quieres usar eso, usted desea utilizar algunas librerías de control que están ahí fuera

417
00:23:54,000 --> 00:23:57,990
y usted no desea escribir esas cosas a ti mismo - que es una buena idea, ¿verdad? -

418
00:23:57,990 --> 00:23:59,560
puede utilizar absolutamente este material.

419
00:23:59,560 --> 00:24:03,660
No hay nada que te detiene el uso de cualquier tipo de biblioteca que está basada en JavaScript

420
00:24:03,660 --> 00:24:05,380
CSS, HTML5.

421
00:24:05,380 --> 00:24:09,740
Una vez más, si es algo que puedes hacer en IE10, que es un heck de mucho en estos días,

422
00:24:09,740 --> 00:24:11,220
usted puede hacerlo.

423
00:24:11,220 --> 00:24:14,800
Tire de ella en su aplicación, la referencia que la biblioteca de JavaScript, y lo utilizan en su aplicación,

424
00:24:14,800 --> 00:24:19,880
sólo teniendo en cuenta que puede pegarle a un contexto de seguridad de vez en cuando - no muy a menudo.

425
00:24:19,880 --> 00:24:24,150
>> Y a continuación, las características, vamos a repasar unos cuantos más de los que a medida que avanzamos.

426
00:24:24,150 --> 00:24:27,500
El UX te tipo de acostumbrarse a como se ve más y más aplicaciones

427
00:24:27,500 --> 00:24:29,250
de la tienda de Windows.

428
00:24:29,250 --> 00:24:33,870
Usted obtiene una idea de cómo funcionan y cómo el diseño estético tiende a trabajar

429
00:24:33,870 --> 00:24:37,720
a través de diferentes aplicaciones y lo que la gente puede utilizar para experimentar.

430
00:24:37,720 --> 00:24:39,660
Eso es realmente la parte más importante.

431
00:24:39,660 --> 00:24:42,460
Asegúrese de que cuando el fuego de su aplicación no necesitan leer un manual,

432
00:24:42,460 --> 00:24:44,300
que nunca lo hacen, por cierto.

433
00:24:44,300 --> 00:24:46,650
Ellos sólo deben ser capaces de empezar a jugar con su solicitud

434
00:24:46,650 --> 00:24:49,450
y calcular hacia fuera sin mucha dificultad.

435
00:24:49,450 --> 00:24:52,660
Al seguir y adherirse a una gran cantidad de estas prácticas,

436
00:24:52,660 --> 00:24:57,640
que va a hacer a sus usuarios un gran favor, haciendo que sea más fácil.

437
00:24:57,640 --> 00:25:01,810
>> Okay. Una última cosa en el lado de la API y luego nos meteremos en realidad la escritura de código.

438
00:25:01,810 --> 00:25:05,660
WinJS es que lo he mencionado muy brevemente con esa diapositiva compleja

439
00:25:05,660 --> 00:25:08,850
con todas esas diferentes opciones que tiene para hacer las aplicaciones.

440
00:25:08,850 --> 00:25:10,890
WinJS, se puede pensar en él como un amigo.

441
00:25:10,890 --> 00:25:13,680
Es su amigo para ayudarle a escribir las cosas más rápidamente.

442
00:25:13,680 --> 00:25:18,820
Es sólo JavaScript y CSS. Usted no tiene que usarlo. Usted puede utilizarlo.

443
00:25:18,820 --> 00:25:22,180
Si usted va a estar llamando a las características de Windows, que va a terminar de usarlo,

444
00:25:22,180 --> 00:25:27,210
pero si hay cosas como algunos patrones de diseño o controles que usted realmente no desea utilizar,

445
00:25:27,210 --> 00:25:29,090
desea utilizar otra cosa, le toca a usted.

446
00:25:29,090 --> 00:25:32,580
Decida lo que usted desea utilizar y los estilos que desea utilizar.

447
00:25:32,580 --> 00:25:37,250
Las características de la generación de espacios de nombre y clase - depende de usted.

448
00:25:37,250 --> 00:25:41,650
Si prefiere una u otra, es totalmente su decisión. Todavía es JavaScript y CSS.

449
00:25:41,650 --> 00:25:43,860
Pero esto va a ayudar a hacer un montón de cosas.

450
00:25:43,860 --> 00:25:47,780
Por ejemplo, aquí hay un subconjunto de lo que puede hacer,

451
00:25:47,780 --> 00:25:50,790
cosas como ayudar a la programación asincrónica con promesas.

452
00:25:50,790 --> 00:25:54,000
¿Alguno de ustedes oído hablar o trabajaron con Node.js?

453
00:25:54,000 --> 00:25:59,520
Es un patrón común para trabajar con la programación asincrónica.

454
00:25:59,520 --> 00:26:02,370
Así que básicamente lo que está diciendo es: "Ve a hacer algo,

455
00:26:02,370 --> 00:26:05,790
"Y usted me va a dar una promesa de que volverás a mí cuando hayas terminado."

456
00:26:05,790 --> 00:26:08,400
Eso es esencialmente lo que está pasando.

457
00:26:08,400 --> 00:26:12,400
Así que no se congelan hasta su aplicación, mientras que el usuario va y recogiendo un archivo

458
00:26:12,400 --> 00:26:15,810
o algo está siendo transmitido desde la Web.

459
00:26:15,810 --> 00:26:17,210
La interfaz de usuario sigue siendo sensible.

460
00:26:17,210 --> 00:26:19,410
Y usted puede hacer esto mediante el uso de programación asincrónica.

461
00:26:19,410 --> 00:26:23,620
Suena ridículamente compleja, pero es realmente fácil, porque usted está utilizando promesas

462
00:26:23,620 --> 00:26:27,900
y que acaba de decir: "Ve a hacer esto y cuando haya terminado, volver a llamar a este método."

463
00:26:27,900 --> 00:26:30,270
Eso es prácticamente todo. Eso es todo integrado en WinJS.

464
00:26:30,270 --> 00:26:35,120
Esto va a hacer que sea mucho más fácil escribir aplicaciones realmente flexibles y potentes.

465
00:26:35,120 --> 00:26:37,870
>> Puedes ver el resto aquí, un montón de animaciones.

466
00:26:37,870 --> 00:26:41,240
Probablemente una de las cosas más importantes en esta diapositiva son controles.

467
00:26:41,240 --> 00:26:44,680
Creo que tengo un todo - Sí, lo creo.

468
00:26:44,680 --> 00:26:48,900
He aquí un ejemplo de algunos de los controles que puede utilizar en sus aplicaciones.

469
00:26:48,900 --> 00:26:51,060
Esto es todo en línea recta desde WinJS.

470
00:26:51,060 --> 00:26:53,430
Usted no está escribiendo estos mismos,

471
00:26:53,430 --> 00:26:55,990
Acabas de decir, "Así es como yo quiero componer mi solicitud."

472
00:26:55,990 --> 00:26:59,420
"Voy a usar una vista flip para poder ir entre las diferentes imágenes."

473
00:26:59,420 --> 00:27:03,380
Yo no te he mostrado zoom semántico. Te voy a mostrar que en un segundo.

474
00:27:03,380 --> 00:27:05,700
Listviews. Hay GridViews.

475
00:27:05,700 --> 00:27:08,680
Ya ha visto una rejilla en el marco de la aplicación de almacenamiento,

476
00:27:08,680 --> 00:27:12,170
así que la posibilidad de utilizar bloques de contenido y el desplazamiento a través de eso.

477
00:27:12,170 --> 00:27:15,660
Menús menú lateral verás de vez en cuando.

478
00:27:15,660 --> 00:27:19,090
La barra de la aplicación que te mostró con la aplicación de la pintura fresca, así,

479
00:27:19,090 --> 00:27:22,190
por lo que vio cómo se pueden personalizar los botones que al poner en él

480
00:27:22,190 --> 00:27:26,360
y que tiene que ocultar lejos cuando no te importa usar eso.

481
00:27:26,360 --> 00:27:28,120
Eso es realmente totalmente de usted para su uso.

482
00:27:28,120 --> 00:27:30,210
Estos son todos los controles que forman parte de WinJS.

483
00:27:30,210 --> 00:27:33,640
Te voy a mostrar cómo hacer esto en tan sólo unos segundos, pero no hay mucho más que esto,

484
00:27:33,640 --> 00:27:37,060
y la clave es usarlos si quieres, ahorrar un poco de tiempo.

485
00:27:37,060 --> 00:27:40,830
>> Si usted tiene otras bibliotecas de control que le gustaría usar, eso es perfectamente bien también.

486
00:27:40,830 --> 00:27:46,300
Cosas como jQuery UI hacen una gran cantidad de este tipo de idea, así,

487
00:27:46,300 --> 00:27:51,280
proporcionar más controles que se extienden más de lo que puede hacer en HTML y JavaScript.

488
00:27:52,690 --> 00:27:55,680
Vamos a bucear pulg Ya he dicho eso. Usa lo que te gustaría.

489
00:27:55,680 --> 00:27:59,680
Hemos de tener en cuenta que usted podría encontrarse con algunos problemas de contexto.

490
00:27:59,680 --> 00:28:03,380
Pero que sin duda puede mezclar y combinar cualquier tipo de bibliotecas que se sienta cómodo,

491
00:28:03,380 --> 00:28:06,770
quieres aprender, que desea utilizar, para ahorrar un poco de tiempo.

492
00:28:06,770 --> 00:28:09,850
>> Vamos a hablar acerca de las herramientas sólo por un segundo.

493
00:28:09,850 --> 00:28:12,400
Usted puede conseguir lo que necesita para comenzar a trabajar con Windows Store aplicaciones.

494
00:28:12,400 --> 00:28:17,360
Si voy a salir, tengo demasiadas cosas por aquí.

495
00:28:17,360 --> 00:28:21,770
Si vas a esta página, que es dev.windows.com,

496
00:28:21,770 --> 00:28:23,300
se puede descargar todo lo necesario.

497
00:28:23,300 --> 00:28:28,170
Como estudiantes, usted tiene acceso a más de la población en general lo hace,

498
00:28:28,170 --> 00:28:30,670
para que pueda obtener las versiones de gama alta de Visual Studio.

499
00:28:30,670 --> 00:28:34,090
Edwin mencionó que ya se puede obtener Windows también.

500
00:28:34,090 --> 00:28:36,790
Pero, en general, para todos los desarrolladores, puede ir a este sitio

501
00:28:36,790 --> 00:28:40,380
y descargar todo lo que necesita para hacer una aplicación, y todo es gratis.

502
00:28:40,380 --> 00:28:42,460
Así que hay una versión gratuita de Visual Studio,

503
00:28:42,460 --> 00:28:44,450
hay algunas herramientas que instalarán junto de eso -

504
00:28:44,450 --> 00:28:47,240
todo lo que necesita para crear y probar la aplicación.

505
00:28:47,240 --> 00:28:50,130
Es sólo cuando usted va a publicar la aplicación a la tienda

506
00:28:50,130 --> 00:28:52,470
que usted va a necesitar una cuenta de desarrollador.

507
00:28:52,470 --> 00:28:56,100
Esto también creo que es gratis. ¿Es gratuito para los estudiantes, así? >> [Guarin] ¿Cuál?

508
00:28:56,100 --> 00:28:57,970
La cuenta de desarrollador, la presentación efectiva. >> [Guarin] Sí.

509
00:28:57,970 --> 00:28:59,580
Esa es otra buena noticia.

510
00:28:59,580 --> 00:29:00,840
Irás mira esto.

511
00:29:00,840 --> 00:29:03,840
Se dirá que un individuo de forma predeterminada es de $ 49.

512
00:29:03,840 --> 00:29:06,140
Pero no inscribirse para que cuando era estudiante.

513
00:29:06,140 --> 00:29:10,250
Le daremos un poco de información a través de sus programas que usted puede obtener una cuenta gratuita,

514
00:29:10,250 --> 00:29:13,980
y que le permitirá luego enviar sus solicitudes hasta el almacén,

515
00:29:13,980 --> 00:29:17,370
como todas las que quieras, y toda esa bondad seguirán pronto.

516
00:29:17,370 --> 00:29:19,710
Así que eso es dev.windows.com.

517
00:29:19,710 --> 00:29:22,170
Puede descargar las herramientas que pueda necesitar de aquí.

518
00:29:22,170 --> 00:29:25,310
Y si lo desea, puede obtener una versión de prueba de Windows aquí,

519
00:29:25,310 --> 00:29:27,160
pero de nuevo, no será necesario hacerlo.

520
00:29:27,160 --> 00:29:32,880
>> El otro sitio - permítanme señalar este es para ti rápidamente - es design.windows.com.

521
00:29:32,880 --> 00:29:34,770
Eso fue dev.windows.com.

522
00:29:34,770 --> 00:29:37,770
Design.windows.com, usted puede adivinar para qué sirve.

523
00:29:37,770 --> 00:29:40,380
En realidad es un sitio bastante agradable. Hay un montón de buena información aquí.

524
00:29:40,380 --> 00:29:41,770
Usted puede trabajar a través de él.

525
00:29:41,770 --> 00:29:43,960
Se va a dar un consejo en algunas cosas

526
00:29:43,960 --> 00:29:46,760
que tal vez no han pensado antes o han tenido que hacer frente a antes,

527
00:29:46,760 --> 00:29:50,780
como el diseño para el tacto, el diseño de los diferentes factores de forma,

528
00:29:50,780 --> 00:29:55,310
diseñar para las capacidades de Windows 8, las cosas que he mencionado antes

529
00:29:55,310 --> 00:29:58,740
como la búsqueda y el intercambio, algunas cosas que no he hablado todavía.

530
00:29:58,740 --> 00:30:05,570
Todos están listados aquí, y es un muy buen conjunto de páginas de archivos útiles

531
00:30:05,570 --> 00:30:08,670
que le ayudará a entender cómo hacer un determinado tipo de aplicación,

532
00:30:08,670 --> 00:30:14,250
cómo hacer la interacción, cómo hacer frente a la UI y UX de su solicitud.

533
00:30:14,250 --> 00:30:18,630
Yo recomiendo que eches un vistazo a esto, especialmente si usted está en un cierto punto

534
00:30:18,630 --> 00:30:22,960
con la esperanza de publicar una aplicación a la tienda.

535
00:30:22,960 --> 00:30:25,250
Usted va a querer saber cómo hacer una buena aplicación

536
00:30:25,250 --> 00:30:28,300
ya he mencionado antes, si no lo hace, no hay esos exámenes de nuevo.

537
00:30:28,300 --> 00:30:29,930
La gente va a ser infeliz.

538
00:30:29,930 --> 00:30:32,960
No van a ser capaces de encontrar las cosas que esperan en los lugares correctos.

539
00:30:32,960 --> 00:30:36,590
Nadie quiere que eso le suceda a usted.

540
00:30:36,590 --> 00:30:39,220
>> El camino hacia adelante aquí, permítanme concluir eso.

541
00:30:39,220 --> 00:30:43,700
Ahora que usted sabe dónde conseguir las cosas, yo te mostraré cómo empezar utilizar realmente las cosas.

542
00:30:43,700 --> 00:30:48,520
Para empezar, voy a realmente mostrar aquí un ejemplo de las aplicaciones de escritorio en la pantalla de inicio.

543
00:30:48,520 --> 00:30:53,600
Aquí se puede ver Visual Studio, se puede ver Blend y otras herramientas de desarrollo que tengo.

544
00:30:53,600 --> 00:30:55,890
Tienen una baldosa ligeramente diferente.

545
00:30:55,890 --> 00:30:57,930
Eso es debido a que son aplicaciones de escritorio,

546
00:30:57,930 --> 00:31:00,960
y en aquellos casos en que todos van a poner en marcha de nuevo a mi escritorio

547
00:31:00,960 --> 00:31:05,350
realmente sólo como aplicaciones que usted está acostumbrado.

548
00:31:05,350 --> 00:31:06,960
Así que la experiencia de Windows, que es la misma cosa.

549
00:31:06,960 --> 00:31:12,940
No son, por ejemplo, como armado! o estas cosas. Permítanme lanzar uno rápidamente.

550
00:31:12,940 --> 00:31:14,340
En realidad, esto es muy interesante.

551
00:31:14,340 --> 00:31:19,210
Este fue desarrollado por los estudiantes que trabajan en cooperación al NERD.

552
00:31:19,210 --> 00:31:23,430
Aplicación a pantalla completa, este tipo de experiencias aquí.

553
00:31:23,430 --> 00:31:26,290
Oh, buenas pantallas de corte y todo tipo de cosas divertidas.

554
00:31:26,290 --> 00:31:34,330
Desarrollaron esto. También podríamos mostrar toda la cosa mientras estamos en ello.

555
00:31:37,510 --> 00:31:41,070
De hecho, he trabajado con ellos un poco, les dio algunos consejos sobre cosas

556
00:31:41,070 --> 00:31:44,160
porque estaban haciendo JavaScript para su aplicación.

557
00:31:44,160 --> 00:31:46,460
Por favor, no me estoy tomando el crédito por su trabajo, sino que hicieron todo el trabajo.

558
00:31:46,460 --> 00:31:48,990
Yo sólo les di un poco de consejo aquí y allí,

559
00:31:48,990 --> 00:31:52,400
pero lo hicieron algunas grandes cosas mediante el uso de una interfaz JavaScript

560
00:31:52,400 --> 00:31:56,920
y empatando en algunos motores de la física y cosas que hacer un montón de este trabajo.

561
00:32:00,120 --> 00:32:03,360
Vaya. Vamos a ver si funciona.

562
00:32:03,360 --> 00:32:07,010
Wow, que aún funcionaba. Muy bien, muy bien. Pero se entiende la idea.

563
00:32:07,010 --> 00:32:09,350
Una aplicación de pantalla completa, una experiencia muy buena.

564
00:32:09,350 --> 00:32:14,250
Esto se apoya no sólo el ratón y el lápiz si tengo cosas por el estilo, pero también toco.

565
00:32:14,250 --> 00:32:19,420
Si tuviera una pantalla táctil, tan sólo pudiera dibujar sobre él y seguir trabajando con eso.

566
00:32:19,420 --> 00:32:21,440
>> Una cosa que no se presentó, y la razón por la que estoy tocando el tema

567
00:32:21,440 --> 00:32:23,840
es que me quería tener otra aplicación para mostrar lo que puede hacer,

568
00:32:23,840 --> 00:32:29,480
usted puede tomar las aplicaciones de Windows y arrastrarlos hacia el lado de la pantalla.

569
00:32:29,480 --> 00:32:33,070
Esto se llama romperse una aplicación.

570
00:32:33,070 --> 00:32:37,800
En este caso, he tomado Inkarus y he añadido a un lado aquí.

571
00:32:37,800 --> 00:32:42,990
Ahora está a la vista Snap, y que me permite hacer otra cosa mientras que la aplicación está ahí.

572
00:32:42,990 --> 00:32:46,210
La mayoría de los juegos que encontrarás serán simplemente hacer una pausa.

573
00:32:46,210 --> 00:32:51,090
Eso es normalmente una cosa decente que hacer a menos que su juego de alguna manera se puede escalar hacia abajo

574
00:32:51,090 --> 00:32:54,210
para que los pequeños de una resolución, como tal vez algún tipo de juegos de mesa

575
00:32:54,210 --> 00:32:55,620
o cosas por el estilo en la ocasión.

576
00:32:55,620 --> 00:32:58,570
Pero, en general, la cosa más fácil de hacer y lo más apropiado para hacer por juegos

577
00:32:58,570 --> 00:33:00,620
es para hacer una pausa la aplicación.

578
00:33:00,620 --> 00:33:09,440
Para aplicaciones como aplicaciones de noticias, si lanzo esta uno y luego me Snap,

579
00:33:09,440 --> 00:33:16,170
verás que en realidad cambia de manera significativa en cómo se presentan los datos para usted.

580
00:33:16,170 --> 00:33:20,070
Aquí le está mostrando en realidad una cacerola más vertical que la información,

581
00:33:20,070 --> 00:33:23,340
pero todavía puedo utilizar absolutamente la aplicación.

582
00:33:23,340 --> 00:33:25,640
Por lo tanto, sigue siendo muy útil.

583
00:33:25,640 --> 00:33:29,870
El hecho de que se encuentra en un punto de vista más pequeño no me inhabilita el uso de esa aplicación. Así que pensar en eso.

584
00:33:29,870 --> 00:33:32,090
Es algo que usted necesita tener sus aplicaciones hacen hasta cierto punto,

585
00:33:32,090 --> 00:33:35,370
pero le toca a usted para determinar la forma funcional deben ser sus aplicaciones

586
00:33:35,370 --> 00:33:39,080
en ese tipo de un entorno más pequeño.

587
00:33:39,080 --> 00:33:44,780
Permítanme concluir que uno hacia abajo y volver a donde estábamos aquí.

588
00:33:44,780 --> 00:33:48,110
>> Edwin, que agregó una foto de mí ya? >> [Guarin] Sí. >> [Bowen] Mira eso.

589
00:33:48,110 --> 00:33:51,510
¿Ves eso? Edwin agregó una foto. [Risas]

590
00:33:51,510 --> 00:33:54,410
>> Volvamos aquí en Visual Studio. Voy a lanzar esto para usted.

591
00:33:54,410 --> 00:33:58,170
Yo podría haber hecho clic en el azulejo en esa pantalla de inicio.

592
00:33:58,170 --> 00:34:02,630
Me trajo de vuelta a modo de escritorio, y es el lanzamiento de la aplicación de escritorio de Visual Studio.

593
00:34:02,630 --> 00:34:06,790
Se trata de los de Windows que usted ya conoce.

594
00:34:06,790 --> 00:34:09,100
Puedo seguir adelante y crear un proyecto aquí.

595
00:34:09,100 --> 00:34:11,159
Nos centraremos más en JavaScript, HTML.

596
00:34:11,159 --> 00:34:16,510
Voy a salir y seleccionar hasta aquí bajo JavaScript, Windows Store.

597
00:34:16,510 --> 00:34:19,010
Hay una serie de plantillas que se pueden utilizar.

598
00:34:19,010 --> 00:34:21,710
Para la productividad, le recomiendo que eche un vistazo a algunos de estos otros aquí

599
00:34:21,710 --> 00:34:23,489
como el Grid y Split.

600
00:34:23,489 --> 00:34:25,270
Son muy útiles si usted está haciendo una aplicación

601
00:34:25,270 --> 00:34:28,960
eso va a tener ese tipo de diseño y navegación. Verá estas mucho.

602
00:34:28,960 --> 00:34:33,070
El que yo acabo de mostrar era en realidad una instancia de la aplicación Grid.

603
00:34:33,070 --> 00:34:36,880
Así que si crees que vas a estar haciendo una aplicación de noticias o un lector de RSS

604
00:34:36,880 --> 00:34:43,120
o algo por el estilo que se ocupa de múltiples entradas para las que le gustaría mostrar el detalle,

605
00:34:43,120 --> 00:34:45,989
considerar el uso de una de estas plantillas para empezar a trabajar rápidamente

606
00:34:45,989 --> 00:34:48,380
y la personalización de allí.

607
00:34:48,380 --> 00:34:50,120
Pero para que yo pueda mostrarle todas las partes en movimiento aquí

608
00:34:50,120 --> 00:34:56,120
Voy a crear la aplicación en blanco, y luego vamos a ir un poco más profundo en los detalles.

609
00:34:56,120 --> 00:34:58,690
Sólo estoy haciendo que la aplicación en blanco aquí.

610
00:34:58,690 --> 00:35:01,270
Se va a crear todo el proyecto para mí.

611
00:35:01,270 --> 00:35:03,290
Abriré las cosas que quiero que le muestre de forma predeterminada.

612
00:35:03,290 --> 00:35:08,550
Permítanme el zoom en un poco para mostrar lo que se crea para nosotros aquí.

613
00:35:08,550 --> 00:35:11,350
Las cosas que usted va a mirar primero son todos llamados por defecto.

614
00:35:11,350 --> 00:35:15,970
Así que vas a buscar default.html, default.js y default.css.

615
00:35:15,970 --> 00:35:19,590
La otra cosa a destacar es que ya tenemos una referencia a lo que he mencionado antes.

616
00:35:19,590 --> 00:35:24,530
Este es WinJS. En realidad, nadie lo llama este largo nombre aquí.

617
00:35:24,530 --> 00:35:27,710
Es WinJS, la Biblioteca de Windows para JavaScript.

618
00:35:27,710 --> 00:35:29,530
Si lo abres, se puede ver que es todo aquí.

619
00:35:29,530 --> 00:35:31,820
Hay diferentes archivos CSS, hay JavaScript.

620
00:35:31,820 --> 00:35:33,520
Está ahí para ayudarte.

621
00:35:33,520 --> 00:35:37,190
Es realmente allí para proporcionar controles y estilos y esas cosas que sólo puede utilizar automáticamente.

622
00:35:37,190 --> 00:35:41,240
Pero, de nuevo, si hay cosas que desea utilizar en su lugar en términos de estilo y otros controles,

623
00:35:41,240 --> 00:35:45,600
es totalmente de usted. Yo te mostraré cómo utilizar un par de esas cosas ahora.

624
00:35:45,600 --> 00:35:51,020
>> Volver por encima a nuestro lado izquierdo, déjame mostrarte la página HTML predeterminada.

625
00:35:51,020 --> 00:35:54,490
Ya has visto las cosas WinJS, y eso es realmente todo lo que está pasando allí

626
00:35:54,490 --> 00:35:59,930
con las líneas medias de marcado, sólo con lo que en el CSS por defecto

627
00:35:59,930 --> 00:36:02,370
y lo que en un par de archivos JavaScript desde WinJS.

628
00:36:02,370 --> 00:36:06,400
Usted no necesita ser dueño de lo que está pasando dentro de esos archivos.

629
00:36:06,400 --> 00:36:10,110
Es bastante interesante echar un vistazo a ellos para revisar algo de lo que está pasando ahí dentro

630
00:36:10,110 --> 00:36:14,410
porque hay bastante interesantes técnicas de nivel intermedio y avanzado pasando ahí,

631
00:36:14,410 --> 00:36:18,100
pero lo bueno es que los desarrolladores, puede simplemente tomar ventaja de ellos, sólo los utilizan

632
00:36:18,100 --> 00:36:19,510
y realmente no tiene que preocuparse por ello.

633
00:36:19,510 --> 00:36:21,960
Todavía se puede conducir un coche sin tener que saber cómo funciona, ¿no?

634
00:36:21,960 --> 00:36:24,180
Así que ese es el tipo de cosa que está pasando aquí.

635
00:36:24,180 --> 00:36:26,930
Hay controles y estilos y esas cosas que usted puede seguir adelante y utilizar

636
00:36:26,930 --> 00:36:31,460
y el código que se puede utilizar en un segundo sin necesidad de saber lo que hay allí.

637
00:36:31,460 --> 00:36:33,200
Aquí están sus propios archivos.

638
00:36:33,200 --> 00:36:35,860
Estos son sus lugares que usted puede modificar su propio CSS

639
00:36:35,860 --> 00:36:38,400
y su propia JavaScript para que todo funcione.

640
00:36:38,400 --> 00:36:43,300
Se le agrega ciertamente otros archivos JavaScript y tal vez otros archivos CSS

641
00:36:43,300 --> 00:36:47,480
que el proyecto crece, pero esto es sólo un punto de partida.

642
00:36:47,480 --> 00:36:52,570
Aquí está el Hola, equivalente en el mundo de HTML, así que estamos de vuelta en el cuerpo de la etiqueta.

643
00:36:52,570 --> 00:36:55,990
En la parte superior, por cierto, es el doctype HTML5,

644
00:36:55,990 --> 00:37:00,060
por lo que va a reconocer que a partir de lo que has estado trabajando.

645
00:37:00,060 --> 00:37:04,600
Hay plena IntelliSense aquí también, así que si usted hace las cosas como el tipo en una etiqueta de vídeo

646
00:37:04,600 --> 00:37:07,340
y ampliar eso, de lo que has aprendido sobre el hecho de

647
00:37:07,340 --> 00:37:12,760
que es necesario hacer reserva de codificación para las etiquetas de vídeo en HTML5 - o quizás usted tiene -

648
00:37:12,760 --> 00:37:17,490
para asegurar que los diferentes navegadores tienen soporte para el vídeo.

649
00:37:17,490 --> 00:37:22,610
Tenemos este tipo de cosas a través de HTML, a través de JavaScript, a través de CSS.

650
00:37:22,610 --> 00:37:26,020
Eso se basa en, y te muestro CSS en un segundo.

651
00:37:26,020 --> 00:37:29,430
Aquí usted puede seguir adelante y empezar a modificar el código, el marcado.

652
00:37:29,430 --> 00:37:33,700
De hecho, antes de que cambie nada, voy a ejecutar este y le mostrará lo que hay.

653
00:37:33,700 --> 00:37:35,700
Usted va a tener una pantalla de presentación que puede personalizar

654
00:37:35,700 --> 00:37:40,940
y luego se obtiene el Hola, la experiencia del mundo aquí. Es fantástico, ¿verdad?

655
00:37:40,940 --> 00:37:42,640
Vaya por delante y barco, ¿verdad?

656
00:37:42,640 --> 00:37:45,970
El contenido va aquí. Eso es lo básico.

657
00:37:45,970 --> 00:37:48,740
Esto sólo puede mejorar a partir de ahí.

658
00:37:48,740 --> 00:37:51,300
Vamos a seguir adelante y añadir en algunas cosas.

659
00:37:51,300 --> 00:37:53,470
Tengo un poco de margen de beneficio que voy a copiar aquí

660
00:37:53,470 --> 00:37:55,740
sólo para que usted no tiene que verme escribiendo.

661
00:37:55,740 --> 00:38:02,620
Déjame ir a abrir la caja de herramientas aquí, y voy a Pin esto porque voy a estar haciendo esto un par de veces.

662
00:38:02,620 --> 00:38:05,650
Caja de herramientas, si usted no ha visto Visual Studio, es donde vas a encontrar un montón de controles.

663
00:38:05,650 --> 00:38:09,050
También se puede poner fragmentos de código en él que se puede reutilizar.

664
00:38:09,050 --> 00:38:16,360
Aquí sólo voy a estallar en algún otro HTML, nada terriblemente avanzado en absoluto aquí.

665
00:38:16,360 --> 00:38:20,170
Es sólo el HTML básico diciendo que tengo una entrada donde puedo escribir,

666
00:38:20,170 --> 00:38:23,860
Tengo un botón donde puedo presentarla, y luego tengo un div que es esencialmente un marcador de posición

667
00:38:23,860 --> 00:38:27,360
que puedo usar para emitir el "Hola, que escribe esto."

668
00:38:27,360 --> 00:38:32,780
Es la intro de ejemplo HTML.

669
00:38:32,780 --> 00:38:39,340
Si ejecuto esto, se obtiene automáticamente el HTML, pero también se recibe automáticamente el estilo.

670
00:38:39,340 --> 00:38:42,270
Esta es una de las cosas importantes de WinJS.

671
00:38:42,270 --> 00:38:47,250
Se va a dar de forma predeterminada algunos apariencia es realmente consistente

672
00:38:47,250 --> 00:38:50,520
con el resto de lo que está haciendo Windows 8.

673
00:38:50,520 --> 00:38:52,110
Aquí puede ver las cosas como el botón.

674
00:38:52,110 --> 00:38:55,890
El botón por defecto en HTML no se parece a eso, sino que lo hace aquí

675
00:38:55,890 --> 00:39:00,880
porque se está haciendo ese derecho CSS de ese archivo CSS en WinJS.

676
00:39:00,880 --> 00:39:04,680
Si desea utilizar otra cosa, si usted quiere cambiar eso, totalmente bien,

677
00:39:04,680 --> 00:39:06,790
seguir adelante y hacer lo que le gustaría. Pero ese es el valor predeterminado.

678
00:39:06,790 --> 00:39:09,610
Va a ser más familiar para los usuarios.

679
00:39:09,610 --> 00:39:13,510
Y por supuesto, esto no va a hacer nada porque yo en realidad no del cable hasta cualquier tipo de código

680
00:39:13,510 --> 00:39:16,630
para responder a eso. Era sólo el código HTML.

681
00:39:16,630 --> 00:39:20,630
Así que puedo deshacerme de eso, y vamos a volver en nuestra aplicación.

682
00:39:20,630 --> 00:39:25,310
>> Déjame cambiar a nuestros default.js.

683
00:39:25,310 --> 00:39:29,030
Esto parece bastante complejo, pero sólo está haciendo algunas cosas para ti.

684
00:39:29,030 --> 00:39:33,120
Es repetitivo. Va a ser la misma en todos sus proyectos.

685
00:39:33,120 --> 00:39:36,620
Lo único que esto está haciendo es sólo un poco de preguntar: "¿Cómo he llegado hasta aquí?"

686
00:39:36,620 --> 00:39:39,090
y diciendo: "¿Está iniciando esta aplicación por primera vez?"

687
00:39:39,090 --> 00:39:42,640
"¿Está usted de reanudar la aplicación de tener que ser suspendido?"

688
00:39:42,640 --> 00:39:44,510
Un par de cosas por el estilo.

689
00:39:44,510 --> 00:39:50,300
En realidad, nuestro enfoque en este archivo aquí es justo aquí.

690
00:39:50,300 --> 00:39:54,490
En este punto, esta línea de código es bastante importante.

691
00:39:54,490 --> 00:39:57,070
En realidad va a ir a buscar a través de todos los de su margen de beneficio,

692
00:39:57,070 --> 00:40:01,640
y que va a encontrar cosas que te he pedido que se han convertido en los controles,

693
00:40:01,640 --> 00:40:07,220
controles más profundos, como un control de clasificación, como una vista de cuadrícula, como el menú lateral

694
00:40:07,220 --> 00:40:09,570
y esas otras cosas que les mostré en esa diapositiva antes.

695
00:40:09,570 --> 00:40:12,550
No son controles HTML nativas.

696
00:40:12,550 --> 00:40:17,860
Usted simplemente no decir flotante como un elemento y hacer que sabía qué hacer.

697
00:40:17,860 --> 00:40:22,120
Lo que se hace realmente es lo mismo que sucede en otros tipos de marcos de control.

698
00:40:22,120 --> 00:40:26,200
jQuery UI hace el mismo tipo de enfoque general.

699
00:40:26,200 --> 00:40:30,800
Utilice las marcas en el código HTML, y algo más tarde a través de JavaScript viene y dice:

700
00:40:30,800 --> 00:40:35,900
"Oh, yo sé lo que es eso. Eso es pedir para que esto se convirtió en estas cosas"

701
00:40:35,900 --> 00:40:39,850
que es otra de HTML más expresivo para hacer como un control de las calificaciones,

702
00:40:39,850 --> 00:40:41,790
que es lo que te voy a mostrar ahora.

703
00:40:41,790 --> 00:40:46,140
Esta línea de código es una promesa que está diciendo: "Cuando se cumpla esta promesa,

704
00:40:46,140 --> 00:40:49,090
"Todo lo que le has pedido a continuación ha sido creado."

705
00:40:49,090 --> 00:40:52,780
Y eso es todo. Se ve un poco complejo, pero en realidad es el mismo en cada proyecto.

706
00:40:52,780 --> 00:40:56,690
Aquí abajo es donde usted puede comenzar a agregar en cualquier otra cosa que queremos que suceda,

707
00:40:56,690 --> 00:40:58,280
así que vamos a volver a eso en un segundo.

708
00:40:58,280 --> 00:41:01,480
>> En primer lugar, necesito un poco de código que puede responder al hecho de

709
00:41:01,480 --> 00:41:03,320
que alguien ha hecho clic en el botón.

710
00:41:03,320 --> 00:41:06,330
Voy a seguir adelante y poner eso en aquí abajo.

711
00:41:06,330 --> 00:41:09,620
Una vez más, yo no voy a hacer ninguna escribiendo delante de ustedes aquí.

712
00:41:09,620 --> 00:41:12,560
JavaScript Muy básico sólo decir cuando esto se llama

713
00:41:12,560 --> 00:41:15,270
vamos a proporcionar algunos detalles sobre cómo hemos llegado hasta aquí

714
00:41:15,270 --> 00:41:17,630
y luego vamos a hacer algunas cosas básicas.

715
00:41:17,630 --> 00:41:21,300
Ve a buscar a la cosa en mi página de HTML que se denomina nameInput,

716
00:41:21,300 --> 00:41:28,490
agarrarlo, tome su valor, slap "Hola" en el frente de la misma, y ​​se adhieren esa cadena resultante

717
00:41:28,490 --> 00:41:31,960
en esa etiqueta div que teníamos antes de que realmente no tenían nada antes.

718
00:41:31,960 --> 00:41:37,220
Ahora nos vamos a encontrar con esa etiqueta y hacer su contenido interior igual a la cadena.

719
00:41:37,220 --> 00:41:38,880
JavaScript Muy simple.

720
00:41:38,880 --> 00:41:42,240
Esperemos que está reconociendo que no hay nada inusual está pasando aquí.

721
00:41:42,240 --> 00:41:45,360
Es sólo hacia arriba HTML y JS aquí.

722
00:41:45,360 --> 00:41:48,220
Si me quedo esto ahora, todavía no va a hacer ningún trabajo, porque no he atado con alambre para arriba

723
00:41:48,220 --> 00:41:50,030
para recibir el evento.

724
00:41:50,030 --> 00:41:55,710
Para hacer eso, voy a hacer eso aquí, una vez más volver a mi caja de herramientas,

725
00:41:55,710 --> 00:41:58,730
apareciendo en aquí.

726
00:41:58,730 --> 00:42:03,060
Espero que hayas visto todo este tipo de cosas antes, así que no voy demasiado explicarlo.

727
00:42:03,060 --> 00:42:05,060
Ahora vamos a ir a buscar el helloButton.

728
00:42:05,060 --> 00:42:07,730
Vamos a decir, "Button, felicitaciones."

729
00:42:07,730 --> 00:42:10,130
"Este es un evento que ahora está respondiendo."

730
00:42:10,130 --> 00:42:13,420
"Cuando alguien hace clic en su área, llame a esta función, el buttonClickHandler."

731
00:42:13,420 --> 00:42:17,070
Y es que la función que acaba de agregar a la derecha abajo en el fondo allí. Eso es todo.

732
00:42:17,070 --> 00:42:20,980
Así que ahora tenemos una aplicación increíblemente funcional.

733
00:42:20,980 --> 00:42:24,720
Creo que estarás muy impresionado con esto.

734
00:42:24,720 --> 00:42:32,320
Chris. Espere por ello. Wow. Okay. Eso es increíble. [Risas]

735
00:42:32,320 --> 00:42:36,570
Pero hay más. No lo compre todavía. Espere.

736
00:42:36,570 --> 00:42:39,610
>> Te voy a enseñar un poco más aquí y salir de la pantalla completa.

737
00:42:39,610 --> 00:42:42,690
Vamos a caminar antes de correr.

738
00:42:42,690 --> 00:42:45,530
Déjame ir en y en realidad te enseñe un poco con CSS.

739
00:42:45,530 --> 00:42:49,480
Sólo por defecto, si miramos hacia atrás en la página de aquí,

740
00:42:49,480 --> 00:42:53,570
cada vez que nos detuvimos en estas cosas de WinJS y conseguimos el ui-oscuro,

741
00:42:53,570 --> 00:42:58,550
de hecho, se puede cambiar el valor predeterminado para el uso de aplicación de la luz.

742
00:42:58,550 --> 00:43:03,450
ui-negro es bueno para aplicaciones gráficas como el uso de una gran cantidad de imágenes,

743
00:43:03,450 --> 00:43:05,740
usted está mostrando una gran cantidad de contenido visual.

744
00:43:05,740 --> 00:43:12,560
Si usted está mostrando una gran cantidad de contenido textual, el ui-luz es generalmente una buena opción.

745
00:43:12,560 --> 00:43:15,160
Usted no tiene que elegir, pero he cambiado a lo

746
00:43:15,160 --> 00:43:17,690
y ahora que estamos viendo el mismo margen de beneficio, todo igual,

747
00:43:17,690 --> 00:43:20,320
es sólo utilizando básicamente un esquema invertido aquí

748
00:43:20,320 --> 00:43:24,770
donde todo es lo que es texto negro sobre fondo blanco.

749
00:43:24,770 --> 00:43:26,460
Eso es todo bien y bueno.

750
00:43:26,460 --> 00:43:30,680
Vamos a ver aquí, y vamos a hacer realidad un poco más con el CSS.

751
00:43:30,680 --> 00:43:34,830
Lo pondré de nuevo en la oscuridad, porque creo que es probable que sea más fácil de ver en la pantalla

752
00:43:34,830 --> 00:43:36,970
cuando empiezo a hacer estas cosas.

753
00:43:36,970 --> 00:43:40,150
Voy a cambiar el cuerpo una vez más.

754
00:43:40,150 --> 00:43:44,040
Voy a ir aquí. Permítanme Nuke esto.

755
00:43:44,040 --> 00:43:48,690
Vamos a traer el cuerpo con clases.

756
00:43:48,690 --> 00:43:53,000
Creo que has hecho selectores básicos con CSS y cosas como que ya,

757
00:43:53,000 --> 00:43:55,380
por lo que usted probablemente sabe lo que está pasando aquí.

758
00:43:55,380 --> 00:43:59,250
Simplemente asignar algunas clases en nuestro encabezado, y estamos creando un nuevo div

759
00:43:59,250 --> 00:44:04,430
para envolver el resto de esas cosas que ahora podemos usar el estilo de todos juntos.

760
00:44:04,430 --> 00:44:07,760
Entonces, ¿qué puedo hacer ahora es ir a nuestro CSS por defecto.

761
00:44:07,760 --> 00:44:11,900
¿Has mirado en las consultas de los medios de comunicación todavía? ¿Ha hablado de eso en absoluto?

762
00:44:11,900 --> 00:44:17,220
Consultas de los medios de comunicación son parte de esta tendencia emergente -

763
00:44:17,220 --> 00:44:19,660
o es una tendencia establecida ahora en realidad en la Web -

764
00:44:19,660 --> 00:44:22,760
para el diseño de respuesta o de adaptación,

765
00:44:22,760 --> 00:44:28,480
y la idea es que sus aplicaciones realmente pueden ajustar apropiadamente

766
00:44:28,480 --> 00:44:31,910
basado en lo que el dispositivo que están siendo mostrados en puede hacer.

767
00:44:31,910 --> 00:44:35,040
Así que si estás en un dispositivo móvil, es obvio que no vas a tener bienes raíces tanto la pantalla

768
00:44:35,040 --> 00:44:41,520
como se puede en un gran monitor de 30 pulgadas de estar con un escritorio, un gran PC así.

769
00:44:41,520 --> 00:44:46,710
Así que la respuesta a esa edad sería tener 5, 6 versiones diferentes de la misma página

770
00:44:46,710 --> 00:44:51,350
y que le abre la versión que se ajusta para que cierto tamaño de la pantalla.

771
00:44:51,350 --> 00:44:55,420
No muy bien. Es muy, muy repetitivo y hay un montón de mantenimiento para hacer eso.

772
00:44:55,420 --> 00:44:58,120
Ahora tenemos algo llamado consultas de medios CSS,

773
00:44:58,120 --> 00:45:02,530
y podemos usar esto para detectar automáticamente cuando hay ciertos tamaños

774
00:45:02,530 --> 00:45:07,030
o ciertos usos de su contenido que se llevan a cabo.

775
00:45:07,030 --> 00:45:09,580
Así que usted puede responder a eso y usted puede decir: "Bueno, en este caso

776
00:45:09,580 --> 00:45:12,580
"Es probable que ni siquiera es necesario que le diga lo que está pasando aquí".

777
00:45:12,580 --> 00:45:18,020
Esto es sólo decir si se tomó esta aplicación, como he mostrado antes -

778
00:45:18,020 --> 00:45:20,830
agarrar y ponerlo al lado de la pantalla -

779
00:45:20,830 --> 00:45:23,910
a continuación, vamos a hacer el siguiente estilo.

780
00:45:23,910 --> 00:45:25,850
Styling no es sólo acerca de los colores y cosas así.

781
00:45:25,850 --> 00:45:29,860
Se trata también de tamaño y márgenes y rellenos y orientaciones de contenido

782
00:45:29,860 --> 00:45:34,040
o incluso desactivar o activar partes enteras de su página

783
00:45:34,040 --> 00:45:36,420
y, en este caso, su aplicación o su juego también.

784
00:45:36,420 --> 00:45:39,210
Así que aquí usted puede hacer tan simple como usted quiere.

785
00:45:39,210 --> 00:45:46,720
Esto no sería útil en sus aplicaciones, pero es hora de demostración,

786
00:45:46,720 --> 00:45:50,530
así que voy a seguir adelante y sólo tiene que añadir en el selector de cuerpo básico y decir:

787
00:45:50,530 --> 00:45:58,360
"Cuando estoy espeté, vamos a seguir adelante y hacer background-color y vamos a elegir algo."

788
00:45:58,360 --> 00:46:00,400
Tienes IntelliSense aquí. Esto es realmente genial.

789
00:46:00,400 --> 00:46:05,720
En 2012 hemos añadido un montón de cosas para el soporte CSS y JavaScript y HTML.

790
00:46:05,720 --> 00:46:08,690
Usted ha supuesto tienes IntelliSense desplegable también, pero eso no es lo bueno.

791
00:46:08,690 --> 00:46:11,730
Lo bueno es que tienes selectores visuales para un montón de cosas también.

792
00:46:11,730 --> 00:46:14,120
Por lo que podría pasar y simplemente elegir un color,

793
00:46:14,120 --> 00:46:17,580
o puede salir y ser aún más específico y se puede elegir -

794
00:46:17,580 --> 00:46:22,330
esto va a ser terrible. Yo realmente Elija un color decente aquí.

795
00:46:22,330 --> 00:46:26,500
Mira el marcado también, por cierto. Ese es el formato estándar RGB allí.

796
00:46:26,500 --> 00:46:30,780
Pero si me cambio la opacidad, que va a cambiar a un selector de canal alfa aquí.

797
00:46:30,780 --> 00:46:36,910
Así se puede ver que, el color con esencialmente el porcentaje de transparencia que tiene para que

798
00:46:36,910 --> 00:46:38,860
todo al horno bien ahí.

799
00:46:38,860 --> 00:46:42,530
Voy a mantenerlo como el 100% y luego, cuando he terminado con eso, todo está bien y bueno.

800
00:46:42,530 --> 00:46:46,160
Ahora bien, si ejecuto la aplicación y nos tomo la aplicación y Snap,

801
00:46:46,160 --> 00:46:49,000
ese color de fondo se ajusta de forma automática

802
00:46:49,000 --> 00:46:53,410
sólo porque tenemos un poco de CSS que dice: "Ve a hacer eso."

803
00:46:53,410 --> 00:46:55,580
También puede escribir JavaScript también que va a hacer lo mismo

804
00:46:55,580 --> 00:47:03,010
o que se puede utilizar para hacer una pausa en realidad un juego, hacer cosas como esa.

805
00:47:03,010 --> 00:47:04,310
Eso es probablemente cuando se tendría que utilizar JavaScript.

806
00:47:04,310 --> 00:47:06,610
Se podría desactivar el bucle de juego en ese punto.

807
00:47:06,610 --> 00:47:09,970
Usted necesita un poco de JavaScript, ya que no sería algo que le CSS para.

808
00:47:09,970 --> 00:47:11,760
Pero tenga en cuenta que es sólo un evento.

809
00:47:11,760 --> 00:47:14,860
Usted podría decir: "Cuando se cambia el tamaño de mi solicitud,

810
00:47:14,860 --> 00:47:17,780
"Vamos a ver si nos rompimos." Y eso es todo.

811
00:47:17,780 --> 00:47:24,440
>> ¿De acuerdo? He estado hablando mucho. ¿Hay preguntas hasta ahora en dónde estamos? Sí.

812
00:47:24,440 --> 00:47:29,310
[Estudiante] ¿Hay un tutorial para que cualquiera pueda obtener más información? Sí >>.

813
00:47:29,310 --> 00:47:33,510
La pregunta es, ¿hay un tutorial para esto? Voy a extiendo a todo.

814
00:47:33,510 --> 00:47:37,490
Hay algunas cosas que usted puede ir. Vamos realmente a salir de aquí.

815
00:47:37,490 --> 00:47:40,150
Déjame volver aquí.

816
00:47:40,150 --> 00:47:45,180
Una cosa a destacar es propio Visual Studio tiene tutoriales construido adentro

817
00:47:45,180 --> 00:47:47,650
Déjame deshacerme de esto.

818
00:47:47,650 --> 00:47:51,520
Si te vas a crear un nuevo proyecto, no en Archivo, Nuevo proyecto,

819
00:47:51,520 --> 00:47:56,750
y ver el lado de la mano izquierda, hay un nodo en línea en este selector.

820
00:47:56,750 --> 00:47:59,790
Va a tomar un poco. Estoy en mi MyFi aquí.

821
00:47:59,790 --> 00:48:02,300
Pero va a venir y que me va a dar la oportunidad de encontrar plantillas

822
00:48:02,300 --> 00:48:05,190
pero también, lo más importante, las muestras así.

823
00:48:05,190 --> 00:48:06,750
Así que puede hacer clic en JavaScript.

824
00:48:06,750 --> 00:48:10,050
Va a encontrar las muestras para mí. Mi resolución es mucho mayor aquí.

825
00:48:10,050 --> 00:48:15,070
Normalmente, debería ver una lista de un montón de cosas diferentes aquí.

826
00:48:15,070 --> 00:48:18,280
Si hay algo que quieres probar, elegir el idioma,

827
00:48:18,280 --> 00:48:20,970
JavaScript escrito aquí, y decir: "Yo no sé cómo hacerlo geolocalización."

828
00:48:20,970 --> 00:48:22,220
"No sé cómo abrir un archivo."

829
00:48:22,220 --> 00:48:25,840
"No sé cómo tomar ventaja de la cámara web

830
00:48:25,840 --> 00:48:28,290
"U optimizar para el tacto o cosas por el estilo."

831
00:48:28,290 --> 00:48:33,190
Hay muestras de todo: el intercambio, búsqueda, bares de aplicaciones,

832
00:48:33,190 --> 00:48:37,520
realizar llamadas remotas a un servicio, codificación JSON.

833
00:48:37,520 --> 00:48:40,390
Todos los tipos de cosas que hay muestras de que aquí,

834
00:48:40,390 --> 00:48:44,560
y no son enormes muestras que se van a tomar toda la noche a separarse

835
00:48:44,560 --> 00:48:46,820
sólo para encontrar que una cosa que quería aprender.

836
00:48:46,820 --> 00:48:49,870
Son muy buenos. Son pequeños, derecho a las clases puntos de las muestras.

837
00:48:49,870 --> 00:48:52,330
He aprendido un montón pasando a través de éstos mismo,

838
00:48:52,330 --> 00:48:55,260
y por lo que recomiendo que muchos como una cosa.

839
00:48:55,260 --> 00:49:01,750
>> Otra cosa a destacar es también, por supuesto, te mostré dev.windows.com,

840
00:49:01,750 --> 00:49:07,490
así que si usted va de nuevo a ese, verás en la parte inferior también hay las muestras aquí.

841
00:49:07,490 --> 00:49:12,560
Así que usted puede descargar a todos ellos a la vez, pero también hay un montón de otros recursos también aquí

842
00:49:12,560 --> 00:49:14,400
que pueden ayudarle a ponerse al día.

843
00:49:14,400 --> 00:49:17,870
>> Otra cosa, y realmente me gustaría recomendar que usted intente esto,

844
00:49:17,870 --> 00:49:24,510
Ya lo tengo en mi blog, pero me voy a ir al grano.

845
00:49:24,510 --> 00:49:28,220
Te voy a mostrar. Mi blog tiene los recursos y cosas por el estilo.

846
00:49:28,220 --> 00:49:35,300
Una de las cosas que señalar es aquí, esta cosa: su idea. Su aplicación. 30 días.

847
00:49:35,300 --> 00:49:40,960
Si hace clic en este, que va a traer a un sitio realmente útil.

848
00:49:40,960 --> 00:49:44,650
Esto es mucho más útil que se podría esperar.

849
00:49:44,650 --> 00:49:49,040
Esto va a ser de 30 días de contenido que usted puede obtener básicamente consejos y trucos

850
00:49:49,040 --> 00:49:51,990
a lo largo de ese proceso va a crear una aplicación.

851
00:49:51,990 --> 00:49:55,980
Y ya que no puede esperar, en realidad se puede conseguir por juegos también

852
00:49:55,980 --> 00:49:57,840
y para aplicaciones de teléfono, cosas así.

853
00:49:57,840 --> 00:50:01,000
Así que, básicamente, se inscriben en ella, y que van a ser el envío de consejos y trucos,

854
00:50:01,000 --> 00:50:03,010
"¿Has pensado en hacer esto? ¿Apoya Snap?"

855
00:50:03,010 --> 00:50:04,900
"Aquí hay algunas pautas sobre cómo hacerlo bien."

856
00:50:04,900 --> 00:50:07,440
"¿Has pensado en someterse a la tienda?"

857
00:50:07,440 --> 00:50:09,370
"¿Has pensado en cómo va a vender su aplicación?"

858
00:50:09,370 --> 00:50:11,490
Se va a caminar a través de todas estas cosas diferentes.

859
00:50:11,490 --> 00:50:13,380
Y, de hecho, si usted está en la pista de juego, en algún momento

860
00:50:13,380 --> 00:50:17,010
usted comenzará a reconocer a la persona hablar con usted

861
00:50:17,010 --> 00:50:22,850
porque en realidad tenía que ir a Redmint hacer esas y grabadas 2 vídeos allí.

862
00:50:22,850 --> 00:50:25,240
Pero todo eso es parte de la pista de juego,

863
00:50:25,240 --> 00:50:27,650
y también hay una pista completa para el desarrollo general de la aplicación.

864
00:50:27,650 --> 00:50:29,380
Eso se llama Generación App.

865
00:50:29,380 --> 00:50:33,460
Sin duda, recomendaría que a usted también, además de las muestras.

866
00:50:33,460 --> 00:50:38,110
>> Hay una gran cantidad de videos en un sitio llamado Canal 9 también.

867
00:50:38,110 --> 00:50:42,790
Eso es probablemente lo último que voy a recomendar, así antes de pasar aquí.

868
00:50:42,790 --> 00:50:45,280
Channel9.msdn.com.

869
00:50:45,280 --> 00:50:48,880
Esto es grande porque usted no va a ser la lectura a través de toneladas de libros blancos.

870
00:50:48,880 --> 00:50:53,880
Se trata básicamente de una gran cantidad de videos, screencasts y cosas que son directo al grano.

871
00:50:53,880 --> 00:50:57,940
Yo no debería decir que es siempre directo al grano. Depende de quién está haciendo el hablar.

872
00:50:57,940 --> 00:51:02,290
Pero, en general, hay un poco de videos realmente to-the-punto aquí

873
00:51:02,290 --> 00:51:06,230
que le mostrará alguna cosa en particular es posible que desee aprender o ver demos.

874
00:51:06,230 --> 00:51:11,110
También hay todo nuestro contenido de nuestra conferencia que sucedió hace un par de semanas

875
00:51:11,110 --> 00:51:14,380
llamado Build, y verás que allí mismo.

876
00:51:14,380 --> 00:51:18,450
Hay tecnologías Core para Windows 8 juegos. Ahí lo tienes.

877
00:51:18,450 --> 00:51:23,150
Yo estaba allí, en realidad. Usted no me puede ver. Yo estaba aquí.

878
00:51:23,150 --> 00:51:27,560
Pero de todos modos, aparte de eso, yo recomendaría que usted echa un vistazo a los videos.

879
00:51:27,560 --> 00:51:29,330
Son muy útiles.

880
00:51:29,330 --> 00:51:32,620
Si usted está atascado en algo o lo que desea es ver lo que algo se podría hacer, despedir a los de arriba.

881
00:51:32,620 --> 00:51:36,890
>> [Guarin] Windows Mail me acaba de enviar un correo electrónico con un enlace al contenido

882
00:51:36,890 --> 00:51:42,140
para que los estudiantes descarga con código de ejemplo y cosas por el estilo. >> [Bowen] Grande.

883
00:51:42,140 --> 00:51:45,510
Impresionante. Gracias, Edwin.

884
00:51:45,510 --> 00:51:48,320
>> Bueno. >> [Estudiante] Tengo una pregunta. >> [Bowen] Oh. Sí, por favor.

885
00:51:48,320 --> 00:51:55,030
[Pregunta estudiante inaudible] >> [Bowen] Oh, me alegra que lo preguntes eso. Sí.

886
00:51:55,030 --> 00:51:58,940
La pregunta era, ¿hay una interfaz visual para mí para crear cosas?

887
00:51:58,940 --> 00:52:01,630
Edwin te recompensará generosamente por esa pregunta.

888
00:52:01,630 --> 00:52:04,310
Hay una manera de hacer esto.

889
00:52:04,310 --> 00:52:09,040
¿Hay que hacerlo ahora? Vamos a hacerlo ahora.

890
00:52:09,040 --> 00:52:11,780
Voy a ir a ella en estos momentos.

891
00:52:11,780 --> 00:52:14,070
En realidad, permítanme añadir en una cosa más en esta demo,

892
00:52:14,070 --> 00:52:16,710
y luego te voy a mostrar la respuesta real.

893
00:52:16,710 --> 00:52:21,340
Iba a añadir un poco más de CSS aquí.

894
00:52:21,340 --> 00:52:23,980
Yo estaba un poco por la tangente aquí.

895
00:52:23,980 --> 00:52:26,770
Permítanme decirlo de alguna CSS aquí para aprovechar

896
00:52:26,770 --> 00:52:29,980
de las clases que hemos añadido hace poco,

897
00:52:29,980 --> 00:52:33,930
a la cabecera, a la div mainContent y, a continuación, a la greetingOutput.

898
00:52:33,930 --> 00:52:37,920
Si hago eso y ejecutarlo, se puede ver que ahora tenemos a otra persona con el relleno y los márgenes poco,

899
00:52:37,920 --> 00:52:40,310
por lo que tenemos en realidad algunas compensaciones aquí.

900
00:52:40,310 --> 00:52:44,630
Estos son más hacia lo que vas a esperar de una aplicación de pulido final.

901
00:52:44,630 --> 00:52:47,770
Pero sólo estoy mostrando esto a usted porque es hacia arriba CSS.

902
00:52:47,770 --> 00:52:51,910
Así que las cosas que usted ya sabe que usted puede utilizar para ajustar el contenido a su gusto.

903
00:52:51,910 --> 00:52:55,100
Ya has visto cómo hacer que el fondo cambie de esa manera.

904
00:52:55,100 --> 00:53:02,980
>> Si regreso a nuestro HTML, voy a añadir en un conjunto más de margen de beneficio,

905
00:53:02,980 --> 00:53:06,140
y esto es en realidad va a ser un control de WinJS.

906
00:53:06,140 --> 00:53:09,840
Voy a ir y agarrar esto, una etiqueta. Quiero estar seguro que lo estoy haciendo en el lugar correcto.

907
00:53:09,840 --> 00:53:11,740
Probablemente lo suficientemente bueno.

908
00:53:11,740 --> 00:53:15,590
Aquí he Acabo de añadir - y nos vamos de pantalla completa para que pueda ver todo el asunto -

909
00:53:15,590 --> 00:53:18,520
He añadido una etiqueta para la próxima div.

910
00:53:18,520 --> 00:53:20,890
El div se llama ratingControlDiv.

911
00:53:20,890 --> 00:53:23,090
Por sí mismo no hará nada.

912
00:53:23,090 --> 00:53:28,570
Si abre este en un navegador, usted estaría mirando en blanco, el mismo div.

913
00:53:28,570 --> 00:53:31,820
Pero debido a que la misteriosa línea de código que he mostrado antes,

914
00:53:31,820 --> 00:53:35,650
todo el proceso, que va a buscar algo que se parece a esto -

915
00:53:35,650 --> 00:53:40,380
control de ganancia de datos - y que va a encontrar lo que está en ese parámetro.

916
00:53:40,380 --> 00:53:44,560
Se va a hacer un ejemplo de lo que sea que está señalando.

917
00:53:44,560 --> 00:53:48,850
En este caso, se trata de un control de clasificación, por lo que estoy diciendo, "Por favor, vaya y vuelva a colocar esta cosa

918
00:53:48,850 --> 00:53:51,400
"Con lo que usted necesita hacer para hacer un control de clasificación."

919
00:53:51,400 --> 00:53:56,610
Podría tratarse de un control de la moneda, que podría ser el anillo de progreso o lo que sea el control que desea utilizar.

920
00:53:56,610 --> 00:53:59,390
Todos ellos van a trabajar esencialmente de la misma manera.

921
00:53:59,390 --> 00:54:02,920
Usted está utilizando marcado estándar HTML5 para indicar lo que quiere,

922
00:54:02,920 --> 00:54:07,670
y luego te vas a conseguir un control al final de este. Déjame correr esto.

923
00:54:07,670 --> 00:54:12,270
He copiado que en, y ahora que el marcado se convierte en esto,

924
00:54:12,270 --> 00:54:15,280
que es en realidad un buen número de elementos HTML.

925
00:54:15,280 --> 00:54:18,440
Estas son todas las imágenes individuales, y hay alrededor de ellos divs con selectores.

926
00:54:18,440 --> 00:54:22,610
Esperamos que usted puede ver eso. Es un poco más sutil.

927
00:54:22,610 --> 00:54:27,380
Puedo flotar sobre los diferentes conceptos, y que va a permitir que vea la clasificación aquí.

928
00:54:27,380 --> 00:54:31,560
Puedo hacer clic en él, y que recuerda la calificación, pero eso es todo.

929
00:54:31,560 --> 00:54:33,100
No está haciendo nada con la calificación.

930
00:54:33,100 --> 00:54:35,230
>> La última cosa que quiero mostrar en esta

931
00:54:35,230 --> 00:54:37,820
antes de que nos cambiamos a una experiencia de diseño más visual

932
00:54:37,820 --> 00:54:42,680
es un poco de código que pueda utilizar para responder a estos WinJS controles.

933
00:54:42,680 --> 00:54:47,540
Voy a salir de allí, de nuevo fuera de la pantalla completa,

934
00:54:47,540 --> 00:54:52,690
y cambiar a JS aquí por segundo.

935
00:54:52,690 --> 00:54:57,450
Yo puedo hacer esto aquí. Creo que voy a sustituir a todo este asunto.

936
00:54:57,450 --> 00:55:03,080
En realidad, creo que va a sustituir a todo, pero voy a averiguar juntos.

937
00:55:03,080 --> 00:55:07,350
Voy a poner esto aquí. Sí. Voy a eliminar este también.

938
00:55:07,350 --> 00:55:11,790
¿Qué puedo añadir? Parece que mucho. No es mucho.

939
00:55:11,790 --> 00:55:14,920
Acabo extendí esa línea de código que ya hablé antes,

940
00:55:14,920 --> 00:55:18,590
y yo digo, "Cuando todo está hecho, cuando se han hecho todos mis controles,

941
00:55:18,590 --> 00:55:23,660
"Y luego hacer esto." Así que a continuación, ejecute esta función llamada completada.

942
00:55:23,660 --> 00:55:27,080
En este caso, esto es algo que usted puede imaginar.

943
00:55:27,080 --> 00:55:29,040
Ve a buscar a ese control div.

944
00:55:29,040 --> 00:55:30,790
En realidad, hay una cosa que quiero señalar.

945
00:55:30,790 --> 00:55:35,630
Esa línea siguiente en realidad está diciendo, "Tengo que ratingControlDiv."

946
00:55:35,630 --> 00:55:39,770
"Quiero hablar con él como si se tratara de un verdadero control, un control WinJS."

947
00:55:39,770 --> 00:55:42,020
Así que, básicamente, que está pidiendo que a partir de ella.

948
00:55:42,020 --> 00:55:44,600
Usted está diciendo: "Yo quiero hablar con usted como un control."

949
00:55:44,600 --> 00:55:47,810
Y entonces usted puede comenzar a decir cosas como: "Vamos a añadir un detector para usted

950
00:55:47,810 --> 00:55:51,430
"Así que cuando usted está cambiado podemos responder a eso."

951
00:55:51,430 --> 00:55:56,930
Y entonces nosotros también podemos hacer cosas como esta. En realidad, ese es el viejo código allí.

952
00:55:56,930 --> 00:55:59,600
Creo que me falta pegar en una función más,

953
00:55:59,600 --> 00:56:05,030
y que sería la función real que responda a el control de clasificación que se cambia.

954
00:56:05,030 --> 00:56:07,710
Permítanme que en el pop justo aquí abajo,

955
00:56:07,710 --> 00:56:09,840
en algún lugar por allí.

956
00:56:09,840 --> 00:56:14,930
Y en este caso, lo único que es nuevo es el hecho de que estamos entrando en

957
00:56:14,930 --> 00:56:21,000
lo que el control de clasificación nos dice y nos estamos preguntando por qué se llama la tentativeRating.

958
00:56:21,000 --> 00:56:23,150
Hay un montón de diferentes otras cosas que ese control le puede decir,

959
00:56:23,150 --> 00:56:25,310
y no hace falta de control por control.

960
00:56:25,310 --> 00:56:29,140
Es muy sencillo. Usted será capaz de resolverlo ningún problema en absoluto.

961
00:56:29,140 --> 00:56:34,040
Ejecuto esto, y ahora cuando cambio las valoraciones y haga clic en la calificación,

962
00:56:34,040 --> 00:56:36,480
se puede ver ahora en realidad es la respuesta a la misma.

963
00:56:36,480 --> 00:56:40,280
Es poner esa calificación en la pantalla en esa etiqueta div demás vacío

964
00:56:40,280 --> 00:56:42,970
a continuación el control de clasificación.

965
00:56:42,970 --> 00:56:46,670
Esa es la magia de un montón de cosas aquí también.

966
00:56:46,670 --> 00:56:49,580
Así como usted está creando aplicaciones para el Windows Store,

967
00:56:49,580 --> 00:56:52,930
hay un montón de controles que usted puede utilizar. Todos ellos trabajan de esta manera.

968
00:56:52,930 --> 00:56:58,670
>> Te voy a enseñar la parte visual de diseño para estas aplicaciones.

969
00:56:58,670 --> 00:57:03,440
La buena noticia es que usted ya tendrá esta herramienta cuando instale todo

970
00:57:03,440 --> 00:57:06,240
si vas a la descarga y obtienes Visual Studio.

971
00:57:06,240 --> 00:57:09,890
Puedo hacer clic derecho en este. No voy a agrandar

972
00:57:09,890 --> 00:57:12,040
Sólo dice Abrir en Blend.

973
00:57:12,040 --> 00:57:16,040
Blend es otra herramienta que trabaja codo a codo con Visual Studio

974
00:57:16,040 --> 00:57:19,230
y se centra mucho más en el lado del diseño de las cosas,

975
00:57:19,230 --> 00:57:23,660
por lo que realmente Superficies herramientas optimizadas para la creación de estilos,

976
00:57:23,660 --> 00:57:29,720
la creación de animaciones, el trabajo con CSS, un montón de cosas en ese tipo de vena.

977
00:57:29,720 --> 00:57:36,380
Aquí lo que debe ser muy interesante y bastante obvio de inmediato es que estamos viendo la aplicación.

978
00:57:36,380 --> 00:57:40,060
Esperemos que todavía estamos.

979
00:57:40,060 --> 00:57:42,650
En lugar de ver el código, que todavía vemos en la parte inferior,

980
00:57:42,650 --> 00:57:45,350
estamos viendo la representación real de la aplicación.

981
00:57:45,350 --> 00:57:49,640
Lo que es más, no es sólo una representación de la aplicación, que es en realidad la aplicación en ejecución.

982
00:57:49,640 --> 00:57:52,010
Y eso es lo que realmente es bueno de Blend.

983
00:57:52,010 --> 00:57:58,620
El equipo ha hecho un montón de trabajo para llevar HTML y JavaScript y CSS en esta herramienta.

984
00:57:58,620 --> 00:58:01,930
Ahora usted puede, si tienes curiosidad, "¿Qué significa eso? ¿Qué puedo hacer yo?"

985
00:58:01,930 --> 00:58:08,310
De hecho, puedo diseñar a esta aplicación a pesar de que este tipo de cosas no existen en mi marcado.

986
00:58:08,310 --> 00:58:13,230
Recuerde que el control de calificación? Era sólo una etiqueta div.

987
00:58:13,230 --> 00:58:17,090
Esta cosa, esa estrella, sólo existe en tiempo de ejecución. ¿Cómo lo sé?

988
00:58:17,090 --> 00:58:20,300
Hay un poco de magia por aquí.

989
00:58:20,300 --> 00:58:21,700
Vea estos rayos?

990
00:58:21,700 --> 00:58:25,570
Cada vez que veas un relámpago, que significa que fue creado por algo en tiempo de ejecución.

991
00:58:25,570 --> 00:58:31,770
Algunos JavaScript corrió y se volvió algo en esto o creado esto con un poco de lógica.

992
00:58:31,770 --> 00:58:37,100
Esas estrellas que se ven allí fueron creados por JavaScript mediante WinJS.

993
00:58:37,100 --> 00:58:41,800
Lo bueno es que no me importa, todavía puede diseñar,

994
00:58:41,800 --> 00:58:44,410
Todavía puedo entrar y cambiar, puedo descubrir lo que está pasando aquí,

995
00:58:44,410 --> 00:58:50,260
Puedo mirar a la CSS, puedo seguir adelante y descubrir por qué el color es la forma que sea,

996
00:58:50,260 --> 00:58:54,610
Puedo empezar a jugar con las cosas y haciendo cosas horribles,

997
00:58:54,610 --> 00:58:58,360
lo que yo quiero hacer.

998
00:58:58,360 --> 00:59:01,020
En realidad, voy a dejar las cosas en paz.

999
00:59:01,020 --> 00:59:03,980
Pero se puede ver aquí es todo el CSS y te está mostrando aquí.

1000
00:59:03,980 --> 00:59:10,120
Si voy hasta allí, se va a mostrar todo lo que ellos llaman Ganar,

1001
00:59:10,120 --> 00:59:14,850
por lo que las reglas CSS que son los más específicos y el más elegido para ese artículo,

1002
00:59:14,850 --> 00:59:17,110
que probablemente ya has ido otra vez en sus clases,

1003
00:59:17,110 --> 00:59:22,000
donde se puede decir que hay una fuente general de que estamos aplicando a todo,

1004
00:59:22,000 --> 00:59:26,860
sino porque se trata de un h1 y tengo un color definido por H1S,

1005
00:59:26,860 --> 00:59:29,820
que va a ser de este color, y eso es porque es más específica que la cuerpo1.

1006
00:59:29,820 --> 00:59:32,590
Pero una cosa aquí que todos los que muestra,

1007
00:59:32,590 --> 00:59:35,470
y es realmente algo muy poderoso a medida que se vuelven más complejos,

1008
00:59:35,470 --> 00:59:38,160
te estás preguntando por qué estas cosas son como son.

1009
00:59:38,160 --> 00:59:41,020
Es en realidad le dirá, y se puede elegir cualquiera de estos artículos aquí.

1010
00:59:41,020 --> 00:59:43,370
Ese color no es tan malo, de hecho.

1011
00:59:43,370 --> 00:59:47,150
Puede seleccionarlos. Esperamos que usted puede ver esto.

1012
00:59:47,150 --> 00:59:52,410
Por todo lo que usted tiene en su aplicación, verá una cascada

1013
00:59:52,410 --> 00:59:56,070
de todo el CSS que podría haber aplicado a eso y cuál es ganar,

1014
00:59:56,070 --> 00:59:58,050
que uno realmente tomó precedencia.

1015
00:59:58,050 --> 01:00:00,930
Estos son un poco aburrido. No hay mucho que hacer en algunas de ellas.

1016
01:00:00,930 --> 01:00:04,660
Si me voy y cambio el color, entonces usted comenzará a ver algunos en cascada allí.

1017
01:00:04,660 --> 01:00:07,760
También puede usar HTML aquí también.

1018
01:00:07,760 --> 01:00:12,490
Puedo ir a través y modificar las propiedades del HTML para todas estas cosas como yo quiero.

1019
01:00:12,490 --> 01:00:14,620
Sólo hay un montón de cosas aquí.

1020
01:00:14,620 --> 01:00:18,070
>> No quiero tomar su tiempo yendo a través de todo aquí. Sólo sé que está aquí.

1021
01:00:18,070 --> 01:00:21,700
Hay una gran cantidad de funcionalidad orientada al diseño que es sólo disponible para usted

1022
01:00:21,700 --> 01:00:26,730
para que pueda mantenerse visual, trabajar con la aplicación, y no tener que hacer un montón de conjeturas

1023
01:00:26,730 --> 01:00:32,180
que tendría que ver con normalidad y hacen ciclos regresando desde un navegador de nuevo en su diseño,

1024
01:00:32,180 --> 01:00:33,940
de vuelta al navegador.

1025
01:00:33,940 --> 01:00:37,010
Esto es realmente cosas interesantes para eso, y mientras desarrolla una aplicación de Windows Store,

1026
01:00:37,010 --> 01:00:39,650
que va a hacer un montón más productivo.

1027
01:00:39,650 --> 01:00:45,150
>> También verá que está siguiendo el marcado aquí y tu CSS

1028
01:00:45,150 --> 01:00:47,270
como el que está trabajando a través de diferentes cosas.

1029
01:00:47,270 --> 01:00:50,180
Es probable que sea muy difícil para usted ver que, sobre todo en el vídeo,

1030
01:00:50,180 --> 01:00:54,680
pero eso es lo que está pasando aquí, y se lo recomendaría a familiarizarse con eso.

1031
01:00:54,680 --> 01:00:57,240
Esto le ahorrará mucho tiempo. Eso es Blend.

1032
01:00:57,240 --> 01:01:00,520
Si realiza cambios aquí, van automáticamente a llevar de vuelta a lo largo

1033
01:01:00,520 --> 01:01:01,870
a Visual Studio.

1034
01:01:01,870 --> 01:01:06,590
Son los mismos archivos, que es lo mismo todo. Lo dejo solo.

1035
01:01:06,590 --> 01:01:08,650
Tengo un ejemplo mejor que yo quiero mostrar.

1036
01:01:08,650 --> 01:01:11,660
Pero si he hecho un cambio allí y guardé y volví a Visual Studio, se diría,

1037
01:01:11,660 --> 01:01:16,390
"Hey, que acaba de cambiar algo. ¿Puedo volver a cargarlo para usted?" Sí.

1038
01:01:16,390 --> 01:01:18,770
Y usted está usando el mismo material allí.

1039
01:01:18,770 --> 01:01:21,320
Ese es el final de esa muestra particular.

1040
01:01:21,320 --> 01:01:28,170
>> Yo quiero mostrar una muestra de gama alta sólo para darle una vista de otra funcionalidad

1041
01:01:28,170 --> 01:01:30,350
es posible pensar también.

1042
01:01:30,350 --> 01:01:32,280
Esta es una aplicación de ejemplo que se puede descargar.

1043
01:01:32,280 --> 01:01:35,620
Si usted busca algo que se llama el Campo de Windows en una caja,

1044
01:01:35,620 --> 01:01:40,340
hay algunas muestras que están en eso, y uno de ellos es El libro de cocina de Contoso.

1045
01:01:40,340 --> 01:01:41,640
Yo sólo puedo correr esto para usted.

1046
01:01:41,640 --> 01:01:44,700
Pantalla de bienvenida personalizada. Esta es la aplicación vista de cuadrícula.

1047
01:01:44,700 --> 01:01:49,590
Han obligados algunos datos personalizados aquí. Usted puede navegar a través de este.

1048
01:01:49,590 --> 01:01:53,090
Usted puede ir y echar un vistazo a varias cosas que nos harán hambre en una tarde de viernes.

1049
01:01:53,090 --> 01:01:57,760
No se. ¿Qué va a hacerme el más hambre?

1050
01:01:57,760 --> 01:02:00,530
No se. Yo sólo voy a elegir uno.

1051
01:02:00,530 --> 01:02:02,460
Te metes en estas cosas. Se le mostrará la receta.

1052
01:02:02,460 --> 01:02:04,900
Usted también podría, en lugar de hacer clic en un elemento,

1053
01:02:04,900 --> 01:02:10,360
se puede llegar directamente a la categoría de contenido, esa sección de contenido.

1054
01:02:10,360 --> 01:02:15,590
En este caso, se puede leer un montón de falsos América que contarnos todo sobre estas recetas aquí

1055
01:02:15,590 --> 01:02:17,720
y luego ir a la derecha en la receta específica.

1056
01:02:17,720 --> 01:02:22,770
Esto también es compatible con cosas como el intercambio que he mostrado antes, con las fotos.

1057
01:02:22,770 --> 01:02:26,160
También puede buscar en esta aplicación también.

1058
01:02:26,160 --> 01:02:28,880
Es muy sencillo de hacer la búsqueda.

1059
01:02:28,880 --> 01:02:31,300
Básicamente, usted acaba de entrar una cadena de texto desde Windows

1060
01:02:31,300 --> 01:02:34,720
y usted decide cómo quiere manejar búsqueda con eso.

1061
01:02:34,720 --> 01:02:39,830
Está a unas pocas líneas de código para conseguir eso, y entonces, ¿qué se hace con él después de eso es totalmente de usted.

1062
01:02:39,830 --> 01:02:44,180
>> Aquí también tienen una barra de la aplicación donde se está utilizando alguna otra funcionalidad.

1063
01:02:44,180 --> 01:02:45,430
Sólo te diré lo que es.

1064
01:02:45,430 --> 01:02:48,220
Un recordatorio va a utilizar lo que se llama una notificación brindis.

1065
01:02:48,220 --> 01:02:52,930
Esto es muy práctico para dejar que el usuario saber cuando las cosas han sucedido,

1066
01:02:52,930 --> 01:02:55,850
como una aplicación se ha instalado o se completó algo.

1067
01:02:55,850 --> 01:02:57,950
También es bueno para los juegos también.

1068
01:02:57,950 --> 01:03:02,360
Si usted tiene un mundo persistente o una tabla de líderes y un servicio que ha de hosting que

1069
01:03:02,360 --> 01:03:08,490
tal vez en un equipo diferente, las notificaciones se pueden enviar en una máquina

1070
01:03:08,490 --> 01:03:12,240
e incluso si el usuario no está utilizando su juego, jugar el juego o el funcionamiento de su aplicación,

1071
01:03:12,240 --> 01:03:15,170
aún pueden recibir notificaciones sobre este tipo de eventos.

1072
01:03:15,170 --> 01:03:19,350
Así que se podría decir, "Tu castillo ha sido destruido o está a punto de destruir."

1073
01:03:19,350 --> 01:03:22,870
"¡Vuelve aquí y defenderla", o algo por el estilo.

1074
01:03:22,870 --> 01:03:26,830
Hace clic en la notificación, vaya a la derecha de nuevo en el juego, y se puede jugar.

1075
01:03:26,830 --> 01:03:32,170
Así que ese tipo de cosas pueden realmente ayudar a atraer a la gente de nuevo en su aplicación muy efectiva.

1076
01:03:32,170 --> 01:03:37,450
>> También hay apoyo en esta aplicación para usar el micrófono, la cámara web,

1077
01:03:37,450 --> 01:03:39,560
haciendo video y tomar fotos.

1078
01:03:39,560 --> 01:03:42,080
También puede anclar una ficha secundaria.

1079
01:03:42,080 --> 01:03:46,760
Es útil si usted quiere tener sólo una ficha que va a la derecha a determinados contenidos.

1080
01:03:46,760 --> 01:03:49,960
En este caso, se va a la derecha a esta receta.

1081
01:03:49,960 --> 01:03:51,300
Todo lo que estoy mencionando sólo estoy mostrando

1082
01:03:51,300 --> 01:03:53,270
porque es lo que usted puede pensar acerca del uso también.

1083
01:03:53,270 --> 01:03:57,590
En su mayor parte, son muy fácil de usar.

1084
01:03:57,590 --> 01:04:00,070
Me acaba de recomendar que aparezca que el explorador muestra

1085
01:04:00,070 --> 01:04:03,600
y encontrar una muestra que puede mostrarle cómo hacerlo.

1086
01:04:03,600 --> 01:04:07,140
Es bastante sencillo de llevar a los en sus aplicaciones allí también.

1087
01:04:07,140 --> 01:04:11,030
>> Me voy a mostrar algo que es bastante fresco aquí.

1088
01:04:11,030 --> 01:04:15,230
Yo romperé esta aplicación, y voy a volver a Visual Studio.

1089
01:04:15,230 --> 01:04:18,870
Esta aplicación se está ejecutando. Está funcionando desde Visual Studio.

1090
01:04:18,870 --> 01:04:21,370
Puedo hacer algunas cosas bastante bien con eso.

1091
01:04:21,370 --> 01:04:23,840
De hecho, tengo una opción para seleccionar un elemento,

1092
01:04:23,840 --> 01:04:28,250
y puedo ir de aquí a la aplicación en vivo y lo que puedo decir,

1093
01:04:28,250 --> 01:04:34,000
"Me pregunto por qué es Tiempo de preparación un poco gris más claro que el título en sí mismo?"

1094
01:04:34,000 --> 01:04:35,680
Puedo hacer clic en él.

1095
01:04:35,680 --> 01:04:38,080
Se va a sincronizar ese nuevo en Visual Studio,

1096
01:04:38,080 --> 01:04:43,780
y que me va a mostrar exactamente el contenido generado por el que dio lugar a que una parte de la interfaz de usuario.

1097
01:04:43,780 --> 01:04:47,270
Así que en este caso, es elemento h4-subtítulos y doble construcción,

1098
01:04:47,270 --> 01:04:51,110
y que, probablemente, nos dice lo que necesitamos saber, porque como h4 dentro de ese contexto,

1099
01:04:51,110 --> 01:04:53,550
que va a obtener un determinado tipo de fuente.

1100
01:04:53,550 --> 01:04:56,410
Pero si todavía no sé por qué, puedo hacer clic en Rastrear estilos.

1101
01:04:56,410 --> 01:05:02,330
Entonces puedo expandir el color y puedo averiguar exactamente por qué ese color no es el color de la carrocería

1102
01:05:02,330 --> 01:05:04,640
pero en realidad es otra cosa.

1103
01:05:04,640 --> 01:05:07,210
Esto es esencialmente las herramientas dev desde Internet Explorer

1104
01:05:07,210 --> 01:05:09,530
hasta cierto punto puesto en Visual Studio.

1105
01:05:09,530 --> 01:05:12,110
Si usted ha trabajado con las herramientas de Chrome Dev, Firebug, cosas así,

1106
01:05:12,110 --> 01:05:14,720
ese tipo de herramientas que se encuentran en el navegador,

1107
01:05:14,720 --> 01:05:17,340
ese tipo de funcionalidad se ha traído a la derecha en Visual Studio

1108
01:05:17,340 --> 01:05:22,090
por lo que en realidad no tiene que lanzar un navegador y trabajar con esas herramientas por separado.

1109
01:05:22,090 --> 01:05:24,320
Ahora tengo una aplicación de Windows Store sólo correr,

1110
01:05:24,320 --> 01:05:27,840
y puedo empezar a tirar lo diferencia y descubrir por qué las cosas están haciendo lo que son.

1111
01:05:27,840 --> 01:05:30,440
>> También puedo hacerlo de esta manera también.

1112
01:05:30,440 --> 01:05:35,020
Puedo ir y sólo debes elegir algo bien a partir del marcado y averiguar de qué se trata

1113
01:05:35,020 --> 01:05:38,560
en la propia aplicación. Creo que he pasado por todo.

1114
01:05:38,560 --> 01:05:41,440
Aquí estoy flotando sobre esto. Puedo seleccionarlo.

1115
01:05:41,440 --> 01:05:45,540
Se me va a mostrar en la aplicación en ejecución real donde esa cosa es

1116
01:05:45,540 --> 01:05:48,070
que estoy ahora haciendo clic en en el marcado.

1117
01:05:48,070 --> 01:05:49,700
Cosas realmente interesantes.

1118
01:05:49,700 --> 01:05:52,710
Como usted está tratando de averiguar lo que está pasando y lo que está haciendo HTML,

1119
01:05:52,710 --> 01:05:56,080
lo CSS está haciendo, tenga esto en cuenta.

1120
01:05:56,080 --> 01:05:58,450
Recuerde que esto está aquí para usted

1121
01:05:58,450 --> 01:06:02,070
y también que Blend puede trabajar con una aplicación en ejecución en vivo.

1122
01:06:02,070 --> 01:06:06,070
>> La última cosa que quería mostrarle con esta aplicación -

1123
01:06:06,070 --> 01:06:09,290
Por cierto, se nota que los deltas como las cosas cambian demasiado,

1124
01:06:09,290 --> 01:06:11,160
para que pueda ver por esos reflejos amarillos.

1125
01:06:11,160 --> 01:06:14,060
Esas son las cosas que han cambiado sólo en la aplicación.

1126
01:06:14,060 --> 01:06:16,350
Pero una última cosa. Quiero volver a Mezcle sólo por un segundo aquí.

1127
01:06:16,350 --> 01:06:21,790
Abriremos esto, Abrir en Blend, misma aplicación, todo igual.

1128
01:06:21,790 --> 01:06:28,660
Sólo quiero que le muestre la experiencia aquí no es sólo usted está atascado en la página principal

1129
01:06:28,660 --> 01:06:32,880
mirando las cosas que usted conseguirá de forma predeterminada cuando se ejecuta la aplicación y dejar reposar allí.

1130
01:06:32,880 --> 01:06:36,490
También puede activar esta bastante pequeño icono aquí.

1131
01:06:36,490 --> 01:06:38,560
Se llama modo Interactivo.

1132
01:06:38,560 --> 01:06:41,560
Hace clic en eso. Se va a abrir la aplicación.

1133
01:06:41,560 --> 01:06:43,730
Usted no está en el modo de diseño más, así que usted no va a ser hacer clic en las cosas

1134
01:06:43,730 --> 01:06:47,270
para cambiar la funcionalidad, pero en realidad se puede trabajar con la aplicación ahora.

1135
01:06:47,270 --> 01:06:51,560
Puede hacer clic a través de, usted puede hacer lo que sea, llegar a una receta que usted se preocupa por

1136
01:06:51,560 --> 01:06:54,810
oa una categoría. Vamos a ir a esta categoría.

1137
01:06:54,810 --> 01:06:56,880
Yo le digo: "Bueno, aquí es donde quiero diseñar".

1138
01:06:56,880 --> 01:06:59,680
Luego hacer clic en ese botón, que le llevará de vuelta a la superficie de diseño,

1139
01:06:59,680 --> 01:07:02,130
y ahora usted puede hacer todas esas cosas que los que hablaba antes.

1140
01:07:02,130 --> 01:07:06,230
Voy a seguir haciendo clic hasta que llego este seleccionado, averiguar sus dimensiones,

1141
01:07:06,230 --> 01:07:09,890
averiguar el código HTML para él, el CSS para que

1142
01:07:09,890 --> 01:07:14,990
para una aplicación en ejecución, una parte posterior de la aplicación.

1143
01:07:14,990 --> 01:07:17,780
Muy, muy útil. Te voy a mostrar esto a usted.

1144
01:07:17,780 --> 01:07:21,340
Por favor, tenga en cuenta si usted está buscando en la escritura de código con este

1145
01:07:21,340 --> 01:07:26,070
porque va a ahorrar un montón de problemas, y es bastante bueno.

1146
01:07:26,070 --> 01:07:32,370
Eso es casi todo lo que quería mostrar en Blend y en Visual Studio para todo eso.

1147
01:07:32,370 --> 01:07:36,130
>> ¿Tiene preguntas sobre cualquiera de estas herramientas?

1148
01:07:36,130 --> 01:07:40,000
¿Cualquier cosa? >> [Guarin] Tengo cosas para dar a conocer, por lo que las buenas preguntas, cosas buenas.

1149
01:07:40,000 --> 01:07:43,700
>> [Bowen ríe] Ya te he mostrado mis demos aquí.

1150
01:07:43,700 --> 01:07:47,000
Voy a ponerlo en la página de Los Recursos y gire a preguntas ahora.

1151
01:07:47,000 --> 01:07:53,850
Esa primera referencia es que la Generación App sitio con la pista de juego y la pista de aplicación.

1152
01:07:53,850 --> 01:07:55,040
Regístrate en aquellos.

1153
01:07:55,040 --> 01:07:57,210
Usted no tiene que esperar los 30 días para obtener el contenido.

1154
01:07:57,210 --> 01:08:00,370
Usted puede empezar a ir y mirar el contenido a su gusto.

1155
01:08:00,370 --> 01:08:04,380
Entiendo sus marcos de tiempo pueden ser diferentes de - [risas]

1156
01:08:04,380 --> 01:08:07,780
Por eso, cuando es el hackathon? Eso es un par de semanas, ¿no?

1157
01:08:07,780 --> 01:08:09,620
Así que usted no tiene los 30 días para esperar.

1158
01:08:09,620 --> 01:08:13,180
Así que sí, puede inscribirse en eso y entonces simplemente comenzar a retirar el contenido de ella.

1159
01:08:13,180 --> 01:08:15,320
También el Dev y los Centros de Diseño.

1160
01:08:15,320 --> 01:08:17,620
Y no he mencionado esto, pero también está la tienda Docs.

1161
01:08:17,620 --> 01:08:22,880
Esto sería para después de la hackathon y cuando usted está listo para comenzar a enviar sus aplicaciones para la tienda.

1162
01:08:22,880 --> 01:08:27,350
Hay algunas pautas útiles aquí, alguna orientación sobre cómo hacer las cosas en la tienda,

1163
01:08:27,350 --> 01:08:29,960
algunos problemas comunes que puedas tropezar y caer,

1164
01:08:29,960 --> 01:08:32,540
y ese es el final de esos recursos.

1165
01:08:32,540 --> 01:08:35,300
>> Entonces, ¿qué tienes en mente? Cualquier otra cosa que usted -

1166
01:08:35,300 --> 01:08:40,580
[Guarin] ¿Quién está pensando en hacer una aplicación de Windows para CS50? Genial.

1167
01:08:40,580 --> 01:08:42,200
[Bowen] fresco. Grande.

1168
01:08:44,149 --> 01:08:49,410
>> ¿Una pregunta sobre las cosas que has visto hasta ahora y cómo se relaciona con esto?

1169
01:08:49,410 --> 01:08:54,540
Por ejemplo, con más tiempo podría tomar un juego que he escrito

1170
01:08:54,540 --> 01:08:57,310
y que se ejecuta en el navegador y sólo un poco de ir a través del proceso

1171
01:08:57,310 --> 01:08:59,870
de poner eso en Visual Studio y lo que es una aplicación de Windows Store.

1172
01:08:59,870 --> 01:09:02,870
Se tarda más tiempo de lo que realmente había que incluir hoy en día,

1173
01:09:02,870 --> 01:09:08,010
pero la versión corta es que es el mismo código que se estén ejecutando en el navegador,

1174
01:09:08,010 --> 01:09:11,680
y las cosas que usted cambia son las cosas que usted decida para conectar a Windows 8.

1175
01:09:11,680 --> 01:09:16,220
Así que si usted desea utilizar encantos, si usted desea buscar o compartir,

1176
01:09:16,220 --> 01:09:19,899
que necesita para crear una barra de la aplicación para esconderse algunas funciones en que,

1177
01:09:19,899 --> 01:09:21,939
esos son los tipos de cosas que cambiaría.

1178
01:09:21,939 --> 01:09:25,229
Pero el núcleo de tu aplicación web puede permanecer intacto.

1179
01:09:25,229 --> 01:09:29,590
Una vez más, siempre y cuando se trabaja en IE10, que va a ser un puerto muy fácil

1180
01:09:29,590 --> 01:09:33,680
para traer esas cosas en Visual Studio, en Blend, y convertirla en una aplicación de Windows Store.

1181
01:09:33,680 --> 01:09:37,500
Una vez más, las únicas cosas que usted tendrá que aprender son las otras características

1182
01:09:37,500 --> 01:09:41,830
que se puede utilizar para iluminar una aplicación, como una baldosa en vivo y ese tipo de cosas.

1183
01:09:41,830 --> 01:09:46,899
>> Sí. >> [Estudiante] Mi pregunta es sobre el trabajo móvil.

1184
01:09:46,899 --> 01:09:52,210
Así que si usted hace una aplicación que funciona como una aplicación de escritorio,

1185
01:09:52,210 --> 01:09:56,480
¿es realmente fácil de transferir a móvil, o hay una -

1186
01:09:56,480 --> 01:10:01,270
La pregunta es, si hago una aplicación de Windows Store que realmente está optimizado para este entorno

1187
01:10:01,270 --> 01:10:06,430
y quiero llevarlo a un mundo móvil, lo que está involucrado en hacer eso?

1188
01:10:06,430 --> 01:10:10,060
Eso, al igual que muchas preguntas, es siempre una respuesta constante cambio.

1189
01:10:10,060 --> 01:10:16,190
La buena noticia es que si usted se está pegando con HTML y JavaScript, CSS,

1190
01:10:16,190 --> 01:10:18,720
si estás empezando desde una aplicación de Windows Store,

1191
01:10:18,720 --> 01:10:20,590
que va a permitir que usted lo trae a la Web

1192
01:10:20,590 --> 01:10:24,650
y luego utilizar ese tipo de técnicas, como las consultas y las cosas de los medios,

1193
01:10:24,650 --> 01:10:27,180
para adaptarse a diferentes dispositivos de tamaño.

1194
01:10:27,180 --> 01:10:29,900
Dicho esto, siempre hay marcos y cosas por ahí

1195
01:10:29,900 --> 01:10:33,450
que el apoyo que se extiende a cabo diferentes tecnologías, las diferentes plataformas.

1196
01:10:33,450 --> 01:10:35,670
Eso cambia todo el tiempo.

1197
01:10:35,670 --> 01:10:40,030
También estamos cambiando las cosas tan bien como nosotros miramos hacia lo que tenemos ahora

1198
01:10:40,030 --> 01:10:42,950
realidad con Windows Phone 8.

1199
01:10:42,950 --> 01:10:44,930
Tenemos algunas infraestructuras básicas compartidas

1200
01:10:44,930 --> 01:10:48,180
ofrecido entre las aplicaciones para estos entornos.

1201
01:10:48,180 --> 01:10:51,200
Así que las cosas que usted está haciendo para crear una aplicación de Windows Store,

1202
01:10:51,200 --> 01:10:57,790
mucho de eso se puede trasladar a una aplicación de Windows Phone 8 también.

1203
01:10:57,790 --> 01:11:02,270
Eso es otra vez una historia emergente, por lo que hay algo de contenido de eso en Generar.

1204
01:11:02,270 --> 01:11:06,780
El SDK acaba de salir hace un rato. Se acaba de publicar hace un rato.

1205
01:11:06,780 --> 01:11:09,920
Pero en términos de otras plataformas también,

1206
01:11:09,920 --> 01:11:13,360
usted probablemente se encuentra con muchos marcos de plataforma cruzada también.

1207
01:11:13,360 --> 01:11:16,170
La buena noticia es que las cosas que usted está haciendo aquí,

1208
01:11:16,170 --> 01:11:19,620
la funcionalidad principal es hacia arriba cosas estándar web.

1209
01:11:19,620 --> 01:11:24,010
Las únicas cosas que no se traducirían fácilmente son las cosas que Windows 8 hace,

1210
01:11:24,010 --> 01:11:28,060
pero eso no es una sorpresa ya que es una característica de Windows.

1211
01:11:28,060 --> 01:11:34,090
No vas a encontrar compartiendo o tipos similares de contratos en cualquier otra plataforma.

1212
01:11:34,090 --> 01:11:37,480
Así que esas son las cosas que usted desearía desde una perspectiva de diseño

1213
01:11:37,480 --> 01:11:40,820
asegúrese de que tiene formas de tipo de resumen que fuera así que usted puede decir,

1214
01:11:40,820 --> 01:11:42,970
"Si estoy corriendo en esto, yo puedo hacer eso."

1215
01:11:42,970 --> 01:11:48,120
Si no estoy, hay algunos patrones de diseño que puede utilizar para ocultar tipo de esas cosas de distancia.

1216
01:11:48,120 --> 01:11:53,360
Pero hay que tener eso en mente. Sí. Lo siento. Adelante.

1217
01:11:53,360 --> 01:11:58,130
>> [Estudiante] Si quiero probar mi aplicación de Windows en la parte superior de [inaudible]

1218
01:11:58,130 --> 01:12:02,310
[Bowen] Sí. Me salté una cosa más también. Sí.

1219
01:12:02,310 --> 01:12:04,910
Voy a responder a su pregunta en primer lugar, a continuación, te voy a mostrar una característica que me olvidé de mencionar.

1220
01:12:04,910 --> 01:12:09,220
Tenemos algunas máquinas disponibles localmente. Lo siento.

1221
01:12:09,220 --> 01:12:11,240
La pregunta era, ¿cómo puedo probar las cosas en los dispositivos

1222
01:12:11,240 --> 01:12:14,230
si no sucede que tiene un montón de cosas para elegir?

1223
01:12:14,230 --> 01:12:17,130
[Guarin] Le prestamos chicos, creo, 5 o 6. ¿Cuántos necesita?

1224
01:12:17,130 --> 01:12:20,940
[Estudiante] Tenemos 4 de ellos. >> Okay. ¿Tienen 4 pizarras para jugar.

1225
01:12:20,940 --> 01:12:25,520
Así que sin duda que todos lo sepan, por favor. [Risas] >> [Bowen] Impresionante.

1226
01:12:25,520 --> 01:12:27,610
Esa es una respuesta aún mejor de lo que me iba a dar.

1227
01:12:27,610 --> 01:12:31,250
Tenemos horario de oficina para los desarrolladores que hacemos en nuestra oficina

1228
01:12:31,250 --> 01:12:35,110
y ahora próximamente en la tienda de Microsoft sobre el Pru,

1229
01:12:35,110 --> 01:12:37,010
pero Edwin ya ha tomado el cuidado de usted.

1230
01:12:37,010 --> 01:12:42,180
Hay 4 pizarras disponibles para préstamo, para la prueba.

1231
01:12:42,180 --> 01:12:45,440
Eso es. Hay un ejemplo de uno allí.

1232
01:12:45,440 --> 01:12:47,340
Así que sí, absolutamente. Grande.

1233
01:12:47,340 --> 01:12:52,700
Absolutamente, con mucho, la mejor manera de probar que es estar en un dispositivo.

1234
01:12:52,700 --> 01:12:56,810
Si no sucede que tiene uno todavía o no quieren caminar por el campus en la nieve

1235
01:12:56,810 --> 01:13:01,130
tomar uno o lo que sea, hay una manera de hacer esto de nuevo en Visual Studio.

1236
01:13:01,130 --> 01:13:10,360
Si vuelvo a ir a donde yo estaba aquí, aquí en vez de usar la máquina local,

1237
01:13:10,360 --> 01:13:13,590
usted puede conectarse a la máquina remota, pero eso no es lo que estoy hablando aquí.

1238
01:13:13,590 --> 01:13:16,830
Simulador es lo que usted puede desear mirar en.

1239
01:13:16,830 --> 01:13:22,120
Voy a correr esto, y realmente lo que es, es esencialmente una ventana a su propio sistema.

1240
01:13:22,120 --> 01:13:26,260
Aquí es en realidad mi sistema en funcionamiento, corriendo Contoso,

1241
01:13:26,260 --> 01:13:29,550
pero de una manera que me permite cambiar algunos de los parámetros de ejecución,

1242
01:13:29,550 --> 01:13:31,060
los parámetros ambientales.

1243
01:13:31,060 --> 01:13:34,150
Así que puedo decir aquí, "¿Sabes qué?"

1244
01:13:34,150 --> 01:13:39,240
Oh. Ya he funcionando en una simulación de monitor de 27 pulgadas en 2560 resolución.

1245
01:13:39,240 --> 01:13:44,930
Puedo caer fácilmente que hacia abajo y ver lo que mi aplicación haría con una pantalla más pequeña

1246
01:13:44,930 --> 01:13:47,480
o cambiar la configuración de PPP o lo que sea.

1247
01:13:47,480 --> 01:13:50,700
Así que en una pequeña pantalla, un 10,6, ¿qué va a hacer?

1248
01:13:50,700 --> 01:13:53,040
Eso todavía se ve muy bien, ¿verdad?

1249
01:13:53,040 --> 01:13:58,220
Usted querrá hacer esto, especialmente si vas a enviar a la tienda, porque lo hacemos

1250
01:13:58,220 --> 01:14:00,480
como parte del proceso de pruebas.

1251
01:14:00,480 --> 01:14:02,400
Y si hay problemas como esos,

1252
01:14:02,400 --> 01:14:06,160
entonces usted podría encontrarse con un problema de obtener la certificación para la tienda.

1253
01:14:06,160 --> 01:14:09,240
Pero eso es parte del simulador. Realmente bueno. Muy fácil de hacer eso.

1254
01:14:09,240 --> 01:14:11,480
También puede utilizar funciones como girar también.

1255
01:14:11,480 --> 01:14:15,650
Puedo hacer clic en el botón, haga que la gira, ver qué alguien tendría como una experiencia

1256
01:14:15,650 --> 01:14:20,970
girando su pizarra, su tablet, y el uso de la aplicación con eso.

1257
01:14:20,970 --> 01:14:25,060
Hay algunas otras cosas también, como la emulación de contacto y algunas otras cosas,

1258
01:14:25,060 --> 01:14:27,210
AJUSTE GPS.

1259
01:14:27,210 --> 01:14:31,050
Puedo fingir que estoy en un lugar diferente y ver lo que mi aplicación

1260
01:14:31,050 --> 01:14:34,690
cuando finjo que estoy de vuelta en Seattle o algo así.

1261
01:14:34,690 --> 01:14:41,970
Pero es una característica muy útil, y está integrado en Visual Studio y en Blend.

1262
01:14:41,970 --> 01:14:44,460
Sí. Tu pregunta.

1263
01:14:44,460 --> 01:14:48,530
>> [Estudiante] Si estás escribiendo un juego, no Visual Studio ningún apoyo para la animación?

1264
01:14:48,530 --> 01:14:55,550
Sí. La pregunta es de alrededor de ayuda de la animación, sobre todo con los juegos.

1265
01:14:55,550 --> 01:14:58,380
Depende. [Risas]

1266
01:14:58,380 --> 01:15:06,870
Con JavaScript voy a decir que probablemente hay menos apoyo que hay en el lado XAML,

1267
01:15:06,870 --> 01:15:11,430
que cuenta con líneas de tiempo, cuenta con storyboards y cosas que se construyen pulg

1268
01:15:11,430 --> 01:15:18,710
Para animaciones en aplicaciones de JavaScript, no sé qué parte de la respuesta que quiero dar.

1269
01:15:18,710 --> 01:15:25,110
Tengo los recursos en mi blog que pasan por un montón de opciones para ambos animaciones físicas,

1270
01:15:25,110 --> 01:15:29,280
opciones para juegos orientados JavaScript en Windows 8.

1271
01:15:29,280 --> 01:15:31,300
Me remito a aquellos.

1272
01:15:31,300 --> 01:15:34,300
Básicamente, hay tantas opciones.

1273
01:15:34,300 --> 01:15:37,770
La razón por la que estoy dudando es que hay tantas opciones para hacer animaciones con JavaScript.

1274
01:15:37,770 --> 01:15:44,280
Podría ser CSS, podría basarse-Lona, podría ser simplemente animaciones básicas de DOM,

1275
01:15:44,280 --> 01:15:47,470
que podría ser un montón de cosas diferentes, así que realmente depende de su elección.

1276
01:15:47,470 --> 01:15:55,790
Si usted decide usar algo como Create.js o cal u otros tipos de marcos -

1277
01:15:55,790 --> 01:15:59,150
Bueno, ni siquiera estoy seguro de que vas a ser capaz de utilizar un marco de gama alta

1278
01:15:59,150 --> 01:16:01,370
gustaría Impacto o Construir.

1279
01:16:01,370 --> 01:16:07,000
Esto tiende a generar más código que usted podría considerar a partir de cero.

1280
01:16:07,000 --> 01:16:11,730
Pero en esos casos, aún se podía utilizar un simulador, puede utilizar los entornos,

1281
01:16:11,730 --> 01:16:17,480
y tiendo a utilizar este entorno para mi plataforma de pruebas en los casos

1282
01:16:17,480 --> 01:16:19,930
como que estoy desarrollando juegos.

1283
01:16:19,930 --> 01:16:22,110
He estado bien, especialmente con las animaciones de lona,

1284
01:16:22,110 --> 01:16:23,850
que es probablemente la cosa más común.

1285
01:16:23,850 --> 01:16:27,360
Lo mejor que vas a encontrar es probablemente las herramientas dev en el navegador

1286
01:16:27,360 --> 01:16:30,160
y las herramientas dev en Visual Studio.

1287
01:16:30,160 --> 01:16:34,610
Una especie de respuesta meandros allí, pero espero que me dieron la respuesta. Sí. Usted.

1288
01:16:34,610 --> 01:16:36,470
>> [Estudiante] ¿Cuáles son las opciones de almacenamiento de datos para aplicaciones de Windows 8?

1289
01:16:36,470 --> 01:16:41,100
¿Cuáles son las opciones de almacenamiento de datos para aplicaciones de Windows 8, Windows Store apps?

1290
01:16:41,100 --> 01:16:46,790
Sus opciones son en realidad cada aplicación tiene su propio estanque de almacenamiento local

1291
01:16:46,790 --> 01:16:52,150
para los ajustes y los datos, pero también es ridículamente fácil de usar la itinerancia de almacenamiento,

1292
01:16:52,150 --> 01:16:54,920
para utilizar el almacenamiento basado en la nube. Es gratuito.

1293
01:16:54,920 --> 01:16:58,250
Lo que pasa es que, básicamente, elegir una clase diferente y usted dice,

1294
01:16:58,250 --> 01:17:03,370
"Configuración de Roaming, Guardar, este conjunto particular de contenido"

1295
01:17:03,370 --> 01:17:06,050
y su cuenta de Microsoft, lo que han firmado con el nombre,

1296
01:17:06,050 --> 01:17:08,620
va a ser la clave de la itinerancia que la información alrededor.

1297
01:17:08,620 --> 01:17:13,790
Así que si uso el juego en mi computadora portátil y luego abro una sesión con la misma cuenta

1298
01:17:13,790 --> 01:17:18,900
como yo jugar el juego en una superficie o una tableta,

1299
01:17:18,900 --> 01:17:23,610
que va a vagar automáticamente esta configuración y datos entre las máquinas.

1300
01:17:23,610 --> 01:17:27,550
Eso es algo predeterminado. Eso es bueno para determinadas cantidades de datos.

1301
01:17:27,550 --> 01:17:30,220
Usted no pondría una enorme base de datos en aquellos.

1302
01:17:30,220 --> 01:17:35,350
Para que usted necesita para ir a otro tipo de soluciones, como una base de datos alojada en la nube,

1303
01:17:35,350 --> 01:17:36,690
cosas así.

1304
01:17:36,690 --> 01:17:39,840
Hay algunas otras opciones en la comunidad alrededor de otros tipos de tecnologías de datos.

1305
01:17:39,840 --> 01:17:42,920
He visto algunas de las opciones de SQLite en la comunidad alrededor de allí también.

1306
01:17:42,920 --> 01:17:46,690
Así que cada vez más están surgiendo, pero esas son las cosas principales que usted desea mirar hacia

1307
01:17:46,690 --> 01:17:49,430
para un juego o una aplicación.

1308
01:17:49,430 --> 01:17:50,610
Y había una pregunta en la parte posterior también.

1309
01:17:50,610 --> 01:18:02,390
>> [Estudiante] En cuanto a la red de [inaudible] subir o descargar archivos [inaudible]

1310
01:18:02,390 --> 01:18:04,870
[Bowen] ¿Es tu pregunta ¿cómo se puede ver que, o cómo se puede depurar y probar que él?

1311
01:18:04,870 --> 01:18:10,630
[Estudiante] ¿Cómo puedes depurarlo [inaudible]

1312
01:18:10,630 --> 01:18:12,670
Lo siento. No puedo oír todo.

1313
01:18:12,670 --> 01:18:16,480
[Estudiante] ¿Cómo lo consigue probado bug y también [inaudible]

1314
01:18:16,480 --> 01:18:17,490
Grande. Grande.

1315
01:18:17,490 --> 01:18:21,860
¿Cómo se trabaja con las redes? ¿Cómo se puede ver lo que está pasando?

1316
01:18:21,860 --> 01:18:23,620
Hay muchas respuestas diferentes a esta,

1317
01:18:23,620 --> 01:18:26,420
pero déjame que te enseñe probablemente las cosas más fáciles aquí.

1318
01:18:26,420 --> 01:18:29,350
Déjame deshacerme del simulador por un segundo.

1319
01:18:29,350 --> 01:18:31,740
Opciones de depuración Sólo un par de redes.

1320
01:18:31,740 --> 01:18:36,070
Hay una pila de red completa al horno a la derecha en tanto el nivel WinRT y desde WinJS,

1321
01:18:36,070 --> 01:18:42,810
por lo que usted puede hacer muy fácilmente XHR, tipo AJAX llamadas de su juego o aplicación para hacer eso.

1322
01:18:42,810 --> 01:18:47,250
En primer lugar, yo tiendo a usar 2 cosas.

1323
01:18:47,250 --> 01:18:53,660
Yo uso los propios herramientas dev reales, que tienen una pila de red al horno en ellos.

1324
01:18:53,660 --> 01:18:55,870
Te voy a enseñar la página de inicio de Windows.

1325
01:18:55,870 --> 01:19:02,730
Yo puedo hablar de esto, y no hay realmente un proxy de red al horno en estas herramientas aquí.

1326
01:19:02,730 --> 01:19:08,390
Así que yo puedo hacer esto, puedo actualizar la página, y que va a mostrarme todas las interacciones,

1327
01:19:08,390 --> 01:19:14,550
incluyendo llamadas AJAX para esa sesión, la duración de dicha solicitud.

1328
01:19:14,550 --> 01:19:17,600
Esto es útil. Va a ser muy útil para aplicaciones basadas en navegador.

1329
01:19:17,600 --> 01:19:20,470
Para otros tipos de aplicaciones, como Windows para almacenar aplicaciones,

1330
01:19:20,470 --> 01:19:23,970
Yo uso una herramienta llamada Fiddler.

1331
01:19:23,970 --> 01:19:29,650
Vas a conseguir un juego en respuesta. [Risas]

1332
01:19:29,650 --> 01:19:32,750
Fiddler es un proxy simple. Creo que puedo demostrar que a usted.

1333
01:19:32,750 --> 01:19:40,190
Es sólo GetFiddler.com, que, curiosamente, estoy trazando mi pila de red

1334
01:19:40,190 --> 01:19:41,740
va a GetFiddler.

1335
01:19:41,740 --> 01:19:45,700
Pero de todos modos, El violinista ha sido escrito por uno de los PMs en el equipo de IE,

1336
01:19:45,700 --> 01:19:48,290
así que él sabe lo que está haciendo.

1337
01:19:48,290 --> 01:19:52,630
Esto es un buen indicador que se puede utilizar para el tráfico de la red de depuración.

1338
01:19:52,630 --> 01:19:55,730
Yo recomendaría que. Pregunta por ahí también.

1339
01:19:55,730 --> 01:19:58,050
>> [Estudiante] ¿Hay una manera fácil de integrar a la entrada de lenguas extranjeras,

1340
01:19:58,050 --> 01:20:00,810
como el japonés o el chino, en aplicaciones de Windows?

1341
01:20:00,810 --> 01:20:03,240
No puedo decir que he hecho demasiado de mí mismo, sino que es al horno pulg

1342
01:20:03,240 --> 01:20:08,470
Hay opciones para, por supuesto, que emite su aplicación - Lo siento, yo no he dicho la pregunta -

1343
01:20:08,470 --> 01:20:11,100
opciones en torno a la globalización, la localización de los contenidos,

1344
01:20:11,100 --> 01:20:14,320
incluyendo cosas como la capacidad de vender en diferentes mercados

1345
01:20:14,320 --> 01:20:19,190
y apuntar a que la versión de su aplicación para las lenguas individuales

1346
01:20:19,190 --> 01:20:21,080
o culturas o cosas por el estilo. Absolutamente construido adentro

1347
01:20:21,080 --> 01:20:22,980
Hemos tenido el apoyo para que por siempre,

1348
01:20:22,980 --> 01:20:26,630
y que lleva adelante en sus opciones para la Windows Store.

1349
01:20:26,630 --> 01:20:30,450
Usted puede hacer eso en la propia tienda, vender en diferentes mercados,

1350
01:20:30,450 --> 01:20:34,050
que puede hacer que, en la solicitud, así también con el uso de los recursos para definir,

1351
01:20:34,050 --> 01:20:42,220
"Si me desarrollé para esta cultura, a continuación, utilizar estos reemplazos para el contenido textual

1352
01:20:42,220 --> 01:20:44,510
"O utilizar un derecho de lector de la izquierda."

1353
01:20:44,510 --> 01:20:51,290
Esos son todos parte de los WinJS predeterminados y APIs WinRT. Buena pregunta.

1354
01:20:51,290 --> 01:20:54,770
>> ¿Cómo lo estamos haciendo? ¿Algún otro?

1355
01:20:54,770 --> 01:20:58,850
Y si alguien en el vídeo tiene preguntas, estoy cbowen @ microsoft,

1356
01:20:58,850 --> 01:21:02,790
así que estoy feliz de tomar cualquiera de sus preguntas desde el futuro.

1357
01:21:02,790 --> 01:21:05,690
Muy - Desde el futuro, [echo imita] futuras.

1358
01:21:05,690 --> 01:21:09,140
Así que aquí soy yo. Permítanme volver puse mi contacto aquí.

1359
01:21:09,140 --> 01:21:11,840
Así que me acaba de enviar una nota, cbowen @ microsoft,

1360
01:21:11,840 --> 01:21:15,190
y yo pondremos en contacto con usted tan pronto como pueda.

1361
01:21:15,190 --> 01:21:19,010
>> Cualquier otra cosa que usted se está preguntando? ¿Estamos bien?

1362
01:21:19,010 --> 01:21:24,050
Grande. Está bien. Gracias a todos mucho. Te lo agradezco. [Aplausos]

1363
01:21:24,800 --> 01:21:27,000
>> [CS50.TV]