1
00:00:00,120 --> 00:00:00,390
Todo bien.

2
00:00:00,390 --> 00:00:01,190
Dar una buena acogida.

3
00:00:01,350 --> 00:00:06,450
En los próximos videos nos enfocaremos en construir una aplicación sustancial algo que tenga muchas piezas móviles

4
00:00:06,450 --> 00:00:12,570
más tiempo html más CSSA mucho estilo y lo más importante mucha población dominante y evento a mano lo que

5
00:00:12,570 --> 00:00:18,260
vamos a construir es un R. GRAMO. ser coloreado adivinando el juego.

6
00:00:18,510 --> 00:00:23,820
Por lo tanto, no es solo una gran demostración de cómo todas estas piezas encajan, sino que también es una herramienta

7
00:00:23,820 --> 00:00:24,980
realmente agradable para ti.

8
00:00:24,990 --> 00:00:30,510
Y para que practiques R. GRAMO. ser colores porque el sistema de color RGV es un poco intuitivo al principio.

9
00:00:30,810 --> 00:00:35,300
Es muy diferente a la mayoría de los sistemas de color que las personas están acostumbradas a trabajar.

10
00:00:35,310 --> 00:00:36,860
Así que déjame mostrarte cómo funciona.

11
00:00:36,870 --> 00:00:40,330
Cargamos la página y obtenemos seis colores aleatorios aquí.

12
00:00:40,530 --> 00:00:41,750
Estos son siempre diferentes.

13
00:00:41,850 --> 00:00:47,150
Y uno de esos colores se enumera aquí el nombre del color en nuestro GP.

14
00:00:47,250 --> 00:00:50,330
Y nuestro trabajo es elegir cuál.

15
00:00:50,340 --> 00:00:57,390
Recuerde que hay tres canales rojo, verde y azul, y cada uno varía de 0 a 255 y todo lo que necesitamos

16
00:00:57,390 --> 00:01:01,020
son esos tres colores para hacer cada color que podamos desear.

17
00:01:01,170 --> 00:01:07,940
Negro blanco amarillo naranja morado todos esos se hacen realmente combinando rojo verde y azul.

18
00:01:08,340 --> 00:01:09,410
Entonces, si echamos un vistazo.

19
00:01:09,570 --> 00:01:13,850
Tengo Wikipedia abierta, podemos ver cómo funciona la mezcla de color aditiva en este diagrama.

20
00:01:13,920 --> 00:01:21,330
Así que tenemos rojo verde y azul y para hacer amarillo realmente combinamos rojo y verde, que es tal vez un

21
00:01:21,330 --> 00:01:24,650
poco diferente de lo que se espera que haga magenta.

22
00:01:25,170 --> 00:01:26,730
Es azul y rojo.

23
00:01:26,940 --> 00:01:31,340
Y para hacer que Cyan sea de color azul claro, es verde y azul.

24
00:01:31,470 --> 00:01:34,810
Y luego, para hacer blanco combinamos los tres.

25
00:01:34,810 --> 00:01:38,170
Aquí hay otro diagrama hecho aquí que lo hace un poco más fácil.

26
00:01:38,190 --> 00:01:44,850
Tenemos rojo, verde y azul y luego magenta amarillo cian y blanco y luego no hay color negro.

27
00:01:45,000 --> 00:01:49,640
Entonces, si volvemos podemos usar eso para tratar de averiguar de qué color es esto.

28
00:01:49,920 --> 00:01:54,860
Si echamos un vistazo, tenemos un montón de rojo casi todo rojo.

29
00:01:55,140 --> 00:02:00,660
Hasta 255 por lo que casi hay mucho verde y muy poco azul.

30
00:02:00,840 --> 00:02:06,960
Por lo tanto, un montón de rojo en una gran cantidad de verde si recuerda en este cuadro rojo y verde se pone amarillo.

31
00:02:07,260 --> 00:02:11,670
Entonces, si tuviéramos 255 255 rojos verdes, se vería así.

32
00:02:11,970 --> 00:02:16,290
Pero tenemos menos de 255, así que no va a ser tan brillante.

33
00:02:16,320 --> 00:02:17,440
Así que regresemos.

34
00:02:17,700 --> 00:02:22,860
Espero que puedas decir cuál es la respuesta correcta basada en el diagrama que acabamos de ver, pero

35
00:02:22,860 --> 00:02:25,790
primero voy a adivinar algo malo para mostrarte lo que sucede.

36
00:02:25,800 --> 00:02:27,450
Entonces este definitivamente está mal.

37
00:02:27,450 --> 00:02:29,970
Esto es todo rojo y muy poco verde.

38
00:02:30,360 --> 00:02:33,900
Hago clic y se va y me dice que vuelva a intentarlo.

39
00:02:33,900 --> 00:02:36,750
Así que sigamos adivinando algunas equivocadas como esa.

40
00:02:36,750 --> 00:02:37,690
Este está mal.

41
00:02:37,860 --> 00:02:38,770
Este está mal.

42
00:02:38,990 --> 00:02:39,270
DE ACUERDO.

43
00:02:39,270 --> 00:02:41,000
El conocimiento adivina el correcto.

44
00:02:41,130 --> 00:02:43,140
Rojo y verde va a ser muy amarillo.

45
00:02:43,320 --> 00:02:44,370
Entonces esto es correcto

46
00:02:44,520 --> 00:02:48,120
Voy a hacer clic y observar que los seis cuadrados vuelven.

47
00:02:48,150 --> 00:02:53,080
Todos cambian al color correcto y nuestro fondo parece que los cambios también son del color correcto.

48
00:02:53,760 --> 00:02:59,070
un mensaje que dice correcto, y si quiero, puedo hacer clic en reproducir de nuevo y eso generará nuevos colores.

49
00:02:59,070 --> 00:03:00,000
Y para recibir

50
00:03:00,210 --> 00:03:05,680
Mi pantalla vuelve a azul aquí y tengo seis nuevos cuadrados y un nuevo color aleatorio aquí.

51
00:03:06,270 --> 00:03:08,870
Y luego, lo que también puedo hacer es cambiar la dificultad.

52
00:03:08,910 --> 00:03:12,690
Entonces, si quiero más fácil, solo tengo tres colores para elegir.

53
00:03:12,810 --> 00:03:18,990
Esto puede ser un poco desafiante cuando tenemos todas las actualizaciones algunas veces, como aquí tenemos dos tonos de

54
00:03:18,990 --> 00:03:20,510
azul que son muy similares.

55
00:03:20,520 --> 00:03:25,080
Ahora, después de jugar este juego por un tiempo, deberías poder determinar cuál es el correcto a

56
00:03:25,080 --> 00:03:27,980
partir de estos tres tonos rosados ​​o estos dos tonos azules.

57
00:03:28,020 --> 00:03:29,220
Y ese es realmente el punto aquí.

58
00:03:29,340 --> 00:03:32,520
Pero para comenzar, es posible que solo desee dos colores para elegir.

59
00:03:32,520 --> 00:03:33,420
Así que aquí hay otro.

60
00:03:33,510 --> 00:03:35,290
Vamos a hacerlo un poco rojo.

61
00:03:35,310 --> 00:03:36,470
Casi no rojo.

62
00:03:36,690 --> 00:03:37,800
Un poco de verde.

63
00:03:37,830 --> 00:03:38,560
No mucho.

64
00:03:38,670 --> 00:03:42,890
Y un montón de azul, por supuesto, nos va a dar un azul muy puro.

65
00:03:43,380 --> 00:03:44,690
Volvamos al modo difícil.

66
00:03:44,700 --> 00:03:50,760
Otro punto que mostraré aquí es que es un sitio receptivo, así que puedo redimensionarlo y

67
00:03:50,760 --> 00:03:52,830
mis cuadrados se mueven al centro.

68
00:03:52,830 --> 00:03:54,870
Mira este pequeño bar naff aquí.

69
00:03:54,870 --> 00:03:59,060
El espacio entre ellos en los lados aumentará y disminuirá.

70
00:03:59,130 --> 00:04:03,290
Y si tengo un mensaje, hagamos clic en uno de estos. Eso está mal.

71
00:04:03,780 --> 00:04:04,880
Me vuelvo a intentar

72
00:04:05,100 --> 00:04:08,140
Observe cómo estos se acercan.

73
00:04:08,820 --> 00:04:11,950
Y luego puedo separarlos y tenemos más espacio entre ellos.

74
00:04:12,270 --> 00:04:16,970
Entonces, para concluir antes de que realmente comencemos a crearlo, solo quiero resumir algunas cosas.

75
00:04:17,220 --> 00:04:22,260
Va a ser una aplicación bastante grande tener un montón de javascript sobre cientos

76
00:04:22,260 --> 00:04:25,130
de líneas eficientes, y también algunos de ellos.

77
00:04:25,200 --> 00:04:29,580
Comenzaremos con un estilo muy escueto y vamos a poner en marcha la funcionalidad

78
00:04:29,580 --> 00:04:33,030
y luego agregaremos un poco de estilo a la parte superior.

79
00:04:33,030 --> 00:04:34,160
La otra cosa.

80
00:04:34,530 --> 00:04:40,110
Y luego, una vez que lo terminemos, con suerte puede usarlo con bastante frecuencia para mejorar su R. GRAMO. de mis habilidades de RGV.

81
00:04:40,110 --> 00:04:45,820
las habilidades, incluso haciendo esto para el curso, me han ayudado bastante a mejorar algunas

82
00:04:45,870 --> 00:04:49,280
Me he dado cuenta de que tiendo a confiar demasiado en los selectores de colores RGV.

83
00:04:49,410 --> 00:04:54,680
Así que esto es genial para mí también para practicar y recordarme a mí mismo cómo funciona RGV.

84
00:04:55,080 --> 00:04:56,970
Entonces, el próximo video vamos a comenzar a escribir un código