YouMind
साइन इन करें

Grok Bot का उपयोग: Figma फोटोमोज़ेक

@mattyp
अंग्रेज़ी07 सित॰ 2026
343K
1.1K
142
49
661

TL;DR

Matt Palmer दिखाते हैं कि कैसे Grok Bot का लाभ उठाकर Figma में थ्री-पैनल फोटोमोज़ेक बनाने की प्रक्रिया को स्वचालित किया जाए, जिसमें प्रॉम्प्ट इंजीनियरिंग और फर्स्ट-प्रिंसिपल्स डिज़ाइन थिंकिंग पर जोर दिया गया है।

आपने अपनी टाइमलाइन पर कुछ तीन-पैनल वाली मोज़ाइक देखी होंगी। यहाँ बताया गया है कि आप उन्हें @bot और @figma के साथ कैसे बना सकते हैं।

https://x.com/kazarov_d/status/2094470313862136145

कोई भी डिज़ाइनर जानता है कि वह इसे कैसे बनाएगा, यह बस थोड़ा सा सिरदर्द है।

https://x.com/studiobakers/status/2095077637639262295

इसलिए हमें पूछना चाहिए "मैं AI का उपयोग करके इसे 90% कम सिरदर्द कैसे बना सकता हूँ, ताकि मैं डिज़ाइन के शानदार, रचनात्मक भागों पर ध्यान केंद्रित कर सकूँ"

Grok Bot बिल्कुल यही कर सकता है।

अगर आपको "कैसे" से कोई मतलब नहीं है और आप सिर्फ एक @bot टेम्पलेट चाहते हैं, तो आप इसे यहाँ पा सकते हैं: https://x.ai/bot/dYpPe1PCZv2WJDVTYDwhc

अन्यथा, यहाँ बताया गया है कि मैंने अपना कैसे बनाया:

फोटोमोज़ेक बनाना

Grok Bot के साथ मेरा सामान्य दृष्टिकोण है: यह समझें कि आप स्वयं एसेट कैसे बनाएंगे, फिर @Bot को बिल्कुल वैसा ही करने का निर्देश दें।

इस मामले में, वर्कफ़्लो Figma में एक डिज़ाइन था।

https://x.com/justinsunyt/status/2096635033603756354

यह सिर्फ एक कैनवास है जिसमें एक हीरो एसेट है, जिसे कम्पोनेंटाइज़ किया गया है और तीन पैनलों में विभाजित किया गया है। हम X पर मौजूदा पोस्ट देखकर आस्पेक्ट रेशियो को रिवर्स इंजीनियर कर सकते हैं।

मैंने Bot से बिल्कुल यही करने के लिए कहा - यहाँ मेरा ऑप्टिमाइज़्ड पहला प्रॉम्प्ट है।

Cursor Gothic, [link to image], और [insert file] को अपने एसेट्स से बदलें।

text
1इस पोस्टिंग फ़ॉर्मेट को रिवर्स इंजीनियर करें - यह तीन छवियों का एक फोटोमोज़ेक है जो एक साझा बैकग्राउंड पर एक चौड़े स्क्रीनशॉट में जुड़ती हैं।
2
3https://x.com/kazarov_d/status/2094470313862136145
4https://x.com/studiobakers/status/2095077637639262295
5
6- प्रत्येक पैनल को पूर्ण रिज़ॉल्यूशन पर खींचें और आस्पेक्ट रेशियो प्राप्त करें।
7
8- तीन एक्सपोर्ट पैनल (बाएँ / केंद्र / दाएँ) क्रॉप करें
9
10- इसे संलग्न फ़ाइल [insert file] में एक नया डिज़ाइन बनाएं - इसे एक सेक्शन में रखें
11
12- सभी तीन पैनलों पर नया बैकग्राउंड [link to image] - इस एसेट का उपयोग करें, संदर्भ पोस्ट के BG का नहीं
13
14- हीरो: एक सिम्युलेटेड 4K डिस्प्ले (2× DPR) पर cursor.com का स्क्रीनशॉट। पेज को ज़ूम करें ताकि UI/टाइप दूर से पढ़ा जा सके। पुष्टि करें कि कैप्चर वास्तव में लैंडर (नेव + हेडलाइन) है
15
16- विंडो पर सेंटर्ड ड्रॉप शैडो + वास्तविक कोना गोलाई। वेबपेज के ऊपरी कोनों को एक क्लिप्ड/मास्क्ड लेयर की आवश्यकता है अन्यथा वे चौकोर दिखेंगे
17
18- आर्क-स्टाइल क्रोम: डार्क Cursor इंक शेल, रंगीन ट्रैफ़िक लाइट्स, Cursor Gothic में केंद्रित URL। टाइटलबार + URL टेक्स्ट को ऊँचाई को गले लगाना चाहिए। पेज के चारों ओर समान इनसेट L/R/B
19
20- Figma में कम्पोनेंट्स के साथ व्यवस्थित करें ताकि एक पेस्ट हर पैनल को अपडेट करे - बैकग्राउंड, हीरो (आर्क), मास्टर, साथ ही मास्टर के तीन एक्सपोर्ट क्लिप
21
22आपका काम तब पूरा होता है जब BG या हीरो को एक बार एडिट करने से मास्टर और तीनों एक्सपोर्ट अपडेट हो जाते हैं।

प्रॉम्प्ट भेजने के बाद, हर कुछ मिनट में अपने bot की जाँच करें - अगर चीज़ें गलत हो रही हैं, तो पूछें क्यों।

हो सकता है कि bot ऑटोलेआउट का ठीक से उपयोग नहीं कर रहा हो। हो सकता है कि पैडिंग गलत हो। हो सकता है कि बॉर्डर रेडियस में बदलाव की आवश्यकता हो।

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

matt palmer - inline image

मेरा bot काम करते हुए देख रहा हूँ

कुछ मेटा-पॉइंट्स:

  • मैं सटीक भाषा का उपयोग कर रहा हूँ। ध्यान दें कि मैंने इसे "फोटोमोज़ेक" कहा, न कि "एक चीज़ पर तीन चीज़ों के रूप में एक तस्वीर"
  • मुझे नहीं पता था कि फोटोमोज़ेक क्या होता है, लेकिन मैंने Grok से पूछा "उसे क्या कहते हैं जब तीन छवियों का एक कोलाज एक बड़ी छवि बनाने के लिए इकट्ठा किया जाता है"
  • हर प्रॉम्प्ट एक शुरुआती मानसिकता से शुरू होना चाहिए - मैं इसे अच्छी तरह से करने के लिए आवश्यक सब कुछ कैसे सीखूँ?
  • मेरा पहला प्रयास सही नहीं था। मैंने Grok Bot से पूछकर उपरोक्त प्रॉम्प्ट तक पहुँचा "मुझे बताएं कि पहली बार में इसे सही पाने के लिए आपको शुरू में क्या चाहिए था"
  • हमेशा पूछते रहें, "मैं इस वर्कफ़्लो को कैसे डुप्लिकेट कर सकता हूँ या सुनिश्चित कर सकता हूँ कि AI अगली बार सब कुछ कर सके?" यह वह बात है जिसे @poteto वास्तव में समझाते हैं।
  • मैंने इसके लिए कोई विशेष bot का उपयोग नहीं किया - बस Figma से जुड़ा एक सामान्य bot। एक बार के काम के लिए, यह ठीक है, लेकिन बार-बार होने वाले कार्यों के लिए मैं शायद एक विशेषज्ञ bot बनाऊँगा।

Grok Bot केवल AI का प्रभावी ढंग से उपयोग करने के बारे में नहीं है - यह एक कंप्यूटर का प्रभावी ढंग से उपयोग करने के बारे में है।

इसका मतलब है मूल सिद्धांतों की सोच, प्रभावी ढंग से संवाद करना और धैर्य रखना। Grok Bot का उपयोग करना ज्यादातर समस्या समाधान के बारे में है।

matt palmer - inline image

तैयार एसेट

साथ ही, अब मेरे पास एक टिकाऊ एसेट है जिसे मैं पुनः उपयोग कर सकता हूँ - जैसा मैंने इस पोस्ट में किया:

matt palmer - inline image

iPad घोषणा पोस्ट के लिए अपने एसेट का पुनरुपयोग

इस फ़ॉर्मेट की समझ के बिना, मैं iPad की घोषणा समय पर नहीं कर पाता।

क्रिएटिव की भूमिका भावना जगाना है।

Grok Bot मुझे एसेट चयन और इमेजरी पर ध्यान केंद्रित करने की अनुमति देता है, जबकि यह बाकी सब कुछ संभाल लेता है।

सबसे आम सवाल जो मुझे मिलता है वह है "मैं Grok Bot का उपयोग कैसे कर सकता हूँ" - यहाँ डिज़ाइन के लिए इसका उपयोग करने का एक तरीका है।

YouMind में रीमिक्स करें

Turn one viral article into a full content workflow

Collect the source, decode the pattern, create assets, draft the story, and distribute from one AI workspace.

Explore YouMind
क्रिएटर्स के लिए

अपने Markdown को एक साफ़-सुथरे 𝕏 आर्टिकल में बदलें

जब आप अपना लंबा कंटेंट पब्लिश करते हैं, तो इमेज, टेबल और कोड ब्लॉक को 𝕏 के लिए फ़ॉर्मेट करना मुश्किल होता है। YouMind पूरे Markdown ड्राफ़्ट को एक साफ़-सुथरे, पोस्ट के लिए तैयार 𝕏 आर्टिकल में बदल देता है।

Markdown से 𝕏 आज़माएँ

समझने के लिए और पैटर्न

हाल के वायरल लेख

और वायरल लेख देखें