# UI मॉकअप के लिए GPT Image प्रॉम्प्ट कैसे लिखें

डैशबोर्ड, ऐप स्क्रीन और डिवाइस मॉकअप के लिए GPT Image 2 को प्रॉम्प्ट कैसे दें, ताकि लेआउट अनुमान के मुताबिक बने और लेबल पढ़ने लायक हों।

URL: https://www.gptimagehub.com/hi/guides/gpt-image-ui-mockup-prompts
Category: UI / UX डिज़ाइन
Updated: 2026-10-20
Reading time: 3 minutes

## Direct answer

UI मॉकअप के लिए अच्छे GPT Image प्रॉम्प्ट में प्रोडक्ट, स्क्रीन और उसके मुख्य कंपोनेंट, वह डिवाइस या फ़्रेम जिसमें स्क्रीन दिखेगी, विज़ुअल स्टाइल और वह सटीक टेक्स्ट बताया जाता है जिसका पढ़ने लायक होना ज़रूरी है। कंपोनेंट पढ़ने के क्रम में लिखें और स्क्रीन पर दिखने वाला टेक्स्ट छोटा रखें, क्योंकि मॉडल इंटरफ़ेस टेक्स्ट के पैराग्राफ़ों की तुलना में कुछ बड़े लेबल कहीं ज़्यादा भरोसेमंद ढंग से बनाता है।

## स्क्रीन को वायरफ़्रेम की तरह समझाएँ

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

- प्रोडक्ट और स्क्रीन का नाम लिखें: “SaaS बिलिंग टूल के लिए एनालिटिक्स डैशबोर्ड” या “मेडिटेशन ऐप के लिए ऑनबोर्डिंग स्क्रीन”।
- हिस्सों को क्रम से लिखें: साइडबार नेविगेशन, सर्च वाला टॉप बार, तीन KPI कार्ड, एक लाइन चार्ट और हाल के ट्रांज़ैक्शन की टेबल।
- डेंसिटी बताएँ: खुली-खुली स्पेसिंग, एक जैसे कार्ड साइज़, साफ़ अलाइनमेंट।

## फ़्रेम चुनें: फ़्लैट स्क्रीन, डिवाइस या सीन

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

- फ़्लैट: “फ़्लैट UI स्क्रीनशॉट, कोई डिवाइस फ़्रेम नहीं, 16:9”।
- डिवाइस: “हल्के कोण पर रखे स्लिम लैपटॉप पर, स्क्रीन कैमरे की ओर, हल्के रिफ़्लेक्शन”।
- सीन: “दिन की प्राकृतिक रोशनी में लकड़ी की डेस्क पर लैपटॉप, शैलो डेप्थ ऑफ़ फ़ील्ड”; ध्यान रखें कि इसमें इंटरफ़ेस छोटा और कम पढ़ने लायक होगा।

## इंटरफ़ेस टेक्स्ट छोटा और सटीक रखें

जनरेट किए गए UI में सबसे आम गड़बड़ी पढ़ने लायक टेक्स्ट में ही होती है। सिर्फ़ ज़रूरी कुछ लेबल कोट्स में दें और बाकी को प्लेसहोल्डर लाइनों के रूप में छोड़ दें।

- हेडिंग और बटन हूबहू कोट्स में लिखें: “राजस्व”, “प्लान अपग्रेड करें”।
- बॉडी कॉपी के लिए प्लेसहोल्डर टेक्स्ट लाइनें माँगें।
- असली डेटा की लंबी टेबल से बचें; इसके बजाय सैंपल ट्रांज़ैक्शन की पाँच पंक्तियाँ माँगें।

## विज़ुअल सिस्टम तय करें

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

- रंग: बैकग्राउंड, सरफ़ेस, प्राइमरी एक्सेंट और स्टेटस कलर।
- टाइपोग्राफ़ी: एक सैंस-सेरिफ़ फ़ैमिली, वेट की साफ़ हायरार्की, और हेडिंग व लेबल के साइज़ में कंट्रास्ट।
- कंपोनेंट: कॉर्नर रेडियस, शैडो, बॉर्डर और आइकन स्टाइल।

## Checklist

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

## FAQ

### क्या GPT Image 2 इस्तेमाल करने लायक UI डिज़ाइन बना सकता है?

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

### UI मॉकअप में पढ़ने लायक टेक्स्ट कैसे पाएँ?

पढ़ने लायक टेक्स्ट को कोट्स में दिए कुछ लेबलों तक सीमित रखें, उन्हें बड़ा रखें और बाकी सब कुछ प्लेसहोल्डर लाइनों के रूप में बताएँ। साफ़ सैंस-सेरिफ़ फ़ॉन्ट में छोटे शब्द सबसे भरोसेमंद ढंग से रेंडर होते हैं।

### कई स्क्रीन को एक जैसा कैसे रखें?

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