1
00:00:00,120 --> 00:00:00,390
Tutto ok.

2
00:00:00,390 --> 00:00:01,190
Ben tornato.

3
00:00:01,350 --> 00:00:06,450
Nei prossimi video ci concentreremo sulla creazione di un'applicazione sostanziale qualcosa che ha molti pezzi in movimento

4
00:00:06,450 --> 00:00:12,570
più a lungo più CSSA molto stile e, soprattutto, un sacco di popolazione dominante e di eventi a portata di

5
00:00:12,570 --> 00:00:18,260
mano cosa costruiremo è un R. G. sii gioco di indovinelli colorati.

6
00:00:18,510 --> 00:00:23,820
Quindi non è solo una grande dimostrazione di come tutti questi pezzi combacino, ma è anche uno strumento

7
00:00:23,820 --> 00:00:24,980
davvero bello per te.

8
00:00:24,990 --> 00:00:30,510
E per far pratica con R. G. essere colori perché il sistema di colori RGV è un po 'poco intuitivo in un primo momento.

9
00:00:30,810 --> 00:00:35,300
È molto diverso dalla maggior parte dei sistemi di colore con cui le persone sono abituate a lavorare.

10
00:00:35,310 --> 00:00:36,860
Quindi lascia che ti mostri come funziona.

11
00:00:36,870 --> 00:00:40,330
Carichiamo la pagina e qui otteniamo sei colori casuali.

12
00:00:40,530 --> 00:00:41,750
Questi sono sempre diversi.

13
00:00:41,850 --> 00:00:47,150
E uno di quei colori è elencato qui il nome del colore nel nostro GP.

14
00:00:47,250 --> 00:00:50,330
E il nostro lavoro è scegliere quale.

15
00:00:50,340 --> 00:00:57,390
Ricorda che ci sono tre canali rosso verde e blu e ognuno va da 0 a 255 e tutto ciò di cui abbiamo bisogno

16
00:00:57,390 --> 00:01:01,020
sono quei tre colori per rendere ogni singolo colore che potremmo desiderare.

17
00:01:01,170 --> 00:01:07,940
Nero bianco giallo arancio viola tutti questi sono in realtà realizzati combinando rosso verde e blu.

18
00:01:08,340 --> 00:01:09,410
Quindi se diamo un'occhiata.

19
00:01:09,570 --> 00:01:13,850
Ho aperto Wikipedia, possiamo vedere come funziona il mixaggio additivo di colori in questo diagramma.

20
00:01:13,920 --> 00:01:21,330
Quindi abbiamo il rosso verde e il blu e per fare il giallo combiniamo effettivamente il rosso e il verde che è forse un po

21
00:01:21,330 --> 00:01:24,650
'diverso da quello che ci si aspetta che crei il magenta.

22
00:01:25,170 --> 00:01:26,730
È blu e rosso.

23
00:01:26,940 --> 00:01:31,340
E per rendere Ciano il colore azzurro è verde e blu.

24
00:01:31,470 --> 00:01:34,810
E infine, per rendere bianco, combiniamo tutti e tre.

25
00:01:34,810 --> 00:01:38,170
Quindi ecco un altro diagramma fatto qui che lo rende un po 'più facile.

26
00:01:38,190 --> 00:01:44,850
Abbiamo rosso verde e blu e poi magenta giallo ciano e bianco e quindi nessun colore è nero.

27
00:01:45,000 --> 00:01:49,640
Quindi se torniamo possiamo usarlo per cercare di capire di che colore si tratta.

28
00:01:49,920 --> 00:01:54,860
Quindi se diamo un'occhiata abbiamo un mazzo di rosso quasi tutto rosso.

29
00:01:55,140 --> 00:02:00,660
Fino a 255 così quasi Ci sono un sacco di verde e molto poco blu.

30
00:02:00,840 --> 00:02:06,960
Quindi un sacco di rosso in un sacco di verde se ti ricordi di questo grafico rosso e verde diventa giallo.

31
00:02:07,260 --> 00:02:11,670
Quindi se avessimo 255 255 rosso verde, sembrerebbe questo.

32
00:02:11,970 --> 00:02:16,290
Ma abbiamo meno di 255 quindi non sarà così luminoso.

33
00:02:16,320 --> 00:02:17,440
Quindi torniamo indietro

34
00:02:17,700 --> 00:02:22,860
Spero che tu possa dire quale sia la risposta corretta sulla base del diagramma che abbiamo appena visto, ma ho

35
00:02:22,860 --> 00:02:25,790
intenzione di indovinare qualcosa di sbagliato prima di mostrarti cosa succede.

36
00:02:25,800 --> 00:02:27,450
Quindi questo è decisamente sbagliato.

37
00:02:27,450 --> 00:02:29,970
Questo è tutto rosso e molto poco verde.

38
00:02:30,360 --> 00:02:33,900
Clicco e sparisce e mi dice di riprovare.

39
00:02:33,900 --> 00:02:36,750
Quindi continuiamo a indovinare quelli sbagliati come quello.

40
00:02:36,750 --> 00:02:37,690
Questo è sbagliato.

41
00:02:37,860 --> 00:02:38,770
Questo è sbagliato.

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

43
00:02:39,270 --> 00:02:41,000
La conoscenza indovina quello corretto.

44
00:02:41,130 --> 00:02:43,140
Rosso e verde sarà molto giallo.

45
00:02:43,320 --> 00:02:44,370
Quindi questo è corretto.

46
00:02:44,520 --> 00:02:48,120
Farò clic e noterò che tutti e sei i riquadri tornano indietro.

47
00:02:48,150 --> 00:02:53,080
Cambiano tutti al colore corretto e anche il nostro sfondo appare come il colore corretto.

48
00:02:53,760 --> 00:02:59,070
un messaggio che dice corretto e se voglio posso cliccare di nuovo su Play e questo genererà nuovi colori.

49
00:02:59,070 --> 00:03:00,000
E per ottenere

50
00:03:00,210 --> 00:03:05,680
Il mio schermo torna al blu qui e ottengo sei nuovi quadrati e un nuovo colore casuale qui.

51
00:03:06,270 --> 00:03:08,870
E poi quello che posso anche fare è cambiare la difficoltà.

52
00:03:08,910 --> 00:03:12,690
Quindi se voglio più facile ho solo tre colori tra cui scegliere.

53
00:03:12,810 --> 00:03:18,990
Questo può diventare un po 'impegnativo quando ci siamo rinfrescati un paio di volte, come qui abbiamo due sfumature di

54
00:03:18,990 --> 00:03:20,510
blu che sono molto simili.

55
00:03:20,520 --> 00:03:25,080
Ora, dopo aver giocato questo gioco per un po 'dovresti essere in grado di determinare quale è corretto

56
00:03:25,080 --> 00:03:27,980
basandoti su queste tre sfumature rosa o queste due sfumature blu.

57
00:03:28,020 --> 00:03:29,220
E questo è davvero il punto qui.

58
00:03:29,340 --> 00:03:32,520
Ma per iniziare potresti volere solo due colori tra cui scegliere.

59
00:03:32,520 --> 00:03:33,420
Quindi ecco un altro.

60
00:03:33,510 --> 00:03:35,290
Facciamolo un po 'di rosso.

61
00:03:35,310 --> 00:03:36,470
Quasi nessun rosso.

62
00:03:36,690 --> 00:03:37,800
Un po 'di verde.

63
00:03:37,830 --> 00:03:38,560
Non molto.

64
00:03:38,670 --> 00:03:42,890
E un sacco di blu ovviamente ci darà blu molto puro.

65
00:03:43,380 --> 00:03:44,690
Torniamo alla modalità difficile.

66
00:03:44,700 --> 00:03:50,760
Un altro punto che mostrerò qui è che si tratta di un sito reattivo in modo che io possa ridimensionarlo e che

67
00:03:50,760 --> 00:03:52,830
i miei quadrati si spostino verso il centro.

68
00:03:52,830 --> 00:03:54,870
Guarda questo piccolo bar qui.

69
00:03:54,870 --> 00:03:59,060
Lo spazio tra loro sui lati aumenterà e diminuirà.

70
00:03:59,130 --> 00:04:03,290
E se ho un messaggio, facciamo clic su uno di questi. È sbagliato.

71
00:04:03,780 --> 00:04:04,880
Ci proverò di nuovo.

72
00:04:05,100 --> 00:04:08,140
Nota come questi si avvicinano.

73
00:04:08,820 --> 00:04:11,950
E poi posso spostarli a parte e otteniamo un po 'più di spazio.

74
00:04:12,270 --> 00:04:16,970
Quindi, per concludere prima di iniziare a crearlo, voglio solo riassumere alcune cose.

75
00:04:17,220 --> 00:04:22,260
Sarà un'app abbastanza grande per avere un sacco di javascript su un centinaio di

76
00:04:22,260 --> 00:04:25,130
righe ish e anche un po 'di successo.

77
00:04:25,200 --> 00:04:29,580
Inizieremo un po 'di bell'aspetto e andremo a far funzionare

78
00:04:29,580 --> 00:04:33,030
la funzionalità, quindi andremo ad aggiungerne uno stile.

79
00:04:33,030 --> 00:04:34,160
L'altra cosa.

80
00:04:34,530 --> 00:04:40,110
E poi, una volta finito, spero che tu possa usarlo abbastanza spesso per rispolverare la tua R. G. alcune delle mie abilità RGV.

81
00:04:40,110 --> 00:04:45,820
le abilità, anche solo facendo questo per il corso, mi hanno aiutato un po 'a rispolverare

82
00:04:45,870 --> 00:04:49,280
Ho notato che tendo a contare troppo sui raccoglitori colorati RGV.

83
00:04:49,410 --> 00:04:54,680
Quindi, per me è un bene anche fare un po 'di pratica e ricordare a me stesso come funziona RGV.

84
00:04:55,080 --> 00:04:56,970
Quindi il prossimo video inizieremo a scrivere del codice