CodingTrain / CodingTrain/Suggestion-Box
Beginner tutorial: Smooth variable changes (lerp, damping, easing)
- Lenguaje dominante
- Sin datos de lenguaje
- Estrellas
- 570
- Forks
- 85
- Métricas de merge de PR
- Sin PR fusionados en 30 d
Descripción
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);
}
```
Guía de contribución
No hay ninguna guía de contribución indexada para este repositorio
Línea de trabajo
No se indica ningún archivo objetivo ni ninguna prueba. Comienza con el ejemplo de JavaScript propuesto y define el tutorial en torno a lerp(), el movimiento suave, los cambios de valor, la amortiguación y el easing; estará terminado cuando el tutorial orientado a principiantes explique y demuestre esos temas.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- javascript
- Área
- documentation
- Tipo de issue
- Documentación
- Dificultad
- 5/5
- Tiempo estimado
- Más de una semana
- Estado de actividad
- Estancado
- Claridad
- Bastante claro
- Aptitud para principiantes
- 35/100