यह दिखाने के लिए एक अच्छा (और आसान) तरीका क्या है कि स्क्रीनशॉट एक स्क्रीनशॉट है?


14

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

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

तो मेरा सवाल यह है - यह दिखाने के लिए एक आसान, उत्तम दर्जे का तरीका क्या है कि एक छवि वास्तव में एक वेबसाइट का हिस्सा नहीं है? मुझे लगता है कि 5 पिक्सेल ब्लैक बॉर्डर शायद ऐसा करेगा, लेकिन यह उत्तम दर्जे का नहीं है। मुझे वह सूक्ष्म ढाल पसंद है जो OS X करता है, लेकिन क्या वह सभी स्क्रीनशॉट के लिए उपयुक्त है, और क्या इसे बनाना आसान होगा?

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

यहाँ छवि विवरण दर्ज करें

^ मैं जिस समस्या के बारे में बात कर रहा हूं उसका उदाहरण


5
अच्छा उदाहरण है। एक पल के लिए मैंने सोचा कि क्रोम को एक समस्या थी ...
4

1
उत्तम दर्जे के साथ, संदर्भ सब कुछ है। 5px बॉर्डर एक उत्तम दर्जे की के-कार है, एक ड्रॉप शैडो एक उत्तम दर्जे की स्पोर्ट्स कार है, और 1px बॉर्डर उत्तम दर्जे की लक्जरी सेडान है।
क्षितिज अनुपात

1
ImageShack ने आपकी छवि को हटा दिया है, और इसे विज्ञापन बैनर के साथ बदल दिया है। यदि आप कर सकते हैं, तो कृपया संपादक टूलबार में छवि अपलोड बटन का उपयोग करके छवि (या कुछ समतुल्य) को पुनः लोड करें (जो इसे स्टैक एक्सचेंज के इमगुर खाते में अपलोड करेगा)।
इल्मरी करोनें

जवाबों:


8

पूरी तरह से इस बात पर निर्भर करता है कि हम किस प्रकार की छवियों के बारे में बात कर रहे हैं।

इसे करने के संभावित तरीके:

  1. "स्क्रीनशॉट" या "स्क्रेन्केप्ट्योर" कहे जाने वाले किसी कोने में पाठ
  2. कैमरा आइकन किसी कोने या टेक्स्ट और कैमरा आइकन की छवि।
  3. उस उत्तर बॉक्स के मामले में, सबसे सुरक्षित तरीका यह हो सकता है कि वह दूसरे रंग के साथ ओवरले करे और होवर पर छवि को प्रकट करे।
  4. क्योंकि # 3 यह सब स्पष्ट नहीं हो सकता है, यह ओवरले पाठ और / या आइकन के साथ हो सकता है या यदि कोई ओवरले रंग नहीं है तो इसे उलटा भी किया जा सकता है।
  5. किसी प्रकार की सीमा अच्छा संकेतक हो सकती है।

जहाँ तक तकनीकें जाती हैं:

# 1 और # 2
बहुत सारे पेंचवर्क प्रोग्राम वॉटरमार्क की अनुमति देते हैं जो एकल छवियों या कुछ छवियों के लिए आदर्श होगा। कई छवियों के मामले में फ़ोटोशॉप का उपयोग वॉटरमार्क जोड़ने के लिए किया जा सकता है। या एक HTML/CSSकैप्शन।

# 3, # 4 और # 5
इन्हें HTML/CSSकैप्शन के साथ बनाना होगा ।


मदद नहीं कर सकता, लेकिन मेरी एक परियोजना के बारे में सोच सकता हूं ... अब .. "मैं विज्ञापन नहीं करना चाहता ... लेकिन ..." http://photoshopmesta.net/sic/theTest/ कुछ इस तरह से इस्तेमाल किया जा सकता है जब आप छवि पर होवर करते हैं तो यह छवि है।

ऐसा करने के लिए और कुछ नहीं था इसलिए मैंने उदाहरण दिया कि यह कैसे काम कर सकता है http://photoshopmesta.net/1/screenshot/


ओह, मैं अपने iPad पर यह पढ़ रहा था और मुझे यह स्वीकार करना होगा कि मैंने उत्तर छवि पर क्लिक करने की कोशिश की थी। मैं आपको +1 देने के लिए आगे बढ़ा। काश मैं +2 दे पाता जैसा कि उत्कृष्ट उदाहरण था :)


6

यह मेरा व्यक्तिगत पसंदीदा तरीका है, हालांकि सभी स्थितियों में काम नहीं करता है, लेकिन पूर्ण स्क्रीन स्क्रीनशॉट के लिए आदर्श है।

स्क्रीनशॉट को बाहर निकालना


क्या आप इस बारे में विस्तार से बता सकते हैं कि इसे कैसे पूरा किया जाए या कहीं ऐसा लिंक दिया जाए जिसमें एक ट्यूटोरियल हो?
cwd

Ctrl + PrintScrn स्क्रीन को प्रिंट करने के लिए, इसे फोटोशॉप में पेस्ट करें। इंटरनेट से मॉनिटर का एक चित्र प्राप्त करें और इसे फ़ोटोशॉप में खोलें। मॉनिटर के चित्र में अपने स्क्रीनशॉट को कॉपी करें और कोनों को स्क्रीन के आकार में खींचने के लिए एडिट> ट्रांसफॉर्म> डिस्टॉर्ट टूल का उपयोग करें।
स्कॉट ब्राउन

4

अपने स्क्रीनशॉट को सूक्ष्म तरीके से हाइलाइट करते हुए, दृष्टिकोण को सुसंगत रखना एक अच्छा विचार है। मुझे लगता है कि Apple की डिफॉल्ट ड्रॉप शैडो बहुत ज्यादा टैड है।

मैं सिर्फ 40% पर अस्पष्टता के साथ शॉट के लिए एक 3px केंद्रित स्ट्रोक जोड़ता हूं। आप चाहें तो इसमें ड्रॉप शैडो मिला सकते हैं।


धन्यवाद, क्या आप एक उदाहरण जोड़ सकते हैं?
cwd

4

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

आपको एक स्टाइलिश मॉनीटर के रूप में विस्तृत रूप से जाने की ज़रूरत नहीं है, और यदि आप उन सभी को समान आकार नहीं देना चाहते हैं, तो आपकी कार्रवाई बस एक मनमाने ढंग से आकार की छवि में एक ढाल स्ट्रोक जोड़ सकती है। यह आपको ब्रिज से प्रोसेस करने Tools > Photoshop > Batch...और एक्शन में सब कुछ करने की अनुमति देगा ।


4

कुछ चीजें जो मदद करेगी:

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

उदाहरण के लिए:

उदाहरण स्क्रीनशॉट


दूसरी बात अच्छी लगती है। अच्छा है!
भारत में

3

(आपने जवाब देने वाले बॉक्स के शॉट के साथ मुझे बेवकूफ बनाया। बहुत चालाक।) लेकिन मेरे जवाब के लिए ...

मैं सुझाव दूंगा कि बाकी पेज से शॉट को दृष्टिगोचर बनाने के लिए फ्रेम इफेक्ट का उपयोग किया जाए। बस इसे एक दांतेदार कागज का किनारा दें। यही मैं करता हूँ।


मैं फोटोशॉप पर प्रो नहीं हूं - क्या यह करना आसान है?
cwd

आप आसानी से बस एक सफेद आयत बना सकते हैं, इसके ऊपर शॉट रखें, फिर दांतेदार तरीके से फोटो के चारों ओर मिटा दें। फोटोशॉप में करना आसान होना चाहिए।
एंड्रयू डेविस

1

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

$ defaults write com.apple.screencapture disable-shadow -bool TRUE

फिर या तो फिर से शुरू करें या परिवर्तनों को सीधे देखने के लिए निम्नलिखित दर्ज करें:

$ killall SystemUIServer

यहां बताया गया है कि ऊपर को उल्टा कैसे करें:

$ defaults write com.apple.screencapture disable-shadow -bool FALSE
$ killall SystemUIServer

tutsplus.com पर एक उपयोगी लेख के माध्यम से


0

स्क्रीनशॉट को इस तरह दिखाने के लिए, मैंने एक हल्के ग्रे रेडियल ग्रेडिएंट और एक बॉक्स शैडो का उपयोग किया है। इस विधि का सिर्फ सीएसएस के साथ संभव होने का लाभ है - कोई छवि संपादन आवश्यक नहीं:

background: -webkit-radial-gradient(white,white,#e5e6e7);
background: -o-radial-gradient(white,white,#e5e6e7);
background: -moz-radial-gradient(white,white,#e5e6e7);
background: radial-gradient(white,white,#e5e6e7);
box-shadow: 0px 0px 2px #555555;

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.