यदि आप बचपन में लेगो के साथ खेलना पसंद करते थे (या वयस्क होने पर भी इसके साथ खेलना जारी रखते थे), तो संभवतः आपको आइसोमेट्रिक पिक्सेल कला में रुचि होगी। यह तकनीकी हो सकता है और चित्रण से अधिक विज्ञान जैसा हो सकता है। लेकिन ऐसी कला में कोई 3डी परिप्रेक्ष्य नहीं है, आप तत्वों को स्थानांतरित कर सकते हैं पर्यावरणअधिकतम सरलता के साथ.

हम पिक्सेल कला के लिए एक तार्किक प्रारंभिक बिंदु के रूप में चरित्र का निर्माण करेंगे, क्योंकि यह हमारे द्वारा बनाई जा सकने वाली अधिकांश अन्य वस्तुओं के अनुपात को निर्धारित करने में मदद करेगा। हालाँकि, पहले आपको आइसोमेट्रिक पिक्सेल कला की कुछ बुनियादी बातें सीखने की ज़रूरत है, और फिर एक चरित्र बनाने के लिए आगे बढ़ना होगा; यदि आप मूल बातें सीखना और घन बनाना नहीं चाहते हैं, तो चरण 3 पर जाएं। अब चलिए शुरू करते हैं।

1. पिक्सेल रेखाएँ

ये पंक्तियाँ आइसोमेट्रिक पिक्सेल कला की सबसे आम (और दिलचस्प) शैली का आधार हैं, जिस शैली का हम इस ट्यूटोरियल में उपयोग करेंगे:

वे प्रत्येक पिक्सेल डाउन के लिए दो पिक्सेल का प्रतिनिधित्व करते हैं। ये रेखाएँ अपेक्षाकृत नरम दिखती हैं और चौकोर सतहों के लिए उपयोग की जाती हैं:

सबसे अधिक उपयोग की जाने वाली रेखा संरचनाएं (जैसे कि नीचे दी गई हैं) अच्छी तरह से काम करेंगी, लेकिन आपके द्वारा बढ़ाए जाने वाले प्रत्येक वेतन वृद्धि के साथ ड्राइंग अधिक कोणीय और खुरदरी हो जाएगी:

इसके विपरीत, यहां कुछ असमान रूप से संरचित पंक्तियाँ दी गई हैं:

बहुत कोणीय और देखने में नहीं आता

सुंदर। इनका प्रयोग करने से बचें.

2. वॉल्यूम

हमारा चरित्र आइसोमेट्री के नियमों का बिल्कुल पालन नहीं करेगा, तो आइए पहले अनुपात तय करने के लिए एक सरल घन बनाएं।

फ़ोटोशॉप में रिज़ॉल्यूशन के साथ एक नया दस्तावेज़ बनाएं 400 x 400 पिक्सल.

मैं मेनू का उपयोग करके उसी फ़ाइल के लिए एक अतिरिक्त विंडो खोलना पसंद करता हूँ विंडो > व्यवस्थित करें > नई विंडो/पाठ।(विंडो > व्यवस्थित करें > नई विंडो…)। यह आवर्धन पर काम करने की अनुमति देता है 600% ज़ूम विंडो में परिणामों की निगरानी करें 100% . ग्रिड का उपयोग करना आपके ऊपर निर्भर है, लेकिन कभी-कभी मुझे यह मददगार से ज्यादा दखल देने वाला लगता है।

आइए दस्तावेज़ पर ज़ूम करें और एक पंक्ति बनाएँ 2:1

मैं उपयोग करना पसंद करता हूं 5% स्लेटीकाले के बजाय, ताकि आप छाया (काला और कम अस्पष्टता) जोड़ सकें और जादू की छड़ी का उपयोग करके प्रत्येक रंग को अलग से चुनने में सक्षम हो सकें।

रेखा खींचने के कई तरीके हैं:

1. प्रयोग करना रेखा उपकरण(लाइन टूल) मोड के साथ पिक्सेल(पिक्सेल), अनियंत्रित चौरसाई(एंटी-एलियास) और मोटाई 1px. ड्राइंग करते समय, कोण टूलटिप दिखना चाहिए 26.6°. वास्तव में, लाइन टूल को सुविधाजनक नहीं कहा जा सकता; सीधे पंक्तियां, यदि कोण सटीक नहीं है।

2. आपको एक चयन बनाना होगा 20 x 40 पिक्सल, फिर K चुनें पेंसिल(पेंसिल टूल) मोटाई 1pxऔर चयन के निचले बाएँ कोने में एक बिंदु बनाएं, फिर कुंजी दबाए रखें बदलावऊपरी दाएं कोने में क्लिक करें. फोटोशॉप अपने आप बन जाएगा नई लाइनदो बिंदुओं के बीच. यदि आप अभ्यास करते हैं, तो आप बिना हाइलाइट किए इस तरह से सीधी रेखाएँ बना सकते हैं।

3. आपको एक पेंसिल से दो पिक्सेल बनाने हैं, उन्हें चुनना है, क्लिक करना है Ctrl+Alt, फिर चयन को एक नए स्थान पर खींचें ताकि पिक्सेल कोनों पर मिलें। आप अपने कीबोर्ड पर तीर कुंजियों को दबाए रखते हुए भी चयन को स्थानांतरित कर सकते हैं Alt. इस विधि को कहा जाता है ऑल्ट-ऑफ़सेट(ऑल्ट-नज)।

तो हमने पहली पंक्ति बनाई। इसे चुनें और इसे चरण 3 की तरह ले जाएँ या नई परत को नीचे ले जाकर बस कॉपी और पेस्ट करें। उसके बाद, मेनू के माध्यम से दूसरी पंक्ति को क्षैतिज रूप से पलटें संपादित करें > रूपांतरण > क्षैतिज पलटें(संपादित करें > रूपांतरण > क्षैतिज पलटें)। मैं इस सुविधा का इतनी बार उपयोग करता हूं कि मैंने इसके लिए एक कीबोर्ड शॉर्टकट भी बना लिया है!

आइए अब अपनी पंक्तियों को संयोजित करें:

फिर, फिर से ऑल्ट-ऑफ़सेट करें, कॉपी को लंबवत रूप से पलटें, और हमारी सतह को पूरा करने के लिए दोनों हिस्सों को मर्ज करें:

अब "तीसरे आयाम" को जोड़ने का समय आ गया है। चौकोर सतह को ऑल्ट-ऑफ़सेट करें और इसे उस पर ले जाएँ 44pxनीचे:

युक्ति: यदि आप चलते समय तीर कुंजियाँ दबाए रखते हैं बदलाव, चयन आगे बढ़ेगा 10 एक के बजाय पिक्सेल.

एक साफ़-सुथरा घन बनाने के लिए, आइए वर्गों से बाएँ और दाएँ पिक्सेल को हटाकर कोनों को नरम करें। उसके बाद लंबवत रेखाएँ जोड़ें:

अब क्यूब के नीचे की अनावश्यक रेखाओं को हटा दें। हमारी आकृति को रंगना शुरू करने के लिए, कोई भी रंग चुनें (अधिमानतः हल्का शेड) और शीर्ष वर्ग को उससे भरें।

अब चयनित रंग की चमक बढ़ाएँ 10% (मैं नियंत्रण कक्ष पर एचएसबी स्लाइडर्स का उपयोग करने की सलाह देता हूं) हमारे रंगीन वर्ग के सामने हल्के कोनों को पेंट करने के लिए। क्योंकि हमने क्यूब को थोड़ा काट दिया है, ये हल्की रेखाएं नीचे की छवि की तरह काले किनारों के ऊपर (उन्हें बदलने के बजाय) अच्छी लगेंगी:

अब हमें काले किनारों को हटाने की जरूरत है। इरेज़र के लिए दूसरी लाइन ड्राइंग विधि की ट्रिक का उपयोग करें (जिसे सामान्य पर सेट किया जाना चाहिए)। इरेज़र उपकरण(इरेज़र टूल), मोड पेंसिल(पेंसिल मोड), मोटाई 1px).

का उपयोग करके शीर्ष वर्ग का रंग चुनें पिपेट(आई ड्रोप्पर उपकरण)। इस टूल को शीघ्रता से चुनने के लिए, दबाएँ Alt. क्यूब के मध्य में ऊर्ध्वाधर रेखा को भरने के लिए परिणामी आईड्रॉपर रंग का उपयोग करें। उसके बाद, रंग की चमक को कम कर दें 15% और क्यूब के बाईं ओर परिणामी रंग भरें। चमक को और कम करें 10% दाईं ओर के लिए:

हमारा क्यूब पूरा हो गया है. ज़ूम इन करने पर यह साफ़ और अपेक्षाकृत चिकना दिखना चाहिए 100% . हम जारी रख सकते हैं.

3. एक अक्षर जोड़ें

चरित्र की शैली पूरी तरह से अलग हो सकती है, आप अपनी इच्छानुसार अनुपात या तत्वों को बदलने के लिए स्वतंत्र हैं। आमतौर पर मैं पतला शरीर और थोड़ा बड़ा सिर पसंद करता हूं। पात्र का पतला शरीर रेखाओं को सीधा और सरल रखने में मदद करता है।

आंखों से शुरुआत करना तर्कसंगत होगा। यदि हम सममितीय कोणों के प्रति सख्त थे, तो चेहरे पर एक आंख नीचे होनी चाहिए, लेकिन छोटे पैमाने पर हम पात्रों के चेहरे को अधिक सुखद बनाने के लिए इस सुविधा की उपेक्षा कर सकते हैं। इससे आकार के बावजूद भी चित्र साफ-सुथरा हो जाएगा।

हम पात्र को छोटा बनाते हैं, क्योंकि कुछ समय बाद आप उसमें एक कार, एक घर, एक पूरा चौराहा या यहाँ तक कि एक शहर भी जोड़ना चाहेंगे। इसलिए, चरित्र सबसे अधिक में से एक होना चाहिए छोटे तत्वचित्रण में. यह ग्राफिकल दक्षता पर भी विचार करने लायक है; चरित्र को यथासंभव आकर्षक बनाने का प्रयास करें न्यूनतम मात्रापिक्सेल (चेहरे की विशेषताओं को दर्शाने के लिए पर्याप्त बड़े)। इसके अलावा, छोटी वस्तुओं को चित्रित करना बहुत आसान होता है। अपवाद तब होता है जब आप केवल किसी चरित्र, उनकी भावनाओं या किसी से उनकी समानता दिखाना चाहते हैं।

आइए एक नई परत बनाएं। आँखों को केवल दो पिक्सेल की आवश्यकता होती है - प्रत्येक आँख के लिए एक, बीच में एक रिक्त पिक्सेल के साथ। आंखों के बाईं ओर एक पिक्सेल छोड़ते हुए, एक लंबवत रेखा जोड़ें:

अब एक और परत जोड़ें और दो पिक्सल की एक क्षैतिज पट्टी बनाएं, यह मुंह होगा। चारों ओर घूमने के लिए अपने कीबोर्ड पर तीर कुंजियों का उपयोग करें और जब आपको सही स्थिति मिल जाए, तो परत को नीचे ले जाएं। ठोड़ी के साथ भी ऐसा ही करें, यह बस एक लंबी रेखा होनी चाहिए:

बालों और सिर के ऊपरी हिस्से को ड्रा करें, फिर कोनों को नरम करें। आपको इसके समान कुछ मिलना चाहिए:

अब दूसरी आंख के बगल में एक खाली पिक्सेल छोड़ें, साइडबर्न जोड़ें (जो चरित्र के कान खींचने में भी मदद करेगा) और उनके ऊपर हेयरलाइन तक कुछ और पिक्सेल जोड़ें। फिर एक और खाली पिक्सेल छोड़ दें, यहीं से कान शुरू होगा और एक रेखा सिर के अंत को चिह्नित करेगी। आगे बढ़ें और उन कोणों को नरम करें जहां रेखाएं मिलती हैं:

कान के शीर्ष के लिए एक पिक्सेल जोड़ें और यदि आप चाहें तो सिर का आकार बदलें; सिर आमतौर पर गर्दन क्षेत्र में पहले से ही खींचे जाते हैं:

ठोड़ी से एक रेखा खींचें - यह छाती होगी। गर्दन की शुरुआत कान क्षेत्र में होगी, कुछ पिक्सेल नीचे और कुछ पिक्सेल तिरछे ताकि हमारे चरित्र के कंधे दिखाई दें:

अब जहां कंधे खत्म होते हैं वहां पर लंबाई की एक खड़ी रेखा लगाएं 12 हाथ के बाहरी हिस्से को बनाने के लिए पिक्सेल, और अंदर बाईं ओर दो पिक्सेल होंगे। हाथ/मुट्ठी बनाने के लिए नीचे की रेखाओं को कुछ पिक्सेल से जोड़ें (इस मामले में कोई विवरण नहीं है, इसलिए उस तत्व को अनदेखा करें) और जहां हाथ समाप्त होता है उसके ठीक ऊपर, एक रेखा जोड़ें 2:1 , जो कमर के रूप में कार्य करेगा, फिर छाती की रेखा खींचेगा और एक संपूर्ण ऊपरी शरीर प्राप्त करेगा। पात्र का दूसरा हाथ दिखाई नहीं दे रहा है, लेकिन यह सामान्य लगेगा क्योंकि यह धड़ से ढका हुआ है।

आपको कुछ इस तरह समाप्त करना चाहिए:

निःसंदेह आप अपनी पसंद के किसी भी अनुपात का उपयोग कर सकते हैं; मुझे चित्र बनाना पसंद है विभिन्न विकल्पयह तय करने से पहले कि कौन सा सबसे अच्छा है।

अब निचले धड़ के लिए हम कुछ और ऊर्ध्वाधर रेखाएँ जोड़ेंगे। मुझे जाना पसंद है 12 तलवों और कमर के बीच पिक्सल. पैर बनाना बहुत आसान है, आपको बस एक पैर को थोड़ा लंबा करने की ज़रूरत है, जिससे चरित्र अधिक विशाल दिखाई देगा:

अब हम रंग डालेंगे. एक अच्छा त्वचा रंग ढूँढना हमेशा मुश्किल होता है, इसलिए यदि आप इस ट्यूटोरियल में उसी रंग का उपयोग करना चाहते हैं, तो उसका कोड #FFCCA5. शेष तत्वों के लिए रंगों का चयन करना कोई समस्या नहीं होनी चाहिए। इसके बाद आस्तीन की लंबाई, शर्ट के कट की स्थिति और उसका स्टाइल तय करें। अब शर्ट को शरीर से अलग करने के लिए एक गहरे रंग की पट्टी लगाएं। मैं सभी सजावटी तत्वों को काले रंग की तुलना में हल्का रखना पसंद करता हूं (खासकर जब कई तत्व एक ही स्तर पर हों, जैसे शर्ट से लेकर चमड़े या पैंट तक)। यह आपको छवि को बहुत अधिक खुरदरा किए बिना आवश्यक कंट्रास्ट प्राप्त करने की अनुमति देता है।

आप लगभग हर रंग क्षेत्र में प्रकाश प्रभाव जोड़ सकते हैं। इससे भी बचें बड़ी मात्राछाया या ग्रेडियेंट का उपयोग। कई पिक्सेल अधिक ( 10% या 25% ) हल्का या गहरा रंग तत्वों को त्रि-आयामी दिखाने और चित्रण की सपाटता को दूर करने के लिए पर्याप्त है। यदि आप किसी ऐसे क्षेत्र में रंग का एक पॉप जोड़ना चाहते हैं जो पहले से ही मौजूद है 100% चमक, इसकी संतृप्ति को कम करने का प्रयास करें। कुछ मामलों में (उदाहरण के लिए, बाल बनाते समय) यह बन सकता है एक अच्छा तरीका मेंरंग बदलें.

बालों के कई विकल्प हैं जिन्हें आप आज़मा सकते हैं। यहाँ कुछ विचार हैं:

जैसे-जैसे आप पात्र बनाना जारी रखते हैं, कपड़ों की शैली, आस्तीन की लंबाई, पैंट की लंबाई, सहायक उपकरण, कपड़े और त्वचा का रंग जैसी छोटी चीजें विविधता के काम आएंगी।

अब बस इतना करना बाकी है कि दोनों तत्वों को एक साथ रखा जाए और मूल्यांकन किया जाए कि वे एक सेटिंग में कैसे दिखते हैं:

यदि आप अपनी रचना निर्यात करना चाहते हैं, तो पीएनजी आदर्श प्रारूप है।

बस, काम हो गया!

मुझे आशा है कि यह पाठ बहुत भ्रमित करने वाला नहीं था। मुझे लगता है कि मैंने इसके बारे में बात की थी अधिकतम मात्रायुक्तियाँ और सौंदर्य तकनीकें। आप अपनी आइसोमेट्रिक पिक्सेल दुनिया का स्वतंत्र रूप से विस्तार कर सकते हैं - इमारतें, कारें, आंतरिक सज्जा, बाहरी भाग। यह सब करना संभव है और दिलचस्प भी, हालांकि इतना आसान नहीं है।

अनुवादक:शापोवाल एलेक्सी

इस ट्यूटोरियल में आप सीखेंगे कि किसी व्यक्ति की फोटो को पिक्सेल आर्ट में कैसे बदला जाए काल्पनिक चरित्र 90 के दशक की शुरुआत से आर्केड गेम।
जेम्स मे - उर्फ ​​स्मजगेथिस - ने 2011 में इस शैली को विकसित किया वीडियो संगीतडबस्टेप रॉक एक्ट के लिए। नीरो की पहली हिट, मी एंड यू - जहां उन्होंने दिखाने के लिए एक एनीमेशन बनाया पुराना खेलनीरो के दो सदस्यों की विशेषता वाला यह गेम डबल ड्रैगन के समान 16-बिट ग्राफिक्स वाला एक 2डी रिदम प्लेटफ़ॉर्मर था, लेकिन सुपर मारियो ब्रदर्स जैसे 8-बिट रेट्रो क्लासिक्स से कहीं बेहतर था।
इस शैली को बनाने के लिए, पात्रों को अभी भी अवरुद्ध होना चाहिए, लेकिन पुराने खेलों की तुलना में अधिक जटिल होना चाहिए। और जबकि आपको लुक प्राप्त करने के लिए सीमित रंग पैलेट का उपयोग करने की आवश्यकता होगी, याद रखें कि इन खेलों में अभी भी 65,536 रंग थे।
यहां जेम्स आपको दिखाता है कि एक साधारण रंग पैलेट और पेंसिल टूल का उपयोग करके फोटो से एक चरित्र कैसे बनाया जाए।
एनीमेशन गाइड की तरह ही, आपको व्यक्ति की फोटो की भी आवश्यकता होगी। जेम्स ने इस ट्यूटोरियल के लिए प्रोजेक्ट फ़ाइलों में शामिल एक पंक की तस्वीर का उपयोग किया।
एक बार पूरा होने पर, इस 16-बिट आफ्टर इफेक्ट्स एनीमेशन ट्यूटोरियल को देखें जहां जेम्स आपको दिखाता है कि इस चरित्र को एई में कैसे लेना है, उसे एनिमेट करना है और रेट्रो गेम प्रभाव लागू करना है।

स्टेप 1

चरित्र के आधार के रूप में उपयोग करने के लिए एनिमेशन गाइड (16 बिट).psd और 18888111.jpg (या अपनी पसंद का फोटो) खोलें। एक पूर्ण-लंबाई वाली प्रोफ़ाइल फ़ोटो सबसे अच्छा काम करेगी और आपके 16-बिट चित्र के लिए रंग पैलेट और स्टाइल प्राप्त करने में मदद करेगी।
एनीमेशन ट्यूटोरियल में अलग-अलग परतों पर कई पोज़ हैं। वह चुनें जो आपके फोटो के पोज़ से सबसे अच्छी तरह मेल खाता हो - चूँकि फ्रेम में हमारे पैर नहीं हैं, इसलिए मैं लेवल 1 पर मानक पोज़ के साथ गया।

चरण दो

रेक्टेंगुलर मार्की टूल (एम) का उपयोग करके, अपने फोटो से हेड का चयन करें और कॉपी करें (Cmd /Ctrl + C) और इसे (Cmd /Ctrl + V) एनिमेशन गाइड (16 बिट) में पेस्ट करें।psd।
छवि को आनुपातिक रूप से फिट करने के लिए स्केल करें। आप देखेंगे कि चूंकि PSD आयाम बहुत छोटे हैं, छवि तुरंत एक पिक्सेल खींचना शुरू कर देगी।

चरण 3

एक नई परत बनाएं और इसमें दिए गए एनीमेशन गाइड और फोटो को आधार के रूप में उपयोग करके, एक एकल पिक्सेल काली पेंसिल (बी) के साथ रूपरेखा बनाएं। \एन
प्रदान की गई मार्गदर्शिका बड़ी बॉस शख्सियतों या पतली महिलाओं से लेकर कई प्रकार के पात्रों को विकसित करने में मदद करती है। यह मेरे पिक्सेल कला पात्रों को बनाने और एनिमेट करने के लिए एक मोटा मार्गदर्शक है।

चरण 4

आईड्रॉपर टूल (I) का उपयोग करके, फोटो में त्वचा टोन के सबसे गहरे क्षेत्र का नमूना लें और रंग का एक छोटा वर्ग बनाएं। चार रंगों वाला त्वचा टोन पैलेट बनाने के लिए इसे तीन बार और करें।
आउटलाइन परत के नीचे एक और परत बनाएं और छवि को शेड करने के लिए एक-पिक्सेल ब्रश और चार-रंग रंग पैलेट का उपयोग करें (फिर से, फोटो को अपने गाइड के रूप में उपयोग करें)। \एन
अपनी कलाकृति के सभी तत्वों या विभिन्न परतों को संग्रहीत करना सबसे अच्छा है क्योंकि इससे उन्हें अन्य आकृतियों पर पुन: उपयोग करना आसान हो जाता है। यह खलनायकों के लिए विशेष रूप से उपयोगी है, क्योंकि अधिकांश 16-बिट गेम बहुत समान संख्याओं का उपयोग करते हैं। उदाहरण के लिए, एक दोस्त के पास लाल शर्ट और एक चाकू हो सकता है, जबकि बाद वाले के पास नीली शर्ट और बंदूक को छोड़कर समान है।

चरण 5

मूल तस्वीर में अन्य तत्वों से मेल खाने के लिए कपड़े को शेड करते हुए, आकृति के अन्य हिस्सों के लिए इस प्रक्रिया को दोहराएं। पहले रंग पैलेट बनाने के लिए आईड्रॉपर टूल के साथ नमूना लेना जारी रखना सुनिश्चित करें, क्योंकि यह रंगों का एक सुसंगत सेट प्रदान करता है जो अच्छा दिखता है और 16-बिट गेम के अपेक्षाकृत सीमित रंग पैलेट में फिट बैठता है।

चरण 6

शेड्स, टैटू, इयररिंग आदि के साथ अपने चरित्र को निखारने के लिए डेटा जोड़ें। यहां भोजन करें और सोचें कि आप अपने चरित्र को गेमिंग वातावरण में कैसा दिखाना चाहते हैं। शायद वे कुल्हाड़ी का उपयोग कर सकते थे या उनके पास रोबोटिक भुजा हो सकती थी?

चरण 7

अपने चरित्र को चेतन करने के लिए, एनीमेशन गाइड की अन्य पाँच परतों का उपयोग करके पिछले चरणों को दोहराएँ। इस प्रक्रिया में महारत हासिल करने और निर्बाध परिणाम बनाने में कुछ समय लग सकता है, लेकिन पिछले फ्रेम से तत्वों का पुन: उपयोग करके शॉर्ट कट बनाया जा सकता है। उदाहरण के लिए, इस छह-फ़्रेम अनुक्रम में, सिर अपरिवर्तित रहता है।

चरण 8

यह जांचने के लिए कि एनीमेशन अनुक्रम क्रम में है, फ़ोटोशॉप में एनीमेशन पैनल खोलें और सुनिश्चित करें कि वर्तमान में एनीमेशन का केवल पहला फ्रेम प्रगति पर है। आप अपना एनीमेशन बनाने के लिए नए फ़्रेम जोड़ सकते हैं और परतों को चालू और बंद कर सकते हैं, लेकिन अधिकांश तेज़ तरीके सेपैनल पॉप-अप मेनू (ऊपर दाएं) में "परतों से फ़्रेम बनाएं" कमांड का उपयोग करना है।
पहला फ्रेम एक खाली पृष्ठभूमि है, इसलिए इसे चुनें और इसे हटाने के लिए पैनल के ट्रैश आइकन (नीचे) पर क्लिक करें।

पिक्सेल-स्तरीय ड्राइंग का अपना विशिष्ट स्थान है ललित कला. सरल पिक्सेल की सहायता से वास्तविक उत्कृष्ट कृतियाँ बनाई जाती हैं। बेशक, आप कागज की शीट पर ऐसे चित्र बना सकते हैं, लेकिन ग्राफिक संपादकों का उपयोग करके चित्र बनाना बहुत आसान और अधिक सही है। इस लेख में हम ऐसे सॉफ़्टवेयर के प्रत्येक प्रतिनिधि का विस्तार से विश्लेषण करेंगे।

दुनिया का सबसे लोकप्रिय ग्राफ़िक्स संपादक जो पिक्सेल स्तर पर काम कर सकता है। इस संपादक में ऐसी तस्वीरें बनाने के लिए, आपको बस कुछ प्रारंभिक सेटअप चरण निष्पादित करने होंगे। यहां वह सब कुछ है जो एक कलाकार को कला बनाने के लिए चाहिए होता है।

लेकिन दूसरी ओर, पिक्सेल कला को चित्रित करने के लिए इतनी अधिक कार्यक्षमता की आवश्यकता नहीं होती है, इसलिए यदि आप इसे केवल किसी विशिष्ट फ़ंक्शन के लिए उपयोग करने जा रहे हैं तो प्रोग्राम के लिए अधिक भुगतान करने का कोई मतलब नहीं है। यदि आप ऐसे उपयोगकर्ताओं में से एक हैं, तो हम आपको अन्य प्रतिनिधियों पर ध्यान देने की सलाह देते हैं जो विशेष रूप से पिक्सेल ग्राफिक्स पर केंद्रित हैं।

पिक्सेलसंपादित करें

इस कार्यक्रम में वह सब कुछ है जो आपको ऐसी पेंटिंग बनाने के लिए चाहिए और यह ऐसे कार्यों से भरा हुआ नहीं है जिनकी कलाकार को कभी आवश्यकता नहीं होगी। सेट अप करना काफी सरल है; रंग पैलेट आपको किसी भी रंग को वांछित टोन में बदलने की अनुमति देता है, और विंडोज़ की मुफ्त आवाजाही आपको प्रोग्राम को अपने लिए अनुकूलित करने में मदद करेगी।

PyxelEdit में कैनवास पर टाइल्स सेट करने की सुविधा है, जो समान सामग्री के साथ ऑब्जेक्ट बनाते समय उपयोगी हो सकती है। परीक्षण संस्करण आधिकारिक वेबसाइट पर डाउनलोड के लिए उपलब्ध है और इसके उपयोग पर कोई प्रतिबंध नहीं है, इसलिए आप खरीदारी करने से पहले उत्पाद को आज़मा सकते हैं।

पिक्सेलफॉर्मर

उपस्थिति और कार्यक्षमता में, यह सबसे साधारण ग्राफिक संपादक है, केवल इसमें कई हैं अतिरिक्त सुविधाओंपिक्सेल छवियाँ बनाने के लिए. यह उन कुछ कार्यक्रमों में से एक है जो बिल्कुल मुफ्त वितरित किए जाते हैं।

डेवलपर्स अपने उत्पाद को पिक्सेल कला बनाने के लिए उपयुक्त नहीं मानते हैं, वे इसे लोगो और आइकन बनाने का एक उत्कृष्ट तरीका कहते हैं।

ग्राफ़िक्सगेल

ऐसे लगभग सभी सॉफ़्टवेयरों में वे एक चित्र एनीमेशन प्रणाली पेश करने का प्रयास करते हैं, जिसके कारण अक्सर यह अनुपयोगी हो जाता है सीमित कार्यऔर गलत कार्यान्वयन। ग्राफ़िक्सगेल भी इसमें उतना अच्छा नहीं है, लेकिन कम से कम यह फ़ंक्शन सामान्य रूप से काम कर सकता है।

जहाँ तक ड्राइंग की बात है, यहाँ सब कुछ बिल्कुल वैसा ही है जैसा कि अधिकांश संपादकों में होता है: बुनियादी कार्य, बड़े रंगो की पटिया, कई परतें बनाने की क्षमता और कुछ भी अतिरिक्त नहीं जो आपके काम में हस्तक्षेप कर सके।

चार्मकर

कैरेक्टर मेकर 1999 ऐसे सबसे पुराने कार्यक्रमों में से एक है। इसे व्यक्तिगत पात्रों या तत्वों को बनाने के लिए बनाया गया था, जिन्हें बाद में अन्य एनीमेशन कार्यक्रमों में उपयोग किया जाएगा या लागू किया जाएगा कंप्यूटर गेम. इसलिए, यह पेंटिंग बनाने के लिए बहुत उपयुक्त नहीं है।

इंटरफ़ेस बहुत अच्छा नहीं है. लगभग किसी भी विंडो को स्थानांतरित या आकार नहीं बदला जा सकता है, और डिफ़ॉल्ट लेआउट बहुत अच्छा नहीं है। हालाँकि, आपको इसकी आदत हो सकती है।

प्रो मोशन एनजी

यह प्रोग्राम लगभग हर चीज़ में आदर्श है, एक सुविचारित इंटरफ़ेस से शुरू होकर, जहाँ विंडोज़ को मुख्य से स्वतंत्र रूप से किसी भी बिंदु पर ले जाना और उनका आकार बदलना संभव है, और एक आईड्रॉपर से एक पेंसिल तक स्वचालित स्विच के साथ समाप्त होता है , जो कि बस एक अविश्वसनीय रूप से सुविधाजनक सुविधा है।

अन्यथा, प्रो मोशन एनजी किसी भी स्तर के पिक्सेल ग्राफिक्स बनाने के लिए सिर्फ अच्छा सॉफ्टवेयर है। परीक्षण संस्करण को आधिकारिक वेबसाइट से डाउनलोड किया जा सकता है और यह तय करने के लिए परीक्षण किया जा सकता है कि आगे पूर्ण संस्करण खरीदना है या नहीं।

एसेप्राइट

सही मायने में सबसे सुविधाजनक और माना जा सकता है सुंदर कार्यक्रमपिक्सेल कला बनाने के लिए. केवल इंटरफ़ेस डिज़ाइन ही इसके लायक है, लेकिन यह एसेप्राइट के सभी फायदे नहीं हैं। एक तस्वीर को चेतन करने की क्षमता है, लेकिन पिछले प्रतिनिधियों के विपरीत, इसे सक्षम और उपयोग में सुविधाजनक तरीके से लागू किया गया है। सुंदर GIF एनिमेशन बनाने के लिए आपकी ज़रूरत की हर चीज़ मौजूद है।

पिक्सेल कला(पिक्सेल ग्राफ़िक्स) आजकल भी गेमिंग के लिए बहुत लोकप्रिय हैं और इसके कई कारण हैं!

तो, पिक्सेल आर्ट को आकर्षक क्या बनाता है:

1. धारणा।पिक्सेल आर्ट अद्भुत दिखता है! स्प्राइट में प्रत्येक व्यक्तिगत पिक्सेल के बारे में बहुत कुछ कहा जा सकता है।
2. उदासी।पिक्सेल आर्ट उन गेमर्स के लिए पुरानी यादें ताज़ा कर देता है जो निंटेंडो, सुपर निंटेंडो, या जेनेसिस (मेरे जैसे!) खेलते हुए बड़े हुए हैं।
3. सीखना आसान है.पिक्सेल कला सीखने के लिए डिजिटल कला के सबसे आसान रूपों में से एक है, खासकर यदि आप एक कलाकार से अधिक एक प्रोग्रामर हैं;]

तो, क्या आप पिक्सेल आर्ट में अपना हाथ आज़माना चाहते हैं? फिर मेरे साथ चलिए क्योंकि मैं आपको दिखाता हूं कि एक सरल लेकिन प्रभावी गेमिंग कैरेक्टर कैसे बनाया जाता है जिसे आप अपने गेम में उपयोग कर सकते हैं! साथ ही, बोनस के रूप में, हम देखेंगे कि इसे iPhone गेम्स में कैसे एकीकृत किया जाए!

सफलतापूर्वक सीखने के लिए, आपको Adobe Photoshop की आवश्यकता होगी। यदि आपके पास यह नहीं है, तो आप Adobe वेबसाइट या टोरेंट से निःशुल्क परीक्षण डाउनलोड कर सकते हैं।

पिक्सेल कला क्या है?

शुरू करने से पहले, आइए स्पष्ट करें कि पिक्सेल आर्ट क्या है, क्योंकि यह उतना स्पष्ट नहीं है जितना आप सोच सकते हैं। पिक्सेल आर्ट क्या है, इसे परिभाषित करने का सबसे आसान तरीका यह परिभाषित करना है कि यह क्या नहीं है, अर्थात्: कुछ भी जहां पिक्सेल स्वचालित रूप से बनाए जाते हैं। यहां कुछ उदाहरण दिए गए हैं:

ढाल: दो रंगों का चयन करें और उनके बीच पिक्सेल के रंग की गणना करें। अच्छा लग रहा है, लेकिन यह पिक्सेल आर्ट नहीं है!

कलंक उपकरण: पिक्सेल को परिभाषित करना और उन्हें बनाने के लिए प्रतिकृति बनाना/संपादित करना नया संस्करणपिछली छवि. फिर, पिक्सेल कला नहीं.

चिकना उपकरण(मूल रूप से कुछ "सुचारू" बनाने के लिए विभिन्न रंगों में नए पिक्सेल उत्पन्न करना)। आपको उनसे बचना चाहिए!

कुछ लोग कहेंगे कि स्वचालित रूप से उत्पन्न रंग भी पिक्सेल कला नहीं हैं, क्योंकि उन्हें मिश्रण प्रभावों के लिए एक परत की आवश्यकता होती है (किसी दिए गए एल्गोरिदम के अनुसार दो परतों के बीच पिक्सेल मिश्रण)। लेकिन चूंकि आजकल अधिकांश उपकरण लाखों रंगों से निपटते हैं, इसलिए इस कथन को नजरअंदाज किया जा सकता है। हालाँकि, पिक्सेल आर्ट में कुछ रंगों का उपयोग करना एक अच्छा अभ्यास है।

अन्य उपकरण जैसे (रेखा) या पेंट बाल्टी उपकरण(पेंट बकेट) भी स्वचालित रूप से पिक्सेल उत्पन्न करता है, लेकिन चूंकि आप उन्हें आपके द्वारा भरे गए पिक्सेल को एंटी-एलियास नहीं करने के लिए सेट कर सकते हैं, इसलिए इन उपकरणों को पिक्सेल आर्ट के अनुकूल माना जाता है।

इस प्रकार, हमें पता चला कि पिक्सेल आर्ट की आवश्यकता है काफी ध्यानप्रत्येक पिक्सेल को स्प्राइट में रखते समय, अक्सर मैन्युअल रूप से और रंगों के सीमित पैलेट के साथ। चलो अब काम पर लग जाओ!

शुरू करना

इससे पहले कि आप अपना पहला पिक्सेल आर्ट एसेट बनाना शुरू करें, आपको पता होना चाहिए कि पिक्सेल आर्ट को स्केल नहीं किया जा सकता है। अगर आप इसे कम करने की कोशिश करेंगे तो सब कुछ धुंधला नजर आएगा। यदि आप इसे ज़ूम इन करने का प्रयास करते हैं, तो जब तक आप दो ज़ूम के गुणक का उपयोग करते हैं तब तक सब कुछ ठीक दिखेगा (लेकिन निश्चित रूप से यह तेज़ नहीं होगा)।

इस समस्या से बचने के लिए, आपको पहले यह समझना होगा कि आपका गेम चरित्र, या गेम तत्व कितना बड़ा होना चाहिए, और फिर काम पर लगना चाहिए। अक्सर यह उस डिवाइस के स्क्रीन आकार पर आधारित होता है जिसे आप लक्षित कर रहे हैं और आप कितने "पिक्सेल" देखना चाहते हैं।

उदाहरण के लिए, यदि आप चाहते हैं कि गेम iPhone 3GS की स्क्रीन पर दोगुना बड़ा दिखे ("हां, मैं वास्तव में अपने गेम को पिक्सेलेटेड रेट्रो लुक देना चाहता हूं!"), जिसका स्क्रीन रिज़ॉल्यूशन 480x320 पिक्सल है, तो आपको यह करना होगा वी. आधे संकल्प के साथ काम करें इस मामले मेंयह 240x160 पिक्सल होगा.

एक नया फ़ोटोशॉप दस्तावेज़ खोलें ( फ़ाइल → नया…) और आकार को उस आकार पर सेट करें जो आपकी गेम स्क्रीन होगी, फिर अपने चरित्र के लिए आकार का चयन करें।

प्रत्येक सेल 32x32 पिक्सेल का है!

मैंने 32x32 पिक्सल को न केवल इसलिए चुना क्योंकि यह चयनित स्क्रीन आकार के साथ पूरी तरह से फिट बैठता है, बल्कि इसलिए भी कि 32x32 पिक्सल 2 का एक गुणक भी है, जो खिलौना इंजनों के लिए सुविधाजनक है (टाइल का आकार अक्सर 2 के गुणक होते हैं, बनावट 2 के गुणक के अनुरूप होती है, वगैरह।

भले ही आप जिस इंजन का उपयोग कर रहे हैं वह किसी भी छवि आकार का समर्थन करता है, आप हमेशा सम संख्या में पिक्सेल के साथ काम करने का प्रयास कर सकते हैं। इस मामले में, यदि छवि को स्केल करने की आवश्यकता है, तो आकार को बेहतर तरीके से विभाजित किया जाएगा, जिसके परिणामस्वरूप अंततः बेहतर प्रदर्शन होगा।

एक पिक्सेल कला चरित्र का चित्रण

पिक्सेल आर्ट को स्पष्ट और पढ़ने में आसान ग्राफिक्स के रूप में जाना जाता है: आप केवल कुछ बिंदुओं के साथ चेहरे की विशेषताओं, आंखों, बालों, शरीर के अंगों को परिभाषित कर सकते हैं। हालाँकि, छवि का आकार इसे कठिन बनाता है: आपका चरित्र जितना छोटा होगा, उन्हें चित्रित करना उतना ही कठिन होगा। अधिक व्यावहारिक होने के लिए, सबसे छोटा चरित्र गुण चुनें। मैं हमेशा आंखें चुनता हूं क्योंकि वे किसी किरदार में जान डालने के सबसे अच्छे तरीकों में से एक हैं।

फ़ोटोशॉप में, चुनें पेंसिल उपकरण(पेंसिल टूल)। यदि आप इसे नहीं ढूंढ पा रहे हैं, तो बस टूल को दबाकर रखें ब्रश टूल(ब्रश टूल) और आप इसे तुरंत देखेंगे (यह सूची में दूसरे स्थान पर होना चाहिए)। आपको बस इसका आकार 1px करने की आवश्यकता होगी (आप टूल विकल्प बार में क्लिक कर सकते हैं और इसका आकार बदल सकते हैं, या बस [ कुंजी दबाए रखें)।

आपको भी आवश्यकता होगी उपकरण मिटाएँ(इरेज़र टूल), इसलिए इस पर क्लिक करें (या ई दबाएं) और ड्रॉपडाउन सूची से चयन करके इसकी सेटिंग्स बदलें तरीका:(तरीका:) पेंसिल(पेंसिल) (क्योंकि इस मोड में कोई एंटी-अलियासिंग नहीं है)।

अब चलो पिक्सेलेटिंग शुरू करें! नीचे दी गई छवि में दिखाए अनुसार भौहें और आंखें बनाएं:

आँख! मैं पिक्सेलित हूँ!!

आप पहले से ही लाइनआर्ट से शुरुआत कर सकते हैं, लेकिन अधिक व्यावहारिक तरीका चरित्र का एक छायाचित्र बनाना है। अच्छी खबर यह है कि इस स्तर पर आपको पेशेवर होने की ज़रूरत नहीं है, बस शरीर के अंगों (सिर, धड़, हाथ, पैर) के आकार और चरित्र की शुरुआती मुद्रा की कल्पना करने का प्रयास करें। ग्रे रंग में कुछ इस तरह आज़माएँ:

इस स्तर पर आपको पेशेवर होने की आवश्यकता नहीं है

ध्यान दें कि मैंने कुछ खाली जगह भी छोड़ी है। आपको वास्तव में पूरे कैनवास को भरने की ज़रूरत नहीं है, भविष्य के फ़्रेमों के लिए जगह छोड़ दें। ऐसे में उन सभी के लिए कैनवास का आकार समान रखना बहुत उपयोगी होगा।

सिल्हूट समाप्त करने के बाद, यह समय है . अब आपको अपने पिक्सेल प्लेसमेंट के साथ अधिक सावधान रहना होगा, इसलिए कपड़े, कवच आदि के बारे में चिंता न करें। सुरक्षित रहने के लिए, आप एक नई परत जोड़ सकते हैं ताकि आप अपना मूल सिल्हूट कभी न खोएं।

यदि आपको लगता है कि पेंसिल टूल चित्र बनाने में बहुत धीमा है, तो आप हमेशा इसका उपयोग कर सकते हैं (लाइन टूल), बस याद रखें कि आप पेंसिल से पिक्सेल को उतनी सटीकता से नहीं रख पाएंगे जितना आप कर सकते हैं। आपको कॉन्फ़िगर करने की आवश्यकता होगी जैसा कि नीचे दिया गया है:

चुनना , दबाना और पकड़ना आयताकार उपकरण(आयत उपकरण)

ड्रॉप-डाउन सूची में टूल विकल्प पैनल पर जाएं टूल मोड चुनें(पथ अनुरेखण मोड) पिक्सेल चुनें, बदलें वज़न(मोटाई) से 1px (यदि पहले से नहीं किया गया है) और अनचेक करें विरोधी उर्फ(स्मूथिंग)। आपके पास यह इस प्रकार होना चाहिए:

ध्यान दें कि मैंने पैरों के लिए निचली रूपरेखा नहीं बनाई है। यह वैकल्पिक है, क्योंकि पैर, पैरों का इतना महत्वपूर्ण हिस्सा नहीं हैं जिन्हें हाइलाइट किया जाए, और इससे कैनवास पर पिक्सेल की एक पंक्ति बच जाएगी।

रंग और छाया लगाना

अब आप हमारे चरित्र को रंगना शुरू करने के लिए तैयार हैं। सही रंग चुनने के बारे में चिंता न करें, बाद में उन्हें बदलना बहुत आसान होगा, बस यह सुनिश्चित करें कि प्रत्येक का अपना "रंग" हो। टैब पर डिफ़ॉल्ट रंगों का उपयोग करें नमूनों(विंडो → नमूने)।

अपने चरित्र को नीचे दिए गए चित्र की तरह रंगें (लेकिन बेझिझक रचनात्मक बनें और अपने खुद के रंगों का उपयोग करें!)

एक अच्छा, विपरीत रंग आपकी संपत्ति की पठनीयता में सुधार करता है!

कृपया ध्यान दें कि मैंने अभी भी कपड़े या बालों की रूपरेखा नहीं बनाई है। हमेशा याद रखें: अनावश्यक आउटलाइन से जितना संभव हो उतने पिक्सेल बचाएं!

प्रत्येक पिक्सेल को चित्रित करने में समय बर्बाद करने की कोई आवश्यकता नहीं है। अपने काम में तेजी लाने के लिए, एक ही रंग की रेखाओं का उपयोग करें, या पेंट बाल्टी उपकरण(पेंट बकेट टूल) अंतरालों को भरने के लिए। वैसे आपको इसे कॉन्फिगर भी करना होगा. चुनना पेंट बाल्टी उपकरणटूलबार पर (या बस G कुंजी दबाएँ) और बदलें सहनशीलता(सहिष्णुता) से 0, और अनचेक भी करें विरोधी उर्फ(स्मूथिंग)।

यदि आपको कभी भी उपयोग करने की आवश्यकता पड़े जादू की छड़ी उपकरण(जादू की छड़ी उपकरण) - बहुत उपयोगी उपकरण, जो एक ही रंग के साथ सभी पिक्सेल का चयन करता है, फिर इसे "पेंट बकेट" टूल की तरह ही सेट करता है - कोई सहनशीलता नहीं और कोई एंटी-अलियासिंग नहीं।

अगला चरण, जिसके लिए आपकी ओर से कुछ ज्ञान की आवश्यकता होगी, चकमा देना और छायांकन करना है। अगर आपको ब्राइट और कैसे दिखाना है इसकी जानकारी नहीं है अंधेरे पक्ष, तो नीचे मैं आपको कुछ निर्देश दूंगा। यदि आपके पास इसका अध्ययन करने के लिए समय या रुचि नहीं है, तो आप इस चरण को छोड़ सकते हैं और "स्पाइस अप योर पैलेट" अनुभाग पर जा सकते हैं, क्योंकि अंत में, आप अपनी छायांकन को मेरे उदाहरण के समान ही बना सकते हैं!

संपूर्ण संपत्ति के लिए एक ही प्रकाश स्रोत का उपयोग करें

इसे वह आकार देने का प्रयास करें जो आप चाहते/सकते हैं, क्योंकि उसके बाद संपत्ति अधिक दिलचस्प लगने लगती है। उदाहरण के लिए, अब आप नाक, भौंहें सिकोड़ती आंखें, बालों का पोछा, पैंट में सिलवटें आदि देख सकते हैं। आप इस पर कुछ हल्के धब्बे भी जोड़ सकते हैं, यह और भी अच्छा लगेगा:

छायांकन करते समय उसी प्रकाश स्रोत का उपयोग करें

और अब, जैसा कि मैंने वादा किया था, प्रकाश और छाया के बारे में एक छोटी सी मार्गदर्शिका:

अपने पैलेट को मसाला दें

कई लोग डिफ़ॉल्ट पैलेट रंगों का उपयोग करते हैं, लेकिन चूंकि कई लोग इन रंगों का उपयोग करते हैं, हम उन्हें कई खेलों में देख सकते हैं।

फ़ोटोशॉप के मानक पैलेट में रंगों का एक बड़ा चयन है, लेकिन आपको इस पर बहुत अधिक भरोसा नहीं करना चाहिए। अपने स्वयं के रंग बनाने का सबसे अच्छा तरीका टूलबार के नीचे मुख्य पैलेट पर क्लिक करना है।

फिर, कलर पिकर विंडो में, वांछित चमक (हल्का या गहरा) और संतृप्ति (उज्ज्वल या नीरस) का चयन करने के लिए एक रंग और मुख्य क्षेत्र का चयन करने के लिए दाएं साइडबार को ब्राउज़ करें।

एक बार जब आपको वह मिल जाए जिसे आप चाहते हैं, तो ओके पर क्लिक करें और पेंट बकेट टूल को पुन: कॉन्फ़िगर करें. चिंता न करें, फिर आप बस 'कॉन्टिगुअस' बॉक्स को अनचेक कर सकते हैं और जब आप एक नए रंग से पेंट करेंगे, तो उसी पृष्ठभूमि रंग वाले सभी नए पिक्सेल भी भर जाएंगे।

यह एक और कारण है कि कम संख्या में रंगों के साथ काम करना और हमेशा एक ही तत्व (शर्ट, बाल, हेलमेट, कवच, आदि) के लिए एक ही रंग का उपयोग करना महत्वपूर्ण है। लेकिन याद रखें कि अन्य क्षेत्रों के लिए अलग-अलग रंगों का उपयोग करें, अन्यथा हमारा चित्र अत्यधिक रंगीन हो जाएगा!

चयनित पिक्सेल को समान रंग से भरने के लिए "सन्निहित" को अनचेक करें

यदि आप चाहें तो रंग बदलें और अधिक ग्लैमरस चरित्र रंग प्राप्त करें! आप रूपरेखाओं को फिर से रंग भी सकते हैं, बस यह सुनिश्चित करें कि वे पृष्ठभूमि के साथ अच्छी तरह मिश्रित हों।

अंत में, करो रंग परीक्षणपृष्ठभूमि: अपने चरित्र के नीचे एक नई परत बनाएं और इसे विभिन्न रंगों से भरें। यह सुनिश्चित करना है कि आपका चरित्र प्रकाश, अंधेरे, गर्म और ठंडे पृष्ठभूमि में दिखाई देगा।

जैसा कि आप पहले ही देख सकते हैं, मैंने अब तक उपयोग किए गए सभी टूल में एंटी-अलियासिंग बंद कर दिया है। इसे अन्य टूल में भी करना न भूलें, जैसे अण्डाकार मार्की(ओवल मार्की) और कमंद(लासो)।

इन उपकरणों से आप आसानी से चयनित हिस्सों का आकार बदल सकते हैं, या उन्हें घुमा भी सकते हैं। ऐसा करने के लिए, किसी क्षेत्र का चयन करने के लिए किसी भी चयन उपकरण का उपयोग करें (या एम दबाएं), राइट-क्लिक करें और चयन करें नि: शुल्क रूपांतरण(फ्री ट्रांसफॉर्म), या बस Ctrl + T दबाएं। चयनित क्षेत्र का आकार बदलने के लिए, परिवर्तन फ़्रेम की परिधि के चारों ओर स्थित हैंडल में से एक को खींचें। अनुपात बनाए रखते हुए चयन का आकार बदलने के लिए, Shift कुंजी दबाए रखें और कोने के एक हैंडल को खींचें।

हालाँकि, फ़ोटोशॉप का उपयोग करके संपादित की गई किसी भी चीज़ को स्वचालित रूप से सुचारू कर देता है नि: शुल्क रूपांतरणइसलिए संपादन से पहले यहां जाएं संपादित करें → प्राथमिकताएँ → सामान्य(Ctrl + K) और बदलें छवि अंतर्वेशन(इमेज इंटरपोलेशन) चालू निकटतम पड़ोसी(निकटतम पड़ोसी)। संक्षेप में, कब निकटतम पड़ोसीनई स्थिति और आकार की गणना बहुत मोटे तौर पर की जाती है, बिना कोई नया रंग या अस्पष्टता लागू किए और आपके द्वारा चुने गए रंगों को बनाए रखते हुए।

iPhone गेम्स में पिक्सेल कला को एकीकृत करना

इस अनुभाग में, आप सीखेंगे कि Cocos2d गेम फ्रेमवर्क का उपयोग करके हमारी पिक्सेल कला को iPhone गेम में कैसे एकीकृत किया जाए। मैं केवल iPhone पर ही विचार क्यों कर रहा हूँ? क्योंकि, यूनिटी के बारे में लेखों की एक श्रृंखला के लिए धन्यवाद (उदाहरण के लिए:, या यूनिटी 2डी में जेटपैक जॉयराइड की शैली में गेम) आप पहले से ही जानते हैं कि यूनिटी में उनके साथ कैसे काम करना है, और क्राफ्टी (ब्राउज़र गेम: स्नेक) के बारे में लेखों से और इम्पैक्ट (इम्पैक्ट पर ब्राउज़र गेम गेम बनाने का परिचय) आपने सीखा कि उन्हें कैनवास में कैसे सम्मिलित किया जाए और ब्राउज़र गेम कैसे बनाया जाए।

यदि आप Cocos2D, या सामान्य रूप से iPhone ऐप डेवलपमेंट में नए हैं, तो मेरा सुझाव है कि आप Cocos2d और iPhone ट्यूटोरियल में से किसी एक से शुरुआत करें। यदि आपके पास Xcode और Cocos2d इंस्टॉल है, तो आगे पढ़ें!

बनाएं नया प्रोजेक्ट iOS → cocos2d v2.x → cocos2d iOS टेम्पलेट, इसे PixelArt नाम दें और डिवाइस के रूप में iPhone चुनें। बनाई गई पिक्सेल कला को अपने प्रोजेक्ट में खींचें, उदाहरण के लिए: sprite_final.png और फिर खोलें हेलोवर्ल्डलेयर.एमऔर आरंभीकरण विधि को निम्नलिखित से बदलें:

-(आईडी) init ( if((self=)) ( CCSprite * हीरो = ; हीरो.पोजीशन = सीसीपी(96, 96); हीरो.फ्लिपएक्स = हाँ; ; ) रिटर्न सेल्फ; )

हम स्प्राइट को स्क्रीन के बाईं ओर रखते हैं और इसे घुमाते हैं ताकि इसका मुख दाईं ओर हो। संकलित करें, चलाएँ, और फिर आप स्क्रीन पर अपना स्प्राइट देखेंगे:

हालाँकि, याद रखें, जैसा कि हमने इस ट्यूटोरियल में पहले चर्चा की थी, हम कृत्रिम तरीके से पिक्सेल के पैमाने को बढ़ाना चाहते थे ताकि प्रत्येक पिक्सेल दूसरों से स्पष्ट रूप से भिन्न हो। तो आरंभीकरण विधि के अंदर इस नई पंक्ति को जोड़ें:

हीरो.स्केल = 2.0;

कुछ भी जटिल नहीं, है ना? संकलित करें, चलाएँ और... रुकें, हमारा स्प्राइट धुंधला है!

ऐसा इसलिए है क्योंकि डिफ़ॉल्ट रूप से Cocos2d ड्राइंग को स्केल करने पर उसे सुचारू कर देता है। हमें इसकी आवश्यकता नहीं है, इसलिए निम्नलिखित पंक्ति जोड़ें:

यह लाइन Cocos2d को एंटी-अलियासिंग के बिना छवियों को स्केल करने के लिए कॉन्फ़िगर करती है, इसलिए हमारा लड़का अभी भी "पिक्सेलेटेड" दिखता है, संकलित करें, चलाएं और... हाँ, यह काम करता है!

पिक्सेल का उपयोग करने के लाभ देखें कला ग्राफिक्स- हम स्क्रीन पर प्रदर्शित छवि से छोटी छवि का उपयोग कर सकते हैं, जिससे बहुत सारी बनावट मेमोरी बच जाती है। हमें रेटिना डिस्प्ले के लिए अलग-अलग छवियाँ बनाने की भी आवश्यकता नहीं है!

आगे क्या होगा?

मुझे आशा है कि आपने इस ट्यूटोरियल का आनंद लिया और पिक्सेल कला के बारे में कुछ और सीखा! अलग होने से पहले मैं तुम्हें कुछ सलाह देना चाहता हूं:

• हमेशा अपनी संपत्ति पर एंटी-अलियासिंग, ग्रेडिएंट्स या बहुत अधिक रंगों के उपयोग से बचने का प्रयास करें। यह आपकी भलाई के लिए है, खासकर यदि आप अभी भी शुरुआती हैं।
• यदि आप वास्तव में रेट्रो शैली का अनुकरण करना चाहते हैं, तो 8-बिट या 16-बिट कंसोल गेम में कलाकृति को देखें।
• कुछ शैलियाँ गहरे रंग की रूपरेखा का उपयोग नहीं करती हैं, अन्य शैलियाँ प्रकाश या छाया के प्रभाव को ध्यान में नहीं रखती हैं। यह सब शैली पर निर्भर करता है! हमारे ट्यूटोरियल में हमने छायाएँ नहीं बनाईं, लेकिन इसका मतलब यह नहीं है कि आपको उनका उपयोग नहीं करना चाहिए।

एक शुरुआत करने वाले के लिए, पिक्सेल आर्ट सीखना सबसे आसान ग्राफ़िक्स जैसा लगता है, लेकिन वास्तव में यह उतना आसान नहीं है जितना लगता है। अपने कौशल को सुधारने का सबसे अच्छा तरीका अभ्यास, अभ्यास, अभ्यास है। मैं आपके काम को पिक्सेल आर्ट मंचों पर पोस्ट करने की अत्यधिक अनुशंसा करता हूं ताकि अन्य कलाकार आपको सलाह दे सकें - यह आपकी तकनीक को बेहतर बनाने का एक शानदार तरीका है! छोटी शुरुआत करें, खूब अभ्यास करें, फीडबैक प्राप्त करें और आप एक अद्भुत गेम बना सकते हैं जो आपके लिए ढेर सारा पैसा और आनंद लाएगा!

एडोब फोटोशॉप: किसी पात्र को बनाएं और चेतन करें पिक्सेल तकनीककला

इस पाठ में आप सीखेंगे कि पिक्सेल आर्ट तकनीक का उपयोग करके पात्रों को कैसे चित्रित और चेतन किया जाए। ऐसा करने के लिए, आपको केवल Adobe Photoshop की आवश्यकता है। परिणाम एक दौड़ते हुए अंतरिक्ष यात्री के साथ एक GIF होगा।

कार्यक्रम: एडोब फोटोशॉप कठिनाई: शुरुआती, मध्यवर्ती स्तर आवश्यक समय: 30 मिनट - घंटा

I. दस्तावेज़ और उपकरण सेट करना

स्टेप 1

टूलबार से पेंसिल चुनें - यह हमारे पाठ का मुख्य उपकरण होगा। सेटिंग्स में, हार्ड राउंड ब्रश प्रकार का चयन करें, और शेष मान चित्र के अनुसार सेट करें। हमारा लक्ष्य पेंसिल निब को यथासंभव तेज़ बनाना है।

चरण दो

इरेज़र टूल (इरेज़र) सेटिंग्स में, पेंसिल मोड का चयन करें, और चित्र में दिखाए अनुसार शेष मान सेट करें।

चरण 3

पिक्सेल ग्रिड चालू करें (देखें > दिखाएँ > पिक्सेल ग्रिड)। यदि मेनू में ऐसा कोई आइटम नहीं है, तो सेटिंग्स पर जाएं और ग्राफ़िक्स एक्सेलेरेशन प्राथमिकताएँ > प्रदर्शन > ग्राफ़िक एक्सेलेरेशन सक्षम करें।

कृपया ध्यान दें: ग्रिड केवल नए बनाए गए कैनवास पर दिखाई देगा जब 600% या अधिक पर ज़ूम किया जाएगा।

चरण 4

प्राथमिकताएँ > सामान्य (नियंत्रण-के) में, छवि इंटरपोलेशन मोड को निकटतम पड़ोसी मोड में बदलें। इससे वस्तुओं की सीमाएँ यथासंभव स्पष्ट रहेंगी।

इकाइयाँ और रूलर सेटिंग्स में, रूलर इकाइयों को पिक्सेल प्राथमिकताएँ > इकाइयाँ और रूलर > पिक्सेल पर सेट करें।

द्वितीय. चरित्र निर्माण

स्टेप 1

और अब जब सब कुछ व्यवस्थित हो गया है, तो हम सीधे चरित्र का चित्रण करने के लिए आगे बढ़ सकते हैं।

अपने चरित्र को एक स्पष्ट रूपरेखा के साथ बनाएं, सावधान रहें कि इसे छोटे विवरणों के साथ अधिभारित न करें। इस स्तर पर, रंग बिल्कुल भी मायने नहीं रखता है, मुख्य बात यह है कि रूपरेखा स्पष्ट रूप से खींची गई है और आप समझते हैं कि चरित्र कैसा दिखेगा। यह रेखाचित्र विशेष रूप से इस पाठ के लिए तैयार किया गया था।

चरण दो

कीबोर्ड शॉर्टकट कंट्रोल+टी, या एडिट > फ्री ट्रांसफॉर्म का उपयोग करके स्केच के स्केल को ऊंचाई में 60 पिक्सेल तक कम करें।

वस्तु का आकार सूचना पैनल में प्रदर्शित होता है। कृपया ध्यान दें कि इंटरपोलेशन सेटिंग्स वैसी ही हैं जैसी हमने चरण 4 में की थीं।

चरण 3

काम को आसान बनाने और परत की अपारदर्शिता को कम करने के लिए स्केच पर 300-400% ज़ूम करें। फिर एक नई परत बनाएं और पेंसिल टूल का उपयोग करके स्केच की रूपरेखा बनाएं। यदि चरित्र सममित है, जैसा कि हमारे मामले में, आप केवल आधे को रेखांकित कर सकते हैं, और फिर इसे डुप्लिकेट कर सकते हैं और इसे दर्पण के रूप में फ़्लिप कर सकते हैं (संपादित करें > ट्रांसफ़ॉर्म > फ़्लिप क्षैतिज)।

लय:जटिल तत्वों को बनाने के लिए, उन्हें भागों में तोड़ें। जब एक पंक्ति में पिक्सेल (बिंदु) एक "लय" बनाते हैं जैसे कि 1-2-3, या 1-1-2-2-3-3, तो स्केच अधिक सहज दिखता है मनुष्य की आंख. लेकिन, यदि स्वरूप को इसकी आवश्यकता हो, तो यह लय बाधित हो सकती है।

चरण 4

जब रूपरेखा तैयार हो जाए, तो आप मुख्य रंग चुन सकते हैं और बड़ी आकृतियों को पेंट कर सकते हैं। इसे आउटलाइन के नीचे एक अलग परत पर करें।

चरण 5

भीतरी किनारे पर छाया खींचकर रूपरेखा को चिकना करें।

छायाएँ जोड़ना जारी रखें. जैसा कि आपने देखा होगा कि चित्र बनाते समय कुछ आकृतियों को ठीक किया जा सकता है।

चरण 6

हाइलाइट्स के लिए एक नई परत बनाएं.

लेयर्स पैनल में ड्रॉप-डाउन सूची से ओवरले ब्लेंड मोड का चयन करें। जिन क्षेत्रों को आप हाइलाइट करना चाहते हैं उन पर हल्के रंग से पेंट करें। फिर फ़िल्टर > ब्लर > ब्लर का उपयोग करके हाइलाइट्स को सुचारू करें।

चित्र पूरा करें, फिर चित्र के तैयार आधे हिस्से को कॉपी करें और मिरर करें, फिर परतों को हिस्सों के साथ जोड़कर एक संपूर्ण चित्र बनाएं।

चरण 7

अब अंतरिक्ष यात्री को कंट्रास्ट जोड़ने की जरूरत है। इसे उज्जवल बनाने के लिए लेवल सेटिंग्स (छवि > समायोजन > स्तर) का उपयोग करें, और फिर रंग संतुलन विकल्प (छवि > समायोजन > रंग संतुलन) का उपयोग करके रंग समायोजित करें।

चरित्र अब एनीमेशन के लिए तैयार है.

तृतीय. चरित्र एनीमेशन

स्टेप 1

परत की एक प्रति बनाएँ (परत > नई > प्रतिलिपि के माध्यम से परत) और इसे 1 पिक्सेल ऊपर और 2 पिक्सेल दाईं ओर ले जाएँ। चरित्र एनीमेशन में यह एक महत्वपूर्ण बिंदु है।

मूल परत की अपारदर्शिता को 50% कम करें ताकि आप पिछला फ़्रेम देख सकें। इसे "प्याज की खाल निकालना" (बहुवचन विधा) कहा जाता है।

चरण दो

अब अपने पात्र के हाथ और पैर ऐसे मोड़ें जैसे वह दौड़ रहा हो।

● हाइलाइट करें बायां हाथलैस्सो उपकरण

● FreeTransformTool (संपादित करें > FreeTransform) का उपयोग करके और नियंत्रण कुंजी को दबाए रखते हुए, कंटेनर की सीमाओं को स्थानांतरित करें ताकि हाथ पीछे चला जाए।

● पहले एक पैर चुनें और उसे थोड़ा सा फैलाएं। फिर इसके विपरीत दूसरे पैर को भींचें ताकि ऐसा लगे कि पात्र चल रहा है।

● एक पेंसिल और इरेज़र का उपयोग करके, कोहनी के नीचे अपने दाहिने हाथ के हिस्से को समायोजित करें।

चरण 3

अब आपको हाथों और पैरों की नई स्थिति को पूरी तरह से दोबारा बनाने की जरूरत है जैसा कि इस पाठ के दूसरे खंड में दिखाया गया है। यह सुनिश्चित करने के लिए आवश्यक है कि छवि स्पष्ट दिखे, क्योंकि परिवर्तन पिक्सेल रेखाओं को बहुत विकृत कर देता है।

चरण 4

दूसरी परत की एक प्रतिलिपि बनाएँ और इसे क्षैतिज रूप से पलटें। अब आपके पास 1 मूल मुद्रा और 2 गति में हैं। सभी परतों की अपारदर्शिता को 100% पर पुनर्स्थापित करें।

चरण 5

टाइमलाइन पैनल प्रदर्शित करने के लिए विंडो > टाइमलाइन पर जाएं और फ्रेम एनिमेशन बनाएं पर क्लिक करें।