Skip to content

Commit

Permalink
Merge branch 'master' into a11y
Browse files Browse the repository at this point in the history
  • Loading branch information
cycomachead authored Sep 24, 2024
2 parents 9e27440 + 329da0e commit 404277b
Show file tree
Hide file tree
Showing 75 changed files with 560 additions and 560 deletions.
14 changes: 7 additions & 7 deletions Gemfile.lock
Original file line number Diff line number Diff line change
Expand Up @@ -54,22 +54,22 @@ GEM
ffi (1.17.0-x86_64-linux-gnu)
ffi (1.17.0-x86_64-linux-musl)
forwardable-extended (2.6.0)
google-protobuf (4.27.1)
google-protobuf (4.27.5)
bigdecimal
rake (>= 13)
google-protobuf (4.27.1-aarch64-linux)
google-protobuf (4.27.5-aarch64-linux)
bigdecimal
rake (>= 13)
google-protobuf (4.27.1-arm64-darwin)
google-protobuf (4.27.5-arm64-darwin)
bigdecimal
rake (>= 13)
google-protobuf (4.27.1-x86-linux)
google-protobuf (4.27.5-x86-linux)
bigdecimal
rake (>= 13)
google-protobuf (4.27.1-x86_64-darwin)
google-protobuf (4.27.5-x86_64-darwin)
bigdecimal
rake (>= 13)
google-protobuf (4.27.1-x86_64-linux)
google-protobuf (4.27.5-x86_64-linux)
bigdecimal
rake (>= 13)
http_parser.rb (0.8.0)
Expand Down Expand Up @@ -138,7 +138,7 @@ GEM
rb-inotify (0.11.1)
ffi (~> 1.0)
regexp_parser (2.9.2)
rexml (3.3.2)
rexml (3.3.3)
strscan
rouge (4.3.0)
rspec (3.13.0)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -147,25 +147,25 @@ <h3 class="box-head">Usar pasos visibles</h3>
En la paleta "Lápiz" se puede encontrar ahora el bloque <code>fijar color de lápiz a</code>. Las computadoras pueden desplegar millones de colores, pero a menos que sea necesario hacer coincidir exáctamente con un color en específico, no hace falta complicarse por hacerlo coincidir a menos que tengas la combinación correcta. La biblioteca de colores fuciona como una caja de crayones, brinda una selección de los colores más utilizados y se encuentran clasificados en familias. De esta forma si deseas incluir una variedad de tonos marrones, selecciona un número entre 30 y 39.<br />
<img class="indent" src="/bjc-r/img/1-introduction/brown.png" alt='bloque de fijar el color del lápiz con la opción de "marrones" seleccionada y que muestra un submenú donde se selecciona la opcón "34 chestnut #954535"' title='bloque de fijar el color del lápiz con la opción de "marrones" seleccionada y que muestra un submenú donde se selecciona la opcón "34 chestnut #954535"' />
</li>
<li>
<img class="imageRight" src="/bjc-r/img/1-introduction/1024px-Suprematist_Composition_-_Kazimir_Malevich.jpg" height="180" alt=" pintura de Malevich" title="pintura de Malevich" />
<li>
<img class="imageRight" src="/bjc-r/img/1-introduction/1024px-Suprematist_Composition_-_Kazimir_Malevich.jpg" height="180" alt=" pintura de Malevich" title="pintura de Malevich" />
En el lado derecho se presenta una pintura del artista Kazimir Malevich. Los elementos en la pintura son rectángulos, tanto de forma horizontal como en un ángulo de 45 grados, en ocasiones unos grados más y otras unos grados menos. Se pueden posicionar los rectángulos de forma aleatoria. El resultado de tu trabajo no necesariamente se debe ver así. Eres un artista, ¡inténtalo!
<div class="dialogue">
<div>
<span>Alphie:</span> Si se despliegan rectángulos de forma aleatoria, los cuadrados más grandes van a cubrir a los más pequeños. Se deberían desplegar los rectángulos grandes primero y dejar los pequeños para el final.
<span>Morgan:</span> Si se despliegan rectángulos de forma aleatoria, los cuadrados más grandes van a cubrir a los más pequeños. Se deberían desplegar los rectángulos grandes primero y dejar los pequeños para el final.
</div>
<div>
<span>Gamal:</span> Sé que nuestro trabajo no se parece a la versión original, pero me gusta la forma en que aparece el rectángulo grande de color negro. Pienso que da una estructura a la pintura, con una parte superior y una parte inferior. Me gustaría incluir uno igual en mi trabajo.
<span>Omar:</span> Sé que nuestro trabajo no se parece a la versión original, pero me gusta la forma en que aparece el rectángulo grande de color negro. Pienso que da una estructura a la pintura, con una parte superior y una parte inferior. Me gustaría incluir uno igual en mi trabajo.
</div>
<div>
<span>Betty:</span> Me gusta la idea de dibujar líneas muy gruesas <em>sin</em> usar el bloque <code>punta de lápiz plana</code> y obtener resultados interesantes como aparecen a continuación:
<span>Jasmine:</span> Me gusta la idea de dibujar líneas muy gruesas <em>sin</em> usar el bloque <code>punta de lápiz plana</code> y obtener resultados interesantes como aparecen a continuación:
</div>
<img class="indent" src="/bjc-r/img/1-introduction/curl.png" alt="forma de cuerno curvado hecha de círculos superpuestos en diferentes colores" title="forma de cuerno curvado hecha de círculos superpuestos en diferentes colores" />
</div>
</li>
<li>
<img class="imageRight" src="/bjc-r/img/1-introduction/Theo_van_Doesburg_Composition_VII_(the_three_graces).jpg" height="130" alt="pintura de van Doesburg" title="pintura de van Doesburg" />
Hacia el lado derecho se presenta una pintura de Theo van Doesburg. Se pueden apreciar detalles en común con la pintura de Malevich, principalmente el uso de rectángulos como elementos de diseño. Sin embargo no tiene rectángulos inclinados, en su lugar se necesita que los rectángulos no estén encima unos de otros por lo que deben ser reducidos para evitar colisiones. Se puede usar el bloque <img src="/bjc-r/img/1-introduction/blackp.es.png" alt="((brillo) en (mí mismo)) = 0" title="((brillo) en (mí mismo)) = 0" /> para identificar si el fondo detrás del elemento es negro y no el color de otro objeto.
</li>
<li>
<img class="imageRight" src="/bjc-r/img/1-introduction/Theo_van_Doesburg_Composition_VII_(the_three_graces).jpg" height="130" alt="pintura de van Doesburg" title="pintura de van Doesburg" />
Hacia el lado derecho se presenta una pintura de Theo van Doesburg. Se pueden apreciar detalles en común con la pintura de Malevich, principalmente el uso de rectángulos como elementos de diseño. Sin embargo no tiene rectángulos inclinados, en su lugar se necesita que los rectángulos no estén encima unos de otros por lo que deben ser reducidos para evitar colisiones. Se puede usar el bloque <img src="/bjc-r/img/1-introduction/blackp.es.png" alt="((brillo) en (mí mismo)) = 0" title="((brillo) en (mí mismo)) = 0" /> para identificar si el fondo detrás del elemento es negro y no el color de otro objeto.
</li>
</ol>
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -152,18 +152,18 @@ <h3 class="box-head">Using Visible Stepping</h3>
In the Pen menu you'll find the <code>set pen to crayon</code> block. Computers can display billions of colors, but unless you have to match the paint on your wall very precisely, finding your way through all those colors may be more trouble than it's worth. The crayon library, just like a box of crayons, gives you a small set of vibrant colors, arranged in families. So if you want a lot of browns in your picture, you could pick a random number between 30 and 39.<br />
<img class="indent" src="/bjc-r/img/1-introduction/brown.png" alt='Set pen to crayon block with menu of color families, selecting "browns" and showing submenu of ten brownish named colors, highlighting "34 chestnut #954535"' title='Set pen to crayon block with menu of color families, selecting "browns" and showing submenu of ten brownish named colors, highlighting "34 chestnut #954535"' />
</li>
<li>
<li>
<img class="imageRight" src="/bjc-r/img/1-introduction/1024px-Suprematist_Composition_-_Kazimir_Malevich.jpg" height="180" alt="painting-by-Malevich" title="painting-by-Malevich" />
At the right is a painting by Kazimir Malevich. Its elements are rectangles, either horizontal or at a 45-degree angle, plus or minus a few degrees. You can position rectangles randomly. Your picture doesn't have to look like his&mdash;you're the artist!
<div class="dialogue">
<div>
<span>Alphie:</span> If we just put rectangles in randomly, the tiny square dots will often be covered by larger ones. Maybe we should do big ones first and smaller ones later.
<span>Morgan:</span> If we just put rectangles in randomly, the tiny square dots will often be covered by larger ones. Maybe we should do big ones first and smaller ones later.
</div>
<div>
<span>Gamal:</span> I know ours don't have to look like the original, but I really like that huge black horizontal rectangle. It gives the painting a structure, with a top part and a bottom part, even though it doesn't go all the way across. I want to make sure to have one like that.
<span>Omar:</span> I know ours don't have to look like the original, but I really like that huge black horizontal rectangle. It gives the painting a structure, with a top part and a bottom part, even though it doesn't go all the way across. I want to make sure to have one like that.
</div>
<div>
<span>Betsy:</span> I bet we can use the idea of drawing really thick lines <em>without</em> using <code>flat line ends</code> and get interesting results:
<span>Jasmine:</span> I bet we can use the idea of drawing really thick lines <em>without</em> using <code>flat line ends</code> and get interesting results:
</div>
<img class="indent" src="/bjc-r/img/1-introduction/curl.png" alt="curved horn shape made of overlapping circles in different colors" title="curved horn shape made of overlapping circles in different colors" />
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -131,13 +131,13 @@ <h3 class="box-head">Depurando con el bloque <img src="/bjc-r/img/2-complexity/D
<strong>Es tu inspiración. Tienes libertad para expresarte.</strong>
<div class="dialogue">
<div>
<span>Gamal:</span> Me parece la figura de un mapa. Veo casas a la derecha, el centro de la ciudad a la derecha. Veo la municipalidad, el parque de bomberos y un supermercado.
<span>Omar:</span> Me parece la figura de un mapa. Veo casas a la derecha, el centro de la ciudad a la derecha. Veo la municipalidad, el parque de bomberos y un supermercado.
</div>
<div>
<span>Betty:</span> Probablemente. A mí me parece que la izquierda representa las huellas dactilares. Por otra parte, la sección a la derecha representa claramente a una persona que mira a la derecha y tiene la nariz hacia arriba.
</div>
<div>
<span>Alphie:</span> No importa mucho a qué se parece la pintura. ¿Cómo vamos <em>nosotros</em> a lograr que nuestro trabajo <em>luzca parecido?</em>
<span>Morgan:</span> No importa mucho a qué se parece la pintura. ¿Cómo vamos <em>nosotros</em> a lograr que nuestro trabajo <em>luzca parecido?</em>
</div>
<div>
<span>Betty:</span> Algunas partes de la pintura tienen un aspecto curvo y líneas de puntos gruesas. Podemos hacer algo como lo siguiente:<br />
Expand All @@ -148,7 +148,7 @@ <h3 class="box-head">Depurando con el bloque <img src="/bjc-r/img/2-complexity/D
Aunque no estoy segura cómo generarlos en gran cantidad y lograr que estén acomodados juntos.
</div>
<div>
<span>Alphie:</span> La aleatoriedad es nuestra amiga. Hagamos muchas líneas de puntos, de diferente grosor y que apunten en diferentes direcciones.<br />
<span>Morgan:</span> La aleatoriedad es nuestra amiga. Hagamos muchas líneas de puntos, de diferente grosor y que apunten en diferentes direcciones.<br />
<img class="indent" src="/bjc-r/img/1-introduction/alphie-dotted.es.png" alt="línea punteada: fijar color de lápiz a
(cuadrado marrón); fijar tamaño de lápiz a (10); fijar el parámetro
(punta de lápiz plana) a (verdadero); repetir (número al azar entre (8) y (20)): {bajar lápiz; mover (número al azar entre (10) y (20)) pasos; subir lápiz; mover (número al azar entre (1) y (8)) pasos; girar a la derecha (número al azar entre (-10) y (20)) grados}" title="línea punteada: fijar color de lápiz a
Expand All @@ -165,28 +165,28 @@ <h3 class="box-head">Depurando con el bloque <img src="/bjc-r/img/2-complexity/D
<span>Betty:</span> ¡Wow! Muy buena idea.
</div>
<div>
<span>Alphie:</span> Aunque el resultado no es lo que tenía en mente para el ejercicio.
<span>Morgan:</span> Aunque el resultado no es lo que tenía en mente para el ejercicio.
</div>
<div>
<span>Betty:</span> ¿A qué te refieres? Recuerda la primera instrucción que se encuentra en negrilla al inicio del ejercicio en la caja azul.
</div>
<div>
<span>Alphie:</span> Sí, lo tengo presente, pero la frase "Tienes libertad" no significa "Quédate con el resultado que salga en el primer intento." Yo tengo otra idea. Hemos estado pensando en la pintura de "Thomas" en la forma de cuadros de color café sobre un fondo blanco, aunque es realmente más café que blanco. ¿Qué tal si empezamos con un fondo café y dibujamos líneas blancas sobre él?
<span>Morgan:</span> Sí, lo tengo presente, pero la frase "Tienes libertad" no significa "Quédate con el resultado que salga en el primer intento." Yo tengo otra idea. Hemos estado pensando en la pintura de "Thomas" en la forma de cuadros de color café sobre un fondo blanco, aunque es realmente más café que blanco. ¿Qué tal si empezamos con un fondo café y dibujamos líneas blancas sobre él?
</div>
<div>
<span>Gamal:</span> ¿Qué sucede con el centro de la ciudad a la derecha?
<span>Omar:</span> ¿Qué sucede con el centro de la ciudad a la derecha?
</div>
<div>
<span>Betty:</span> Esto no es un mapa. Pero para hacerte feliz, cuando se dibujen las líneas blancas hacia la derecha, pueden ser más gruesas. De esta forma la parte derecha tendrá más espacio en blanco que la parte izquierda.
</div>
<div>
<span>Alphie:</span> Uh oh... Si ves detenidamente la pintura original, puedes notar que los elementos en color café no tienen todos la misma tonalidad.
<span>Morgan:</span> Uh oh... Si ves detenidamente la pintura original, puedes notar que los elementos en color café no tienen todos la misma tonalidad.
</div>
<div>
<span>Betty:</span> Alphie, te preocupas demasiado. Pero para hacerte feliz <em>de nuevo</em>, una vez que tengamos el espacio dividido en regiones, podemos usar el bloque <img src="/bjc-r/img/1-introduction/fill.es.png" alt="llenar" title="llenar"> para rellenarlas en varias tonalidades de color café.
</div>
<div>
<span>Gamal:</span> ¡Hey, amigos! ¿Recuerdan que importamos la biblioteca de crayones? ¿Adivinen qué? ¡Tenemos una biblioteca "Mapamundi", también! Esta bibloteca dibuja mapas con "acuarelas" que se ven de la siguiente forma:<br />
<span>Omar:</span> ¡Hey, amigos! ¿Recuerdan que importamos la biblioteca de crayones? ¿Adivinen qué? ¡Tenemos una biblioteca "Mapamundi", también! Esta bibloteca dibuja mapas con "acuarelas" que se ven de la siguiente forma:<br />
<img class="indent" src="/bjc-r/img/1-introduction/water.png" alt="mapa incompleto de una ciudad" title="mapa incompleto de una ciudad"><br />
Luego recorrí cada uno de los puntos del escenario utilizando los bloques <img src="/bjc-r/img/1-introduction/my-brightness.es.png" alt="(brillo) en (mí mismo)" title="(brillo) en (mí mismo)"> y <img src="/bjc-r/img/1-introduction/my-hue.es.png" alt="(tonalidad) en (mí mismo)" title="(tonalidad) en (mí mismo)"> para decidir entre hacer el punto blanco o café:<br />
<img class="indent" src="/bjc-r/img/1-introduction/painted.png" alt="mismo mapa incompleto de una ciudad, pero ahora en tonos marrón y blanco" title="mismo mapa incompleto de una ciudad, pero ahora en tonos marrón y blanco">
Expand Down
Loading

0 comments on commit 404277b

Please sign in to comment.