FRENAR
N°08 · Vanilla JS · فيزياء

فيزياء السحب

نابض مقابل القصور الذاتي. اسحب العنصر نفسه بنموذجين فيزيائيين مختلفين — اشعر بالفرق الجوهري في الجودة المُدرَكة.

SPRING
INERTIA
اسحب كلا العنصرين · قارن الإحساس
// Spring physics — Hooke's law + damping
function springStep(pos, target, velocity, stiffness, damping) {
  const force = (target - pos) * stiffness / 100;
  velocity += force;
  velocity *= 1 - damping / 100;
  pos += velocity;
  return { pos, velocity };
}

// Inertia — velocity decay + boundary bounce
function inertiaStep(pos, velocity, friction, min, max) {
  pos += velocity;
  velocity *= friction / 100;
  if (pos < min || pos > max) {
    velocity *= -0.6; // rebond mur
    pos = Math.max(min, Math.min(max, pos));
  }
  return { pos, velocity };
}
جرّب بنفسك

اضبط صلابة النابض — عند أي قيمة يبدو كشريط مطاطي مقابل وصلة صلبة؟ أي مزيج من الصلابة/التخميد يبدو الأكثر إرضاءً لبطاقة قابلة للسحب؟

تفاعلات فيزيائية تبدو حية

احجز جلسة