# Assingment 4: Sw(eeeeee)irl

Concpet:

I got inspired by one of the given examples that we got the chance of looking through. My idea was very simply just let the letters “W” and “E” have a little fun swirling around the canvas.

inspo:https://www.lyceelecorbusier.eu/p5js/?p=2653#more-2653

Highlight of Code:

As shown in the set of codes below, I was able to control how the letters appeared on screen depending on its position. As well as the distance between each letter and their angle. You can smoothly draw around the canvus as it displays the letters. After displaying them all the code repeats.

```function draw() {
if (mouseIsPressed) {
// Calculate the distance between current and previous mouse positions
let d = dist(x, y, mouseX, mouseY);
textFont('impact');
textSize(fontSizeMin + d / 2); // Set text size based on the distance
let newLetter = letters.charAt(counter); // Get the next letter from the letters string
stepSize = textWidth(newLetter); // Calculate the step size based on text width

if (d > stepSize) {
let angle = atan2(mouseY - y, mouseX - x); // Calculate the angle between current and previous mouse positions

push();
translate(x, y); // Translate the origin to the previous mouse position
rotate(angle + random(angleDistortion)); // Rotate the text randomly
text(newLetter, 0, 0); // Draw the text at the translated and rotated position
pop(); // Restore the previous transformation state

counter++; // Move to the next letter
if (counter > letters.length - 1) {
counter = 0; // Reset the counter when all letters have been used
clearCanvas(); // Clear the canvas when the cycle is complete
}
//moving according to coordinates
x = x + cos(angle) * stepSize;
y = y + sin(angle) * stepSize;
}
}
}```

Reflection and Ideas for Future Work:

I wanted to take more inspotations and combine them in order to come up with an idea that refelcts my own work rather than someone else.

Edit: https://editor.p5js.org/mariamalkhoori/sketches/SpcDmSs92