स्केच में प्रतीकों का उपयोग कैसे करें

विषय

• स्केच में एक प्रतीक बनाना
• स्केच . में प्रतीकों का आयोजन
• स्केच . में अलग-अलग प्रतीकों को ट्वीक करना
• स्क्रैच . से एक प्रतीक बनाना
• 01. ग्रिड ड्रा करें
• 02. आकार जोड़ें
• 03. चित्र चिपकाएँ
• 04. प्रतीकों में कनवर्ट करें

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

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

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

डिजाइन करते समय प्रतीकों का उपयोग करने से समय की बचत होगी और आपको पहले की तुलना में अधिक तेजी से और वास्तविक रूप से बड़ी तस्वीर तक पहुंचने में मदद मिलेगी।

मेरे डिजाइन का कौन सा हिस्सा प्रतीक होना चाहिए?

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

• पाठ्य सामग्री
• अस्पष्टता
• साया
• सम्मिश्रण मोड

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

एक प्रतीक क्या होना चाहिए, यह तय करने के लिए एक डेवलपर की तरह सोचना एक शानदार तरीका है। दोहराई जाने वाली शैलियों और पदों की तलाश करें, कुछ ऐसा जिसके लिए आप कुछ उपयोगिता CSS लिखेंगे। चीजें जैसे की:

• मेनू (और मेनू आइटम)
• संदेशों की सूची
• विजेट
• शीर्षलेख और पादलेख
• पत्ते

होशियार, तेजी से काम करने के लिए प्रतीक महत्वपूर्ण हैं। ५६ पृष्ठों पर हैडर का पृष्ठभूमि रंग बदलने पर ५६ क्लिक नहीं होने चाहिए। एक बार शुरू करने के बाद, आप कभी पीछे मुड़कर नहीं देखेंगे।

स्केच में एक प्रतीक बनाना

प्रतीक बनाना सरल है। आप उन्हें मौजूदा परत समूहों या ढीली परतों से बना सकते हैं। यदि आप ढीली परतों का एक गुच्छा चुनते हैं, तो प्रतीक बनाते समय स्केच उन्हें आपके लिए समूहित करता है।

वांछित आइटम (वस्तुओं) के चयन के साथ, टूलबार में प्रतीक बनाएं आइकन पर क्लिक करें, या मेनू में परत> प्रतीक बनाएं चुनें। यदि आपने एक समूह चुना है, तो आप परत सूची में राइट-क्लिक भी कर सकते हैं और प्रतीक बनाएँ का चयन कर सकते हैं।

आपके द्वारा अभी-अभी बनाए गए प्रतीक - या दस्तावेज़ के किसी भी प्रतीक का उपयोग करने के लिए - टूलबार में सम्मिलित करें> प्रतीक का चयन करें। बस याद रखें: आपके द्वारा अपने नए प्रतीक में किए गए कोई भी परिवर्तन अन्य उदाहरणों में तुरंत दिखाई देंगे। महान सत्ताओं के साथ ही महान जिम्मेदारियां भी आती हैं।

स्केच . में प्रतीकों का आयोजन

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

स्केच में प्रतीकों के समूह बनाना

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

आपके प्रतीकों को व्यवस्थित करने के कई तरीके हैं (बस कोड की तरह!), लेकिन मैं आमतौर पर उनका उपयोग निम्नलिखित तीन तरीकों से करता हूं:

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

स्केच . में प्रतीकों की अदला-बदली

स्केच एक प्रतीक को दूसरे के लिए स्वैप करने का एक आसान तरीका भी देता है, जो एक दूसरे के समान प्रतीकों के आदान-प्रदान के लिए एकदम सही है (जैसे संशोधित पारदर्शी के लिए एक ठोस शीर्षलेख को स्वैप करना)।

चयनित लक्ष्य प्रतीक के साथ, द इंस्पेक्टर (स्क्रीन के दाईं ओर पैनल) के अंदर प्रतीक ड्रॉपडाउन खोजें।

स्केच . में अलग-अलग प्रतीकों को ट्वीक करना

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

स्केच प्रतीकों में टेक्स्ट सामग्री बदलनाing

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

किसी प्रतीक के एकल उदाहरण के अंदर परिवर्तन करने के लिए, लक्ष्य पाठ परत का चयन करें और निरीक्षक में प्रतीक से पाठ मान बहिष्कृत करें विकल्प की जाँच करें। अब, आप इस पाठ परत में जो भी परिवर्तन करेंगे, वे प्रतीक के इस उदाहरण के लिए स्थानीय रहेंगे।

वास्तविक सामग्री के साथ एक मॉकअप भरना परियोजना अनुमोदन को जीतने का एक लंबा रास्ता तय करता है (क्षमा करें, लोरेम इप्सम!), इसलिए मैं हमेशा प्रतीक से प्रतीक तक पाठ मानों को बदलने के लिए समय लेता हूं।

स्केच प्रतीकों की बदलती शैली

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

• अस्पष्टता: प्रतीक और सभी सामग्री के लिए समग्र अस्पष्टता स्तर बदलें
• साया: प्रतीक में समग्र रूप से एक छाया (या छाया) जोड़ें
• सम्मिश्रण मोड: प्रतीक के सम्मिश्रण मोड (ओवरले, स्क्रीन, आदि) को बदलें

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

स्क्रैच . से एक प्रतीक बनाना

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

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

मैं मोज़ेक गैलरी चुन रहा हूँ क्योंकि इसमें लेयर मास्क का उपयोग करके एक साफ-सुथरा उपचार शामिल है, जो निश्चित रूप से इंटरनेट से यादृच्छिक छवियों के साथ काम करते समय समय बचाएगा।

01. ग्रिड ड्रा करें

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

02. आकार जोड़ें

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

03. चित्र चिपकाएँ

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

04. प्रतीकों में कनवर्ट करें

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

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

शब्दों: क्लार्क विम्बरली

स्केच के साथ डिजाइनिंग के बारे में अधिक जानना चाहते हैं? क्लार्क विम्बर्ली का 10-भाग इनविज़न ईकोर्स, स्केच के साथ डिज़ाइन वर्कफ़्लो, सीधे आपके इनबॉक्स में प्राप्त करें। जब आप साइन अप कर सकते हैं, तो सबसे पहले इनविज़न ब्लॉग पर नज़र रखें।

ये पसंद आया? ये पढ़ सकते हैं!

• स्केच . के साथ शुरुआत करना
• स्केच के साथ वेबसाइट का मजाक कैसे उड़ाएं
• 15 शीर्ष स्केच प्लगइन्स