المكتبة الإبداعية والحركات
أقسام وقوالب صفحات وحركات جاهزة تُراجَع قبل أن تتمكن من استخدامها، واستوديو حركات لحركتك الخاصة.
تُرجمت هذه الصفحة من الإنجليزية. وفي حال وجود أي اختلاف، تسري النسخة الإنجليزية. اقرأ بالإنجليزية
المكتبة الإبداعية
Section titled “المكتبة الإبداعية”يغطي الكتالوج سبع فئات:
| الفئة | العناصر |
|---|---|
| الواجهات الرئيسية (Heroes) | 30 |
| البطاقات | 40 |
| أقسام المحتوى | 45 |
| التنقل وإطار الصفحة | 15 |
| الحركة | 35 |
| حركة التمرير | 25 |
| قوالب الصفحات | 10 |
يجتاز كل عنصر قائمة مراجعة (العرض، والتخطيط المتجاوب، وإمكانية الوصول، والترخيص، والتكرار) قبل أن يظهر في Library لديك بالشارة Approved.
استخدم عنصرًا
Section titled “استخدم عنصرًا”افتح Design → Library واختر عنصرًا. يعرضه Preview أولًا. بعد ذلك:
- Use on a page: اختر Page وانقر Add to page. يُفتح محرر الصفحات والأقسام مُدرجة كتغييرات غير محفوظة، جاهزة للتحرير والحفظ.
- Add to website: إذا لم يكن موقعك قادرًا على عرض العنصر بعد، فانقر Propose the change. يقترح Atlas تغييرًا في إعداد الموقع ويكتب Task for the website developer. يضيف مطوّرك المكوّن إلى شيفرة الموقع؛ ويفعّل مسؤول الموقع التغيير ضمن Site setup. لا يثبّت Atlas شيفرة على موقعك أبدًا.
- Open in Animations: لعناصر الحركة، ابدأ حركة جديدة منها.
استوديو الحركات
Section titled “استوديو الحركات”ابنِ حركات موقّتة (تلاشٍ وتحريك وتحجيم وتدوير وكشف) لعناصر موقعك، وعاينها، واحتفظ بكل تغيير كمراجعة.
-
افتح Design → Animations وانقر New animation. أعطها Name وKey، واختر ما Start from (تلاشٍ فارغ، أو حركة معتمدة من المكتبة) وانقر Create.
-
في Timeline، اضبط Duration in milliseconds، واختر Element to animate (Title أو Image أو Button) وAdd track. أضف إطارات مفتاحية واضبط Opacity وMove X وMove Y وScale وRotate وReveal لكل منها.
-
استخدم Play وPause وRestart، وبدّل Preview motion بين Normal وReduced للتحقق من شكلها للزوار الذين يفضلون حركة أقل.
-
انقر Save new revision. تبقى المراجعات السابقة ضمن Revisions.
شغّلها في موقعك
Section titled “شغّلها في موقعك”يعلّم مطوّرك العناصر المراد تحريكها بـdata-atlas-motion="title" (أو media للصورة وaction للزر) ويشغّل الحركة في مكوّن عميل (client component). تُقدَّم الخطوط الزمنية من Delivery API على المسار /motion. وتعرض البطاقة Add to your website في Studio الشيفرة. ويشغّل الإنتاج المراجعة الموجودة في إصداره الحي.
الحدود. من 80 مللي ثانية إلى 60 ثانية لكل حركة، وحتى 12 مسارًا من 24 إطارًا مفتاحيًا. يبدأ التشغيل عندما يستدعيه موقعك؛ والتشغيل المرتبط بالتمرير غير مدمج.