मार्वल के साथ बिल्कुल सही प्रोटोटाइप और हैंड-ऑफ डिज़ाइन

Sep 11, 2025
कैसे करना है
A person sat in a cafe using Marvel on their laptop and displaying a finished prototype on their smartphone.

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

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

01. अपना पहला मार्वल प्रोजेक्ट बनाएं

Marvel's new design screen, indicating the locations of the buttons to create new designs.

एक बार अपनी परियोजना चुन लेने के बाद, डिजाइन प्रक्रिया शुरू करने के लिए दो बटन में से एक पर क्लिक करें

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

डिज़ाइन प्रोजेक्ट चुनें, फिर इसे एक नाम दें, फिर आईफोन एक्स चुनें और प्रोजेक्ट बनाएं बटन पर क्लिक करें। यहां से (हम इस प्रोजेक्ट डैशबोर्ड को यहां से यहां कॉल करेंगे), बाईं ओर डिज़ाइन बटन पर क्लिक करें, या विंडो के बीच में स्टार्ट डिज़ाइनिंग बटन पर क्लिक करें।

02. डिजाइन कम-निष्ठा प्रोटोटाइप

[5 9] Marvel's protoyping screen, showing how easy it is to add mocked up components, include smartphone camera screens.

आप इस कैमरे की स्क्रीन की तरह तैयार किए गए घटकों का उपयोग और अनुकूलन कर सकते हैं

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

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

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

03. प्रतिक्रिया प्राप्त करें

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

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

04. स्केच के साथ मार्वल को एकीकृत करें

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

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

05. प्रोटोटाइप इंटरैक्शन

Marvel screen showing how you can create interactions, for example placing your thumb on the thumbprint scanner to progress to the next screen.

एक स्क्रीन से दूसरे स्क्रीन को जोड़ने के लिए हॉटस्पॉट बनाने के लिए क्षेत्रों को खींचें

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

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

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

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

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

06. डेवलपर्स को डिजाइन सौंपना

A screen grab of Marvel showing how easy it is for developers to access detailed information from handed off designs, such as the positions and sizes of each element.

डिजाइन हैंडऑफ डिजाइन और डेवलपर के लिए एक दूसरे के साथ काम करने के लिए आसान बनाता है

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

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

यह आलेख मूल रूप से नेट 301 में प्रकाशित किया गया था, वेब डिजाइनरों और डेवलपर्स के लिए दुनिया की सबसे अच्छी बिकने वाली पत्रिका। खरीद [14 9] मुद्दा 301

या नेट की सदस्यता लें ।

पुनरावृत्ति प्रोटोटाइप में अधिक अंतर्दृष्टि प्राप्त करें

Generate NYC 2018 runs from the 25th-27th April 2018

मारिसा मॉर्बी अपनी बात दे रही है कि कैसे पुनरावृत्ति प्रोटोटाइप परीक्षण आपको 25-27 अप्रैल 2018 से न्यूयॉर्क को जेनरेट करने के लिए एक विजेता डिजाइन बनाने में मदद करेगा

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

सौभाग्य से, उसकी बात में 25-27 अप्रैल 2018 से न्यूयॉर्क जेनरेट करें , क्लियरहेड में अनुसंधान के प्रमुख मारिसा मॉर्बी, आपको नए डिजाइनों को बनाने और सत्यापित करने का एक बेहतर तरीका दिखाएगा जो पुनरावृत्ति प्रोटोटाइप और परीक्षण का उपयोग करके पारंपरिक डिजाइन प्रक्रिया की तुलना में तेज़, आसान और कम महंगे हैं।

न्यूयॉर्क जेनरेट 25-27 अप्रैल 2018 से होता है। अब अपना टिकट प्राप्त करें ।

संबंधित आलेख: [20 9]

  • 10 शीर्ष प्रोटोटाइप उपकरण [20 9]
  • 18 सर्वश्रेष्ठ वायरफ्रेम उपकरण [20 9]
  • प्रोटोटाइप नुकसान से कैसे बचें [20 9]

कैसे करना है - सर्वाधिक लोकप्रिय लेख

Create god rays in V-Ray

कैसे करना है Sep 11, 2025

वास्तविक दुनिया फोटोग्राफी में, प्रकाश की किरणे�..

Step-by-step: How to mimic oil paint in Corel Painter

कैसे करना है Sep 11, 2025

यह कल की तरह ही लगता है जब मैं नाइट्स, जादूगरों, बर्बर और अंधेरे में छिपे ह�..

How to design graphic figures

कैसे करना है Sep 11, 2025

मेरे चित्रण कैरियर के पहले के वर्षों में मैं यथार..

Master the science of conversion rate optimisation

कैसे करना है Sep 11, 2025

रूपांतरण दर अनुकूलन (सीआरओ) मौजूदा यातायात से रूप..

Master the Bridge tool

कैसे करना है Sep 11, 2025

पुल उपकरण क्या है? यदि आप सीजीआई के लिए नए है�..

How to create digital assets

कैसे करना है Sep 11, 2025

डिजिटल उपयोग के लिए संपत्ति तैयार करना एक मूल कार..

Create better character animations in Maya

कैसे करना है Sep 11, 2025

चींटी वार्ड हमारे कलाकारों में से एक होगा जो आप�..

Sharpen your still life painting skills

कैसे करना है Sep 11, 2025

मेरे आस-पास की दुनिया को चित्रित करने से बेहतर कुछ भी नहीं है, लेकिन जब मैं..

श्रेणियाँ