0:00:00.000,0:00:02.246 Volvemos con Winston 0:00:02.417,0:00:05.743 Ahora tenemos ambas: la variable "x" y la "y" 0:00:05.801,0:00:07.257 Para la posición de Winston 0:00:07.397,0:00:09.240 Así que le podemos mover hacia los lados 0:00:10.075,0:00:11.741 Hacia arriba y hacia abajo wew! 0:00:12.088,0:00:13.328 Muy chulo! 0:00:13.680,0:00:15.866 Ahora vamos a devolverlas a su estado original 0:00:16.057,0:00:19.227 Eran: 200 (x) y 200 (y) 0:00:19.315,0:00:21.995 Vamos a ver como funciona este programa 0:00:22.553,0:00:25.763 Así que empezando aquí: Tenemos una variable (tamañoOjos) 0:00:25.763,0:00:27.813 Que se está usando para manejar el tamaño de los ojos 0:00:27.815,0:00:29.766 Porque los ojos son 40 pix. de ancho 0:00:29.766,0:00:32.426 y 40 pix. de alto 0:00:32.470,0:00:35.437 Y despues tenemos estas variables "x" e "y" 0:00:35.437,0:00:39.127 Y esos posicionan el centro de la cara 0:00:39.843,0:00:41.113 Y las podeis ver usadas 0:00:41.113,0:00:42.729 En este comando "ellipse" 0:00:42.729,0:00:44.579 Que dibuja ese gran círculo amarillo 0:00:45.921,0:00:47.422 Y luego aquí abajo 0:00:47.422,0:00:48.617 Para los ojos 0:00:48.617,0:00:50.427 La "x" y la "y" son usadas de nuevo 0:00:50.731,0:00:51.951 Y aquí 0:00:52.009,0:00:53.669 Los ojos son posicionados 0:00:54.048,0:00:55.778 Relativos al centro de la cara 0:00:55.787,0:00:57.877 Así que este está 0:00:58.026,0:00:58.996 Cincuenta píxeles 0:00:59.293,0:01:00.933 A la izquierda del centro 0:01:01.528,0:01:03.428 Y este está 100 píxeles 0:01:03.455,0:01:05.005 a la derecha del centro 0:01:05.149,0:01:07.829 Ok. Pues muy chulo! 0:01:07.865,0:01:09.365 Y esa es la razon por la que podemos 0:01:09.395,0:01:11.195 mover a Winston hacia arriba y abajo 0:01:11.236,0:01:13.192 Ahora, quiero poder controlar 0:01:13.212,0:01:15.202 mas cosas de la cara de Winston 0:01:15.202,0:01:16.662 usando variables 0:01:16.662,0:01:17.912 Así que quiero averiguar 0:01:17.912,0:01:19.339 que mas en este programa 0:01:19.339,0:01:20.669 podemos "guardar" como variables 0:01:20.669,0:01:21.449 Para eso 0:01:21.449,0:01:22.638 Voy a ir buscando 0:01:22.638,0:01:23.608 en cada linea de codigo 0:01:23.622,0:01:25.122 Y buscar lo que llamamos 0:01:25.157,0:01:27.447 "hard coded" numbers 0:01:27.658,0:01:29.308 esos son numeros que son 0:01:29.388,0:01:30.648 simplemente numeros a secas 0:01:30.723,0:01:33.413 no son variables ni numeros dependeintes de variables 0:01:34.277,0:01:35.377 así que vamos a empezar aquí 0:01:35.432,0:01:37.002 en el primer eclipse 0:01:37.832,0:01:39.222 tenemos 300 y 300 0:01:39.262,0:01:41.062 para la anchura y la altura 0:01:41.584,0:01:43.794 esos simplemente son numeros a secas 0:01:43.794,0:01:45.114 así que vamos a hacer una variable 0:01:45.114,0:01:46.214 sustituyéndolos 0:01:46.214,0:01:47.754 llamado faceSize (tamañoCara) 0:01:48.791,0:01:50.291 y guardar en el el numero "300" 0:01:50.291,0:01:53.201 Ahora simplemente escribiremos faceSize 0:01:53.709,0:01:55.259 faceSize 0:01:55.514,0:01:56.794 Ok, sigamos 0:01:56.868,0:01:58.108 y saltarnos los colores (comando fill) 0:01:58.156,0:02:00.076 ahora los comando elipticos son o 0:02:00.104,0:02:01.504 todo variables 0:02:01.544,0:02:02.704 o dependientes de variables 0:02:02.726,0:02:03.896 así que las vamos a dejar 0:02:03.896,0:02:04.846 así por ahora 0:02:04.859,0:02:06.729 y luego el comando de la boca 0:02:07.419,0:02:09.339 esos son dependientes de "x" e "y" 0:02:09.339,0:02:10.369 pero estos de aquí 0:02:10.417,0:02:11.947 son solo numeros a secas 0:02:12.899,0:02:14.669 150 y 150 0:02:14.799,0:02:16.139 Así que vamos a decir que 0:02:16.223,0:02:18.953 mouthSize (buen nombre) 0:02:19.026,0:02:20.476 es igual a 150 0:02:22.464,0:02:25.264 Sustituiremos mouthSize 0:02:25.301,0:02:27.481 y mouthSize 0:02:27.556,0:02:28.816 Vale, entonces, ahora 0:02:28.861,0:02:30.751 tenemos los tamaños de las figuras 0:02:30.825,0:02:32.725 guardados como variables ahí arriba 0:02:32.773,0:02:34.543 eso significa que es muy muy facil 0:02:34.543,0:02:36.093 para nosotros cambiar los tamaños 0:02:36.103,0:02:36.933 como esto mira 0:02:36.933,0:02:39.163 Woooo Winston tiene hambre! jajaja 0:02:39.257,0:02:41.157 y algo como ya sabes como 0:02:41.157,0:02:42.747 Winston tiene mucha hambre 0:02:42.761,0:02:44.291 y luego se come un monton de donuts 0:02:44.291,0:02:45.931 y luego se hace super grande xD. 0:02:45.962,0:02:47.532 Vale. 0:02:47.542,0:02:48.982 Pero hay algo 0:02:49.037,0:02:51.347 que no me gusta de este programa ahora mismo 0:02:51.863,0:02:59.303 Así que si hago el tamaño de la cara muy muy pequeña 0:02:59.404,0:03:01.064 empieza a ser gracioso 0:03:01.076,0:03:03.006 porque los ojos y la boca 0:03:03.017,0:03:04.667 esán fuera de la cara xD 0:03:04.667,0:03:06.717 y en ciertos puntos si quiera 0:03:06.717,0:03:07.887 parece que estén conectados 0:03:07.887,0:03:08.667 a la cara 0:03:08.667,0:03:10.707 Así que ya no es una cara, no? 0:03:11.629,0:03:13.959 Así que lo que queremos que pase 0:03:13.959,0:03:16.309 es que cuando cambie el tamaño de la cara (faceSize) 0:03:16.309,0:03:18.299 quiero la cara y la boca 0:03:18.354,0:03:21.584 Quiero que su tamaño cambie junto con la cara 0:03:21.584,0:03:23.994 Para que si hago la cara ser la mitad de su tamaño 0:03:24.144,0:03:27.454 quiero que la boca sea la mitad de grande tambien 0:03:27.454,0:03:29.044 eso significa que 0:03:29.519,0:03:32.589 quiero calcular: mouthSize y eyeSize 0:03:32.589,0:03:35.929 como fracciones de faceSize 0:03:36.690,0:03:39.790 Vale, vamos a resetear estas variables 0:03:39.790,0:03:42.060 Y os enseñaré lo que quiero decir 0:03:42.061,0:03:44.221 Vamos a empezar con mouthSize 0:03:44.221,0:03:45.141 así que ahora mismo 0:03:45.172,0:03:49.512 faceSize es 300 y mouthSize es 150 0:03:50.187,0:03:51.727 asi que si pensamos en ello 0:03:51.727,0:03:53.007 relativamente uno del otro 0:03:53.007,0:03:55.907 diriamos que faceSize es el doble de grande 0:03:55.907,0:03:57.577 que mouthSize 0:03:57.577,0:04:00.137 o que mouthSize es la mitad de grande 0:04:00.137,0:04:01.357 que faceSize 0:04:01.432,0:04:03.872 y podemos escribir eso en código como este 0:04:04.063,0:04:08.063 una mitad de faceSize 0:04:08.133,0:04:09.703 ok entonces este codigo dice 0:04:09.703,0:04:11.873 que cojemos el valor de faceSize 0:04:11.873,0:04:13.113 los multiplicamos por la mitad 0:04:13.113,0:04:15.393 y lo guardamos en "mouthSize" 0:04:15.674,0:04:17.494 así que si cambiamos esto de aquí 0:04:18.030,0:04:20.260 el ordenador sabria lo que la mitad de eso es 0:04:20.273,0:04:22.353 y eso se convertiria en mouthSize 0:04:22.353,0:04:24.073 Perfecto! Eso es lo que queremos 0:04:24.848,0:04:26.948 Ahora lo mismo con eyeSize 0:04:27.268,0:04:28.908 Así que faceSize es 300 0:04:29.168,0:04:31.039 y eyeSize is 40 0:04:31.039,0:04:33.219 así que necesitamos que sea 0:04:33.219,0:04:36.639 40/300 40 trescientoavos de faceSize 0:04:36.639,0:04:39.459 que es igual a, vamos a ver 0:04:39.459,0:04:41.138 4/30 que podemos 0:04:41.138,0:04:43.768 simplificar hasta 2/15 0:04:44.295,0:04:45.605 así que vamos a decir que 0:04:45.609,0:04:49.609 2/15 por faceSize 0:04:50.111,0:04:50.911 por cierto 0:04:50.949,0:04:52.459 Si eres nuevo en esto de las fracciones 0:04:52.459,0:04:54.279 Y esas matematicas son algo dificiles para ti 0:04:54.352,0:04:56.422 puedes aprender mas sobre fracciones 0:04:56.422,0:04:57.562 en KhanAcademy 0:04:57.562,0:04:59.562 y volver cuando 0:04:59.562,0:05:00.442 creas que estas preparado 0:05:00.442,0:05:01.912 aquiSí, simplemente ves allí. 0:05:02.752,0:05:03.532 OK 0:05:03.532,0:05:06.442 pues vamos a probar a cambiar el tamaño de la cara otra vez 0:05:06.925,0:05:08.155 Jaja! Mira! 0:05:08.155,0:05:10.015 la cara y los ojos cambian su tamaño 0:05:10.015,0:05:11.655 proporcionalmente a la cara 0:05:11.975,0:05:13.495 pero seguramente te has dado cuenta 0:05:13.495,0:05:14.875 hay algo que está mal 0:05:14.875,0:05:16.565 los ojos y la boca 0:05:16.572,0:05:19.162 aun salen fuera de la cara 0:05:19.162,0:05:20.502 aunque estan 0:05:20.502,0:05:22.612 con un tamaño mas proporcional 0:05:23.206,0:05:24.906 Eso es porque aun tenemos 0:05:24.906,0:05:26.626 unos numero a secas 0:05:26.626,0:05:28.396 en nuestro comando elipse 0:05:28.396,0:05:30.376 unos numeros que en realidad deberían 0:05:30.376,0:05:32.656 deberían ser fracciones de variables 0:05:33.148,0:05:34.578 Aquí, te lo enseñaré 0:05:34.669,0:05:37.799 Entonces, para el "ellipse" 0:05:37.799,0:05:40.819 tenemos X menos 50 para la posicion de X 0:05:40.838,0:05:43.278 Esto significa que siempre estará 50 pixeles a la izquierda 0:05:43.443,0:05:45.133 incluso si hacemos nuestra cara 0:05:45.133,0:05:46.843 mas pequeña que 50 pix 0:05:46.843,0:05:48.063 y eso no tiene nigun sentido 0:05:48.063,0:05:49.783 porque eso significa que el ojo ozquierdo 0:05:49.783,0:05:50.461 ni si quiera estará 0:05:50.461,0:05:52.161 en la cara 0:05:52.441,0:05:55.218 Así que debería ser X menos alguna fracción 0:05:55.218,0:05:57.258 el tamaño de nuestra cara 0:05:57.278,0:05:59.218 y podremos averiguar la fraccion 0:05:59.218,0:06:00.148 de la misma manera 0:06:00.148,0:06:03.898 50 relativamente de 300 0:06:03.898,0:06:07.898 así que 50/300, 5/30, 1/6 0:06:08.582,0:06:11.952 entonces 1/6 por faceSize 0:06:12.440,0:06:14.110 Y veremos otros 50 aqu´´i 0:06:14.400,0:06:16.060 Asñi que podemos hacer lo mismo 0:06:16.060,0:06:17.360 de la misma manera 0:06:17.360,0:06:19.140 aqui tenemos 100/300 0:06:19.460,0:06:20.690 que será 0:06:20.710,0:06:23.220 1/3 un tercio faceSize 0:06:23.220,0:06:24.720 este es 60 0:06:24.720,0:06:26.080 así que acabará siendo 0:06:26.080,0:06:28.897 1/5 por faceSize 0:06:29.267,0:06:32.087 y aqui tenemos otros 50 0:06:32.087,0:06:34.457 así que es un sexto otra vez 0:06:34.457,0:06:35.727 y luego 40 0:06:35.727,0:06:38.257 que es lo que sacamos por ahí arriba 0:06:38.257,0:06:39.507 2/15 0:06:39.507,0:06:44.937 así que 2/15 por faceSize 0:06:45.347,0:06:48.117 vale, vamos a intentarlo de nuevo 0:06:48.117,0:06:49.477 Oh! Mira eso! 0:06:49.477,0:06:51.257 Míralo! Es bellísimo 0:06:51.268,0:06:52.048 muy bueno 0:06:52.617,0:06:54.587 Vale, pues vamos a recordar 0:06:54.587,0:06:56.117 Habíamos creado esta variable 0:06:56.130,0:06:57.950 que guardan el tamaño de la cara 0:06:57.950,0:06:59.630 y simplemente guarda un numero 0:06:59.630,0:07:01.510 despues tenemos estas variables "mouthSize" 0:07:01.510,0:07:03.350 y "eyeSize" 0:07:03.350,0:07:05.710 y las calculamos basandos en fracciones 0:07:05.710,0:07:06.790 relaccionadas a faceSize 0:07:06.790,0:07:07.770 para asegurarnos de que 0:07:07.770,0:07:09.500 sus valores son siempre cambiados 0:07:09.500,0:07:12.360 basandonos en como empezamos esta al principio 0:07:12.514,0:07:15.104 luego todos los otros son calculados 0:07:15.104,0:07:16.894 basandono en faceSize también 0:07:16.894,0:07:18.454 para asegurarnos de que la posición 0:07:18.454,0:07:19.884 dentro de la cara cambie 0:07:19.884,0:07:22.064 Si faceSize cambia 0:07:22.064,0:07:23.014 Whoo! Vale! 0:07:23.014,0:07:24.614 Ahora que realmente entendemos 0:07:24.614,0:07:25.725 como hacer variables 0:07:25.725,0:07:27.865 dependiendo de los valores de otras variables 0:07:27.865,0:07:30.375 podemos hacer muchas mas cosas con nuestros programas! 0:07:30.375,0:07:32.365 Vamos a celebrarlo haciendo a Winston 0:07:32.365,0:07:36.781 Gigante! Si, vamos Winston!