वेब डिज़ाइन + मैक ओएस - एडोब = स्केच। एक नया उपकरण सभी पुराने से बेहतर है

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

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



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

हम कहां गए

सीमा के लिए कार्यक्रम सरल है, जो यह ध्यान केंद्रित करना संभव बनाता है कि आप क्या आकर्षित करते हैं, और न कि आप इसे कैसे आकर्षित करते हैं। यह इस तरह दिखता है:


बाईं ओर परतें (पहली बार में असामान्य, कुछ दिनों में गुजरती हैं), दाईं ओर चयनित ऑब्जेक्ट के गुण। स्वाभाविक रूप से, रंग और फोंट के लिए अभी भी सिस्टम पैनल हैं।

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



या पूरे दस्तावेज को एक टेम्पलेट के रूप में सहेजें:



एक अंतर्निहित ग्रिड है, जो या तो कॉलम हो सकता है, या, वास्तव में, एक ग्रिड। यह आसानी से कॉन्फ़िगर किया गया है।

उपकरण

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



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



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



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

बचत और निर्यात

स्केच का निर्यात png, jpeg, tiff, pdf, eps (अभी तक यह अच्छी तरह से काम नहीं कर रहा है) और svg से होता है। केवल स्केच और svg खोलता है। डेवलपर्स, हालांकि, पूरे जोरों पर हैं, इसलिए जल्द ही, शायद, वे अन्य स्वरूपों को सीखेंगे, लेकिन psd समर्थन निश्चित रूप से निकट भविष्य में दिखाई नहीं देगा।

यदि आप एक आदर्श डिजाइनर हैं और अपने लेआउट्स को स्वयं लेआउट करते हैं, तो स्केच यहां आपकी सहायता करेगा: वह किसी CSS की वस्तु की शैली की प्रतिलिपि बना सकता है, और यहां तक ​​कि निर्यात करते समय यह केवल वांछित परत को बचाने के लिए संभव बनाता है, किनारों के चारों ओर सभी अतिरिक्त पारदर्शिता को काटता है (सटीक "स्लाइस खींचने की आवश्यकता नहीं") "आइकन के आसपास, उदाहरण के लिए)। और "रेटिनिस्टिक" संस्करण की स्वचालित बचत भी काम करती है यदि आप बॉक्स की जांच करते हैं।

यदि आपको कोडर्स को PSD देने की आवश्यकता है, तो छोटी समस्याएं होंगी। मैंने दो रास्ते खोजे हैं। पहला: पीडीएफ़ के रूप में सहेजें → इलस्ट्रेटर में पीडीएफ खोलें → Psd में पुनः सहेजें, फ़ोटोशॉप में खोलें, परतों को साफ करें। मैं दूसरे का उपयोग करता हूं: Pixelmator में आवश्यक आकार की एक फ़ाइल बनाते हैं → नीचे पृष्ठ की एक तस्वीर के साथ एक परत संलग्न करें → एक समय में एक स्केच से एक पेस्ट करें (सब कुछ png में क्लिपबोर्ड पर कॉपी किया जाता है, स्टाइल के साथ तुरंत ग्रंथ)। प्रक्रिया सरल है, आपको बस कई बार Cmd + C / Cmd + V दबाने की आवश्यकता है। तो Pixelmator निर्यात से psd करने के लिए। एक पल है: psd असम्पीडित हो जाता है और फ़ोटोशॉप के बाद एक ही लेआउट से कई गुना अधिक वजन होता है, इसलिए इसे भेजने से पहले इसे एक ज़िप में संपीड़ित करना बेहतर होता है - फ़ाइल "बहुत वजन कम" करेगी।

बोनस

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



युपीडी। टिप्पणियों ने इंटरफ़ेस तत्वों और सभी प्रकार की वस्तुओं के साथ .sketch टेम्प्लेट्स में कुछ लिंक एकत्र किए: स्केच-टेम्प्लेट्स पर Github , Meng To , Anton Aleinikov , scetchmine (वैसे, वहाँ मेरा "लेंस" कहीं है)।