التخفيف في الرسوم المتحركة

المفهوم

التخفيف (الاستيفاء غير الخطي) يحوّل الحركة الميكانيكية إلى حركة عضوية. بدلاً من التحرك بسرعة ثابتة، نُسرّع في البداية ونُبطئ في النهاية. في p5.js، تستوفي lerp(a, b, t) خطياً. للتخفيف، نطبق منحنى على t مثل t*t أو smoothstep.

الكود

// Easing: circle follows mouse with smoothstep
let x = 0, y = 0;
function setup() { createCanvas(400, 280); }
function draw() {
  background(11, 15, 20);
  // Smoothstep easing toward mouse
  let t = 0.08;
  x = lerp(x, mouseX, t);
  y = lerp(y, mouseY, t);
  noStroke(); fill(55, 227, 195);
  ellipse(x, y, 24, 24);
  // Trail
  fill(55, 227, 195, 40);
  ellipse(mouseX, mouseY, 10, 10);
}

للمزيد

استكشف الدورات المجانية الأخرى على صفحة التعلم، أو احجز مكالمة لمناقشة مشروعك.