लेख एक ऐसी विधि का वर्णन करता है जो रेखाचित्रों के निर्माण को सरल बनाता है। यह उन सभी लोगों के लिए उपयुक्त है जिनका काम उपयोगकर्ताओं के लिए इंटरफेस डिजाइन करना है।

के लिए रेखाचित्र क्या हैं?

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

स्केच डिजाइन के मुद्दे

शासकों का उपयोग करके स्केच को आमतौर पर कागज पर कलम या पेंसिल से खींचा जाता है। कम अक्सर विशेष उपकरण में आकर्षित करते हैं, उदाहरण के लिए - फिम्मा । लेकिन दोनों तरीकों में अपनी कमियां हैं।

हाथ खींचा हुआ

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

लेकिन जब यह एक बड़ी परियोजना की बात आती है, जिसकी संरचना 4-5 पृष्ठों तक सीमित नहीं है, सामग्री का उल्लेख नहीं करना, ड्राइंग कठिन हो जाता है। पृष्ठों पर बार-बार ब्लॉक और तत्व होते हैं जिन्हें व्यक्तिगत रूप से खींचना पड़ता है। यह श्रमसाध्य कार्य है जिसमें बहुत समय लगता है।

चित्र में लिया गया

टूल में खींचे गए स्केच अंतिम डिज़ाइन के नज़दीक हैं। यह क्लाइंट को भ्रमित कर सकता है और उसे यह समझाना होगा कि डिजाइन एक अलग चरण है और परिणाम अलग होगा।

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

निर्णय

मैं एक समाधान का प्रस्ताव करता हूं जिसे मैंने नवीनतम परियोजनाओं में से एक में कार्यान्वित किया है। यह दो पिछले प्रकारों पर आधारित है और आपको जल्दी और लचीले ढंग से हाथ से तैयार किए गए रेखाचित्रों को डिजाइन करने में मदद करता है।

ड्राइंग मॉड्यूल

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

छवि में परिवर्तित करें

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

चादरों को स्कैन करने और पीडीएफ प्रारूप में सहेजने के बाद, यह हमारे लिए रहता है कि हम कंप्यूटर पर फ़ाइलों को डाउनलोड करें और उन्हें जेपीजी में परिवर्तित करें। मैं इसके लिए ऑनलाइन सेवा " PDF.io " का उपयोग करता हूं।

मॉड्यूल टुकड़ा करने की क्रिया और इंटरफ़ेस विधानसभा

हम अंजीर में तैयार चित्रों को लोड करते हैं और फ़्रेम या मास्क का उपयोग करके आवश्यक तत्वों और ब्लॉकों को अलग-अलग मॉड्यूल में काटते हैं।



पृष्ठों पर प्रतियों की संख्या बड़ी हो जाने पर आप उन्हें गतिशील रूप से संपादित करने के लिए "घटक" बना सकते हैं।

यह केवल आवश्यक आर्टबोर्ड बनाने और उनमें आवश्यक मॉड्यूल डालने के लिए रहता है, जैसा कि निर्माता में है।

प्रोटोटाइप सेटअप

इस दृष्टिकोण का एक और लाभ क्लाइंट को भविष्य के इंटरफेस के साथ बातचीत करने की अनुमति देने की क्षमता है। आप बटन क्लिक, पृष्ठ संक्रमण और पॉप-अप को अनुकूलित कर सकते हैं।

परिणाम

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

मैं टेलीग्राम में इंटरफ़ेस डिज़ाइन के बारे में एक चैनल का नेतृत्व करता हूं - @interfacer