CodingTrain / CodingTrain/Suggestion-Box
Beginner tutorial: Smooth variable changes (lerp, damping, easing)
- Lingua principale
- Nessun dato sulla lingua
- Stelle
- 570
- Fork
- 85
- Metriche di merge delle PR
- Nessuna PR unita negli ultimi 30g
Descrizione
Hi! I think a lot of beginners would appreciate a simple tutorial on using the lerp() function to achieve smooth motion and value changes.
I think something like this example would be pretty good:
```javascript
let rndBg = 0;
let newRndBg = 0;
let ellipseCol = 0;
let newEllipseCol = 0;
let d = 100;
let newD = 100;
let x = 0;
let y = 0;
let bigCircle = false;
function lerpVariables() {
rndBg = lerp(rndBg, newRndBg, 0.05);
ellipseCol = lerp(ellipseCol, newEllipseCol, 0.05);
x = lerp(x, mouseX, 0.05);
y = lerp(y, mouseY, 0.05);
d = lerp(d, newD, 0.05);
}
function setup() {
createCanvas(windowWidth, windowHeight);
colorMode(HSL);
}
function draw() {
lerpVariables();
background(rndBg, 50, 30);
fill(ellipseCol, 50, 70);
ellipse(x, y, d);
}
function mousePressed() {
bigCircle = !bigCircle;
bigCircle ? newD = 300 : newD = 50;
newRndBg = random(360);
newEllipseCol = random(360);
}
```
Guida per i contributori
Nessuna guida per i contributori indicizzata per questo repository
Direzione di ricerca
No target file or test is named. Start from the proposed JavaScript example and define the tutorial around lerp(), smooth motion, value changes, damping, and easing; it is done when the beginner-focused tutorial explains and demonstrates those topics.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Valutazione
- Stack tecnologico
- javascript
- Ambito
- documentation
- Tipo di issue
- Documentazione
- Difficoltà
- 5/5
- Tempo stimato
- Più di una settimana
- Stato di attività
- Ferma
- Chiarezza
- Abbastanza chiara
- Idoneità per principianti
- 35/100