फोटोशॉप में वीडियो स्क्रीन मॉकअप कैसे बनाएं

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

वीडियो स्क्रीन मॉकअप क्या है?

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

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

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

ये मूविंग डिज़ाइन वीडियो से लेकर UX/UI डिज़ाइन प्रोटोटाइप या स्क्रीन रिकॉर्डिंग तक कुछ भी हो सकते हैं।

आपको एनिमेटेड स्क्रीन मॉकअप का उपयोग क्यों करना चाहिए?

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

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

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

फोटोशॉप में एनिमेटेड स्क्रीन मॉकअप कैसे बनाएं

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

आपको किस तरह के वीडियो का इस्तेमाल करना चाहिए?

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

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

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

हमारे वीडियो के लिए, हमने Makeuseof.com वेबसाइट को रिकॉर्ड किया है, जिसमें ग्राफिक डिजाइन के बारे में कई लेख दिखाए गए हैं। आप स्क्रीन रिकॉर्ड कर सकते हैं जो आपके लिए समझ में आता है। एक स्थिर स्क्रॉल रखें और सुनिश्चित करें कि यह न तो बहुत तेज़ है और न ही बहुत धीमा है।

एक बार आपकी छोटी रिकॉर्डिंग पूरी हो जाने के बाद, इसे MP4 के रूप में सहेजें और इसे एक आसान-से-पहुंच वाले फ़ोल्डर में रखें।

आपको किस तरह की फोटो का इस्तेमाल करना चाहिए?

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

यह संभव है कि एक बाधित स्क्रीन का उपयोग करें या अधिक जटिल मॉकअप के लिए भारी परिप्रेक्ष्य वाली छवि, लेकिन हम इसे आज ही सरल रखेंगे।

आप अपनी खुद की फोटो ले सकते हैं या रॉयल्टी-मुक्त साइट से डाउनलोड कर सकते हैं, जैसे unsplash. हम इस ट्यूटोरियल के लिए एक प्रीमियर PSD मॉकअप का उपयोग नहीं करेंगे, इसलिए आपको एक खोजने की कोशिश करने की परेशानी की आवश्यकता नहीं होगी।

वीडियो मॉकअप कैसे बनाएं

फ़ोटोशॉप में अपनी छवि खोलें।

यदि आपने छवि को रॉयल्टी-मुक्त साइट से डाउनलोड किया है या इसे उच्च-गुणवत्ता वाले कैमरे से लिया है, तो आकार बहुत बड़ा हो सकता है। आप छवि का आकार नीचे ला सकते हैं।

क्लिक छवि > छवि का आकार. अंतिम आयाम आप पर निर्भर हैं, लेकिन हम लगभग 1200 की चौड़ाई की अनुशंसा करते हैं। आकार बदलते समय छवि की बाधाओं को अनुपात में रखें। क्लिक ठीक.

अब जगह बनाने के लिए जहां वीडियो बैठेगा। अपने मूल वीडियो के आयाम खोजें; यदि आप किसी फ़ोन से स्क्रीन रिकॉर्ड करते हैं, तो फ़ोन का स्क्रीन आयाम ढूंढें, और यदि आपने किसी वेबसाइट को स्क्रीन पर रिकॉर्ड किया है, तो आप मानक 1680 x 1050 का उपयोग कर सकते हैं, जब तक कि आप सटीक आयामों को नहीं जानते।

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

आयत की परत पर, राइट-क्लिक करें और पर जाएँ स्मार्ट ऑब्जेक्ट में कनवर्ट करें. अब आप स्क्रीन में पूरी तरह फिट होने के लिए आयत को रूपांतरित कर सकते हैं। इसका मतलब है कि स्मार्ट ऑब्जेक्ट पर रखी गई कोई भी छवि उसी आकार परिवर्तन का अनुसरण करेगी।

अपने आयत को बदलने के लिए, ट्रांसफ़ॉर्म टूल का उपयोग करें। आप इसे पर जाकर पा सकते हैं संपादित करें > नि: शुल्क रूपांतरण या मार कर सीएमडी + टी (मैक) या Ctrl + टी (खिड़कियाँ)।

ट्रांसफ़ॉर्म टूल केवल आयत के आकार को बदलेगा। आकार को स्क्रीन के समान बदलें जैसा आप कर सकते हैं। फिर डिस्टॉर्ट फीचर का इस्तेमाल करें।

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

आप अपने वीडियो को अपने सही आकार और आकार की स्मार्ट वस्तु में सम्मिलित कर सकते हैं। क्लिक खिड़की > समय एनीमेशन टाइमलाइन खोलने के लिए। सुनिश्चित करें कि यह फ्रेम एनीमेशन के बजाय वीडियो टाइमलाइन पर है।

अपने स्मार्ट ऑब्जेक्ट के लिए थंबनेल पर पेपर और स्क्वायर वाले आइकन पर क्लिक करके लेयर्स पैनल में स्मार्ट ऑब्जेक्ट पर डबल-क्लिक करें। यह एक नई विंडो में खुलता है।

अपने वीडियो को स्मार्ट ऑब्जेक्ट विंडो पर खींचें। आपका वीडियो आपके आयत के आकार जैसा होना चाहिए। यदि आयाम बंद हैं, तो आप इसे आसानी से ठीक कर सकते हैं: कोनों को तब तक खींचें जब तक कि वे पूरी विंडो में फिट न हो जाएं।

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

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

अपना वीडियो देखने के लिए प्ले बटन पर क्लिक करें। लोड होने में कुछ समय लग सकता है और इसलिए वास्तविक समय की तुलना में धीमी गति से चलता है।

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

अब, वीडियो को अपने मॉकअप में सहेजने के लिए, बस स्मार्ट ऑब्जेक्ट विंडो सहेजें। आप पर जाकर ऐसा कर सकते हैं फ़ाइल > सहेजें या मारना सीएमडी + एस (मैक) या Ctrl + S (खिड़कियाँ)। एक बार सहेजे जाने के बाद, स्मार्ट ऑब्जेक्ट विंडो से बाहर निकलें।

आप मॉकअप विंडो पर वापस आ जाएंगे। आप अपने वीडियो को स्क्रीन के स्थान पर देखेंगे।

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

यह आपके पूर्ण वीडियो मॉकअप के साथ एक अंतिम MP4 वीडियो फ़ाइल में परिणत होगा।

वीडियो स्क्रीन मॉकअप के साथ अपने मॉकअप को और आगे ले जाएं

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

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

फोटोशॉप में बॉक्स पैकेजिंग मॉकअप कैसे बनाएं

आगे पढ़िए

लेखक के बारे में