diff --git a/.gitignore b/.gitignore index 520fdfd9b4..34802a4456 100644 --- a/.gitignore +++ b/.gitignore @@ -33,3 +33,4 @@ dist/* !dist/download/version.json !dist/books/media.zip !dist/learn/books/media.zip + diff --git a/src/data/en.yml b/src/data/en.yml index 6a23c5575c..15f57531d5 100644 --- a/src/data/en.yml +++ b/src/data/en.yml @@ -1074,16 +1074,13 @@ learn: We welcome new written tutorial contributions and this guide outlines the steps of how to propose, prepare and contribute. writing-a-tutorial-how-start-title: 'How to get started:' - writing-a-tutorial-how-start-1: 'Check that your proposed topic has not already been covered. There is ' - writing-a-tutorial-how-start-2: a working spreadsheet here + writing-a-tutorial-how-start-1: 'Ensure your chosen topic has not been previously covered. ' + writing-a-tutorial-how-start-2: '' writing-a-tutorial-how-start-3: >- - that outlines in progress tutorials. If your topic is listed as in progress, - perhaps you can add to work being done and contribute to preparing existing - work for publication so please reach out to us. + If your topic is already in progress, consider contributing to the existing work and helping prepare it for publication. Feel free to reach out to us for guidance. writing-a-tutorial-how-start-4: >- - If your topic is not already covered and is not listed as in progress, - please write a few sentences on what you propose to cover and email us this - description at education@p5js.org. + If your topic hasn't been covered and isn't currently in progress, please provide a brief description of your proposed topic. You can send this description to us at education@p5js.org. + writing-a-tutorial-how-prepare-title: 'How to prepare a p5js tutorial for publication online:' writing-a-tutorial-how-prepare-1: >- When your tutorial is ready for publication, please follow these steps to diff --git a/src/data/es.yml b/src/data/es.yml index 3550478809..8ee2b3098a 100644 --- a/src/data/es.yml +++ b/src/data/es.yml @@ -1190,7 +1190,7 @@ learn: missing semicolon for example is not allowed and will result in an error message. You can't use different types of numbers, like floats or integers interchangeably. - getting-started-in-webgl-shaders-p6x1: 'First let''s look at a basic vertex shader:' + getting-started-in-webgl-shaders-p6x1: "First let's look at a basic vertex shader:" getting-started-in-webgl-shaders-p7x1: >- This vertex shader begins with an attribute, which p5.js uses to share vertex position information with the shader. This attribute is a - - Comprueba que el tema que hayas propuesto no haya sido cubierto antes. - Puedes encontrar + Comprueba que el tema que hayas propuesto no haya sido cubierto antes.Puedes encontrar. writing-a-tutorial-how-start-2: una lista aquí writing-a-tutorial-how-start-3: >- - con los tutoriales que están en progreso. Si tu tema está marcado en esta - lista como en progreso, tal vez puedes añadir al trabajo que se está - llevando a cabo y cooperar preparando el trabajo ya existente para su - publicación así que por favor contáctate con nosotros. + con los tutoriales que están en progreso. Si tu tema está marcado en esta + lista como en progreso, tal vez puedes añadir al trabajo que se está llevando a cabo y cooperar preparando el trabajo ya existente para su publicación así que por favor contáctate con nosotros. writing-a-tutorial-how-start-4: >- - Si tu tema no está cubierto y no está enlistado como en progreso, por favor - escribe unas líneas sobre lo que propones cubrir y mándanos un email con + Si tu tema no está cubierto y no está enlistado como en progreso, por favor + escribe unas líneas sobre lo que propones cubrir y mándanos un email con esta descripción a education@p5js.org. + writing-a-tutorial-how-prepare-title: 'Cómo preparar un tutorial de p5js para su publicación en línea:' writing-a-tutorial-how-prepare-1: >- Cuando tu tutorial esté listo para ser publicado, por favor sigue los @@ -2922,7 +2920,7 @@ teach: teach-case13-title: p5.js à l'Ubuntu Party! teach-case13-lead-name: Basile Pesin teach-case13-content1: '2020 Ubuntu Party ' - teach-case13-content1-1: 'Cité des Sciences et de l''''Industrie, Paris, France' + teach-case13-content1-1: "Cité des Sciences et de l''Industrie, Paris, France" teach-case13-content2: 'Any age, including children and parents, young and older adults.' teach-case13-content3: Advanced teach-case13-content4: >- diff --git a/src/data/hi.yml b/src/data/hi.yml index 0b451fd4c7..bb269301e8 100644 --- a/src/data/hi.yml +++ b/src/data/hi.yml @@ -688,7 +688,7 @@ learn: One of the most fundamental differences between working in 2D and working in 3D is the most obvious: there is one more dimension to work with. In addition to the horizontal and vertical position (x and y axes) of an - element in our drawing, 3D adds depth, the z-axis. + element in our drawing, 3D adds depth, the z-axis. getting-started-in-webgl-coords-and-transform-p6x1: >- When drawing in 2D, the point (0,0) is located at the top left corner of the screen. In WebGL mode, the origin of the sketch (0,0,0) is located in the @@ -763,7 +763,7 @@ learn: example, if rotate() is called, followed by translate(), the direction of that translation will be affected by the rotation. The entire coordinate system is rotating and - moving, not just the shape itself. + moving, not just the shape itself. getting-started-in-webgl-coords-and-transform-p14x1: >- Transformations can be performed in any order, but using translate, rotate, and then @@ -790,7 +790,7 @@ learn: places two boxes in our sketch. To position the second box without push() and pop(), you have to account for the first transformation. This can be a lot to keep track of in a more - complex 3D scene. + complex 3D scene. getting-started-in-webgl-coords-and-transform-p16x2: and getting-started-in-webgl-coords-and-transform-p16x3: >- . push() and pop() make it easier to @@ -806,7 +806,7 @@ learn: Consider this following example, which places two boxes in our sketch. To position the second box without push() and pop(), you have to account for the first transformation. - This can be a lot to keep track of in a more complex 3D scene. + This can be a lot to keep track of in a more complex 3D scene. getting-started-in-webgl-coords-and-transform-p17x1: >- Now, let's try the same code with push() and pop(). Now we can just translate the object where we want @@ -821,7 +821,7 @@ learn: getting-started-in-webgl-coords-and-transform-p18x1: >- In the below example, try removing push() and pop() to see how the transformations affect the second - object that is drawn. + object that is drawn. getting-started-in-webgl-coords-and-transform-heading5: Basic Shapes in 3D getting-started-in-webgl-coords-and-transform-p19x1: >- So far we have only been using box() but p5.js has seven @@ -896,7 +896,7 @@ learn: method, which should be used within preload(). getting-started-in-webgl-custom-geometry-p2x2: >- method, which should be used within preload(). Then you - can use the + can use the getting-started-in-webgl-custom-geometry-p2x3: 'function to draw the model, as demonstrated in the example below.' getting-started-in-webgl-custom-geometry-p3x1: >- A common issue that can come up with custom models is scaling. Depending on @@ -938,11 +938,11 @@ learn: href="{{root}}/reference/#/p5/p5.Geometry">p5.Geometry, which p5 uses internally for loadModel() but can also be used to define custom geometry, offering tools that can be helpful in calculating - faces and normals. + faces and normals. getting-started-in-webgl-custom-geometry-p6x1_: >- , which p5.js uses internally for loadModel() but can also be used to define custom geometry, offering tools that can be helpful - in calculating faces and normals. + in calculating faces and normals. getting-started-in-webgl-custom-geometry-p6x2: >- In 3D, a face refers to a collection of three or four points that make up a surface, giving our geometry the appearance of being solid. A normal is the @@ -1004,7 +1004,7 @@ learn: A perspective camera skews objects so they appear to get smaller as they get further away, vanishing at a single point in the distance. This is in contrast to an orthographic camera, where the geometry stays - the same size as it gets further away and has no vanishing point. + the same size as it gets further away and has no vanishing point. getting-started-in-webgl-appearance-p3x1: >- One setting that we can change with a perspective camera is the field-of-view, or FOV. This is the term that is used to describe @@ -1080,7 +1080,7 @@ learn: getting-started-in-webgl-appearance-p11x1: >- In this interactive example, try selecting each of the different materials to see how they affect the appearance of the geometry. You can move your - mouse and see the effect that a directional light has on the material. + mouse and see the effect that a directional light has on the material. getting-started-in-webgl-appearance-p12x1: 'Try commenting and uncommenting the different lights in this example:' getting-started-in-webgl-appearance-p13x1: >- More custom materials can be achieved through using Introduction to - Shaders page when you are ready. + Shaders page when you are ready. getting-started-in-webgl-appearance-info1x2: Introduction to Shaders getting-started-in-webgl-appearance-info1x3: 'page when you are ready. ' getting-started-in-webgl-appearance-heading4: Conclusion @@ -1179,7 +1179,7 @@ learn: missing semicolon for example is not allowed and will result in an error message. You can't use different types of numbers, like floats or integers interchangeably. - getting-started-in-webgl-shaders-p6x1: 'First let''s look at a basic vertex shader:' + getting-started-in-webgl-shaders-p6x1: "First let's look at a basic vertex shader:" getting-started-in-webgl-shaders-p7x1: >- This vertex shader begins with an attribute, which p5.js uses to share vertex position information with the shader. This attribute is a - - जो प्रगति शिक्षण में रूपरेखा है। यदि आपके विषय को प्रगति के रूप में सूचीबद्ध - किया गया है, तो शायद आप काम करने के लिए जोड़ सकते हैं और प्रकाशन के लिए - मौजूदा काम को तैयार करने में योगदान कर सकते हैं ताकि कृपया हमारे पास - पहुंचें। + जो प्रगति शिक्षण में रूपरेखा है। यदि आपके विषय को प्रगति के रूप में सूचीबद्ध किया गया है, तो शायद आप काम करने के लिए जोड़ सकते हैं और प्रकाशन के लिए मौजूदा काम को तैयार करने में योगदान कर सकते हैं ताकि कृपया हमारे पास पहुंचें। writing-a-tutorial-how-start-4: >- - यदि आपका विषय पहले से ही कवर नहीं है और प्रगति के रूप में सूचीबद्ध नहीं है, - तो कृपया कुछ वाक्यों को लिखें, जो आप हमें इस विवरण को education@p5js.org पर - कवर करने और ईमेल करने का प्रस्ताव देते हैं। + यदि आपका विषय पहले से ही कवर नहीं है और प्रगति के रूप में सूचीबद्ध नहीं है, तो कृपया कुछ वाक्यों को लिखें, जो आप हमें इस विवरण को education@p5js.org पर कवर करने और ईमेल करने का प्रस्ताव देते हैं। + writing-a-tutorial-how-prepare-title: 'ऑनलाइन प्रकाशन के लिए एक p5js शिक्षण कैसे तैयार करें:' writing-a-tutorial-how-prepare-1: >- जब आपका शिक्षण प्रकाशन के लिए तैयार हो जाता है, तो कृपया p5js वेबसाइट के लिए @@ -1626,7 +1622,7 @@ learn: के लिए createCanvas () फ़ंक्शन के उपयोग पर ध्यान दें। curves-description1: >- This tutorial is written by J David Eisenberg and ported by Sally Chen. If - you see any errors or have comments, + you see any errors or have comments, curves-description2: ' please let us know.' curves-description3: 'This work is licensed under a ' curves-description4: ' Creative Commons Attribution-NonCommercial-ShareAlinke 4.0 International License.' @@ -1857,7 +1853,7 @@ libraries: p5.xr: p5 के साथ VR और AR रेखाचित्र बनाने के लिए एक पुस्तकालय| p5.3D: 'WebGL में 3D पाठ और छवियां। ' WEBMIDI.js: Easily send and receive MIDI messages from p5. - p5.buttons: '''एक पुस्तकालय जिसका उद्देश्य स्क्रिप्टिंग बटन को जटिल बनाना है।''' + p5.buttons: "'एक पुस्तकालय जिसका उद्देश्य स्क्रिप्टिंग बटन को जटिल बनाना है।'" p5.button: >- 'p5.js कैनवास में सीधे सरल या स्टाइल वाले बटनों को डिज़ाइन और प्रस्तुत करने के लिए छोटा एक फ़ंक्शन लाइब्रेरी।' @@ -2012,7 +2008,7 @@ community: contributors-conference-title: p5.js योगदानकर्ता सम्मेलन contributors-conference1: >- जबकि अधिकांश कार्य ऑनलाइन होते है, हम IRL भी आयोजित करते हैं। हमने - पिट्सबर्ग, पेंसिल्वेनिया में + पिट्सबर्ग, पेंसिल्वेनिया में contributors-conference2: >- कार्नेगी मेलन विश्वविद्यालय में योगदानकर्ताओं के दो सम्मेलन आयोजित किए। कलाकार, डिजाइनर, डेवलपर्स, शिक्षक p5.js परियोजना को आगे बढ़ाने के लिए एक साथ @@ -2194,7 +2190,7 @@ community: and Access via Translation. It provides space for contributors of p5.js and experienced practitioners from outside OSSTA projects to share their knowledge, perspectives, and dreams for building greater access to - technical and arts spaces. + technical and arts spaces. 2022-p5js-access-day-recap-video: p5.js Access Day 2022 Recap Video 2022-p5js-access-day-recap-video-asl: p5.js Access Day 2022 Recap Video with ASL Interpretation 2022-p5js-access-day-moderator: Moderator @@ -2466,7 +2462,7 @@ showcase: project-a-5-1-qianqian: 'I am very excited about ' project-a-5-2-qianqian: ' in LA.' creator-from-phuong: 'From Kyiv, Ukraine' - project-a-1-1-phuong: 'I''m a creative coder and designer, a ' + project-a-1-1-phuong: "I'm a creative coder and designer, a " link-1-phuong: Play Airi Flies! link-2-phuong: Code for AiriFlies on GitHub link-3-phuong: More info in Phuong Ngo's portfolio @@ -2565,7 +2561,7 @@ showcase: great about making sure the project is a learning resource and not just a collection of examples. project-a-3-1-casey-louise: 'Casey: Does ' - project-a-3-2-casey-louise: ' count as a feature? I also love having the ability to share my programs on the web so that people don''t have to install special software or come to NYC to see my work.' + project-a-3-2-casey-louise: " count as a feature? I also love having the ability to share my programs on the web so that people don't have to install special software or come to NYC to see my work." project-a-3-3-casey-louise: 'Louise: My favorite feature is ' project-a-3-4-casey-louise: ' and ' project-a-3-5-casey-louise: ' for transformation of the coordinate system to make generative visuals.' @@ -2589,7 +2585,7 @@ showcase: openframeworks-book-casey-louise: openFrameworks book project-a-4-7-casey-louise: ' is written. A fun "hey, it’s not hard and you can do it too" approach is what we believe in.' project-a-5-1-casey-louise: 'Check out the ' - project-a-5-2-casey-louise: ' to explore our peers'' amazing grant projects!' + project-a-5-2-casey-louise: " to explore our peers' amazing grant projects!" pronouns-nonbinary: (they/them) creator-from-moon: 'From Athens, Georgia' posters-by: Posters By @@ -2799,7 +2795,7 @@ teach: teach-case11-content5: >- We used p5.js Web editor and code examples on the website. We also used dice, playing cards and various paper tools to help students learn about - coding concepts. + coding concepts. teach-case12-title: Digital Weaving & Physical Computing Workshop Series teach-case12-lead-name: Qianqian Ye teach-case12-image-alt: In-class photo @@ -2819,7 +2815,7 @@ teach: teach-case13-title: p5.js à l'Ubuntu Party! teach-case13-lead-name: Basile Pesin teach-case13-content1: '2020 Ubuntu Party ' - teach-case13-content1-1: 'Cité des Sciences et de l''''Industrie, Paris, France' + teach-case13-content1-1: "Cité des Sciences et de l''Industrie, Paris, France" teach-case13-content2: 'Any age, including children and parents, young and older adults.' teach-case13-content3: Advanced teach-case13-content4: >- diff --git a/src/data/it.yml b/src/data/it.yml index 1169011ee6..20f4fe9272 100644 --- a/src/data/it.yml +++ b/src/data/it.yml @@ -31,7 +31,7 @@ home: blmnamelistending: 'e tanti altri, troppi da elencare qui...' blmstatement1: >- Questo sito è attualmente offline, come piccolo segno di rispetto e di - solidarietà. La + solidarietà. La blmstatement2: rimane disponibile. blmstatement3: 'Please consider donating to ' blacklivesmatter: Black Lives Matter @@ -91,7 +91,7 @@ copyright: copyright-title: Informazioni di Copyright copyright1: >- La libreria p5.js è software libero; lo si può redistribuire e/o modificare - in base ai termini della + in base ai termini della copyright2: ' come pubblicata dalla Free Software Foundation, versione 2.1.' copyright3: 'La sezione Riferimenti è sotto una licenza ' copyright4: ' il che permette di riusare questo contenuto per fini non commerciali, se si concede il dovuto riconoscimento.' @@ -111,7 +111,7 @@ get started: hosted-title: Utilizzare una versione hosted della libreria p5.js download1: >- Il modo più semplice per iniziare è usando l'esempio vuoto incluso nel - download del + download del download2: p5.js completo download3: . download4: >- @@ -121,7 +121,7 @@ get started: download5: >- In alternativa, puoi linkare ad un file p5.js online. Tutte le versioni di p5.js sono salvate in un CDN (Content Delivery Network). Puoi trovare la - cronologia di queste versioni nel + cronologia di queste versioni nel download6: '. In questo caso puoi modificare il link in:' download7: 'Una pagina HTML d'esempio potrebbe essere simile a questa:' download8: 'Può anche iniziare con questo ' @@ -129,7 +129,7 @@ get started: environment-title: Ambiente di sviluppo environment1: >- Per eseguire p5.js sul tuo computer avrai bisogno di un editor di testo. - Puoi usare l' + Puoi usare l' environmentlink: 'https://it.wikipedia.org/wiki/Editor_di_testo' environment2: ' editor ' environment3: 'che preferisci. Le istruzioni per la configurazione di ' @@ -137,7 +137,7 @@ get started: environment5: ' e ' environment6: >- Se utilizzi uno screen reader e non usi il p5 web editor, ti consigliamo di - scegliere + scegliere environment7: ' o ' environment8: >- Avvia Sublime. Vai sul menu File e clicca Open... e seleziona la cartella in @@ -146,7 +146,7 @@ get started: nella cartella in basso. environment9: >- Clicca sul tuo file sketch.js e questo si aprirà sulla destra, dove potrai - modificarlo. + modificarlo. environment10: il codice di avvio p5 nell'editor sublime. environment11: >- Apri il file index.html con il tuo browser facendo doppio-click su di esso o @@ -169,7 +169,7 @@ get started: your-first-sketch6: >- Se stai usando uno screen reader, devi attivare gli output accessibili nell'editor, al di fuori dell'editor devi aggiungere la libreria - di accessibilità al tuo html. Per saperne di più visita il + di accessibilità al tuo html. Per saperne di più visita il your-first-sketch7: tutorial per usare p5 con uno screen reader your-first-sketch8: >- Se hai scritto tutto correttamente, ti apparirà questo sulla finestra di @@ -246,7 +246,7 @@ download: complete-library-title: Libreria completa complete-library-intro1: >- Questo download comprende il file della libreria p5.js, la componente - aggiuntiva p5.sound, e un progetto esempio. Non contiene un editor. Visita + aggiuntiva p5.sound, e un progetto esempio. Non contiene un editor. Visita complete-library-intro2: Iniziare complete-library-intro3: ' per imparare a impostare un progetto p5.js.' p5.js-complete: p5.js completo @@ -272,7 +272,7 @@ download: support-1: >- We need your help! p5.js è gratuito e open-source. Vogliamo rendere la nostra community il più aperta e inclusiva possibile. You can support this work by making a donation to - the + the support-2: >- , the organization that supports p5.js. Your donation supports software development for p5.js, education resources @@ -342,7 +342,7 @@ learn: learn-title: Imparare learn1: >- Questi tutorial forniscono una panoramica più precisa e step-by-step di - determinati argomenti. Dai un'occhiata alle + determinati argomenti. Dai un'occhiata alle learn2: pagine di esempio" learn3: per scoprire brevi dimostrazioni su vari argomenti p5.js. introduction-to-p5js-title: Introduzione a p5.js @@ -383,13 +383,13 @@ learn: add labels into your code that instruct the screen reader on how to describe certain elements within your canvas. labeling-canvases-what-is-labeling-3: >- - For more information about p5.js screen reader accessibility, please read + For more information about p5.js screen reader accessibility, please read labeling-canvases-available-labels: Screen reader labels for p5.js labeling-canvases-available-labels-1: p5.js offers four different functions for labeling your canvas labeling-canvases-available-labels-li-1: >- describe() provides an overall description of the canvas contents. This function's parameters include: text, which affords a string of text for the label; and display, an optional parameter to set the visibility of the label. - labeling-canvases-available-labels-li-2: >- + labeling-canvases-available-labels-li-2: >- describeElement() describes a specific element or a specific grouping of elements in a canvas. This function's parameters include: name, which affords a string naming the element described; text, which affords a string of text as the label description; and display, an optional parameter to set the visibility of the label. @@ -529,11 +529,11 @@ learn: getting-started-in-webgl-title: Getting Started in WebGL getting-started-in-webgl-coords-and-transform-title: Coordinates and Transformations getting-started-in-webgl-coords-and-transform: Basics of 3D setup, coordinates, and transformations - getting-started-in-webgl-coords-and-transform-p1x1: >- + getting-started-in-webgl-coords-and-transform-p1x1: >- p5.js is a powerful tool for creating 2D graphics but it's also capable of 3D graphics. To get started in 3D there are some new concepts to learn and this document will introduce some ideas that will be important to any 3D sketch. - getting-started-in-webgl-coords-and-transform-toc-title: Table of Contents + getting-started-in-webgl-coords-and-transform-toc-title: Table of Contents getting-started-in-webgl-coords-and-transform-toc1: What is WebGL getting-started-in-webgl-coords-and-transform-toc2: 3D Coordinate Space getting-started-in-webgl-coords-and-transform-toc3: Transformations @@ -541,27 +541,27 @@ learn: getting-started-in-webgl-coords-and-transform-toc5: Basic Shapes in 3D getting-started-in-webgl-coords-and-transform-toc6: Conclusion getting-started-in-webgl-coords-and-transform-heading1: What is WebGL - getting-started-in-webgl-coords-and-transform-p2x1: >- + getting-started-in-webgl-coords-and-transform-p2x1: >- WebGL is a library that gives us the tools we need to create 3D graphics within a web browser. To put it simply, it allows us to do all kinds of math that help arrange and display objects in 3D. p5.js makes it easier to work with WebGL through its special WebGL mode. - getting-started-in-webgl-coords-and-transform-p3x1: >- - Working in 3D introduces a lot of complexity, especially when a sketch involves motion, texture, lighting, and - more. Luckily for us, computers have special hardware that is particularly - well suited to performing those calculations, the graphics processing unit (GPU). The GPU is capable of - processing many things simultaneously, which is especially important when we're dealing with pixels and many shapes in space. - getting-started-in-webgl-coords-and-transform-p4x1: >- + getting-started-in-webgl-coords-and-transform-p3x1: >- + Working in 3D introduces a lot of complexity, especially when a sketch involves motion, texture, lighting, and + more. Luckily for us, computers have special hardware that is particularly + well suited to performing those calculations, the graphics processing unit (GPU). The GPU is capable of + processing many things simultaneously, which is especially important when we're dealing with pixels and many shapes in space. + getting-started-in-webgl-coords-and-transform-p4x1: >- Let's get started by setting up the p5.js to use WebGL, by passing a third parameter into createCanvas(). getting-started-in-webgl-coords-and-transform-heading2: >- 3D Coordinate Space: Positioning in 3D getting-started-in-webgl-coords-and-transform-info1x1: >- If coordinates systems aren't making sense it might be helpful to revisit the tutorial titled Coordinate System and Shapes. - getting-started-in-webgl-coords-and-transform-p5x1: >- + getting-started-in-webgl-coords-and-transform-p5x1: >- One of the most fundamental differences between working in 2D and working in 3D is the most obvious: there is one more dimension to work with. In addition to the horizontal and vertical position (x and y axes) of an - element in our drawing, 3D adds depth, the z-axis. - getting-started-in-webgl-coords-and-transform-p6x1: >- + element in our drawing, 3D adds depth, the z-axis. + getting-started-in-webgl-coords-and-transform-p6x1: >- When drawing in 2D, the point (0,0) is located at the top left corner of the screen. In WebGL mode, the origin of the sketch (0,0,0) is located in the middle of the screen. By default, the x-axis goes left-to-right, y-axis goes up-to-down, and the z-axis goes from further-to-closer. @@ -611,7 +611,7 @@ learn: getting-started-in-webgl-coords-and-transform-p13x1: >- Something that can feel unpredictable at first is the order of transformations. Each transformation always affects the next one. For example, if rotate() is called, followed by translate(), the direction of that translation will - be affected by the rotation. The entire coordinate system is rotating and moving, not just the shape itself. + be affected by the rotation. The entire coordinate system is rotating and moving, not just the shape itself. getting-started-in-webgl-coords-and-transform-p14x1: >- Transformations can be performed in any order, but using translate, rotate, and then scale will be the most intuitive. Translation, followed by rotation, produces the effect of moving the shape and then rotating around that new location. @@ -632,7 +632,7 @@ learn: can get complicated and difficult to follow. Consider this following example, which places two boxes in our sketch. To position the second box without push() and pop(), you have to account for the first transformation. This - can be a lot to keep track of in a more complex 3D scene. + can be a lot to keep track of in a more complex 3D scene. getting-started-in-webgl-coords-and-transform-p17x1: >- Now, let's try the same code with push() and pop(). Now we can just translate the object where we want it, without @@ -648,13 +648,13 @@ learn: getting-started-in-webgl-coords-and-transform-p18x1: >- In the below example, try removing push() and pop() to see how the transformations affect the second object - that is drawn. + that is drawn. getting-started-in-webgl-coords-and-transform-heading5: >- Basic Shapes in 3D - getting-started-in-webgl-coords-and-transform-p19x1: >- + getting-started-in-webgl-coords-and-transform-p19x1: >- So far we have only been using box() but p5.js has seven different predefined geometries that you can use in your sketch. These basic predefined geometries are often referred to as 'primitives'. - getting-started-in-webgl-coords-and-transform-p20x1: >- + getting-started-in-webgl-coords-and-transform-p20x1: >- These primitive shape methods are: box(), plane(), sphere(), @@ -662,7 +662,7 @@ learn: cone(), cylinder(), and torus(). - getting-started-in-webgl-coords-and-transform-p21x1: >- + getting-started-in-webgl-coords-and-transform-p21x1: >- It is also possible to create custom geometry, either from scratch or from 3D models created in another program. More information about custom geometry can be found the Custom @@ -703,7 +703,7 @@ learn: If you are new to 3D check out the Coordinates and Transformations tutorial. - getting-started-in-webgl-custom-geometry-toc-title: Table of Contents + getting-started-in-webgl-custom-geometry-toc-title: Table of Contents getting-started-in-webgl-custom-geometry-toc1: Loading 3D Models from File getting-started-in-webgl-custom-geometry-toc2: Creating Basic Procedural Geometry getting-started-in-webgl-custom-geometry-toc3: Conclusion @@ -734,7 +734,7 @@ learn: these methods can be used to construct a 3D shape mathematically. getting-started-in-webgl-custom-geometry-p6x1: >- There is also a powerful class, p5.Geometry, which p5 uses internally for loadModel() but can also be used to - define custom geometry, offering tools that can be helpful in calculating faces and normals. + define custom geometry, offering tools that can be helpful in calculating faces and normals. getting-started-in-webgl-custom-geometry-p6x2: >- In 3D, a face refers to a collection of three or four points that make up a surface, giving our geometry the appearance of being solid. A normal is the direction that is perpendicular to the face, which helps p5.js calculate lighting across the surface. @@ -756,13 +756,13 @@ learn: STL (most often standing for "standard tesselation language") is a file format for 3D models. It only stores information about the geometry. getting-started-in-webgl-custom-geometry-glossary-term4-title: OBJ - getting-started-in-webgl-custom-geometry-glossary-term4-definition: >- + getting-started-in-webgl-custom-geometry-glossary-term4-definition: >- OBJ is an open file format that stores geometry data as well as some material and texture data. In p5.js, we are limited to its geometry, although an image can still be mapped to the surface using textures. getting-started-in-webgl-custom-geometry-glossary-term5-title: Faces getting-started-in-webgl-custom-geometry-glossary-term5-definition: The solid surface that is generated between three points. getting-started-in-webgl-custom-geometry-glossary-term6-title: Normals - getting-started-in-webgl-custom-geometry-glossary-term6-definition: The direction that is perpendicular to a face, which is often needed when calculating lighting or using materials. + getting-started-in-webgl-custom-geometry-glossary-term6-definition: The direction that is perpendicular to a face, which is often needed when calculating lighting or using materials. getting-started-in-webgl-custom-geometry-glossary-term7-title: Normalization getting-started-in-webgl-custom-geometry-glossary-term7-definition: Changing something so that it fits within a standard range. getting-started-in-webgl-appearance-title: Styling and Appearance @@ -771,7 +771,7 @@ learn: Creating in 3D is about more than just geometry. Cameras, lights, and materials are an important part of creating a visually interesting 3D scene. p5.js has a number of tools that make it possible to transform the appearance of our geometry. - getting-started-in-webgl-appearance-toc-title: Table of Contents + getting-started-in-webgl-appearance-toc-title: Table of Contents getting-started-in-webgl-appearance-toc1: Camera and View getting-started-in-webgl-appearance-toc2: Lighting getting-started-in-webgl-appearance-toc3: Materials and Textures @@ -786,7 +786,7 @@ learn: getting-started-in-webgl-appearance-p2x1: >- A perspective camera skews objects so they appear to get smaller as they get further away, vanishing at a single point in the distance. This is in contrast to an orthographic camera, where the - geometry stays the same size as it gets further away and has no vanishing point. + geometry stays the same size as it gets further away and has no vanishing point. getting-started-in-webgl-appearance-p3x1: >- One setting that we can change with a perspective camera is the field-of-view, or FOV. This is the term that is used to describe how much our camera can see, measured as an angle. In simple examples it might appear @@ -842,7 +842,7 @@ learn: varied, making objects shiny, rough, or even textured with images. getting-started-in-webgl-appearance-p11x1: >- In this interactive example, try selecting each of the different materials to see how they - affect the appearance of the geometry. You can move your mouse and see the effect that a directional light has on the material. + affect the appearance of the geometry. You can move your mouse and see the effect that a directional light has on the material. getting-started-in-webgl-appearance-p12x1: >- Try commenting and uncommenting the different lights in this example: getting-started-in-webgl-appearance-p13x1: >- @@ -853,7 +853,7 @@ learn: getting-started-in-webgl-appearance-info1x1: >- While they are useful for changing the appearance of your geometry, shaders are a bit beyond the scope of this tutorial, so make sure to check out the Introduction to Shaders - page when you are ready. + page when you are ready. getting-started-in-webgl-appearance-heading4: Conclusion getting-started-in-webgl-appearance-p14x1: >- Being able to have control over the camera, lighting, and materials will give you much more flexibility @@ -888,7 +888,7 @@ learn: generating noise, applying filters like blur, or shading polygons. Shader programming can feel daunting at first, requiring a different approach than the 2D drawing of p5.js. This document will outline the basics of shader programming and point you towards other resources. - getting-started-in-webgl-shaders-toc-title: Table of Contents + getting-started-in-webgl-shaders-toc-title: Table of Contents getting-started-in-webgl-shaders-toc1: Setup getting-started-in-webgl-shaders-toc2: Shading Language (GLSL) getting-started-in-webgl-shaders-toc3: Uniforms @@ -1042,7 +1042,7 @@ learn: getting-started-in-webgl-shaders-glossary-term12-title: Fragment Shader getting-started-in-webgl-shaders-glossary-term12-definition: >- The part of a shader program that is responsible for the color and appearance of each pixel output by the - shader. + shader. color-title: Colore color: Una introduzione ai colori digitali. coordinate-system-and-shapes-title: Sistema di Coordinate e Figure @@ -1092,17 +1092,18 @@ learn: writing-a-tutorial-how-start-title: 'Come iniziare:' writing-a-tutorial-how-start-1: >- Verifica che l'argomento da te proposto non sia stato già trattato. - C'è + C'è writing-a-tutorial-how-start-2: uno spreadsheet writing-a-tutorial-how-start-3: >- - che tiene traccia dei tutorial in lavorazione. Se l'argomento da te + che tiene traccia dei tutorial in lavorazione. Se l'argomento da te scelto è nella lista dei tutorial già iniziati, puoi sempre arricchire un lavoro in corso d'opera e contribuire preparando un tutorial già esistente alla pubblicazione, quindi non esitare a contattarci. writing-a-tutorial-how-start-4: >- - Se il tuo argomento non è già stato affrontato o iniziato, scrivi qualche + Se il tuo argomento non è già stato affrontato o iniziato, scrivi qualche frase per spiegare quale tema proponi di trattare e inviaci questa descrizione per email a education@p5js.org. + writing-a-tutorial-how-prepare-title: 'Come preparare un tutorial p5.js per la pubblicazione online:' writing-a-tutorial-how-prepare-1: >- Quando sei pronto per pubblicare il tuo tutorial, segui i passaggi seguenti @@ -1114,13 +1115,13 @@ learn: come quella qui sotto: writing-a-tutorial-how-prepare-5: >- La cartella contenente il tuo tutorial verrà verrà posizionata nella - cartella "tutorial" del sito p5.js. Il file index.hbs è la + cartella "tutorial" del sito p5.js. Il file index.hbs è la writing-a-tutorial-how-prepare-6: 'pagina iniziale dei tutorial p5.js,' writing-a-tutorial-how-prepare-7: ' e il file test-tutorial.hbs è il test di prova.' writing-a-tutorial-how-prepare-8: Tutto il contenuto deve essere incluso nei tag writing-a-tutorial-how-prepare-9: >- della pagina, e formattato con i tag <h1>, <h2> e i tag di - paragrafo <p> come mostrato nella + paragrafo <p> come mostrato nella writing-a-tutorial-how-prepare-10: pagina del tutorial di prova. writing-a-tutorial-how-prepare-11: >- Se il tuo tutorial contiene immagini, queste devono essere inserite nella @@ -1149,7 +1150,7 @@ learn: writing-a-tutorial-iframe-1: >- Un iframe è come creare una finestra attraverso cui puoi vedere un'altra pagina, isolata dal resto della tua pagina. In questo caso - sarà una finestra sul file index.html che contiene il tuo sketch p5.js. + sarà una finestra sul file index.html che contiene il tuo sketch p5.js. writing-a-tutorial-iframe-2: >- Metti i tuoi sketch p5 nella cartella /src/assets/learn del sito, in una cartella etichettata con il nome del tuo sketch, come mostrato nello @@ -1157,7 +1158,7 @@ learn: collegati all'iframe. writing-a-tutorial-iframe-3: >- Nelle sottocartelle contenenti il tuo esempio p5 deve esserci un file - sketch.js e un file embed.html per lo sketch. + sketch.js e un file embed.html per lo sketch. writing-a-tutorial-iframe-4: >- Assicurati che il tuo file embed.html abbia i percorsi corretti delle librerie p5 del sito. Se la struttura dei tuoi file è uguale a quella di cui @@ -1166,7 +1167,7 @@ learn: writing-a-tutorial-iframe-5: >- Una volta verificato questo, puoi includere i file "index" di p5.js come iframe nel file .hbs che contiene il contenuto del tuo tutorial. Il codice - di incorporamento per l'iframe sarà quindi: + di incorporamento per l'iframe sarà quindi: writing-a-tutorial-iframe-6: 'Styling dell'iframe (direttamente nel file o nel foglio di stile): ' writing-a-tutorial-iframe-7: 'Qui puoi trovare lo sketch puro in esecuzione: ' writing-a-tutorial-iframe-8: 'E qui è incorporato nel sito p5 usando il seguente codice: ' @@ -1181,7 +1182,7 @@ learn: chiama embed.html). writing-a-tutorial-iframe-11: >- Ulteriori informazioni sull'incorporamento di sketch p5.js sono - disponibili + disponibili writing-a-tutorial-embed-iframe-12: qui. writing-a-tutorial-finishing-title: Ultimi dettagli writing-a-tutorial-finishing-1: >- @@ -1194,7 +1195,7 @@ learn: Questo tutorial è preso dal libro Learning Processing di Daniel Shiffman, pubblicato da Morgan Kaufmann, © 2008 Elsevier Inc. Tutti i diritti riservati. È stato trascritto in p5 da Kelly Chang. Se trovi qualche errore - o hai commenti, + o hai commenti, color-description2: ' faccelo sapere.' color-p1x1: >- Nel mondo digitale, quando vogliamo parlare di un colore, è necessaria la @@ -1217,7 +1218,7 @@ learn: color-p3x3: >- . Istintivamente potremmo pensare di usare "stroke(0)" per eliminare il contorno, ma è importante tenere a mente che 0 non significa "niente", bensì - indica il colore nero. Inoltre, ricorda di non eliminare entrambi: con + indica il colore nero. Inoltre, ricorda di non eliminare entrambi: con color-p3x4: ' e ' color-p3x5: ', non apparirà nulla!' color-p4x1: >- @@ -1274,7 +1275,7 @@ learn: Il modello RGB con valori tra 0 e 255 non è l'unico modo per definire i colori in p5.js, che infatti ci permette di utilizzare più metodi. Per esempio, potremmo preferire una gamma di colori che va dallo 0 a 100 (come - una percentuale). Per fare questo puoi usare + una percentuale). Per fare questo puoi usare color-custom-ranges-p2x1: >- La funzione qui sopra dice: "OK, dobbiamo usare i valori rosso, verde e blu per definire i colori. I loro valori saranno compresi tra 0 e 100" @@ -1357,7 +1358,7 @@ learn: coordinate-system-simple-shapes-p6x1: >- Un secondo modo per disegnare un rettangolo consiste nello specificare il punto centrale, con la larghezza e l'altezza. Se preferiamo questo - metodo, indichiamo innanzitutto che vogliamo usare la modalità + metodo, indichiamo innanzitutto che vogliamo usare la modalità coordinate-system-simple-shapes-p6x2: ' prima delle istruzioni per il rettangolo stesso. Si noti che p5 è sensibile al maiuscolo / minuscolo.' coordinate-system-simple-shapes-p7x1: >- Infine, possiamo anche disegnare un rettangolo con due punti (l'angolo @@ -1367,11 +1368,11 @@ learn: dell'esempio sopra. coordinate-system-simple-shapes-p8x1: >- Quando avremo preso confidenza con il concetto di disegnare un rettangolo, - un + un coordinate-system-simple-shapes-p8x2: ' è un gioco da ragazzi. In effetti, è identica a ' coordinate-system-simple-shapes-p8x3: >- con la differenza che l'ellisse è disegnata dove dovrebbe essere la - casella contenente il rettangolo. La modalità predefinita per + casella contenente il rettangolo. La modalità predefinita per coordinate-system-simple-shapes-p8x4: ' è ' coordinate-system-simple-shapes-p8x5: ', invece di ' coordinate-system-simple-shapes-p8x6: . @@ -1536,7 +1537,7 @@ community: in-practice-title: 'In pratica:' in-practice1: >- Non siamo programmatori snob. Non assumiamo conoscenze preliminari o - supponiamo che ci siano cose che tutti dovrebbero sapere. + supponiamo che ci siano cose che tutti dovrebbero sapere. in-practice2: >- Insistiamo nell'essere attivamente coinvolti nelle richieste di feedback, indipendentemente dalla loro complessità. @@ -1596,7 +1597,7 @@ community: contributors-conference-title: Conferenza dei Collaboratori di p5.js contributors-conference1: >- Sebbene la maggior parte del lavoro avvenga online, ci incontriamo anche di - persona. Abbiamo tenuto due conferenze dei contribuenti al + persona. Abbiamo tenuto due conferenze dei contribuenti al contributors-conference2: >- alla Carnegie Mellon University di Pittsburgh, Pennsylvania. Artisti, designer, sviluppatori, e educatori si sono riuniti per promuovere lo @@ -1645,7 +1646,7 @@ community: 2015contributors-conference-diversity6: ', ' 2015contributors-conference-diversity7: >- il panel si è svolto martedì 25 maggio 2015 nell'auditorium di Kresge - alla Carnegie Mellon University. Gli speaker sono stati + alla Carnegie Mellon University. Gli speaker sono stati 2015contributors-conference-diversity8: e 2015contributors-conference-diversity9: . 2015cc_1: >- @@ -1665,7 +1666,7 @@ community: adesive su di essa mentre una studentessa parla al microfono 2015cc_8: >- I partecipanti si siedono intorno a un tavolo a guardare l'altro laptop - e confrontare il codice + e confrontare il codice 2015cc_9: 'Lavagna con note adesive e scritte di colore diverso sulla programmazione ' 2015cc_10: >- Donna che parla al microfono della valutazione di diversi set di abilità @@ -1766,10 +1767,10 @@ community: 2019cc_14: 'L'aula dei partecipanti di fronte a un oratore ascolta attentamente ' 2019cc_15: >- Donna con microfono che parla ai compagni partecipanti con il testo sacred - buondaries nella proiezione dietro di lei + buondaries nella proiezione dietro di lei 2019cc_16: >- Vista dall'alto dei partecipanti che ascoltano un pannello e vedono una - proiezione di un'immagine 3d sulla persona + proiezione di un'immagine 3d sulla persona 2019cc_17: >- I partecipanti si siedono intorno a un tavolo con i loro laptop e osservano il codice su uno schermo @@ -1817,7 +1818,7 @@ books: book-3-authors: 'Benedikt Gross, Hartmut Bohnacker, Julia Laub e Claudius Lazzeroni.' book-3-publisher: >- Pubblicato 30 ottobre 2018, Princeton Architectural Press; Edizione di - ristampa. + ristampa. book-3-pages: '255 pagine. ' book-3-type: Tascabile. book-3-description: >- @@ -1847,10 +1848,10 @@ books: usando JavaScript con la libreria di programmazione p5.js. Le competenze che acquisirai da questo libro sono altamente trasferibili a una miriade di settori e possono essere utilizzate per la costruzione di applicazioni web, - robot programmabili o arte generativa. + robot programmabili o arte generativa. book-5-order-a: Ordina su Apress book-5-order-b: Ordina su Amazon - book-6-title: "Aesthetic Programming: A Handbook of Software Studies" + book-6-title: 'Aesthetic Programming: A Handbook of Software Studies' book-6-authors: 'Winnie Soon, Geoff Cox. ' book-6-publisher: 'Published 2020, Open Humanities Press. ' book-6-pages: '298 pages. ' @@ -1969,11 +1970,11 @@ showcase: (interpolazione lineare) e visualizzare gli elementi visivi nel project-a-2-2-roni-cantor: >- . Ho quindi usato una funzione nel mio codice che ha esportato la mia - grafica programmata in un file + grafica programmata in un file project-a-2-3-roni-cantor: '. Avevo bisogno di un file SVG da dare al plotter (un ' project-a-2-4-roni-cantor: >- ) in modo che capisse dove disegnare le linee che avevo programmato. Ho - inviato queste informazioni al plotter con un programma chiamato + inviato queste informazioni al plotter con un programma chiamato project-a-2-5-roni-cantor: '!' project-q-3: Qual è la tua funzione p5.js preferita? project-a-3-roni-cantor: ' perché le linee sono divertenti e "lerp" è una parola divertente da dire!' @@ -2044,7 +2045,7 @@ showcase: creator-from-phuong: 'Da Kyiv, Ukraine' project-a-1-1-phuong: >- Sono un programmatore creativo e designer, una beneficiaria della borsa di - studio per la diversità della + studio per la diversità della link-1-phuong: Gioca a Airi Flies! link-2-phuong: Codice di AiriFlies su GitHub link-3-phuong: Maggiori informazioni sul portfolio di Phuong Ngo @@ -2056,7 +2057,7 @@ showcase: project-a-2-1-phuong: >- Ho usato p5.js per lavorare sulla parte visiva del gioco. Gli sprite di animazione per Airi e i fantasmi sono stati disegnati su un'app per - iPad chiamata + iPad chiamata project-a-2-2-phuong: ' e poi integrati nel codice ' project-a-2-3-phuong: . Ho usato principalmente esempi di p5.play come riferimento. project-a-2-4-phuong: 'Per lo sfondo a scorrimento infinito, ho trovato uno ' @@ -2071,7 +2072,7 @@ showcase: project-a-2-7-phuong: ' (al momento esiste una versione beta non ancora disponibile al pubblico, ma lo sarà molto presto!). Ho aggiunto circa 120 campioni dei miei compagni di classe che dicevano la parola "pew" con diverse intonazioni e 80 campioni di rumore di fondo per addestrarlo. Quindi ho integrato il modello nel gioco con ' project-a-3-1-phuong: >- Adoro la facilità con cui puoi creare, manipolare ed eliminare blocchi e - classi HTML con la + classi HTML con la project-a-3-2-phuong: ' tramite ' project-a-3-3-phuong: ' etc. Ma la mia funzione preferita è ' project-a-3-4-phuong: ', poiché è qui che avviene la magia.' @@ -2101,7 +2102,7 @@ showcase: Quest'estate mi sono sfidato a realizzare poster tipografici con la programmazione, e questo è uno dei poster che ho realizzato. Fino a poco tempo fa non sapevo che avrei potuto utilizzare i dati del sensore di - movimento con p5.js. Stavo anche guardando + movimento con p5.js. Stavo anche guardando dan-shiffman-matterjs-tutorial: i video tutorial di Dan Shiffman sul matter.js project-a-2-2-chung: >- , al che ho pensato: perché non unire le due cose e mettere in pratica ciò @@ -2109,7 +2110,7 @@ showcase: project-a-3-1-chung: >- Ci sono molte cose che amo di p5.js come la community online e l'accoglienza e la comprensione riservate ai principianti. Quello che - mi piace davvero in questo momento è il + mi piace davvero in questo momento è il project-a-3-2-chung: >- , con cui non solo posso lavorare online per me stesso, ma anche condividere rapidamente gli URL. Per questo progetto, in particolare, ho dovuto fare @@ -2117,7 +2118,7 @@ showcase: ad utilizzare GitHub. project-a-4-1-chung: >- Ho avuto qualche difficoltà con la gestione di font, canale alfa e - profondità z nella modalità + profondità z nella modalità project-a-4-2-chung: >- . Non sono ancora completamente soddisfatto di tutte le mie decisioni. Ma in generale, è stato utile cercare nel forum e non dimenticare di scomporre i @@ -2125,11 +2126,11 @@ showcase: problemi nel rendering dei file video direttamente da p5.js. La registrazione dello schermo non era un'opzione a causa di cadute di frequenza dei fotogrammi intermittenti (il mio laptop è piuttosto lento). - Dopo aver fatto qualche ricerca, ho deciso di imparare i fondamenti di + Dopo aver fatto qualche ricerca, ho deciso di imparare i fondamenti di project-a-4-3-chung: ' e costruire un tool da solo.' project-a-5-1-chung: >- Come accennato in precedenza, se desiderate eseguire il rendering di frame e - file video dagli sketch p5.js, consultate il mio + file video dagli sketch p5.js, consultate il mio project-a-5-2-chung: ' e fatemi sapere cosa ne pensate.' creator-from-casey-louise: 'Da New York, New York' project-a-1-1-casey-louise: >- @@ -2141,7 +2142,7 @@ showcase: tecnologie dei sensori. project-a-1-3-casey-louise: >- Casey: Ho iniziato a studiare p5.js nel 2018 nel mio primo semestre presso - ITP, anche se mi dilettavo con + ITP, anche se mi dilettavo con project-a-1-4-casey-louise: ' dal 2012. Sono stato introdotto a Processing dal mio amico Pedro mentre studiavo graphic design e mi ha fatto impazzire. L'idea di creare i miei strumenti per la creazione di grafica e arte interattiva ha suscitato il mio interesse, ma una volta che l'ho provato, sono rimasto entusiasta. Il primo progetto che ricordo è un occhio che ti seguiva nello schermo e si intristiva quando lo lasciavi da solo.' project-a-1-5-casey-louise: >- Louise: Inizialmente ho imparato p5.js per rendere un sito Web che stavo @@ -2151,7 +2152,7 @@ showcase: Casey: Rimandavo l'apprendimento degli shader da molto tempo, ed ero anche curioso di poterli usare in p5.js. Poi ho sentito parlare di una sovvenzione per progetti open source, di storytelling e di risorse di - apprendimento all'ITP chiamata + apprendimento all'ITP chiamata project-a-2-2-casey-louise: >- . Dato che non trovavo molto sulla documentazione di p5.js + shader, ho deciso di capire come sono implementati in p5.js e creare una risorsa dove @@ -2167,7 +2168,7 @@ showcase: project-a-4-1-casey-louise: >- Casey: L'inizio del progetto (capire come funzionano le cose) è consistito nel raggiungere persone straordinarie, porre domande e chiedere - il permesso di utilizzare i loro esempi nel nostro progetto. + il permesso di utilizzare i loro esempi nel nostro progetto. adam-ferris-repo-casey-louise: La repository GitHub di Adam Ferriss project-a-4-2-casey-louise: ' ci ha davvero dato le fondamenta per capire come funzionano gli shader in p5.js e ci ha fornito un quadro di esempi accessibili su cui basarci. Per alcuni problemi specifici relativi a p5.js che stavamo riscontrando, abbiamo contattato ' project-a-4-3-casey-louise: ' e ' @@ -2180,7 +2181,7 @@ showcase: GitHub di Adam Ferriss. Il nostro obiettivo era farlo in modo che un principiante potesse capire come implementarlo, quindi era sia una sfida tecnica che una sfida nell'insegnamento del codice a estranei e - principianti. Qui abbiamo tratto ispirazione dal modo in cui è scritto il + principianti. Qui abbiamo tratto ispirazione dal modo in cui è scritto il openframeworks-book-casey-louise: openFrameworks book project-a-4-7-casey-louise: >- . Crediamo in un approccio del tipo "ehi, non è difficile e puoi farlo anche diff --git a/src/data/ko.yml b/src/data/ko.yml index c06a73b8b8..00c66179ca 100644 --- a/src/data/ko.yml +++ b/src/data/ko.yml @@ -99,10 +99,10 @@ get started: download11: 'http://localhost:{당신의-포트(port)-넘버}/empty-example' download4: >- 다운로드 파일 중, index.html 파일에는 p5.js 링크가 적혀있습니다. 로딩 시간을 단축하려면 해당 p5.js 링크를 그 간략 - 버전인 p5.min.js로 아래와 같이 변경하면 됩니다. + 버전인 p5.min.js로 아래와 같이 변경하면 됩니다. download5: >- p5.js 파일의 온라인 링크를 직접 입력하는 방법도 있습니다. p5.js의 모든 버전은 CDN(Content Delivery - Network)에 저장되어 있으며, 버전 히스토리는 여기서 확인할 수 있습니다: + Network)에 저장되어 있으며, 버전 히스토리는 여기서 확인할 수 있습니다: download6: '. 링크를 다음과 같이 변경해보세요:' download7: '아래는 HTML 페이지 샘플입니다:' environment-title: 개발 환경 @@ -135,11 +135,11 @@ get started: your-first-sketch1: 'After ' your-first-sketch2: >- 위의 코드를 설명하자면 다음과 같습니다: "좌측 상단 모서리로부터 아래로 50px, 오른쪽으로 50px 떨어진 점을 중심으로 타원을 - 그린다. 타원의 너비와 높이는 모두 80px로 한다." + 그린다. 타원의 너비와 높이는 모두 80px로 한다." your-first-sketch3: '스케치를 저장한 뒤 브라우저를 새로고침하면, 입력한 코드에 문제가 없는 한, 다음과 같은 화면을 볼 수 있습니다:' your-first-sketch4: >- 주의: 스크린 리더를 사용하는 경우, p5 웹에디터에서 접근성 모드 출력(Accessible Outputs)을 활성화해야 합니다. 별도의 - 에디터를 사용하는 경우, 접근성 라이브러리를 html 파일에 추가해야 합니다. 자세한 설명은 다음 링크를 참조하세요: + 에디터를 사용하는 경우, 접근성 라이브러리를 html 파일에 추가해야 합니다. 자세한 설명은 다음 링크를 참조하세요: your-first-sketch5: 스크린 리더에서 p5를 사용하는 방법 your-first-sketch6: >- If you are using a screen reader, you must turn on the accessible outputs in @@ -188,7 +188,7 @@ get started: book1: >- 본 튜토리얼의 일부는 로렌 맥카시(Lauren McCarthy), 캐시 리스(Casey Reas), 벤 프라이(Ben Fry), 오라일리(O'Reilly) 저 Getting Started with p5.js 에서 발췌하였습니다. / Make 2015. - Copyright + Copyright download: Download: 다운로드 download-intro: >- @@ -225,7 +225,7 @@ download: 여러분도 p5.js를 지원하는 프로세싱 재단( support-2: >- )에 후원을 통해 이에 동참할 수 있습니다. 여러분의 소중한 후원금은 p5.js 소프트웨어 개발과 더불어 코드 예제 및 튜토리얼을 비롯한 - 교육 자료 제작에 쓰입니다. 또한, 다음과 같은 커뮤니티 활동을 위해서도 쓰입니다 : + 교육 자료 제작에 쓰입니다. 또한, 다음과 같은 커뮤니티 활동을 위해서도 쓰입니다 : support-3: 펠로우십 support-4: ', ' support-5: 커뮤니티 행사. @@ -632,7 +632,7 @@ learn: One of the most fundamental differences between working in 2D and working in 3D is the most obvious: there is one more dimension to work with. In addition to the horizontal and vertical position (x and y axes) of an - element in our drawing, 3D adds depth, the z-axis. + element in our drawing, 3D adds depth, the z-axis. getting-started-in-webgl-coords-and-transform-p6x1: >- When drawing in 2D, the point (0,0) is located at the top left corner of the screen. In WebGL mode, the origin of the sketch (0,0,0) is located in the @@ -707,7 +707,7 @@ learn: example, if rotate() is called, followed by translate(), the direction of that translation will be affected by the rotation. The entire coordinate system is rotating and - moving, not just the shape itself. + moving, not just the shape itself. getting-started-in-webgl-coords-and-transform-p14x1: >- Transformations can be performed in any order, but using translate, rotate, and then @@ -734,7 +734,7 @@ learn: places two boxes in our sketch. To position the second box without push() and pop(), you have to account for the first transformation. This can be a lot to keep track of in a more - complex 3D scene. + complex 3D scene. getting-started-in-webgl-coords-and-transform-p16x2: and getting-started-in-webgl-coords-and-transform-p16x3: >- . push() and pop() make it easier to @@ -750,7 +750,7 @@ learn: Consider this following example, which places two boxes in our sketch. To position the second box without push() and pop(), you have to account for the first transformation. - This can be a lot to keep track of in a more complex 3D scene. + This can be a lot to keep track of in a more complex 3D scene. getting-started-in-webgl-coords-and-transform-p17x1: >- Now, let's try the same code with push() and pop(). Now we can just translate the object where we want @@ -765,7 +765,7 @@ learn: getting-started-in-webgl-coords-and-transform-p18x1: >- In the below example, try removing push() and pop() to see how the transformations affect the second - object that is drawn. + object that is drawn. getting-started-in-webgl-coords-and-transform-heading5: Basic Shapes in 3D getting-started-in-webgl-coords-and-transform-p19x1: >- So far we have only been using box() but p5.js has seven @@ -840,7 +840,7 @@ learn: method, which should be used within preload(). getting-started-in-webgl-custom-geometry-p2x2: >- method, which should be used within preload(). Then you - can use the + can use the getting-started-in-webgl-custom-geometry-p2x3: 'function to draw the model, as demonstrated in the example below.' getting-started-in-webgl-custom-geometry-p3x1: >- A common issue that can come up with custom models is scaling. Depending on @@ -882,11 +882,11 @@ learn: href="{{root}}/reference/#/p5/p5.Geometry">p5.Geometry, which p5 uses internally for loadModel() but can also be used to define custom geometry, offering tools that can be helpful in calculating - faces and normals. + faces and normals. getting-started-in-webgl-custom-geometry-p6x1_: >- , which p5.js uses internally for loadModel() but can also be used to define custom geometry, offering tools that can be helpful - in calculating faces and normals. + in calculating faces and normals. getting-started-in-webgl-custom-geometry-p6x2: >- In 3D, a face refers to a collection of three or four points that make up a surface, giving our geometry the appearance of being solid. A normal is the @@ -948,7 +948,7 @@ learn: A perspective camera skews objects so they appear to get smaller as they get further away, vanishing at a single point in the distance. This is in contrast to an orthographic camera, where the geometry stays - the same size as it gets further away and has no vanishing point. + the same size as it gets further away and has no vanishing point. getting-started-in-webgl-appearance-p3x1: >- One setting that we can change with a perspective camera is the field-of-view, or FOV. This is the term that is used to describe @@ -1024,7 +1024,7 @@ learn: getting-started-in-webgl-appearance-p11x1: >- In this interactive example, try selecting each of the different materials to see how they affect the appearance of the geometry. You can move your - mouse and see the effect that a directional light has on the material. + mouse and see the effect that a directional light has on the material. getting-started-in-webgl-appearance-p12x1: 'Try commenting and uncommenting the different lights in this example:' getting-started-in-webgl-appearance-p13x1: >- More custom materials can be achieved through using Introduction to - Shaders page when you are ready. + Shaders page when you are ready. getting-started-in-webgl-appearance-info1x2: Introduction to Shaders getting-started-in-webgl-appearance-info1x3: 'page when you are ready. ' getting-started-in-webgl-appearance-heading4: Conclusion @@ -1123,7 +1123,7 @@ learn: missing semicolon for example is not allowed and will result in an error message. You can't use different types of numbers, like floats or integers interchangeably. - getting-started-in-webgl-shaders-p6x1: 'First let''s look at a basic vertex shader:' + getting-started-in-webgl-shaders-p6x1: "First let's look at a basic vertex shader:" getting-started-in-webgl-shaders-p7x1: >- This vertex shader begins with an attribute, which p5.js uses to share vertex position information with the shader. This attribute is a - The part of a shader program that is responsible for the color and - appearance of each pixel output by the shader. + appearance of each pixel output by the shader. getting-started-in-webgl-framebuffers-title: Layered Rendering with Framebuffers getting-started-in-webgl-framebuffers: >- Setting up sketches that draw in multiple stages or access 3D depth @@ -1297,7 +1297,7 @@ learn: writing-a-tutorial-how-start-2: 스프레드시트 writing-a-tutorial-how-start-3: >- 에서 확인하세요. 만약 제안하고자 하는 튜토리얼 주제가 현재 진행 중인 것이라면, 해당 주제의 마무리 작업 또는 p5.js 웹사이트상의 - 공개 작업에 참여할 수 있고 관련해서는 아래의 이메일로 연락주시면 감사하겠습니다. + 공개 작업에 참여할 수 있고 관련해서는 아래의 이메일로 연락주시면 감사하겠습니다. writing-a-tutorial-how-start-4: >- 제안하려는 튜토리얼이 스프레드시트 리스트에 포함되지 않는다면, 튜토리얼에 대한 간략한 설명을 education@p5js.org로 보내주세요. @@ -1306,13 +1306,13 @@ learn: writing-a-tutorial-how-prepare-2: '튜토리얼 콘텐츠를 이 ' writing-a-tutorial-how-prepare-3: 기본 구조 writing-a-tutorial-how-prepare-4: '에 따라 tutorial-name.hbs 파일로 변환해주세요. 콘텐츠에는 아래와 같은 헤더(header)가 반드시 포함되어야 합니다:' - writing-a-tutorial-how-prepare-5: '튜토리얼을 포함한 폴더는 p5js 웹사이트 상 ''tutorials'' 폴더에 배치됩니다. index.hbs 파일은 ' + writing-a-tutorial-how-prepare-5: "튜토리얼을 포함한 폴더는 p5js 웹사이트 상 'tutorials' 폴더에 배치됩니다. index.hbs 파일은 " writing-a-tutorial-how-prepare-6: p5.js 튜토리얼 랜딩 페이지 writing-a-tutorial-how-prepare-7: '에 해당하며, test-tutorial.hbs 파일은 테스트 튜토리얼입니다.' writing-a-tutorial-how-prepare-8: 모든 콘텐츠는 페이지상 writing-a-tutorial-how-prepare-9: >- 태그에 포함되어야하며, <h1> 와 <h2> 태그, 그리고 <p> 문단 태그로서 문서 형식이 정의되어야 - 합니다. 형식 예시는 다음의 페이지에서 확인해보세요: + 합니다. 형식 예시는 다음의 페이지에서 확인해보세요: writing-a-tutorial-how-prepare-10: 테스트 튜토리얼 writing-a-tutorial-how-prepare-11: >- 튜토리얼이 이미지 파일을 포함할 경우, p5 웹사이트의 에셋(assets) 폴더에 배치됩니다. 파일 경로는 아래와 같이 @@ -1336,7 +1336,7 @@ learn: writing-a-tutorial-iframe-title: iframe을 사용하여 p5 스케치 임베드하기 writing-a-tutorial-iframe-1: >- iframe은 한 페이지상 다른 페이지를 보기 위해 만드는 창문틀과도 같습니다. 이 창문틀을 따라 페이지상의 다른 내용들로부터 구분되는 - 셈이지요. 이 경우, p5.js 스케치를 포함한 index.html를 보여주는 창문틀의 역할을 합니다. + 셈이지요. 이 경우, p5.js 스케치를 포함한 index.html를 보여주는 창문틀의 역할을 합니다. writing-a-tutorial-iframe-2: >- 스크린샷에 보이듯, p5 웹사이트 /src/assets/learn 폴더에 스케치의 이름을 딴 별도의 폴더를 새로이 생성하여 여러분의 튜토리얼용 p5 스케치를 올리세요. 이 경로를 통해 iframe에서 보여줄 모든 이미지와 p5 스케치가 저장됩니다. @@ -1346,7 +1346,7 @@ learn: 라이브러리 경로는 "../../../js/p5.min.js" 일것 입니다. writing-a-tutorial-iframe-5: >- 그리고나면, 튜토리얼 콘텐츠를 담고 있는 .hbs 파일상 p5js index 파일을 iframe의 형태로 임베드할 수 있습니다. - iframe 임베드를 위한 코드는 다음과 같습니다: + iframe 임베드를 위한 코드는 다음과 같습니다: writing-a-tutorial-iframe-6: 'iframe 서식 바꾸기: ' writing-a-tutorial-iframe-7: 'iframe을 이용한 무제 스케치 작동 확인하기: ' writing-a-tutorial-iframe-8: '위의 스케치가 p5 site에 임베드된 모습: ' @@ -1366,7 +1366,7 @@ learn: color-description1: >- 이 튜토리얼은 다니엘 쉬프만(Daniel Shiffman) 저, 모건 카우프만(Morgan Kaufmann) 출판 도서 Learning Processing에서 발췌하였습니다 © 2008 Elsevier Inc. 또한, 발췌본은 켈리 장(Kelly Chang)에 의해 p5로 - 옮겨졌습니다. 오류를 발견하거나 의견을 남기고 싶다면 + 옮겨졌습니다. 오류를 발견하거나 의견을 남기고 싶다면 color-description2: 언제든 알려주세요. color-p1x1: >- 디지털 세상에서 색상에 대해 이야기할 땐, 아주 정밀한 표현이 필요합니다. 아쉽게도, "푸른빛의 초록색 원을 만들 수 있어?" 와 같은 @@ -1386,7 +1386,7 @@ learn: color-p3x2: ' 과' color-p3x3: >- . 본능적으로 우리는 "stroke(0)" 를 통해 윤곽선을 제거할 수 있을 거라 생각하지만, 코딩 언어의 세계에서 0은 "아무것도 - 없음"이 아니라, 검정색을 지칭합니다. + 없음"이 아니라, 검정색을 지칭합니다. color-p3x4: ' 과 ' color-p3x5: '를 사용하면 선도 색상도, 아무것도 보이지 않을 거에요!' color-p4x1: >- @@ -1486,11 +1486,11 @@ learn: 높이(height)를 정하는 숫자들이 필요합니다. coordinate-system-simple-shapes-p6x1: >- 사각형을 그리는 또 다른 방법으로, 중앙값, 너비(width), 높이값(height) 설정하기가 있습니다. 이 경우, 먼저 상단의 - setup() 함수에 센터 + setup() 함수에 센터 coordinate-system-simple-shapes-p6x2: ' 모드를 불러오고, 그 뒤에 사각형의 중앙값, 너비, 높이값을 지정해야 합니다. p5는 대문자와 소문자 구분에 민감하니 주의하세요!' coordinate-system-simple-shapes-p7x1: >- 마지막으로, 점 두 개 만으로 사각형을 그리는 방법도 있습니다. 바로, 상단 좌측 코너와 하단 우측 코너의 좌표를 지정하는 것이지요. - 여기서 우리가 setup() 함수에 포함시킬 모드는 코너 + 여기서 우리가 setup() 함수에 포함시킬 모드는 코너 coordinate-system-simple-shapes-p7x2: ' 입니다. 그 결과물은 위의 예제와 동일합니다.' coordinate-system-simple-shapes-p8x1: '사각형 그리기에 익숙해졌다면, 타원그리기 ' coordinate-system-simple-shapes-p8x2: ' 는 식은죽 먹기지요. 타원을 그리는 원리는 ' @@ -1503,7 +1503,7 @@ learn: createCanvas() 함수를 사용하여 캔버스의 너비(width)와 높이(height)를 설정할 수 있습니다. curves-description1: >- This tutorial is written by J David Eisenberg and ported by Sally Chen. If - you see any errors or have comments, + you see any errors or have comments, curves-description2: ' please let us know.' curves-description3: 'This work is licensed under a ' curves-description4: ' Creative Commons Attribution-NonCommercial-ShareAlinke 4.0 International License.' @@ -1597,11 +1597,11 @@ libraries: p5.sound: 'p5.sound는 p5에 웹 오디오 기능(오디오 입력, 재생, 분석 합성 등)을 추가합니다. ' asciiart: >- p5.asciiart는 p5.js를 아스키(ASCII) 아트로 쉽고 간단하게 변환합니다. 한마디로, p5.js를 위한 아스키 아트 - 컨버터입니다. + 컨버터입니다. p5.ble: 'p5.ble은 BLE 기기와 p5 스케치를 연결합니다. ' p5.bots: >- p5.bots를 통해 브라우저, 아두이노, 마이크로프로세서 간의 인터랙션을 만들 수 있습니다. 센서 데이터로 스케치를 만들거나, - 스케치에서 LED나 모터를 작동해보세요! + 스케치에서 LED나 모터를 작동해보세요! p5.bezier: >- p5.beizer는 조절점(control point) 개수 제한 없이 정교한 베지에 곡선(Bézier Curve)을 그릴 수 있게 해주는 라이브러리입니다. @@ -1639,7 +1639,7 @@ libraries: Rotating knobs: 스킨과 반환값을 설정할 수 있는 나만의 노브(knob)를 만들어보세요 p5.scenemanager: >- p5.SceneManager는 스케치를 여러 단계의 씬들로 구성할 수 있도록 합니다. 각각의 씬은 메인 스케치에 포함된 일부 스케치와도 - 같습니다. + 같습니다. p5.screenPosition: 프로세싱의 screenX 및 screenY 기능을 p5js에 적용합니다. p5.scribble: '2D 기본 조형을 손그림으로 표현합니다. 제작: Janneck Wullschleger, 프로세싱 라이브러리 포트 기반 ' p5.serialport: >- @@ -1654,7 +1654,7 @@ libraries: of a p5 sketch on an interval. p5.speech: >- p5.speech는 웹 스피치 및 스피치 인식 API에 대한 접근 권한을 제공하여, 음성을 인식하고 출력할 수 있는 스케치를 쉽게 만들 - 수 있게 합니다. + 수 있게 합니다. p5.start2d.js: '픽셀, 밀리미터, 센티미터 또는 인치 단위의 정적인 2D 아트를 만들기 위한 p5 확장 라이브러리입니다. ' p5.tiledmap: 'p5.tiledmap은 스케치에 지도를 넣기 위한 드로잉 및 도움 기능을 제공합니다. ' TiledPlay: >- @@ -1663,7 +1663,7 @@ libraries: p5.touchgui: 'p5.js를 위한 멀티터치 및 마우스 그래픽 유저 인터페이스(GUI) 라이브러리 ' tramontana: >- Tramontana는 인터랙티브 환경 및 공간을 생성하거나, 공간 속 스케일 기능을 프로토타이핑하기 위한 여러가지 기기(iOS, - Android, tramontana Board, ...)를 쉽게 쓸 수 있도록 하는 플랫폼입니다. + Android, tramontana Board, ...)를 쉽게 쓸 수 있도록 하는 플랫폼입니다. TurtleGFX: >- TurtleGFX allows to code with Turtle Graphics in JavaScript. Great for education and creative coding. @@ -1694,7 +1694,7 @@ libraries: p5.timer: >- This library performs asynchronous timing functions like countdowns, one-shot timers, % time elapsed and encapsulates the millis() function and - other related calculations that often clog up your code. + other related calculations that often clog up your code. c2.js: >- c2.js is a JavaScript library for creative coding based on computational geometry, physics simulation, evolutionary algorithm and other modules. @@ -1730,7 +1730,7 @@ libraries: using-a-library-title: 라이브러리 이용하기 using-a-library1: >- 라이브러리란 p5.js의 핵심 기능을 확장하거나 추가하는 자바스크립트 코드를 말합니다. 라이브러리에는 크게 두 종류가 있습니다. 주요 - 라이브러리인 + 라이브러리인 using-a-library3: '의 경우 p5.js 자체 배포물인 반면, 커뮤니티 라이브러리는 커뮤니티 공헌자에 의해 개발, 소유, 유지됩니다.' using-a-library4: >- 스케치에 라이브러리를 사용하려면 우선 스케치에 p5.js 링크를 걸고, 그 다음 HTML 파일에 라이브러리 링크를 걸면 됩니다. 링크가 @@ -1756,11 +1756,11 @@ community: in-practice-title: '실천:' in-practice1: >- 우리는 '고고한' 개발자가 아닙니다. 상대가 이미 어떠한 것을 알고 있을거라 섣불리 가정하거나, 모든 사람이 반드시 알아야 할 지식이 - 있다고 생각하지 않습니다. + 있다고 생각하지 않습니다. in-practice2: '피드백이 필요한 경우, 언제든 적극적으로 응합니다.' in-practice3: >- 우리는 입문자를 환영하며 타인의 학습을 우선순위에 둡니다. 또, 우리는 모든 업무를 수행할 때 초심자 시절의 열정을 잃지 않습니다. 우리 - 커뮤니티에 있어 입문자는 숙련자만큼이나 중요한 가치를 더하는 존재입니다. + 커뮤니티에 있어 입문자는 숙련자만큼이나 중요한 가치를 더하는 존재입니다. in-practice4: '우리는 언제나 모든 형태의 기여, 공헌, 참여를 적극적으로 인정하고 인증하고자 합니다.' in-practice5: 우리는 언제나 기꺼이 도움과 안내를 제공합니다. in-times-conflict-title: '갈등이 발생할 경우:' @@ -1806,7 +1806,7 @@ community: contributors-conference-title: p5.js 공헌자 컨퍼런스 contributors-conference1: >- 대부분의 커뮤니티 활동은 온라인에서 진행되지만, 오프라인에서도 일어난답니다! 그동안 두 차례의 공헌자 컨퍼런스가 있었는데요, 미국 - 피츠버그 소재 카네기 멜론 대학교(Carnegie Mellon University)의 + 피츠버그 소재 카네기 멜론 대학교(Carnegie Mellon University)의 contributors-conference2: '에서 진행된 것이 그 중 하나입니다. 예술가, 디자이너, 개발자, 교육자들이 모여 p5.js의 개선 방향에 대해 논의하였습니다.' participants-title: 참여자 support-title: 지원 @@ -1944,7 +1944,7 @@ community: and Access via Translation. It provides space for contributors of p5.js and experienced practitioners from outside OSSTA projects to share their knowledge, perspectives, and dreams for building greater access to - technical and arts spaces. + technical and arts spaces. 2022-p5js-access-day-recap-video: p5.js Access Day 2022 Recap Video 2022-p5js-access-day-recap-video-asl: p5.js Access Day 2022 Recap Video with ASL Interpretation 2022-p5js-access-day-moderator: Moderator @@ -2126,14 +2126,14 @@ showcase: project-q-2: How did you use p5.js in this project? project-a-2-1-roni-cantor: >- I used p5.js in this project to generate the sine wave and lerp (linear - interpolation) formulas and display the visuals in the + interpolation) formulas and display the visuals in the project-a-2-2-roni-cantor: >- . I then used a feature in my code that exported my programmed graphic into - an + an project-a-2-3-roni-cantor: ' file. I needed an SVG file to give to the plotter—an ' project-a-2-4-roni-cantor: >- —so that it understood where to draw the lines that I programmed. I sent - this information to the plotter with a program called + this information to the plotter with a program called project-a-2-5-roni-cantor: '!' project-q-3: What's your favorite p5.js feature? project-a-3-roni-cantor: ' because lines are fun and "lerp" is a fun word to say!' @@ -2199,7 +2199,7 @@ showcase: project-a-5-1-qianqian: 'I am very excited about ' project-a-5-2-qianqian: ' in LA.' creator-from-phuong: 'From Kyiv, Ukraine' - project-a-1-1-phuong: 'I''m a creative coder and designer, a ' + project-a-1-1-phuong: "I'm a creative coder and designer, a " link-1-phuong: Play Airi Flies! link-2-phuong: Code for AiriFlies on GitHub link-3-phuong: More info in Phuong Ngo's portfolio @@ -2210,7 +2210,7 @@ showcase: project-a-1-4-phuong: '," mainly taught by ' project-a-2-1-phuong: >- I used p5.js to work on the visual part of the game. The animation sprites - for Airi and the ghosts were drawn on an iPad app called + for Airi and the ghosts were drawn on an iPad app called project-a-2-2-phuong: ' and then integrated into ' project-a-2-3-phuong: ' code. I mainly used examples at p5.play as a reference.' project-a-2-4-phuong: 'For the endless scrolling background, I found a ' @@ -2224,7 +2224,7 @@ showcase: project-a-2-7-phuong: ' (currently, there is a beta version not available in public yet, but it will be very soon!). I added around 120 samples of my classmates saying the word "pew" with different intonations and 80 samples of background noise to train it. Then I integrated the model into the game with ' project-a-3-1-phuong: >- I really love how easily you can create, manipulate, and delete HTML blocks - and classes with the + and classes with the project-a-3-2-phuong: ' via ' project-a-3-3-phuong: ' etc. But my most favorite function is ' project-a-3-4-phuong: ', since this is where you create magic.' @@ -2254,12 +2254,12 @@ showcase: This summer, I gave myself a challenge of making typographic posters with coding, and this is one of the posters I made. I didn’t know until very recently that I could use motion sensor data with p5.js. I was also - watching + watching dan-shiffman-matterjs-tutorial: Dan Shiffman’s matter.js tutorial videos project-a-2-2-chung: ', so I thought why not combine the two and practice what I was learning?' project-a-3-1-chung: >- There are many things I love about p5.js such as the online community and - beginner friendliness. What I really like right now is the + beginner friendliness. What I really like right now is the project-a-3-2-chung: >- , with which I can not only work online for myself but also share URLs quickly in the present mode. For this project in particular, I had to do a @@ -2270,7 +2270,7 @@ showcase: project-a-4-3-chung: ' and build a tool for myself.' project-a-5-1-chung: >- As mentioned above, if you want to render out frames and video files out of - p5.js sketches, check out my + p5.js sketches, check out my project-a-5-2-chung: ' and let me know what you think.' creator-from-casey-louise: 'From New York, New York' project-a-1-1-casey-louise: >- @@ -2281,7 +2281,7 @@ showcase: interactive spaces based on sensor technologies. project-a-1-3-casey-louise: >- Casey: I started learning p5.js in 2018 in my first semester at ITP, though - I had been dabbling in + I had been dabbling in project-a-1-4-casey-louise: ' since 2012. I was introduced to Processing by my friend Pedro while I was studying graphic design, and it blew my mind. The idea of making my own tools for creating graphics and interactive art piqued my interest, but once I actually tried it, I was hooked. The first project I can remember was an eye that followed you around the screen, and it was sad when you left it alone.' project-a-1-5-casey-louise: >- Louise: I initially learned p5.js to make a website I was creating more @@ -2290,7 +2290,7 @@ showcase: project-a-2-1-casey-louise: >- Casey: I was putting off learning shaders for a long time, and I was also curious if I could use them in p5.js. Then I heard about a grant for open - source, storytelling, and learning resource projects at ITP called + source, storytelling, and learning resource projects at ITP called project-a-2-2-casey-louise: >- . Since I wasn't finding much in the way of p5.js + shader documentation, I decided to figure out how they're implemented in p5.js and create a resource @@ -2299,14 +2299,14 @@ showcase: great about making sure the project is a learning resource and not just a collection of examples. project-a-3-1-casey-louise: 'Casey: Does ' - project-a-3-2-casey-louise: ' count as a feature? I also love having the ability to share my programs on the web so that people don''t have to install special software or come to NYC to see my work.' + project-a-3-2-casey-louise: " count as a feature? I also love having the ability to share my programs on the web so that people don't have to install special software or come to NYC to see my work." project-a-3-3-casey-louise: 'Louise: My favorite feature is ' project-a-3-4-casey-louise: ' and ' project-a-3-5-casey-louise: ' for transformation of the coordinate system to make generative visuals.' project-a-4-1-casey-louise: >- Casey: The beginning of the project (figuring out how things work) was us reaching out to amazing people, asking questions, and asking for permission - to use their examples in our project. + to use their examples in our project. adam-ferris-repo-casey-louise: Adam Ferriss' GitHub repo project-a-4-2-casey-louise: ' really laid the groundwork for us in understanding how shaders work in p5.js and provided a framework of approachable examples for us to build on. For some specific p5.js-related issues we were having, we reached out to ' project-a-4-3-casey-louise: ' and ' @@ -2319,11 +2319,11 @@ showcase: Ferriss. Our aim was to do so in a way that a complete beginner can understand how to implement it, so it was as much a technical challenge as it was a challenge in teaching code to strangers and beginners. Here we drew - inspiration from the way the + inspiration from the way the openframeworks-book-casey-louise: openFrameworks book project-a-4-7-casey-louise: ' is written. A fun "hey, it’s not hard and you can do it too" approach is what we believe in.' project-a-5-1-casey-louise: 'Check out the ' - project-a-5-2-casey-louise: ' to explore our peers'' amazing grant projects!' + project-a-5-2-casey-louise: " to explore our peers' amazing grant projects!" pronouns-nonbinary: (they/them) creator-from-moon: 'From Athens, Georgia' posters-by: Posters By @@ -2530,7 +2530,7 @@ teach: teach-case11-content5: >- We used p5.js Web editor and code examples on the website. We also used dice, playing cards and various paper tools to help students learn about - coding concepts. + coding concepts. teach-case12-title: Digital Weaving & Physical Computing Workshop Series teach-case12-lead-name: Qianqian Ye teach-case12-image-alt: In-class photo @@ -2550,7 +2550,7 @@ teach: teach-case13-title: p5.js à l'Ubuntu Party! teach-case13-lead-name: Basile Pesin teach-case13-content1: '2020 우분투 행사(Ubuntu Party),' - teach-case13-content1-1: 'Cité des Sciences et de l''''Industrie, Paris, France' + teach-case13-content1-1: "Cité des Sciences et de l''Industrie, Paris, France" teach-case13-content2: 'Any age, including children and parents, young and older adults.' teach-case13-content3: Advanced teach-case13-content4: >- diff --git a/src/data/zh-Hans.yml b/src/data/zh-Hans.yml index 91459c0ec5..d71a9abc05 100644 --- a/src/data/zh-Hans.yml +++ b/src/data/zh-Hans.yml @@ -1727,7 +1727,7 @@ showcase: project-a-2-1-roni-cantor: 我在这个项目中使用p5.js生成正弦波和Lerp（线性插值）公式，并在 project-a-2-2-roni-cantor: 中显示可视化效果。然后，我使用我的代码中的一个功能将可编程图形导出为 project-a-2-3-roni-cantor: ' 文件。我需要一个SVG文件来提供给绘图仪器，' - project-a-2-4-roni-cantor: ''''' - 以便它知道如何绘制我编程的线条。我使用了名为''' + project-a-2-4-roni-cantor: "'' - 以便它知道如何绘制我编程的线条。我使用了名为'" project-a-2-5-roni-cantor: ' 的程序将此信息发送到绘图仪器！' project-q-3: 你最喜欢 p5.js 的哪个功能？ project-a-3-roni-cantor: ' 因为线条很有趣，而“lerp”是一个有趣的词！' @@ -2031,7 +2031,7 @@ teach: teach-case13-content3: 中高级 teach-case13-content4: 通过有趣和引人注目的示例，向新公众介绍编程。 teach-case13-content5: 方法：现场工作坊，每次1小时，使用不同的参与者。 学生们使用(Ubuntu)机器与p5.js网络编辑器一起学习。 我使用视频投影机和白板教学。 - teach-case13-content5-1: '''材料：我给出的练习可以通过p5.js网络编辑器链接获得。''' + teach-case13-content5-1: "'材料：我给出的练习可以通过p5.js网络编辑器链接获得。'" teach-case14-title: 用p5.js探索生成艺术和设计 teach-case14-lead-name: Priti Pandurangan & Ajith Ranka teach-case14-image-alt: 一组参与者合作使用p5.js网络编辑器在笔记本电脑上创建一些设计。