صانع فن البكسل

ما هو صانع فن البكسل؟

صانع فن البكسل أداة رسم مبنية على شبكة ثابتة: بدلاً من ضربات فرشاة حرة، تضع بكسلات مفردة مربعاً مربعاً. هذا القيد هو سرّ سحر فن البكسل: شخصيات الألعاب (السبرايت) والأيقونات القديمة الطراز والصور الرمزية ورسومات 8-بت كلها تُصنع باختيار كل بكسل عن قصد.

يمنحك هذا المحرر عدّة محرر السبرايت الكلاسيكية: قلم وممحاة وتعبئة وقطّارة ألوان على شبكات من 8x8 إلى 64x64، مع تحريك إطاراً بإطار ومعاينة حية. صدّر النتيجة كصورة PNG حادة بأي حجم، أو GIF متحرك، أو Sprite Sheet جاهزة لمحرك ألعاب.

ولأن هذا Coddy، فرسمتك كود أيضاً. نقرة واحدة تحوّل الشبكة إلى مصفوفة ثنائية الأبعاد في Python، أو مقطع Canvas في JavaScript، أو فن box-shadow في CSS، أو ملف SVG، أو CSV يُفتح في جداول البيانات: طريقة ممتعة لترى أن الصور ليست سوى مصفوفات من الألوان.

ماذا ستتعلم أثناء صنع فن البكسل

• الصورة مصفوفة ثنائية الأبعاد: كل بكسل عنصر يحمل قيمة لون. تصدير الكود يعرض رسمتك هكذا بالضبط: صفوف وأعمدة من أكواد hex.
• اللوحات الصغيرة أجمل. السبرايتات الكلاسيكية تستخدم من 4 إلى 32 لوناً؛ التقييد يفرض أشكالاً نظيفة وخطوطاً خارجية مقروءة.
• التحريك مجرد إطارات. الرمشة أو دورة المشي بضع شبكات متشابهة تُعرض بالتتابع.
• فن البكسل يُكبَّر بطريقة الجار الأقرب. صدّر بمقياس 16x أو 32x وتبقى المربعات حادة تماماً؛ التنعيم كان سيطمسها.

كيف تصنع فن البكسل خطوة بخطوة

1. 1

   اختر حجم الشبكة

   ابدأ صغيراً: 16x16 أو 32x32. الشبكات الصغيرة تفرض أشكالاً بسيطة ومقروءة؛ ومعظم سبرايتات الألعاب الكلاسيكية 16x16 أو 32x32. يمكنك تغيير الحجم لاحقاً دون فقدان الرسمة.

2. 2

   ارسم الشكل العام أولاً

   استخدم القلم للحدود والتعبئة للمساحات الكبيرة. ارسم الشكل الكلي بلون واحد أولاً ثم أضف التفاصيل. النقر بالزر الأيمن (أو الممحاة) يمسح البكسل.

3. 3

   ظلّل بلوحة ألوان صغيرة

   اختر درجتين أو ثلاثاً لكل خامة: أساس وإضاءة وظل. اللوحة المدمجة مرتبة لتجد هذه التدرجات بسهولة، والقطّارة تلتقط أي لون موجود على اللوحة.

4. 4

   حرّكها (اختياري)

   كرّر الإطار، وحرّك بضعة بكسلات، واضغط تشغيل. إطاران أو ثلاثة تكفي لرمشة عين أو قفزة أو رفّة لهب.

5. 5

   صدّر

   نزّل PNG حتى مقياس 32x، أو GIF متحركاً، أو Sprite Sheet بكل الإطارات في صف واحد. أو افتح لوحة الكود وانسخ عملك كـ Python أو JavaScript أو CSS أو SVG أو CSV.

مرجع سريع لفن البكسل

أحجام اللوحات وصيغ التصدير الشائعة، ومتى تستخدم كلاً منها.

أمثلة فن بكسل لتجربتها

PIXELS = [    [None, "#e43b44", "#e43b44", None],    ["#e43b44", "#a22633", "#a22633", "#e43b44"],    [None, "#e43b44", "#a22633", None],    [None, None, "#e43b44", None],]
for row in PIXELS:    print("".join("█" if c else " " for c in row))

.pixel-art {    --px: 12px;    width: var(--px);    height: var(--px);    box-shadow:        calc(1 * var(--px)) 0 0 0 #e43b44,        calc(2 * var(--px)) 0 0 0 #e43b44,        calc(1 * var(--px)) calc(1 * var(--px)) 0 0 #a22633;}

أخطاء شائعة في فن البكسل

• البدء بشبكة 64x64. اللوحات الكبيرة تخفي الأشكال الضعيفة: تعلّم على 16x16 حيث كل بكسل قرار.
• استخدام ألوان كثيرة. إذا كان في السبرايت 40 لوناً فلا أسلوب له. اختر تدرجاً صغيراً لكل خامة والتزم به.
• تكبير الصور المصدَّرة مع التنعيم. فن البكسل يُكبَّر بالجار الأقرب (هذه الأداة تفعل ذلك عنك) وإلا تحوّل إلى لطخة ضبابية.
• تصدير السبرايتات على خلفية بيضاء. أبقِ الخلفية الشفافة مفعّلة لكل ما سيدخل لعبة أو يوضع فوق محتوى آخر.
• التحريك بإطارات كثيرة جداً. الإحساس الكلاسيكي يأتي من 2 إلى 4 إطارات مختارة بعناية، لا من 16 إطاراً شبه متطابق.

أسئلة شائعة عن صانع فن البكسل