الألعاب / الصور

إنشاء ورقة الرسومات وقصّها وتحريكها

رتّب الصور في ورقة رسومات أو أطلس نسيجي، وقسّم الورقة إلى إطارات منفصلة، ثم حرّكها. احفظ ملفات PNG وبيانات hash الوصفية وCSS وZIP أو صورة GIF متحركة دون رفع صورك.

إنشاء ورقة الرسومات وقصّها وتحريكها: يجمع وضع الإنشاء صور PNG وJPG وWebP وإطارات GIF المفكوكة في ورقة على شكل شبكة أو صف أو عمود أو ورقة مرصوصة. تتسع الخلايا الموحدة لأكبر صورة، مع محاذاة إلى الوسط أو أسفل الوسط، وحشو وتباعد وأبعاد اختيارية بقوى العدد 2. يقصّ وضع القص الصور حسب عدد الخلايا أو أحجام البكسل، أو يكتشف الجزر المفصولة بالشفافية أو بمفتاح لون الخلفية. يمكنك استبعاد مستطيلات، وتخطي الخلايا الفارغة، وقص الحواف الشفافة قبل حفظ ملف ZIP أو إرسال الإطارات إلى وضع التحريك. يشغّل وضع التحريك نطاقًا محددًا من الإطارات بمعدل 1–60 FPS، مع ترتيب تكراري أو ذهاب وإياب، وتكبير للبكسل، وخيار جلد البصل. يحفظ ملف GIF أو شريط PNG أفقيًا. ابدأ بأداة إنشاء فن البكسل إذا احتجت إلى رسم الإطارات أولًا. يعمل 100% محليًا في المتصفح، من دون رفع أي ملفات إلى الخادم.

مرات التشغيل
في المتصفح
التكلفة
مجاني · بلا تسجيل
التوفر
جاهز للاستخدام
مساحة عمل ورقة الرسوماتمعالجة محلية

تعمل بالكامل في المتصفح

رتّب الإطارات في ورقة لاستخدامها في لعبتك.

تستخدم الخلايا الموحّدة حجم الإطار الأكبر، مع حشو من جميع الجوانب. يفصل التباعد بين الخلايا.

أضف الإطارات للبدء. يمكنك أيضًا تقسيم ورقة في «قص» وإرسال إطاراتها إلى هنا.

تبقى صورك وملفاتك المصدَّرة في هذا المتصفح. استخدم الملفات المحفوظة في مشروع لعبتك الخاص.

صفحات الكائنات وأطالس الأنسجة

تخزّن صفحة الكائنات عدة إطارات للرسوم المتحركة أو صورًا للعبة في صورة واحدة. تصف الشبكة المنتظمة كل إطار من خلال موضع خليته. ويمكن لأطلس الأنسجة استخدام مستطيلات غير متساوية، ويحتاج إلى إحداثيات تصف كل صورة. توضّح وثائق AtlasTexture في Godot (https://docs.godotengine.org/en/stable/classes/class_atlastexture.html) كيفية استخدام منطقة من الأطلس كنسيج.

تحافظ المحاذاة من الأسفل إلى الوسط على وضع قدمي الشخصية على خط أساس واحد عبر الإطارات. وتحافظ الرفوف المعبأة على الأبعاد الأصلية لكل صورة وتتجنب التدوير. تضيف أبعاد القوة من اثنين بكسلات غير مستخدمة إلى اليمين أو الأسفل، ولا تغيّر حجم رسوماتك. يحافظ PNG على الشفافية الكاملة لقناة ألفا، بينما يحتوي GIF على ألوان أقل وشفافية ببت واحد فقط.

إحداثيات تجزئة JSON

يستخدم تصدير تجزئة JSON أسماء الإطارات كمفاتيح ضمن frames. ويضم كل إدخال مستطيل إطار يحتوي على x وy وw وh، إضافة إلى sourceSize وspriteSourceSize، ورايتي rotated وtrimmed. تُعدّ الإحداثيات البكسلات من الزاوية العلوية اليسرى للصفحة. ويسجّل الكائن meta اسم ملف الصورة والحجم الإجمالي للصفحة. تصف أداة تحميل أطلس تجزئة JSON في Phaser (https://docs.phaser.io/api-documentation/class/loader-loaderplugin#atlasJSONHash) تنسيق الإطارات المسماة هذا.

اجعل التصديرات تستخدم حدود الصورة الأصلية بدلًا من حدود الخلية المحشوة، مع ضبط trimmed وrotated على false. ويمكن لأداة القص تصدير قائمة منفصلة بالمستطيلات المحددة. اقطع الحواف الشفافة فقط عندما تريد اقتصاصًا محكمًا، واترك ذلك معطلًا للحفاظ على خلايا الرسوم المتحركة المنتظمة وموضع تسجيلها. قارن المستطيلات المحفوظة بأداة الاستيراد في محركك قبل استخدام الأطلس في مشروع.

طريقة الاستخدام

  1. اختر إنشاء أو قص أو تحريك؛ لكل وضع رابط يمكنك حفظه في الإشارات المرجعية.
  2. أضف الإطارات أو الورقة، ثم اضبط التخطيط أو شبكة القص أو إعدادات الحركة.
  3. عاين النتيجة ونزّل الملفات لمشروع اللعبة.

الخصوصية والقيود

تبقى ملفاتك في المتصفح. لا يتم رفع أي شيء.

أدوات ذات صلة

الأسئلة الشائعة

هل أستخدم شبكة أم أطلسًا نسيجيًا مرصوصًا؟

تمنح الشبكة كل إطار حجم الخلية نفسه، وتسهل عملية القص أو الاستيراد كحركة منتظمة. تضع الورقة المرصوصة الإطارات ذات الأحجام المختلفة على صفوف متجاورة لتوفير المساحة. لا يتم تدوير الإطارات المرصوصة، وتحتاج إلى المستطيلات المصدّرة في JSON أو إلى إعدادات المناطق المكافئة في محرك اللعبة.

لماذا أستخدم الحشو أو التباعد أو تمديد الحواف؟

قد تستعين الخامات المطبّقة عليها المرشحات بالبكسلات المجاورة، فتُنشئ فواصل لونية تُسمى تسرّب الخامة. يترك الحشو مساحة داخل كل خلية، بينما يترك التباعد فجوة بين الخلايا. تضيف هذه الأداة بكسلات شفافة أو بكسلات بلون الخلفية، ولا تنسخ بكسلات الحواف. يكرر تمديد الحواف ألوان حواف الرسم داخل حدوده؛ استخدم إعدادات الخامة في محركك أو أداة رصّ الأطلس التي تدعم تمديد الحواف إذا احتاج مشروعك إلى ذلك، خصوصًا مع الخرائط المِصغّرة.

كيف أستورد الورقة إلى Godot أو Unity أو Phaser؟

في Godot، استخدم مناطق الورقة بوصفها خامات أطلس أو إطارات حركة. في Unity، تعامل مع الصورة على أنها عدة رسومات، واقصصها إلى شبكة منتظمة أو حدّد المستطيلات. يمكن لـ Phaser استخدام ورقة رسومات منتظمة أو أطلس JSON من نوع hash. احتفظ بملف PNG وملف JSON معًا. تختلف إعدادات الاستيراد؛ اختر ترشيح أقرب جار للحفاظ على وضوح فن البكسل، وتحقق من الشفافية وأبعاد الخلايا، وتأكد من ملاءمة أسماء الإطارات وتنسيق JSON لمشروعك.

ما حدود الشفافية والتوقيت في GIF؟

يدعم GIF بحد أقصى 256 لونًا في لوحة الألوان ومدخلًا واحدًا شفافًا في اللوحة، لذلك تكون البكسلات إما شفافة بالكامل أو معتمة. تصبح الشفافية الأقل من 50% شفافة، بينما تصبح الشفافية الأخرى معتمة. اختر لونًا مطفّيًا لمزج الحواف الناعمة بدلًا من ذلك. تُقرّب فواصل الإطارات إلى 10 ms مع حد أدنى قدره 20 ms، لذلك لا يمكن تمثيل 60 FPS بدقة تامة. يتكرر ملف GIF المصدّر باستمرار؛ ويضيف الذهاب والإياب إطارات العودة دون تكرار نقطتي النهاية.

هل تغادر ملفاتي المتصفح؟

لا. تحدث قراءة الصور وترتيب الأوراق واكتشاف الجزر وإنشاء الملفات المصدّرة كلها على جهازك. تحتاج الأوراق الكبيرة والرسوم المتحركة الطويلة إلى ذاكرة أكبر. يظهر تحذير عند تجاوز 400 إطار أو 8,192 بكسل في أحد الجوانب. حدود التشغيل هي 1,000 إطار مستورد، و16,384 بكسل لكل جانب، و64 مليون بكسل لكل صورة أو ملف رسوم متحركة مصدّر.

أداة مجانية · عدد مرات الاستخدام في المتصفح · لا يتطلب حسابًا