Translating python Pixel workshop to spanish, Will update it incremen… #500

sunnynagavo · 2024-09-17T21:12:29Z

…tally

alemcuevas · 2024-09-17T21:16:13Z

content/espanol/python-pixel/Activity-1.md

@@ -0,0 +1,48 @@
+---
+title: "Actividad 1: Crea un tablero de colores"
+prereq: "Conceptos básicos de Python, Manipulación de imágenes en Python: Abrir una imagen, Pixels de Python: Colores y Pixels"


Píxeles de Python: Colores y Píxeles

alemcuevas · 2024-09-17T21:16:43Z

content/espanol/python-pixel/Activity-1.md

+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/Nz3Uz4kBoUU" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+
+## Ejemplo para un tablero de colores básico


Ejemplo para crear un tablero de colores básico

alemcuevas · 2024-09-17T21:18:19Z

content/espanol/python-pixel/Activity-2.md

+---
+title: "Actividad 2: Modifica tu tablero de colores"
+date: 2020-07-11T00:00:00Z
+prereq: "Conceptos básicos de Python, Python Pixeles: Colores y Pixeles, Manipulación de imágenes Python: Abrir una imagen"


Conceptos básicos de Python, Python Píxeles: Colores y Píxeles, Manipulación de imágenes Python: Abrir una imagen

alemcuevas · 2024-09-17T21:20:21Z

content/espanol/python-pixel/access-pixel.md

+
+## Más sobre los píxeles
+
+Ya hemos aprendido cómo crear una imagen de color puro usando píxeles y cambiar un píxel en la imagen. Ahora, aprenderemos a identificar píxeles en imágenes existentes.


Ya hemos aprendido cómo crear una imagen de color solo usando píxeles y cambiar un píxel en la imagen.

alemcuevas · 2024-09-17T21:21:39Z

content/espanol/python-pixel/access-pixel.md

+Image.size[0]
+Image.size[1]
+```
+`Image.size` proporciona un valor `(ancho, altura)` de una imagen. `Image.size[0]` da el ancho de la imagen y `Image.size[1]` da la altura de la imagen.


proporciona un valor (ancho, altura) de una imagen. Image.size[0] escribe el ancho de la imagen y Image.size[1] escribe la altura de la imagen.

y en Image.size[1] escribe la altura de la imagen.

alemcuevas · 2024-09-17T21:26:05Z

content/espanol/python-pixel/activity-11.md

@@ -0,0 +1,22 @@
+---
+title: "Actividad 11: Desafío: Crea tu propia imagen"
+prereq: "Conceptos básicos de Python, Manipulación de imágenes con Python: Abre una imagen, Python Pixel: Colores y píxeles"


"Conceptos básicos de Python, Manipulación de imágenes con Python: Abre una imagen, Python Pixel: Colores y Píxeles"

alemcuevas · 2024-09-17T21:28:27Z

content/espanol/python-pixel/activity-11.md

+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/KWL3b4xY8dA" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+
+En esta sección, utilizaremos lo que has aprendido hasta ahora para crear y modificar tu propia imagen. En esta sección, tienes la libertad de hacer cualquier combinación de tablas de colores básicas, elementos de dibujo, filtros, recortes, volteos, cambios de colores o texto.


En esta sección, utilizaremos lo que has aprendido hasta ahora para crear y modificar tu propia imagen. En esta sección, tienes la libertad de hacer cualquier combinación de tablas de colores básicas, elementos de dibujo, filtros, recortes, giros, cambios de colores o texto.

alemcuevas · 2024-09-17T21:29:17Z

content/espanol/python-pixel/activity-3.md

@@ -0,0 +1,47 @@
+---
+title: "Actividad 3: Desafío: Diseñar nuevos elementos"
+prereq: "Conceptos básicos de Python, Manipulación de imágenes en Python: Abrir una imagen, Python Pixeles: Colores y Pixeles"


"Conceptos básicos de Python, Manipulación de imágenes en Python: Abrir una imagen, Python Píxeles: Colores y Píxeles"

alemcuevas · 2024-09-17T21:30:18Z

content/espanol/python-pixel/activity-4.md

+---
+title: "Actividad 4: Crear Filtro Básico"
+date: 2020-09-08T00:00:00Z
+prereq: "Fundamentos de Python, Python Pixels: Colores y Píxeles, Manipulación de Imágenes en Python: Abrir una imagen"


"Fundamentos de Python, Python Píxeles: Colores y Píxeles, Manipulación de Imágenes en Python: Abrir una imagen"

alemcuevas · 2024-09-17T21:31:43Z

content/espanol/python-pixel/activity-4.md

+### Ejemplo para filtro azul
+
+<img src="../../media/cat.png" width=50%>
+Queremos agregar un filtro azul al lindo gato de arriba. Veamos cómo lograrlo.


Queremos agregarle un filtro azul al lindo gato de arriba. Veamos cómo lograrlo.

alemcuevas · 2024-09-17T21:32:59Z

content/espanol/python-pixel/activity-5.md

+---
+title: "Actividad 5: Filtros más avanzados"
+date: 2020-09-08T00:00:00Z
+prereq: "Conceptos básicos de Python, Python Pixels: Colores y píxeles, Manipulación de imágenes en Python: Abrir una imagen"


"Conceptos básicos de Python, Python Píxeles: Colores y Píxeles, Manipulación de imágenes en Python: Abrir una imagen"

alemcuevas · 2024-09-17T21:39:34Z

content/espanol/python-pixel/activity-5.md

+{{% notice tip %}}
+Recuerda, para establecer un píxel gris, los tres valores RGB deben ser iguales. Sin embargo, establecer cada píxel al mismo valor aleatorio (ej. 200) hará que toda la imagen sea gris, en lugar de solo añadir un filtro sobre la imagen existente del gato.
+
+¿Cómo podemos averiguar mejor cómo establecer un píxel para que sea la versión 'griseada' de sí mismo? Podemos tomar un promedio de cada valor de los colores RGB. Puedes usar // para hacer una división entera, lo que garantiza que el resultado de la operación de promediado sea un número entero.


¿Cómo podemos averiguar mejor cómo establecer un píxel para que sea la versión 'grisácea' de sí mismo? Podemos tomar un promedio de cada valor de los colores RGB. Puedes usar // para hacer una división entera, lo que garantiza que el resultado de la operación de promediado sea un número entero.

alemcuevas · 2024-09-17T21:41:34Z

content/espanol/python-pixel/activity-6.md

@@ -0,0 +1,78 @@
+---
+title: "Actividad 6: Recortar Imagen"
+prereq: "Conceptos Básicos de Python, Manipulación de Imágenes en Python: Abrir una Imagen, Python Pixel: Colores y Píxeles"


"Conceptos Básicos de Python, Manipulación de Imágenes en Python: Abrir una Imagen, Python Píxel: Colores y Píxeles"

alemcuevas · 2024-09-17T21:42:11Z

content/espanol/python-pixel/activity-6.md

+
+En esta sección, comenzaremos a aprender cómo recortar tu imagen.
+
+### Ejemplo - Recortar al gato a la mitad


Ejemplo - Recortar la imagen del gato a la mitad

alemcuevas · 2024-09-17T21:42:58Z

content/espanol/python-pixel/activity-6.md

+
+<img src="../../media/halfcat.png" width=25%>
+
+### Ejemplo - Recortar la pieza central


Ejemplo - Recortar el centro de la imagen

alemcuevas · 2024-09-17T22:05:57Z

content/espanol/python-pixel/activity-8.md

@@ -0,0 +1,96 @@
+---
+title: "Actividad 8: Voltea tu imagen"


"Actividad 8: Gira tu imagen"

alemcuevas · 2024-09-17T22:06:25Z

content/espanol/python-pixel/activity-8.md

+---
+title: "Actividad 8: Voltea tu imagen"
+date: 2020-09-08T00:00:00Z
+prereq: "Conceptos básicos de Python, Python Pixels: Colores y Píxeles, Manipulación de imágenes con Python: Abrir una imagen"


"Conceptos básicos de Python, Python Píxeles: Colores y Píxeles, Manipulación de imágenes con Python: Abrir una imagen"

alemcuevas · 2024-09-17T22:10:27Z

content/espanol/python-pixel/activity-8.md

+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/Jx_b8111WW0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+
+En esta sección, comenzaremos a aprender cómo voltear tu imagen usando píxeles.


En esta sección, comenzaremos a aprender cómo girar tu imagen usando píxeles.

alemcuevas · 2024-09-17T22:11:07Z

content/espanol/python-pixel/activity-8.md

+
+### Ejemplo - Voltea tu imagen boca abajo
+
+Vamos a voltear el gato boca abajo.


Vamos a girar el gato hacia abajo.

alemcuevas · 2024-09-17T22:11:35Z

content/espanol/python-pixel/activity-8.md

+
+En esta sección, comenzaremos a aprender cómo voltear tu imagen usando píxeles.
+
+### Ejemplo - Voltea tu imagen boca abajo


Ejemplo - Gira tu imagen hacia abajo

alemcuevas · 2024-09-17T22:12:43Z

content/espanol/python-pixel/activity-8.md

+
+{{% notice note %}}
+
+Voltear la imagen boca abajo es lo mismo que crear una imagen simétrica con respecto a la `línea central horizontal`, que es la línea negra en la siguiente imagen.


Girar la imagen hacia abajo es lo mismo que crear una imagen simétrica con respecto a la línea central horizontal, que es la línea negra en la siguiente imagen.

alemcuevas · 2024-09-17T23:02:27Z

content/espanol/python-pixel/pixel-on-image.md

+
+Vamos a sumergirnos en la creación de imágenes. ¡No olvides que aprendimos a abrir y guardar imágenes en Python usando el módulo Pillow en las secciones anteriores!
+
+## Creando imágenes usando píxeles


Creación de imágenes usando píxeles

alemcuevas · 2024-09-17T23:03:27Z

content/espanol/python-pixel/open-image.md

+
+Si estás usando una imagen diferente, asegúrate de poner el nombre del archivo entre las comillas. El código anterior abre la imagen JPG y guarda esa imagen en la variable image. Para comprobar que la variable image tiene la imagen, podemos guardarla como una nueva imagen. De esta manera, la imagen se mostrará en la ventana.
+
+¡Presiona ejecutar y ve aparecer tu imagen! Mi imagen se ve así:


¡Presiona ejecutar y aparecerá tu imagen! Mi imagen se ve así:

alemcuevas · 2024-09-17T23:04:49Z

content/espanol/python-pixel/load_image_module.md

+
+![alt text](../../media/installed_module.png "imagen de lo que deberías ver cuando instales el módulo correctamente")
+
+Si ves lo anterior, significa que has importado un módulo con éxito. Si tienes problemas, por favor pide ayuda antes de continuar.


Si puedes ver lo anterior, significa que has importado un módulo con éxito. Si tienes problemas, por favor pide ayuda antes de continuar.

alemcuevas · 2024-09-17T23:07:18Z

content/espanol/python-pixel/basic-of-colors.md

+</br>
+{{% /showanswer %}}
+
+*Nota: No te preocupes si te sientes confundido aquí, explicaremos más sobre estas ideas en las actividades de código de python más adelante en el taller.*


Nota: No te preocupes si estas ideas parecen confusas en este momento. A lo largo del taller, las aclararemos con más detalle durante las actividades prácticas de código en Python.

alemcuevas · 2024-09-17T23:11:45Z

content/espanol/python-pixel/activity-8.md

+newimg.save("Mycat.png")
+```
+
+¡Wow! Este es nuestro nuevo gato después de voltear.


¡Wow! Este es nuestro nuevo gato después de girarlo.

alemcuevas · 2024-09-17T23:12:50Z

content/espanol/python-pixel/activity-8.md

+
+<img src="../../media/flipcat.png" width=50%>
+
+¿Cómo descubrimos cómo establecer `heightNew`? En el código anterior tenemos:


¿Cómo podemos determinar la forma correcta de establecer heightNew? En el código anterior tenemos:

alemcuevas · 2024-09-17T23:13:54Z

content/espanol/python-pixel/activity-8.md

+
+`heightNew = height - 1 - j`
+
+Este es el punto clave para voltear el gato boca abajo. Esto toma la altura de la imagen y resta 1 así como la ubicación actual de la altura del píxel (j). Restamos 1 para el índice; recuerda que las computadoras comienzan a contar desde '0' en lugar de '1'. Restamos la ubicación actual de la altura del píxel para obtener la ubicación de donde debería estar el nuevo píxel.


Este es el punto clave para girar al gato hacia abajo. Esto toma la altura de la imagen y resta 1 así como la ubicación actual de la altura del píxel (j). Restamos 1 para el índice; recuerda que las computadoras comienzan a contar desde '0' en lugar de '1'. Restamos la ubicación actual de la altura del píxel para obtener la ubicación de donde debería estar el nuevo píxel.

alemcuevas · 2024-09-17T23:14:42Z

content/espanol/python-pixel/activity-8.md

+
+### Desafío - Voltea tu gato de izquierda a derecha
+
+Ahora es tu turno de voltear tu gato de izquierda a derecha.


Ahora es tu turno de girar tu gato de izquierda a derecha.

alemcuevas · 2024-09-17T23:14:57Z

content/espanol/python-pixel/activity-8.md

+
+Luego crea la salida simétrica con respecto a la línea central horizontal y compárala con la salida anterior. ¿Son iguales?
+
+### Desafío - Voltea tu gato de izquierda a derecha


Desafío - Gira tu gato de izquierda a derecha

alemcuevas · 2024-09-17T23:15:24Z

content/espanol/python-pixel/activity-8.md

+
+{{% notice note %}}
+
+Voltear la imagen de izquierda a derecha es lo mismo que crear una imagen simétrica con respecto a la `línea central vertical`.


Girar la imagen de izquierda a derecha es lo mismo que crear una imagen simétrica con respecto a la línea central vertical.

alemcuevas · 2024-09-17T23:16:24Z

content/espanol/python-pixel/activity-9.md

+width = img.size[0]
+height = img.size[1]
+
+# Configurar una nueva imagen con la misma anchura y altura


Configurar una nueva imagen con el mismo ancho y alto

alemcuevas · 2024-09-17T23:17:48Z

content/espanol/python-pixel/activity-9.md

+Luego, gíralo 180 grados en sentido horario y compáralo con el resultado anterior. ¿Son iguales?
+{{% /notice %}}
+
+### Desafío - Rota tu gato 90 grados en sentido antihorario


Rota tu gato 90 grados en sentido contrario a las agujas del reloj.

alemcuevas · 2024-09-17T23:18:18Z

content/espanol/python-pixel/activity-9.md

+
+### Desafío - Rota tu gato 90 grados en sentido antihorario
+
+¡Ahora es tu turno de rotar tu gato 90 grados en sentido antihorario!


¡Ahora es tu turno de rotar tu gato 90 grados en sentido contrario a las agujas del reloj!

alemcuevas · 2024-09-17T23:18:52Z

content/espanol/python-pixel/activity-9.md

+
+El módulo Pillow tiene funciones que pueden ayudar a simplificar los pasos anteriores. Para hacerlo, veamos la función `rotate()` de `Pillow Image`.
+
+La rotación de imagen funciona usando ángulos. Por ejemplo, `rotate(45)` inclinará tu imagen de lado 45 grados. Usar `rotate(90)` girará tu imagen de lado.


La rotación de imagen funciona usando ángulos. Por ejemplo, rotate(45) inclinará tu imagen de lado 45 grados. Usar rotate(90) rotará tu imagen de lado.

alemcuevas · 2024-09-17T23:19:41Z

content/espanol/python-pixel/activity-9.md

+    image.save("myCat.jpg")
+```
+
+Desafío: ¿puedes girar esta imagen completamente? ¿Puedes girar la imagen 3/4 sin usar un ángulo > 180? (Pista: ¡intenta usar números de ángulo negativos!)


Desafío: ¿puedes rotar esta imagen completamente? ¿Puedes rotar la imagen 3/4 sin usar un ángulo > 180? (Pista: ¡intenta usar ángulos negativos!)

alemcuevas · 2024-09-17T23:19:55Z

content/espanol/python-pixel/activity-9.md

+
+Desafío: ¿puedes girar esta imagen completamente? ¿Puedes girar la imagen 3/4 sin usar un ángulo > 180? (Pista: ¡intenta usar números de ángulo negativos!)
+
+Girado completamente, mi imagen se ve así:


Rotado completamente, mi imagen se ve así:

alemcuevas · 2024-09-17T23:20:16Z

content/espanol/python-pixel/answer-key.md

+```
+
+## Actividad2
+Esta es la respuesta de ejemplo para dibujar una línea desde el medio del tablero de color de la Actividad1 hasta su esquina inferior derecha.


Esta es la respuesta de ejemplo para dibujar una línea desde el medio del tablero de color de la Actividad 1 hasta su esquina inferior derecha.

alemcuevas · 2024-09-17T23:21:11Z

content/espanol/python-pixel/answer-key.md

+img.save('pixel-activity2.png')
+```
+
+## Actividad3


Maybe add a space between Actividad and the number?

Translating python Pixel workshop to spanish, Will update it incremen…

2ae0cd0

…tally

alemcuevas reviewed Sep 17, 2024

View reviewed changes

Merge branch 'NuevoFoundation:master' into dev/nagavo/pythonpixelespanol

46e55a3


		<iframe width="560" height="315" src="https://www.youtube.com/embed/Nz3Uz4kBoUU" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

		## Ejemplo para un tablero de colores básico


		## Más sobre los píxeles

		Ya hemos aprendido cómo crear una imagen de color puro usando píxeles y cambiar un píxel en la imagen. Ahora, aprenderemos a identificar píxeles en imágenes existentes.


		En esta sección, comenzaremos a aprender cómo recortar tu imagen.

		### Ejemplo - Recortar al gato a la mitad


		<img src="../../media/halfcat.png" width=25%>

		### Ejemplo - Recortar la pieza central


		### Ejemplo - Voltea tu imagen boca abajo

		Vamos a voltear el gato boca abajo.


		{{% notice note %}}

		Voltear la imagen boca abajo es lo mismo que crear una imagen simétrica con respecto a la `línea central horizontal`, que es la línea negra en la siguiente imagen.


		Vamos a sumergirnos en la creación de imágenes. ¡No olvides que aprendimos a abrir y guardar imágenes en Python usando el módulo Pillow en las secciones anteriores!

		## Creando imágenes usando píxeles


		Si estás usando una imagen diferente, asegúrate de poner el nombre del archivo entre las comillas. El código anterior abre la imagen JPG y guarda esa imagen en la variable image. Para comprobar que la variable image tiene la imagen, podemos guardarla como una nueva imagen. De esta manera, la imagen se mostrará en la ventana.

		¡Presiona ejecutar y ve aparecer tu imagen! Mi imagen se ve así:


		![alt text](../../media/installed_module.png "imagen de lo que deberías ver cuando instales el módulo correctamente")

		Si ves lo anterior, significa que has importado un módulo con éxito. Si tienes problemas, por favor pide ayuda antes de continuar.


		<img src="../../media/flipcat.png" width=50%>

		¿Cómo descubrimos cómo establecer `heightNew`? En el código anterior tenemos:


		`heightNew = height - 1 - j`

		Este es el punto clave para voltear el gato boca abajo. Esto toma la altura de la imagen y resta 1 así como la ubicación actual de la altura del píxel (j). Restamos 1 para el índice; recuerda que las computadoras comienzan a contar desde '0' en lugar de '1'. Restamos la ubicación actual de la altura del píxel para obtener la ubicación de donde debería estar el nuevo píxel.


		### Desafío - Voltea tu gato de izquierda a derecha

		Ahora es tu turno de voltear tu gato de izquierda a derecha.


		Luego crea la salida simétrica con respecto a la línea central horizontal y compárala con la salida anterior. ¿Son iguales?

		### Desafío - Voltea tu gato de izquierda a derecha


		{{% notice note %}}

		Voltear la imagen de izquierda a derecha es lo mismo que crear una imagen simétrica con respecto a la `línea central vertical`.


		### Desafío - Rota tu gato 90 grados en sentido antihorario

		¡Ahora es tu turno de rotar tu gato 90 grados en sentido antihorario!


		El módulo Pillow tiene funciones que pueden ayudar a simplificar los pasos anteriores. Para hacerlo, veamos la función `rotate()` de `Pillow Image`.

		La rotación de imagen funciona usando ángulos. Por ejemplo, `rotate(45)` inclinará tu imagen de lado 45 grados. Usar `rotate(90)` girará tu imagen de lado.


		Desafío: ¿puedes girar esta imagen completamente? ¿Puedes girar la imagen 3/4 sin usar un ángulo > 180? (Pista: ¡intenta usar números de ángulo negativos!)

		Girado completamente, mi imagen se ve así:

Translating python Pixel workshop to spanish, Will update it incremen… #500

Are you sure you want to change the base?

Translating python Pixel workshop to spanish, Will update it incremen… #500

Conversation

sunnynagavo commented Sep 17, 2024

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

alemcuevas Sep 17, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

alemcuevas Sep 17, 2024 •

edited

Loading