الهويّة/الحركة

الحركة

رموزُ الحركة: مددٌ ومنحنياتٌ بأسماء، وحدودٌ لا تُتجاوز.

قفزةٌ لا انزلاق: انطلاقٌ حادٌّ، وهبوطٌ هادئ.

المنحنياتالمسافةُ والمدّةُ واحدة

قفزةjump · cubic-bezier(0.16, 1, 0.3, 1)
استقرارsettle · cubic-bezier(0.22, 1, 0.36, 1)
خروجexit · cubic-bezier(0.4, 0, 1, 1)

المددبالمليثانية

فوريّinstant · 100ms
سريعfast · 160ms
أساسbase · 240ms
بطيءslow · 420ms
قصّةstory · 800ms

لا حركةَ في الواجهة أطولُ من ٤٢٠ مليثانية، و«القصّة» للحظات الكبرى وحدَها.

قواعد

  • الدخولُ من اليمين — من حيث يبدأ السطرُ العربيّ.
  • الخروجُ أسرعُ من الدخول — ما يغادر لا يُنتظر.
  • الفارقُ بين عنصرٍ وعنصر ٥٠ مليثانية، والمسافاتُ ٨ و١٦ و٣٢ بكسلاً.

وتقف حين يُطلب

  • الحركةُ المطفأة في الجهاز تُحترم: لا شيءَ يتحرّك وحدَه، والكلامُ في مكانه.
  • زرُّ «أوقف الحركة» في كلِّ صفحة — ما يتحرّك وحدَه أكثرَ من خمس ثوانٍ يقف به.
  • ثلاثُ درجاتٍ للجهاز: كلُّ شيءٍ على الجهاز القويّ، ونصفُه على المتوسّط، وصورٌ ثابتةٌ على الضعيف.
  • لا يُحجب المحتوى خلف حركة، ولا يدور ما لا يُرى.