क्या स्केच ऐप में "जेनरेट सीएसएस / एचटीएमएल" फीचर या प्लगइन है

Question

मुझे एक स्क्रिप्ट मिली है जो वास्तव में ऐसा करती है (परतों के लिए CSS और HTML उत्पन्न करता है और उन% मूल्यों में निर्यात करने का एक विकल्प प्रदान करता है) और फ़ोटोशॉप के लिए आधे में वेब-देव के लिए काम में कटौती करता है। अब मैं उत्सुक हूं कि कोई भी प्लगइन के साथ आया है या मुझे स्केच ऐप के लिए एक मूल विशेषता की तरह इंगित कर सकता है। इस तरह की अनुपस्थिति स्केच के लिए मेरा संक्रमण वास्तव में दर्दनाक बना रही है। या स्केच के लिए नया होने के नाते मैं बस वैचारिक रूप से सीएसएस और एचटीएमएल के साथ काम करने के तरीके के बारे में कुछ अलग याद कर रहा हूं।

Answer 1

यह काफी जवाब नहीं हो सकता है जिसे आप ढूंढ रहे हैं, लेकिन मैं इसे इंजीनियरों को औसत दर्जे की, ऑटो-जनरेटेड स्टाइल सौंपने से बेहतर समझता हूं।

चयनात्मक मार्कअप

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

बेशक कोई चयनकर्ता नहीं है, यह वास्तव में सिर्फ सीएसएस नोट हैं। प्रत्येक ब्लॉक को परत के नाम का उपयोग करके पूर्ववर्ती टिप्पणी द्वारा बुलाया जाता है, जैसे:

/* Rectangle 1: */
background: #C7C1B5;

/* Rectangle 1 Copy: */
background: #F5E618;

/* Rectangle 1 Copy 2: */
background: #FFFFFF;

फ़ाइल एनोटेशन

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

एनोटेशन से परे

आप अकेले या संयोजन में, इन जैसे टूल आज़मा सकते हैं:

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

प्रायोगिक HTML जनरेटर

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

ब्लेड स्वचालित रूप से HTML उत्पन्न करने के लिए एक स्केच 3 प्लगइन है। यह समूह के लिए टैग <div>, पाठ के लिए टैग <p> आदि उत्पन्न करेगा।

Comments

मैंने ब्लेड रीडमी को आर्किटेक्चर ओवरव्यू / गाइड के साथ दूसरों के लिए बेहतर बनाने के लिए इसे बेहतर बनाने के लिए बेहतर काम करने का मौका दिया ... github.com/kristianmandrup/blade

हमने प्रोटॉपशिप यूआईपीएड जारी किया है जो ठीक यही करता है। यह स्केच के लिए एक कोड जनरेटर है जो स्केच डिज़ाइन को HTML, CSS, SASS और रिएक्ट घटकों में परिवर्तित करता है। यह सीएसएस के लिए बीईएम का उपयोग करता है और पूर्ण स्थिति के बजाय मार्जिन, पेडिंग, फ्लोट्स और फ्लेक्सबॉक्स का उपयोग करता है। protoship.io/tools/uipad.html ।

— जसिम

"हमने जारी किया है" भ्रामक है - प्रोटॉशिप एक साल के लिए एक प्रतीक्षा सूची रही है, और अभी भी है।

— क्रिस मोसचिनी

Answer 2

निम्नलिखित लिंक देखें http://blog.mengto.com/the-best-hidden-features-in-sketch/

दिलचस्प स्केच ट्यूटोरियल, टिप्स और यहां तक ​​कि ट्रिक्स के साथ अद्यतित रखने के लिए मेंग टू के ब्लॉग का पालन करें। http://blog.mengto.com/ https://designcode.io/

Comments

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

— एंड्रयू एचएच