Claude का उपयोग करके "AI-ish" डिज़ाइन से आगे बढ़ने के 3 तरीके

@nobel_824
जापानी2 दिन पहले · 16 जुल॰ 2026
342K
315
19
0
1.1K

TL;DR

यह लेख Claude का उपयोग करके ऐसे पेशेवर डिज़ाइन तैयार करने की तीन रणनीतियों को रेखांकित करता है जो मानवीय समझ, स्पष्ट उद्देश्य और घटक-आधारित वर्कफ़्लो पर जोर देकर सामान्य AI लुक से बचते हैं।

AI ने विभिन्न क्षेत्रों में मानवीय क्षमताओं को लगभग छू लिया है, लेकिन डिज़ाइन लंबे समय से उन क्षेत्रों में से एक रहा है जहाँ AI को संघर्ष करना पड़ता है। हालाँकि, मुझे लगता है कि बहुत से लोग "AI के साथ डिज़ाइन करने" के अर्थ को थोड़ा गलत समझते हैं।

इस लेख में, लियोन लिन (@LexnLin) की पोस्ट "How To Actually Design With AI" के आधार पर, मैंने AI का उपयोग करके डिज़ाइन करने के व्यावहारिक तरीकों को जापानी में सावधानीपूर्वक व्यवस्थित किया है।

लेख के अंत में, मैं Claude के साथ उच्च गुणवत्ता वाले डिज़ाइन बनाने के लिए एक डिज़ाइन सिस्टम किट वितरित कर रहा हूँ।

tatsuki | Claude Code活用支援 on X — cover

आप इसे लेख के नीचे प्राप्त कर सकते हैं।

ध्यान रखने योग्य पूर्वापेक्षाएँ

"AI के साथ डिज़ाइन करने" का मतलब सब कुछ AI पर छोड़ देना नहीं है। विचार, दिशा, अंतर्ज्ञान और रचनात्मकता अंततः आपसे ही आती है। AI को उन चीजों को "आकार देने (निष्पादित करने)" के लिए कुछ समझना आसान है।

सामान्य प्रवाह में ये 3 चरण होते हैं:

  1. स्वयं विचार विकसित करें
  2. प्रेरणा एकत्र करें
  3. अपने विचारों को प्रॉम्प्ट में बदलें और AI से बनवाएँ
tatsuki | Claude Code活用支援 - inline image

आप कोई भी टूल या वातावरण (हार्नेस) जैसे Cursor, Codex, या Claude का उपयोग कर सकते हैं। सार आपके "विचारों को निर्देशों में बदलने" में निहित है।

AI निष्पादन में बहुत अच्छा है, लेकिन इसमें अभी तक वास्तविक रचनात्मकता नहीं है। यह सफ़ेद स्थान, टाइपोग्राफी, रंग सिद्धांत और पदानुक्रम जैसे "डिज़ाइन नियमों" को समझता है। हालाँकि, यह नहीं समझ सकता कि वास्तव में "अच्छा," "मौलिक," या "सार्थक" क्या है - दूसरे शब्दों में, स्वाद (Taste)

यह सबसे बड़ा अंतर है। इस बिंदु पर, आप AI को वास्तविक स्वाद नहीं दे सकते, लेकिन आप यह मानकर उस सीमा को दूर कर सकते हैं कि यह मौजूद है।

tatsuki | Claude Code活用支援 - inline image

विधि 1: डिज़ाइन स्किल्स का उपयोग करना

यह सबसे तेज़ तरीका है। जब आपके पास समय न हो या आप कुछ छोटा बना रहे हों, तो पहले से तैयार "डिज़ाइन स्किल्स" पर भरोसा करना प्रभावी होता है।

उदाहरणों में शामिल हैं:

प्रक्रिया बहुत सरल है:

  1. डिज़ाइन स्किल्स जोड़ें
  2. AI को संदर्भ दें
  3. कुछ प्रॉम्प्ट भेजकर साइट, ऐप या पोस्टर बनवाएँ
  4. स्पष्ट समस्याओं को ठीक करें
  5. प्रकाशित करें

परिणाम आमतौर पर "काफी अच्छे" होते हैं। वे अन्य AI-जनित डिज़ाइनों के समान दिख सकते हैं, लेकिन उच्च गुणवत्ता वाली स्किल्स का उपयोग करने से सबसे खराब विफलताओं और "AI-जैसी" दिखने से बचा जाता है। यह वह तरीका है जिसका उपयोग कई लोग वास्तव में करते हैं।

विधि 2: AI के साथ स्वयं डिज़ाइन करना

यदि आप कुछ ऐसा बनाना चाहते हैं जो "वास्तव में अलग दिखे," तो आपको एक कदम और आगे जाना होगा। आप चाहते हैं कि उपयोगकर्ता आपके उत्पाद को छूने पर महसूस करें कि यह "अच्छी तरह से सोचा-समझा" है - इसके लिए अधिक जानबूझकर की गई प्रक्रिया की आवश्यकता है।

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

"अर्थ" से शुरू करें

सबसे पहले और सबसे महत्वपूर्ण, नींव को परिभाषित करें। इन प्रश्नों के उत्तर देने का प्रयास करें:

  • यह किसके लिए है?
  • यह किस समस्या का समाधान करता है?
  • इसे कैसा महसूस होना चाहिए?
  • यह किसका प्रतीक है?

UI किसी उत्पाद के "अर्थ" को दर्शाता है। इन्हें लिख लें। आप यहाँ AI का भी उपयोग कर सकते हैं, लेकिन तरकीब यह है कि इसका उपयोग डिज़ाइन के लिए नहीं, बल्कि आपसे प्रश्न पूछने के लिए करें।

उदाहरण के लिए, AI से आपको यह पूछने को कहें:

  • यह उत्पाद किस बारे में है?
  • लक्षित उपयोगकर्ता कौन हैं?
  • आप कौन सी भावनाएँ व्यक्त करना चाहते हैं?
  • ब्रांड का माहौल कैसा होना चाहिए?
  • कौन से रंग और फ़ॉन्ट उपयुक्त हैं?
  • न्यूनतम / चंचल / प्रीमियम / तकनीकी / प्रयोगात्मक — कौन सी दिशा?

प्रेरणा एकत्र करें

एक बार दिशा तय हो जाने के बाद, संदर्भ एकत्र करना शुरू करें। एक शक्तिशाली स्रोत Mobbin है, जिसमें विभिन्न श्रेणियों में वास्तविक उत्पाद स्क्रीन हैं।

यहाँ महत्वपूर्ण बात केवल यह देखना और यह सोचना नहीं है कि "यह अच्छा लग रहा है।" अपने आप से पूछें कि यह अच्छा क्यों है

  • क्या यह लेआउट है?
  • सफ़ेद स्थान?
  • टाइपोग्राफी?
  • संरचना?
  • इंटरैक्शन?

जो चीज़ें आपको पसंद हैं उन्हें सहेजें और उन्हें इस प्रकार फ़ोल्डरों में व्यवस्थित करें:

  • नेविगेशन
  • हीरो
  • प्राइसिंग
  • कार्ड्स
  • मोबाइल स्क्रीन
  • डैशबोर्ड
  • एनिमेशन
  • टाइपोग्राफी

अपनी स्वयं की संदर्भ लाइब्रेरी विकसित करने में समय लगाना ही वह तरीका है जिससे आप "स्वाद" विकसित करते हैं।

अन्य सहायक स्रोतों में Pinterest, Cosmos, Awwwards, Webflow Templates, Craftwork, Rebrand Gallery, Component Gallery, Savee और Lummi शामिल हैं।

नोट: डिज़ाइन को पूरी तरह से कॉपी करने से बचें। कई विचारों को मिलाकर और उन्हें अपने उत्पाद में फिट करने के लिए उन्नत करना महत्वपूर्ण है।

संरचना का मानचित्र बनाएं

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

एक ऐप के लिए, यह ऑनबोर्डिंग, होम, सर्च, प्रोफाइल, सेटिंग्स, कोर फ्लो और खाली स्टेट्स हो सकता है।

प्रत्येक अनुभाग के लिए स्पष्ट सामग्री की आवश्यकता होती है। हीरो सेक्शन के लिए, आपको एक हेडलाइन, विवरण, CTA और विज़ुअल्स की आवश्यकता होती है। AI कॉपी में मदद कर सकता है, लेकिन "स्पष्टता" अंततः आपसे ही आती है।

घटक द्वारा निर्माण करें

अंत में, उत्पादन करने का समय आ गया है। आपके द्वारा संदर्भित व्यक्तिगत विचारों को लें और उन्हें अपने उत्पाद में फिट करने के लिए पुनर्निर्माण करें।

"पूरी वेबसाइट बनाओ" कहने के बजाय, कुंजी यह है कि "इस शैली के आधार पर, मेरे ब्रांड के अनुरूप एक हीरो सेक्शन बनाएं।"

चरण-दर-चरण आगे बढ़ें: नेविगेशन → हीरो → कार्ड्स → बटन → टाइपोग्राफी → विवरण। AI छोटे कार्यों में बहुत बेहतर है, और यह आपको नियंत्रण बनाए रखने की अनुमति देता है।

कस्टम एसेट्स जनरेट करें

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

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

समग्र कार्यप्रवाह

संक्षेप में, प्रवाह इस प्रकार दिखता है:

  1. विचार को परिभाषित करें
  2. उद्देश्य और उपयोगकर्ता को स्पष्ट करें
  3. ब्रांड दिशा तय करें
  4. संदर्भ एकत्र करें
  5. उन्हें व्यवस्थित करें
  6. संरचना का मानचित्र बनाएं
  7. घटक बनाएं
  8. एसेट्स जनरेट करें
  9. इंटरैक्शन जोड़ें
  10. पूरी चीज़ को पॉलिश करें
tatsuki | Claude Code活用支援 - inline image

एक ही प्रॉम्प्ट से बनाने की तुलना में आपको बहुत बेहतर परिणाम मिलते हैं।

विधि 3: प्रेरणा बोर्ड का उपयोग करना

एक थोड़ा तेज़ "मध्य मार्ग" भी है। सब कुछ एक-एक करके जोड़ने के बजाय, आप AI को संदर्भों का एक क्यूरेटेड सेट प्रदान करते हैं।

Mobbin, Awwwards, Webflow आदि से स्क्रीनशॉट इकट्ठा करें और पूछें:

कृपया मेरे उत्पाद के लिए एक डिज़ाइन बनाने के लिए इन संदर्भों की शैली और दिशा को संयोजित करें। हालाँकि, उन्हें बिल्कुल कॉपी न करें।

बेशक, यह मानता है कि आपने पर्याप्त संदर्भ प्रदान किया है और AI को पहले प्रश्न पूछने दिया है। यह मैन्युअल काम से तेज़ है, लेकिन एक सामान्य एक-शॉट प्रॉम्प्ट की तुलना में बहुत बेहतर परिणाम देता है।

3 तरीकों का सारांश

  • विधि 1: डिज़ाइन स्किल्स — तेज़, अच्छे परिणाम
  • विधि 2: घटक-आधारित — धीमा, लेकिन उच्चतम गुणवत्ता
  • विधि 3: प्रेरणा बोर्ड — संतुलित
tatsuki | Claude Code活用支援 - inline image

अन्य उपयोगी उपकरण

  • SVG जनरेशन: Quiver जैसे उपकरण SVG बना सकते हैं। चूँकि तत्व अलग होते हैं, इसलिए उन्हें एनिमेट करना आसान होता है।
  • वीडियो: Google Flow जैसे उपकरण। हीरो, बैकग्राउंड और प्रोडक्ट डेमो को बेहतर बना सकते हैं।
  • इमेज लाइब्रेरी: Lummi जैसे प्लेटफ़ॉर्म। लेकिन ऐसी इमेज चुनें जो ब्रांड में फिट हों।
  • लेयरिंग: बैकग्राउंड हटाने और लेयरिंग के साथ गहराई, गति और इंटरैक्शन जोड़ें। विवरणों का संचय बहुत बड़ा अंतर पैदा करता है।

निष्कर्ष

AI आपकी सोच का विकल्प नहीं है।

  • क्या बनाना है
  • यह क्यों महत्वपूर्ण है
  • यह किसके लिए है
  • इसे कैसा महसूस होना चाहिए

आप ही हमेशा ये चीज़ें तय करते हैं। AI बस उन्हें तेज़ी से निष्पादित करता है। सबसे अच्छे परिणाम बेहतर प्रॉम्प्ट से नहीं, बल्कि बेहतर स्वाद से आते हैं।

यह लेख लियोन लिन ([@LexnLin](https://x.com/@LexnLin)) के X पोस्ट "How To Actually Design With AI" के आधार पर जापानी में पुनर्निर्मित किया गया था।

मैं LINE पर मुफ्त में "Claude Design System Kit" वितरित कर रहा हूँ।

tatsuki | Claude Code活用支援 - inline image
tatsuki | Claude Code活用支援 - inline image

▼ "Claude Design System Kit" प्राप्त करने के लिए LINE पर रजिस्टर करें

https://t.co/90omRA4UQ7

कृपया Open Chat (LINE OpenChat) में शामिल हों, और फिर नोट्स में उल्लिखित आधिकारिक LINE से भेजें:

Design System

और आप लाभ प्राप्त करने में सक्षम होंगे।

※ कृपया Open Chat के भीतर ही कीवर्ड न भेजें।

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

tatsuki | Claude Code活用支援 - inline image

▼ "Claude Design System Kit" प्राप्त करने के लिए LINE पर रजिस्टर करें

https://t.co/90omRA4UQ7

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 से 𝕏 आज़माएँ

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

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

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