غالبًا ما يتعين على مطوري Indie الجمع بين عدة أدوار في وقت واحد: مصمم الألعاب ، والمبرمج ، والملحن ، والفنان. وعندما يتعلق الأمر بالمرئيات ، يختار العديد من الأشخاص فن البكسل - للوهلة الأولى ، يبدو الأمر بسيطًا. ولكن لجعلها جميلة ، فأنت بحاجة إلى الكثير من الخبرة والمهارات المعينة. لقد وجدت برنامجًا تعليميًا لأولئك الذين بدأوا للتو في فهم أساسيات هذا النمط: مع وصف للبرامج الخاصة وتقنيات الرسم باستخدام اثنين من العفاريت كمثال.
خلفية
فن البكسل هو شكل من أشكال الفن الرقمي يتم فيه إجراء تغييرات على مستوى البكسل. يرتبط في الغالب برسومات ألعاب الفيديو من الثمانينيات والتسعينيات. ثم كان على الفنانين أن يأخذوا في الاعتبار قيود الذاكرة والدقة المنخفضة. الآن لا يزال فن البكسل شائعًا في الألعاب وكأسلوب فني بشكل عام ، على الرغم من إمكانية إنشاء رسومات ثلاثية الأبعاد واقعية. لماذا؟ حتى بصرف النظر عن الحنين إلى الماضي ، فإن إنشاء عمل رائع ضمن مثل هذا الإطار الصارم يعد تحديًا رائعًا ومكافئًا.
يعد عائق الدخول إلى فن البكسل منخفضًا نسبيًا مقارنة بالفن التقليدي والرسومات ثلاثية الأبعاد ، والتي تجذب مطوري المستقلين. لكن هذا لا يعني أنه سيكون سهلاً إنهاء لعبة في هذا النمط. لقد رأيت العديد من المطورين المستقلين مع فن البكسل metroidvanias على منصات التمويل الجماعي. ظنوا أنهم سينهون كل شيء في غضون عام ، لكنهم في الواقع كانوا بحاجة إلى ست سنوات أخرى.
سبيكة معدنية 3 (أركيد). SNK ، عام 2000
فن البكسل على المستوى الذي يرغب معظم الناس في إنشائه يستغرق وقتًا طويلاً ، والبرامج التعليمية القصيرة قليلة ومتباعدة. عند العمل باستخدام نموذج ثلاثي الأبعاد ، يمكنك تدويره وتشويهه وتحريك أجزائه الفردية ونسخ الرسوم المتحركة من نموذج إلى آخر وما إلى ذلك. يستغرق فن البكسل عالي المستوى دائمًا الكثير من الجهد لوضع وحدات البكسل بدقة على كل إطار.
على العموم انا حذرتك
والآن قليلاً عن أسلوبي: أرسم بشكل أساسي فن البكسل لألعاب الفيديو وأجد الإلهام فيها. على وجه الخصوص ، أنا من محبي Famicom / NES ووحدات التحكم ذات 16 بت وألعاب الأركيد من تسعينيات القرن الماضي. يمكن وصف فن البكسل لألعابي المفضلة في ذلك العصر بأنه مشرق وواثق ونظيف (ولكن ليس بشكل مفرط) ، فهو ليس صعبًا وبسيطًا. أنا أعمل بهذا الأسلوب بنفسي ، لكن يمكنك بسهولة تطبيق الأفكار والتقنيات من هذا البرنامج التعليمي لإنشاء أشياء مختلفة تمامًا. استكشف أعمال الفنانين المختلفين وأنشئ فن البكسل الذي تحبه!
البرمجيات
الأدوات الرقمية الأساسية لفن البكسل - تكبير (تكبير) وقلم رصاص (قلم رصاص) لوضع وحدات البكسل. ستحتاج أيضًا إلى خط (خط) ، وشكل (شكل) ، وتحديد (تحديد) ، ونقل (نقل) ، وملء (دلو الطلاء). هناك العديد من البرامج المجانية والمدفوعة مع هذه المجموعة من الأدوات. سأتحدث عن الأكثر شعبية والذين أستخدمهم بنفسي.
الطلاء (مجاني)
إذا كان لديك نظام التشغيل Windows، فإن برنامج الرسام المدمج هو برنامج بدائي، ولكنه يحتوي على جميع الأدوات اللازمة لفن البكسل.
(مجاني)
محرر فن بكسل وظيفي بشكل غير متوقع يتم تشغيله من خلال المستعرض. يمكنك تصدير عملك إلى PNG أو GIF متحركة. خيار رائع للمبتدئين.
(مجاني)
GraphicsGale هو المحرر الوحيد الذي سمعت عنه مصممًا خصيصًا لفن البكسل ويتضمن أدوات الرسوم المتحركة. تم إنشاؤه من قبل شركة HUMANBALANCE اليابانية. منذ عام 2017 ، تم توزيعه مجانًا ولا يزال مطلوبًا ، على الرغم من الشعبية المتزايدة لـ Aseprite. لسوء الحظ ، إنه يعمل فقط على Windows.
($)
ربما يكون المحرر الأكثر شعبية في الوقت الحالي. ، العديد من الميزات ، الدعم النشط ، إصدارات لويندوز ، ماك ولينوكس. إذا كنت جادًا بشأن فن البكسل وما زلت لم تجد المحرر المناسب ، فقد يكون هذا هو الخيار المناسب لك.
($$ +)
GameMaker Studio 2 هي أداة ثنائية الأبعاد ممتازة مع محرر Sprite جيد. إذا كنت ترغب في إنشاء فن البكسل لألعابك الخاصة ، فمن الملائم جدًا القيام بكل شيء في برنامج واحد. الآن أستخدم هذا البرنامج في عملي ، مجموعة من 50 لعبة قديمة: أقوم بإنشاء النقوش المتحركة والرسوم المتحركة في GameMaker ، ومجموعات البلاط في Photoshop.
($$$ +)
يعد Photoshop برنامجًا باهظ الثمن ، يتم توزيعه عن طريق الاشتراك ، وليس مصممًا لفن البكسل. لا أوصي بشراء هذا إلا إذا كنت تستخدم الرسوم التوضيحية عالية الدقة أو لا تحتاج إلى القيام بمعالجة معقدة للصور مثلما أفعل. يمكنك إنشاء نقوش متحركة ثابتة وفن البكسل فيه ، ولكنه معقد جدًا مقارنة بالبرامج المتخصصة (مثل GraphicsGale أو Aseprite).
آخر
طقم فن البكسل الخاص بي. كل شيء أسود ، لقد لاحظت للتو.
جهاز لوحي للرسومات ($$ +)
أوصي باستخدام الأجهزة اللوحية الرسومية لأي عمل توضيحي رقمي لتجنب متلازمة النفق الرسغي. الوقاية أسهل بكثير من العلاج. في يوم من الأيام ستشعر بالألم وسيزداد سوءًا - اعتني بنفسك من البداية. نظرًا لحقيقة أنني كنت أرسم بالماوس ، فأنا الآن أجد صعوبة في ممارسة الألعاب التي تتطلب منك الضغط على المفاتيح. أستخدم حاليًا Wacom Intuos Pro S.
دعم المعصم ($)
إذا لم تتمكن من الحصول على جهاز لوحي ، فاشترِ على الأقل فرجارًا للمعصم. المفضل لدي هو حمالة المعصم المجهزة باللون الأخضر Mueller. أما البقية فهي إما ضيقة جدًا أو تقدم دعمًا غير كافٍ. يمكن طلب الفرجار عبر الإنترنت دون أي مشاكل.
96 × 96 بكسل
المعركة النهائية. كابكوم ، 1989
هيا بنا نبدأ! لنبدأ بكائن حرف 96x96 بكسل. على سبيل المثال ، رسمت Orc ووضعته على لقطة الشاشة من Final Fight (الصورة أعلاه) حتى تحصل على المقياس. هذا большой sprite لمعظم الألعاب القديمة ، حجم لقطة الشاشة: 384 × 224 بكسل.
في مثل هذا الكائن الكبير ، سيكون من الأسهل إظهار التقنية التي أريد التحدث عنها. أيضًا ، يعتبر التقديم بكسل تلو الآخر أشبه بأشكال فنية تقليدية (مثل الرسم أو الرسم) قد تكون أكثر دراية بها. بعد إتقان التقنيات الأساسية ، سننتقل إلى النقوش المتحركة الأصغر.
1. اختر لوحة
البكسل مفهوم أعمق بكثير في فن البكسل أكثر من أي عالم رقمي آخر. يتم تعريف فن البكسل من خلال حدوده ، مثل الألوان. من المهم اختيار اللوحة المناسبة ، فهي ستساعد في تحديد أسلوبك. لكن في البداية ، أقترح عدم التفكير في اللوحات واختيار إحدى اللوحات الموجودة (أو مجرد بعض الألوان العشوائية) - يمكنك بسهولة تغييرها في أي مرحلة.
في هذا البرنامج التعليمي ، سأستخدم لوحة الألوان المكونة من 32 لونًا التي أنشأناها من أجل . بالنسبة إلى فن البكسل ، غالبًا ما يتم تجميعها من 32 أو 16 لونًا. تم تصميمها لوحدة تحكم خيالية يمكن أن تظهر في مكان ما بين Famicom و PC Engine. يمكنك أن تأخذه أو أي شيء آخر - لا يعتمد البرنامج التعليمي على اللوحة المختارة على الإطلاق.
2. ملامح خشنة
لنبدأ الرسم باستخدام أداة Pencil. لنرسم المخطط بنفس الطريقة التي نرسمها بقلم وورقة عاديين. بالطبع ، يتداخل فن البكسل مع الفن التقليدي ، خاصة عندما يتعلق الأمر بمثل هذه النقوش المتحركة الكبيرة. تظهر ملاحظاتي أن فناني فن البكسل الأقوياء يجيدون الرسم الحر والعكس صحيح على الأقل. لذا فإن تطوير مهارات الرسم مفيد دائمًا.
3. الكنتور
ننهي الخطوط العريضة: أزل البيكسلات الإضافية وقلل سمك كل خط إلى بكسل واحد. ولكن ما هو بالضبط الزائدة عن الحاجة؟ للإجابة على هذا السؤال ، تحتاج إلى فهم خطوط البكسل والنتوءات.
مطبات
تحتاج إلى تعلم كيفية رسم خطين أساسيين في فن البكسل: الخطوط المستقيمة والمنحنيات. باستخدام القلم والورق ، كل شيء يتعلق بالتحكم في العضلات ، لكننا نعمل باستخدام كتل صغيرة من الألوان.
مفتاح رسم خطوط البكسل المناسبة هو الخشونة. هذه هي وحدات البكسل المفردة أو الأجزاء الصغيرة التي تدمر نعومة الخط. كما قلت من قبل ، فإن البكسل الواحد له أهمية كبيرة في فن البكسل ، لذا فإن التفاوت يمكن أن يفسد الجمالية بأكملها. تخيل أنك ترسم خطًا مستقيمًا على الورق وفجأة يضرب شخص ما على الطاولة: تبدو النتوءات في فن البكسل وكأنها تمايل عشوائي.
الأمثلة على ذلك:
توجيه
منحنيات
يظهر التعرق على المنحنيات عندما لا يزيد طول مقاطع الخط أو ينقص تدريجيًا.
من المستحيل تجنب الصدمات تمامًا - فكل ألعابك القديمة المفضلة بها (ما لم يكن ، بالطبع ، فن البكسل مكونًا بالكامل من أشكال بسيطة). الغرض: تقليل المخالفات ، مع إظهار كل ما تحتاجه.
4. تطبيق الألوان الأولى
قم بتلوين شخصيتك باستخدام أداة تعبئة أو أداة أخرى مناسبة. ستعمل اللوحة على تبسيط هذا الجزء من العمل. إذا كان البرنامج لا يوفر استخدام اللوحات ، فيمكنك وضعها مباشرة في الصورة ، كما في المثال أعلاه ، واختيار الألوان باستخدام القطارة.
في الزاوية اليسرى السفلية ، رسمت صديقنا ، تعرف ، هذا شار. مع ذلك ، سيكون من الأسهل فهم ما يحدث بالضبط في كل مرحلة.
5. التظليل
حان الوقت لتصيير الظلال - فقط أضف ألوانًا أغمق إلى الكائن. لذلك ستبدو الصورة ثلاثية الأبعاد. لنفترض أن لدينا مصدر ضوء واحد يقع فوق شركة مصفاة نفط عمان على يساره. هذا يعني أن كل ما هو فوق وأمام شخصيتنا سوف يضيء. أضف الظلال إلى أسفل اليمين.
الشكل والحجم
إذا كانت هذه الخطوة صعبة بالنسبة لك ، فتخيل الرسم على هيئة أشكال ثلاثية الأبعاد ، وليس مجرد خطوط وألوان. توجد الأشكال في مساحة ثلاثية الأبعاد ويمكن أن يكون لها حجم نبنيها بالظلال. سيساعد هذا في تصور الشخصية بدون تفاصيل وجعلها تبدو وكأنها مصنوعة من الطين بدلاً من البكسل. لا يقتصر التظليل على إضافة ألوان جديدة فحسب ، بل يتعلق ببناء شكل. بالنسبة للشخصية المفصلة جيدًا ، لا تحجب التفاصيل الأشكال الأساسية: إذا قمت بالتحديق ، فسترى عدة مجموعات كبيرة من الضوء والظل.
مكافحة التعرج (مكافحة التعرج)
في كل مرة أستخدم فيها لونًا جديدًا ، أقوم بتطبيق الصقل (AA). يساعد على تنعيم البيكسلات عن طريق إضافة ألوان وسيطة في الزوايا حيث يلتقي مقطعا خطي:
البيكسلات الرمادية تخفف "الفواصل" في السطر. كلما زاد طول المقطع المستقيم ، زاد طول مقطع AA.
هذه هي الطريقة التي تبدو بها AA على كتف شركة Orc. هناك حاجة لتنعيم الخطوط التي تمثل منحنى عضلاته.
يجب ألا يتجاوز Anti-aliasing الكائن الذي سيتم استخدامه في اللعبة أو على خلفية يكون لونها غير معروف. على سبيل المثال ، إذا قمت بتطبيق AA على خلفية فاتحة ، فإن الصقل سيبدو قبيحًا على خلفية داكنة.
6. مخطط انتقائي
في السابق ، كانت الخطوط العريضة سوداء تمامًا ، مما جعل العفريت يبدو كرتونيًا للغاية. بدت الصورة مقسمة إلى أجزاء. على سبيل المثال ، تُظهر الخطوط السوداء على الذراع العضلات بشكل متناقض للغاية ، وتبدو الشخصية أقل صلابة.
إذا أصبح الكائن أكثر طبيعية ، ولم يكن التقسيم واضحًا ، فسيكون من الأسهل قراءة الأشكال الأساسية للشخصية. للقيام بذلك ، يمكنك استخدام مخطط تفصيلي انتقائي - استبدل المخطط الأسود جزئيًا بمخطط أفتح. في الجزء المضيء من الكائن ، يمكنك استخدام الألوان الفاتحة أو ، عندما يكون الكائن على اتصال بمساحة سالبة ، يمكنك إزالة المخطط بالكامل. بدلاً من الأسود ، تحتاج إلى استخدام اللون الذي تم اختياره للظل - وبهذه الطريقة سيتم الحفاظ على التقسيم (للتمييز بين العضلات والفراء وما إلى ذلك).
في هذه المرحلة أيضًا أضفت ظلالًا أغمق. اتضح ثلاث تدرجات من اللون الأخضر على جلد شركة مصفاة نفط عمان. يمكن استخدام أغمق لون أخضر للكونتور الانتقائي و AA.
7. اللمسات الأخيرة
في النهاية ، يجدر إضافة الإبرازات (النقاط الأخف على العفريت) والتفاصيل (الأقراط والأزرار والندوب) وتحسينات أخرى حتى تصبح الشخصية جاهزة أو حتى تضطر إلى الانتقال إلى المرحلة التالية.
هناك العديد من الحيل المفيدة التي يمكن تطبيقها في هذه المرحلة. قم بتدوير الرسم أفقيًا ، وهذا غالبًا ما يساعد في الكشف عن الأخطاء في النسب والتظليل. يمكنك أيضًا إزالة اللون - اضبط التشبع على الصفر لفهم المكان الذي تريد تغيير الظلال فيه.
إحداث ضوضاء (التردد ، التردد)
حتى الآن ، استخدمنا في الغالب بقع كبيرة صلبة من الظلال. ولكن هناك تقنية أخرى - التردد ، والتي تسمح لك بالانتقال من لون إلى آخر دون إضافة لون ثالث. انظر للمثال ادناه.
يستخدم التدرج العلوي الداكن إلى الفاتح مئات من درجات اللون الأزرق المختلفة.
يستخدم التدرج الأوسط تسعة ألوان فقط ، لكنه لا يزال يحتوي على الكثير من الظلال من نفس اللون. هناك ما يسمى النطاقات (من الفرقة الإنجليزية - شريط) ، حيث تركز العين ، بسبب خطوط موحدة سميكة ، على نقاط التلامس للألوان ، بدلاً من الألوان نفسها.
في التدرج اللوني السفلي ، طبقنا ترددًا يتجنب التشويش ويستخدم لونين فقط. نقوم بإنشاء ضوضاء متفاوتة الشدة لمحاكاة التدرج اللوني. هذه التقنية تشبه إلى حد كبير الألوان النصفية المستخدمة في الطباعة ؛ بالإضافة إلى التنقيط (التنقيط - الصورة المحببة) - في الرسوم التوضيحية والرسوم الهزلية.
على الأورك ، ترددت قليلاً لنقل الملمس. بعض فناني البكسل لا يستخدمونه على الإطلاق ، بينما البعض الآخر لا يخجلون ويفعلونه بمهارة شديدة. أجد أن التردد يبدو أفضل في المساحات الكبيرة المليئة بلون واحد (انظر إلى السماء في لقطة شاشة Metal Slug أعلاه) أو المناطق التي يجب أن تبدو خشنة وغير متساوية (مثل الأوساخ). قرر بنفسك كيفية استخدامه.
إذا كنت ترغب في رؤية مثال على التدرج الواسع النطاق وعالي الجودة ، فابحث عن ألعاب The Bitmap Brothers ، أو استوديو بريطاني من الثمانينيات ، أو الألعاب على الكمبيوتر PC-80. فقط ضع في اعتبارك أنهم جميعًا NSFW.
Kakyusei (PC-98). العفريت ، 1996
لا يوجد سوى 16 لونًا في هذه الصورة!
8. النظرة الأخيرة
أحد مخاطر فن البكسل هو أنه يبدو خفيفًا وبسيطًا (بسبب حدود هيكله وأسلوبه). لكن في النهاية ، ستقضي وقتًا طويلاً في ضبط النقوش المتحركة. إنه مثل اللغز الذي يحتاج إلى حل ، وهذا هو السبب في أن فن البكسل يروق للكمال. تذكر أن كائنًا واحدًا لا يجب أن يستغرق وقتًا طويلاً - إنه مجرد قطعة صغيرة من مجموعة معقدة للغاية من القطع. من المهم عدم إغفال الصورة الكبيرة.
حتى لو لم يكن فن البكسل الخاص بك مخصصًا للألعاب ، فمن المفيد أحيانًا أن تقول لنفسك ، "إنه جيد بما فيه الكفاية بالفعل!" وانتقل. أفضل طريقة لتطوير المهارات هي متابعة العملية برمتها من البداية إلى النهاية أكبر عدد ممكن من المرات ، باستخدام أكبر عدد ممكن من الموضوعات.
وأحيانًا يكون من المفيد ترك كائن ما لفترة حتى تتمكن من النظر إليه بعيون جديدة بعد قليل.
32 × 32 بكسل
أنشأنا الكائن الكبير بحجم 96 × 96 بكسل أولاً ، لأنه بهذا الحجم يشبه الرسم أو التلوين ، ولكنه منقسم. كلما كان الكائن أصغر ، قل شكله عما يجب أن يعرضه ، وزادت أهمية كل بكسل.
في Super Mario Bros. عين ماريو عبارة عن وحدتي بكسل مكدسة واحدة فوق الأخرى. وأذنه أيضًا. قال صانع الشخصيات Shigeru Miyamoto إن الشارب ضروري لفصل الأنف عن باقي الوجه. لذا فإن إحدى السمات الرئيسية لوجه ماريو ليست مجرد تصميم شخصية ، بل خدعة واقعية أيضًا. وهو ما يؤكد الحكمة القديمة - "الحاجة أم الإبداع".
نحن على دراية بالفعل بالمراحل الرئيسية لإنشاء كائن 32 × 32 بكسل: الرسم ، واللون ، والظلال ، والمزيد من الصقل. لكن في مثل هذه الظروف ، كرسم مبدئي ، ألتقط الأشكال الملونة بدلاً من رسم الخطوط العريضة بسبب الحجم الصغير. يلعب اللون دورًا أكثر أهمية في تعريف الشخصية من الخطوط العريضة. انظر إلى ماريو مرة أخرى ، ليس لديه خطوط على الإطلاق. ليس فقط الشوارب مثيرة للاهتمام. تحدد سوالفه شكل أذنيه ، والأكمام تظهر ذراعيه ، والشكل العام يعكس بشكل أو بآخر جسده بالكامل.
إنشاء نقوش متحركة صغيرة هو مقايضة مستمرة. إذا أضفت حدودًا ، فقد تفقد مساحة للظل. إذا كانت شخصيتك قد حددت الذراعين والساقين بوضوح ، فمن المحتمل ألا يكون الرأس كبيرًا جدًا. سيؤدي استخدام اللون والتمسيد الانتقائي والصقل الفعال إلى جعل الكائن الذي يتم عرضه يبدو أكبر مما هو عليه بالفعل.
بالنسبة للعفاريت الصغيرة ، أحب أسلوب تشيبي: تبدو الشخصيات لطيفة للغاية ، ولديها رؤوس وعيون كبيرة. طريقة رائعة لخلق شخصية مشرقة في مساحة محدودة ، وبشكل عام ، أسلوب لطيف للغاية. لكن ربما تحتاج إلى إظهار حركية الشخصية أو قوتها ، عندها يمكنك إعطاء مساحة أقل للرأس لجعل الجسم يبدو أكثر قوة. كل هذا يتوقف على تفضيلاتك وأهدافك.
يتم تجميع الفريق بأكمله!
تنسيقات الملفات
مثل هذه النتيجة يمكن أن تجعل أي فنان بكسل متوترًا
الصورة التي تراها هي نتيجة حفظ الصورة بتنسيق JPG. تم فقد جزء من البيانات بسبب خوارزميات ضغط الملفات. سينتهي المطاف بفن البكسل عالي الجودة بمظهر سيئ ، ولن يكون من السهل إعادته إلى لوحته الأصلية.
لحفظ صورة ثابتة دون فقدان الجودة ، استخدم تنسيق PNG. للرسوم المتحركة - GIF.
كيفية مشاركة فن البكسل بالطريقة الصحيحة
تعد مشاركة فن البكسل على وسائل التواصل الاجتماعي طريقة رائعة للحصول على تعليقات ومقابلة فنانين آخرين يعملون بنفس الأسلوب. لا تنس استخدام الهاشتاج #pixelart. لسوء الحظ ، غالبًا ما تقوم الشبكات الاجتماعية بتحويل PNG إلى JPG دون طلب ، مما يؤدي إلى تفاقم عملك. وليس من الواضح دائمًا سبب تحويل صورتك.
هناك بعض النصائح حول كيفية حفظ فن البكسل بالجودة المناسبة لمختلف الشبكات الاجتماعية.
تويتر
للحفاظ على ملف PNG بدون تغيير على Twitter ، استخدم أقل من 256 لونًا ، أو أن حجم ملفك أقل من 900 بكسل. أود زيادة حجم الملف إلى 512 × 512 بكسل على الأقل. وبذلك يكون القياس من مضاعفات 100 (200٪ ، وليس 250٪) ويتم الحفاظ على الحواف الحادة (أقرب الجار في Photoshop).
صور GIF متحركة لمشاركات Twitter لا يزيد وزنها عن 15 ميغا بايت. يجب أن تكون الصورة 800 × 800 بكسل على الأقل ، ويجب أن تتكرر الرسوم المتحركة الحلقية ثلاث مرات ، ويجب أن يكون الإطار الأخير نصف الوقت لكل الإطارات الأخرى - النظرية الأكثر شيوعًا. ومع ذلك ، ليس من الواضح إلى أي مدى ينبغي تلبية هذه المتطلبات ، بالنظر إلى أن تويتر يغير باستمرار خوارزميات عرض الصور الخاصة به.
إنستغرام
بقدر ما أعرف ، لا يمكن نشر صورة على Instagram دون فقدان الجودة. لكنها ستبدو بالتأكيد أفضل إذا قمت بزيادةها إلى 512 × 512 بكسل على الأقل.
المصدر: www.habr.com