مولّد ورقة الرسوم المتحركة
اجمع صورًا كثيرة في ورقة Sprite واحدة واحصل معها على خريطة إحداثيات بصيغة JSON. طلب HTTP واحد بدل خمسين ما زال من أكثر تحسينات أداء الواجهات فاعلية. مجانية، بدون حساب، وبدون إضافة أي علامة إلى نتيجتك.
مولّد ورقة الرسوم المتحركة
أضف ملفاتك. الإعدادات الموصى بها جاهزة، لتتمكن من المعالجة بنقرة واحدة.
PDF وWord والصور والصوت والفيديو والأرشيفات والمزيد
حتى 100 ملف · 250 ميغابايت · بدون حساب- 1إضافة ملفات
- 2اختر إجراءً
- 3نزّل أو تابع العمل
متى تحتاج هذه الأداة
كيف تعمل
تُصف الصور في ورقة شفافة واحدة على شكل شبكة، مع حشوة اختيارية بينها حتى لا يتسرب حد صورة إلى التي تليها عند تكبير الورقة أو عند ترشيح الخامات في محرك الألعاب. ومع ملف PNG يأتي ملف JSON يذكر ملف كل صورة وموضعها وحجمها، وملف CSS فيه صنف لكل صورة يحدد حجمها وموضع خلفيتها، جاهز لصفحة ويب.
أسئلة شائعة
ما فائدة خريطة JSON؟
تعطي الإحداثيين x وy والعرض والارتفاع لكل صورة مجمّعة، وهو ما تحتاجه لخاصية background-position في CSS أو لمحمّل الأطلس في محرك الألعاب.
هل تُحفظ الشفافية؟
نعم. تُصدَّر الورقة بصيغة PNG وتنتقل شفافية الصور الأصلية إلى النتيجة.
هل ما زال هذا مهمًا مع HTTP/2؟
أقل مما كان، لكنه ما زال يقلل عبء الطلبات، وهو ممارسة معتادة في أطالس خامات الألعاب.
هل يوجد CSS يمكنني استخدامه مباشرة؟
نعم. يتضمن التنزيل الملف sprite-sheet.css، وفيه الصنف .sprite للورقة وصنف .sprite-الاسم لكل صورة يحدد عرضها وارتفاعها وموضع خلفيتها.
لماذا الحشوة؟
عند تكبير الورقة أو حين يرشّح محرك الألعاب خاماته، قد تتسرب بكسلات صورة مجاورة إلى حافة الصورة المعروضة. وتمنع بضع بكسلات من الحشوة الشفافة بين الصور ذلك.
أدوات مجانية ذات صلة
قسّم الصورة إلى صفوف وأعمدة من قطع متساوية بدقتها الكاملة ونزّلها منفردة أو في ملف ZIP. مثالي لمنشورات إنستغرام المتعددة. مجانًا.
أنشئ جميع أحجام أيقونة الموقع وملف ICO من صورة واحدة للمواقع وتطبيقات الويب.
أنشئ ورقة معاينة بصور مصغرة وأسماء الملفات، كصورة JPG واحدة أو كصفحات A4 بصيغة PDF للطباعة. مجانًا وبدون حساب.
حوّل صور PNG إلى WebP لمواقع أخف وزنًا دون فقدان الشفافية، ولعدة ملفات دفعة واحدة. مجاني وبدون حساب.