00:00:00क्लोड डिज़ाइन आपके फ्रंट-एंड काम के लिए
00:00:01अब तक की सबसे बेहतरीन चीज़ है।
00:00:05लेकिन अगर आप नहीं जानते कि आप क्या कर रहे हैं,
00:00:06तो आप अपना पूरा इस्तेमाल का कोटा खत्म कर देंगे
00:00:09इससे पहले कि आप एक लैंडिंग पेज बना सकें।
00:00:11लेकिन यह क्लोड डिज़ाइन मास्टरक्लास
00:00:12उस समस्या को हल करने में मदद करेगी
00:00:14क्योंकि मैं आपको दिखाऊंगा कि कौन से फीचर्स वास्तव में आपके समय के लायक हैं।
00:00:17इसके अलावा, हम एक सीधा मुकाबला करेंगे
00:00:19सामान्य क्लोड कोड बनाम क्लोड डिज़ाइन के साथ।
00:00:22और हम कुछ दिलचस्प उपयोग के मामलों के बारे में बात करेंगे
00:00:25जो साधारण लैंडिंग पेज के काम से परे हैं।
00:00:27यह एक अद्भुत टूल है और हमें बहुत कुछ कवर करना है।
00:00:30तो चलिए शुरू करते हैं।
00:00:31तो क्लोड डिज़ाइन, Google के स्टिच के जवाब में एंथ्रोपिक का टूल है।
00:00:35और Google स्टिच की तरह ही,
00:00:37यह हमें हमारे वेब ऐप्स, मोबाइल ऐप्स,
00:00:40और यहां तक कि स्लाइड डेक के लिए भी कई विज़ुअल मॉकअप बनाने की क्षमता देता है।
00:00:43क्लोड डिज़ाइन का उपयोग करने के लिए, इसे वेब ऐप पर होना चाहिए।
00:00:45तो claud.ai/design पर जाएं।
00:00:47यह क्लोड कोड में उपलब्ध नहीं है
00:00:48और यह डेस्कटॉप ऐप पर भी उपलब्ध नहीं है।
00:00:51और सीमाओं की बात करें तो,
00:00:52एक बड़ी सीमा जिसे हमें तुरंत बताना होगा
00:00:54वह है उपयोग की सीमाएं।
00:00:56इसकी अपनी साप्ताहिक सीमा है और यह सीमा वही है
00:00:59चाहे आप प्रो, मैक्स 5, या 20X पर हों।
00:01:02और यह चीज़ एक संसाधन खाने वाला राक्षस है,
00:01:05खासकर यदि आप किसी ऐसे टूल का उपयोग करते हैं
00:01:08जिसके बारे में हम इस वीडियो में बाद में बात करेंगे।
00:01:10लेकिन उन सीमाओं के बावजूद,
00:01:11क्लोड डिज़ाइन एक बहुत बड़ी छलांग है
00:01:14जब क्लोड के साथ फ्रंट-एंड डिज़ाइन के काम की बात आती है।
00:01:17ट्वीक सिस्टम जैसी चीजें यह देखना बहुत आसान बनाती हैं कि
00:01:20अलग-अलग बदलाव आपके वेब ऐप के
00:01:23कुल अहसास को कैसे समायोजित करेंगे।
00:01:23एडिट जैसी चीजें आपको बहुत जल्दी गहराई में जाने की अनुमति देती हैं
00:01:28और टेक्स्ट प्रॉम्प्ट पर निर्भर रहे बिना
00:01:30चीजों को बारीकी से बदलने की अनुमति देती हैं।
00:01:31लेकिन अगर आप कमेंट सिस्टम के साथ बने रहना चाहते हैं,
00:01:33तो हम ऐसा कर सकते हैं।
00:01:34उनके पास एक वास्तविक कमेंट बटन है
00:01:35जहां मैं वेब ऐप के अलग-अलग हिस्सों को चुन सकता हूं
00:01:39और कमेंट छोड़ सकता हूं जो सीधे क्लोड कोड पर जाते हैं
00:01:42या मेरी टीम के अन्य सदस्यों के लिए कमेंट कतार में जुड़ जाते हैं
00:01:46ताकि वे अपने विचार जोड़ सकें, क्योंकि यह बहुत सहयोगात्मक है।
00:01:48आप इन डिज़ाइनों को अन्य लोगों के साथ साझा कर सकते हैं
00:01:50और आप सभी अलग-अलग जगहों से एक ही चीज़ पर काम कर सकते हैं।
00:01:53मैं ऐप पर ड्रॉ कर सकता हूं कि मैं क्या बदलाव चाहता हूं।
00:01:56मैं प्रेजेंटेशन को फुल स्क्रीन में बहुत आसानी से देख सकता हूं।
00:02:00और सबसे महत्वपूर्ण बात,
00:02:02मैं इसे बहुत आसानी से क्लोड कोड में एक्सपोर्ट कर सकता हूं।
00:02:05और यह डिज़ाइन विज़ुअल फॉरवर्ड सेटअप इसे इतना आसान बना देता है
00:02:09कि आपको जिस तरह के फ्रंट-एंड आउटपुट चाहिए
00:02:11वह मिल जाएं, बजाय इसके कि आप पूरी तरह से क्लोड कोड के अंदर हों
00:02:13और कोड डेव सर्वर रिफ्रेश बैक द कोड
00:02:18डायनामिक जो हमारे पास लंबे समय से है, उसे करना पड़े।
00:02:19लेकिन इस टूल का अधिकतम लाभ उठाने के लिए,
00:02:21कुछ चीजें हैं जो आपको पता होनी चाहिए।
00:02:22तो हम सबसे पहले एक वेब ऐप के लिए
00:02:25फ्रंट-एंड डिज़ाइन के काम से शुरू करेंगे, जो ज्यादातर लोग ढूंढ रहे हैं।
00:02:29और हम यह भी दिखाएंगे कि क्लोड कोड हमें क्या देता
00:02:33बनाम क्लोड डिज़ाइन।
00:02:34ताकि आप देख सकें कि हमें यहां क्या मिल रहा है
00:02:37और क्या यह इसके लायक भी है।
00:02:38लेकिन ऐसा करने से पहले, हमारे प्रायोजक की ओर से एक छोटी सी बात, यानी मैं।
00:02:42तो हमने अभी क्लोड कोड मास्टरक्लास
00:02:44चेज़ एआई प्लस के बजाय जारी किया है।
00:02:45और यह शून्य से एआई डेव तक जाने का नंबर एक तरीका है,
00:02:48खासकर यदि आप तकनीकी पृष्ठभूमि से नहीं आते हैं।
00:02:51और हाल ही में हम अपने एजेंटिक ओएस सिस्टम पर ध्यान केंद्रित कर रहे हैं
00:02:54मास्टरक्लास के अंदर,
00:02:55जहां हम क्लोड कोड का उपयोग एक इंजन के रूप में करते हैं
00:02:58और हम इसे मेमोरी के लिए ऑब्सीडियन के साथ,
00:03:00अपने पूरे Google सुइट को जोड़ने के लिए GWS के साथ पूरक करते हैं।
00:03:03और फिर इस नींव के साथ,
00:03:05किसी भी और सभी अनुकूलित कौशल पैक को जोड़कर,
00:03:09हम ऐसे समाधान निकाल सकते हैं जो हमारे उपयोग के मामलों के लिए समझ में आते हैं।
00:03:12और हम इस बारे में भी बात करते हैं कि कैसे इसे पैक करें
00:03:14और इसे क्लाइंट्स को बेचें।
00:03:15तो अगर यह कुछ ऐसा है जिसमें आप रुचि रखते हैं,
00:03:17तो निश्चित रूप से इसे देखें।
00:03:18यह चेज़ एआई प्लस के अंदर है,
00:03:19पिन किए गए कमेंट में एक लिंक होगा।
00:03:21तो चलिए क्लोड डिज़ाइन और आपके वेब ऐप के बारे में बात करते हैं,
00:03:24क्योंकि हमें कुछ फैसले लेने की ज़रूरत है
00:03:26इससे पहले कि हम इसे प्रॉम्प्ट करना शुरू करें।
00:03:28और अब मैं इस वीडियो के दौरान स्क्रीन पर हर जगह घूम रहा हूंगा,
00:03:31तो मेरे साथ धैर्य रखें।
00:03:32अब, पहला सवाल जो हम खुद से पूछेंगे वह है,
00:03:35क्या हम एक डिज़ाइन सिस्टम का उपयोग करने जा रहे हैं?
00:03:38तो यहां मेरे लिए, आप कोई नहीं देखते हैं
00:03:40और आप एक एजेंटिक ओएस डिज़ाइन सिस्टम देखते हैं।
00:03:42आपका, पहले तो कोई नहीं कहेगा।
00:03:44अगर हम एक डिज़ाइन सिस्टम बनाना चाहते हैं,
00:03:47तो हम यहां ऊपर आएंगे
00:03:48और हम डिज़ाइन सिस्टम पर जाएंगे।
00:03:50तो आपके पास शायद यहां कुछ नहीं होगा
00:03:52और आप क्रिएट बटन दबाएंगे।
00:03:53अब, डिज़ाइन सिस्टम क्या है?
00:03:56खैर, अनिवार्य रूप से यह एक विज़ुअल टेम्प्लेट की तरह है
00:04:00जिसे आप भविष्य में बनाए जाने वाले किसी भी प्रोजेक्ट पर लागू कर सकते हैं।
00:04:03तो यदि आपके पास विशिष्ट फोंट हैं, तो आप विशिष्ट लोगो का उपयोग करें,
00:04:07विशिष्ट कुछ भी, भले ही यह सिर्फ एक सामान्य मूड हो,
00:04:10आप यहां ऐसा कर सकते हैं।
00:04:11यहीं पर आप इसे सेट करते हैं।
00:04:12ताकि आपको खुद को दोहराना न पड़े
00:04:13हर एक प्रोजेक्ट के लिए।
00:04:15यदि आपके पास किसी प्रकार की एक सीधी रेखा है
00:04:17डिज़ाइन विज़ुअल दृष्टिकोण से।
00:04:20तो आप अपनी कंपनी का नाम दर्ज करें
00:04:21और फिर आप उदाहरण प्रदान करें।
00:04:23अब, ये उदाहरण कोड हो सकते हैं।
00:04:25तो मैं एक GitHub रिपो लिंक कर सकता हूं।
00:04:27मैं यहां एक फोल्डर ड्रैग कर सकता हूं।
00:04:29मैं फाइलें अपलोड कर सकता हूं।
00:04:30मैं फोंट, एसेट, जो कुछ भी जोड़ सकता हूं।
00:04:33यहीं पर आप अपने ब्रांड को परिभाषित करते हैं।
00:04:36अब, चेतावनी।
00:04:39यही वह बात थी जिसके बारे में मैं बात कर रहा था जब मैं कह रहा था कि टोकन का लालची है।
00:04:42और टोकन के लालची से मेरा मतलब है, एक डिज़ाइन सिस्टम चलाना
00:04:45A, इसमें पांच से 15 मिनट का समय लगेगा
00:04:47क्योंकि यह सब कुछ निगल जाता है, यह आकार पर निर्भर करता है।
00:04:50और B, यह आपके उपयोग का लगभग 20 से 25% लेगा
00:04:55शुरुआत में ही।
00:04:56तो इसे समझें, यहां यह सोचकर न आएं,
00:04:57ओह, पहली चीज़ जो मैं करने जा रहा हूं
00:04:58वह है पांच डिज़ाइन सिस्टम को रिप ऑफ करना।
00:05:00बिल्कुल नहीं, बिल्कुल नहीं।
00:05:02एक करें यदि आप जानते हैं कि आप क्या करना चाहते हैं
00:05:05और मैं आपको दिखाऊंगा कि यह कैसा दिखता है
00:05:07जैसे ही हम उसे सेट करते हैं।
00:05:08लेकिन इससे ज्यादा न करें।
00:05:09कम से कम अभी नहीं जब तक वे सीमाएं नहीं बढ़ाते
00:05:11जो वे शायद भविष्य में करेंगे।
00:05:12तो संसाधन का लालची, संसाधन का लालची, संसाधन का लालची,
00:05:16इससे स्क्रूड न हों।
00:05:17अब, यदि आप ऐसा करना चाहते हैं,
00:05:19तो आप बस यह सब भरेंगे
00:05:20और फिर आप 'कंटिन्यू टू जनरेशन' बटन दबाएंगे
00:05:21और एक पॉप-अप बॉक्स कुछ ऐसा दिखाएगा,
00:05:24अरे, इसमें पांच से 15 मिनट लगेंगे।
00:05:26एक बार जब यह उन सभी एसेट्स को अंतर्ग्रहण (ingest) कर लेगा,
00:05:29तो आपको कुछ ऐसा मिलेगा
00:05:30जहां यह आपसे ड्राफ्ट डिज़ाइन सिस्टम की समीक्षा करने के लिए कहता है
00:05:33जो इसके साथ आया था।
00:05:34जो मैंने इसे खिलाया था वह मेरे एजेंटिक ओएस डैशबोर्ड का कोड था
00:05:38जो मैंने आपको थोड़ी देर पहले दिखाया था।
00:05:40इसमें एक तरह की क्लोड कलर थीम है।
00:05:43इसमें विशिष्ट टेक्स्ट फोंट है, वह सब है।
00:05:45तो जो मैंने इसे खिलाया था,
00:05:46वह अनिवार्य रूप से इस तरह का एक दृश्य था।
00:05:48और यह वापस आया इन सब के साथ।
00:05:49तो, अरे, यह अच्छा लग रहा है।
00:05:53यह अच्छा लग रहा है।
00:05:53अरे, उस मैस्कॉट को देखो।
00:05:54थोड़ा परिचित लग रहा है।
00:05:55यह अच्छा लग रहा है।
00:05:57आवाज सभी रंगों से होकर गुजरती है।
00:05:59तो यह बहुत, बहुत बारीकियों में उतर जाता है
00:06:03कि, ठीक है, आप इन रंगों को क्या बनाना चाहते हैं?
00:06:06आप कार्ड को कैसा दिखना चाहते हैं?
00:06:07यह बहुत विशिष्ट है।
00:06:08यह वास्तव में अच्छा है।
00:06:09और फिर से, स्टिच की बहुत याद दिलाता है।
00:06:11इस तरह की चीज़ की बहुत, बहुत याद दिलाता है।
00:06:14और इसलिए मैंने आगे बढ़कर सब कुछ मंजूरी दे दी।
00:06:16यह कह रहा है कि ब्रांड फोंट गायब है।
00:06:17तो अगर मेरे पास विशिष्ट फोंट थे जो मैं हमेशा उपयोग करना चाहता था,
00:06:20तो मैं उन्हें भी अपलोड कर सकता हूं।
00:06:21और किसी भी समय मैं यहां वापस आ सकता हूं
00:06:23क्योंकि इसने सभी कंपोनेंट चीजों को तोड़ दिया,
00:06:26उस पर क्लिक करें, और फिर एक नज़र डालें और आवश्यकतानुसार संपादित करें।
00:06:30और ठीक वैसे ही जैसे आप बाद में देखेंगे
00:06:31वास्तविक लैंडिंग पेजों और स्लाइड डेक के साथ
00:06:33और वह सब, हम इसे साझा कर सकते हैं, है ना,
00:06:36एक टीम के साथ या जो कुछ भी हो, या मैं इसे एक्सपोर्ट कर सकता हूं।
00:06:39जैसे पावरपॉइंट पीडीएफ, हम इसे कैनवा, एचटीएमएल पर भेज सकते हैं,
00:06:42क्लोड कोड, वास्तव में, वास्तव में आसान, बस एक क्लिक दूर।
00:06:44साथ ही, हमारे पास वास्तविक डिज़ाइन फाइलें हैं।
00:06:46तो मैं यहां अंदर देख सकता हूं और सब कुछ देख सकता हूं जो चल रहा है,
00:06:50वास्तविक एचटीएमएल फाइलें और वे सभी स्वयं।
00:06:52तो यहां बहुत कुछ है जिसे आप कस्टमाइज़ कर सकते हैं और खेल सकते हैं।
00:06:55यह बिल्कुल भी ब्लैक बॉक्स नहीं है जहां यह ऐसा है,
00:06:57खैर, मुझे आशा है कि क्लोड डिज़ाइन कुछ अच्छा लेकर आया है।
00:06:59कौन जानता है कि सतह के नीचे क्या चल रहा है?
00:07:01नहीं, आपके पास अंतर्दृष्टि (insight) है।
00:07:03जैसे यह सब कोड है।
00:07:04यह कोड बनाने का एक अच्छा तरीका है
00:07:06और हम उस कोड को अपनी खुद की लोकल मशीन पर ले जा सकते हैं
00:07:09किसी भी क्षण।
00:07:10हम यहां अटके नहीं हैं।
00:07:11और इसलिए क्लोड डिज़ाइन और वेब ऐप्स पर वापस लाने के लिए,
00:07:13यह पहला सवाल है जिसका हम जवाब दे रहे हैं।
00:07:15क्या हम एक डिज़ाइन सिस्टम का उपयोग करने जा रहे हैं?
00:07:16क्या यह दृश्य रूप से उसी नस में कुछ है
00:07:18जो हमने अतीत में किया है?
00:07:19और सबसे महत्वपूर्ण बात,
00:07:20क्या आपने बिल्कुल भी डिज़ाइन सिस्टम बनाया है?
00:07:22क्या आपने एंथ्रोपिक देवताओं को अपने साप्ताहिक टोकन का 20% दे दिया है
00:07:25एंथ्रोपिक के देवताओं को अपना 20% साप्ताहिक टोकन दे दिया है और क्या आपके पास यह विकल्प पहले से ही मौजूद है?
00:07:28तो इस डेमो के लिए, हम सिर्फ 'कुछ नहीं' के साथ रहेंगे।
00:07:30ताकि हम सब एक ही धुन पर काम कर सकें।
00:07:32अगला सवाल यह है, अरे,
00:07:33क्या मैं वायरफ्रेम करना चाहता हूँ या हाई फिडेलिटी?
00:07:37संभावना है कि आप हाई फिडेलिटी करना चाहेंगे।
00:07:39ताकि आप देख सकें कि यह वास्तव में कैसा दिखने वाला है।
00:07:41लेकिन फिर से, अगर आप वायरफ्रेम करना चाहते हैं,
00:07:43तो आप हमेशा आगे-पीछे कर सकते हैं।
00:07:44आप किसी एक के लिए बंधे नहीं हैं।
00:07:45लेकिन इसके लिए, हम हाई फिडेलिटी का उपयोग करेंगे।
00:07:47तो हम इसे CD डेमो कहेंगे और हम इसे बनाएंगे।
00:07:50फिर यह हमें यहाँ ले आएगा और हमसे संदर्भ (context) मांगेगा।
00:07:53तो क्या आपके पास वह डिज़ाइन सिस्टम है या सिर्फ एक स्क्रीनशॉट
00:07:56या कोड बेस या फिग्मा फ़ाइल?
00:07:58बहरहाल, यदि आप शून्य चरण से शुरुआत कर रहे हैं,
00:08:01या यदि आपके पास कोड बेस है,
00:08:03तो आदर्श रूप से आप इसे कुछ देना चाहेंगे।
00:08:05यदि आपके पास कोड बेस है, जैसा कि हमने बात की थी,
00:08:07आप पहले से ही एक ऐप पर काम कर रहे हैं, तो इसे यह दें।
00:08:09इसे क्लॉड डिज़ाइन को दें।
00:08:10यह बेहतर काम करेगा।
00:08:12लेकिन भले ही आप नहीं कर रहे हैं और शून्य से शुरुआत कर रहे हैं,
00:08:14मैं अत्यधिक सुझाव देता हूँ कि कम से कम,
00:08:16आप दुनिया में बाहर जाएं
00:08:18और आपको पसंद आने वाली कोई प्रेरणा खोजें,
00:08:20चाहे वह ड्रिबल, अवॉर्ड़ या गॉडली वेबसाइटों से हो,
00:08:23कुछ भी, है ना?
00:08:25कोरी स्लेट से शुरुआत करना और क्लॉड डिज़ाइन से यह उम्मीद करना
00:08:27कि वह सारी भारी मेहनत करेगा,
00:08:28क्योंकि मुझे यकीन है कि आपका प्रॉम्प्ट खराब होगा।
00:08:30बस यह समझें कि आप इसे जितना कम संदर्भ देंगे,
00:08:33आपके औसत पर वापस लौटने (regression to the mean) की संभावना उतनी ही अधिक होगी।
00:08:35तो बस इसे करते समय यह समझ लें।
00:08:36हमारे पास स्केच करने की क्षमता है।
00:08:38तो, आप जानते हैं, हम वास्तव में यहाँ ड्रा कर सकते हैं
00:08:40और कह सकते हैं, ठीक है, यह रही हमारी इमेज।
00:08:44मुझे टेक्स्ट यहाँ चाहिए।
00:08:48और फिर मुझे हीरो इमेज चाहिए।
00:08:53हीरो इमेज यहाँ।
00:08:59और फिर चलिए स्क्रॉलिंग बैनर करते हैं।
00:09:10हम इसे कुछ देंगे,
00:09:12भले ही वह इसके जैसी कला का कोई शानदार नमूना ही क्यों न हो।
00:09:15और आप उससे कहीं ज्यादा कर सकते हैं।
00:09:16हम पेन बदल सकते हैं, है ना?
00:09:18हम टेक्स्ट डाल सकते हैं।
00:09:19मैं अलग चीजें डाल सकता हूँ, जैसे, मैं स्टिकी नोट्स जोड़ सकता हूँ।
00:09:21तो यहाँ करने के लिए बहुत कुछ है।
00:09:25और यहाँ से, आपको बस इसे प्रॉम्प्ट करना है।
00:09:28आपके पास मॉडल बदलने की क्षमता भी है।
00:09:30ओपस 4.7 वह है जिसका मैं सुझाव दूँगा,
00:09:33क्योंकि खासकर यदि आप स्क्रीनशॉट जैसी चीजें जोड़ रहे हैं,
00:09:35ओपस 4.7 में सबसे अधिक फिडेलिटी है
00:09:37और स्क्रीनशॉट के लिए उच्चतम रिज़ॉल्यूशन है।
00:09:40ओपस 4.6 के साथ आपको जो मिल रहा है, उसका 3 गुना।
00:09:42तो अब इसे एक प्रॉम्प्ट देते हैं।
00:09:44मैं कह रहा हूँ कि आरगस (Argus) के लिए लैंडिंग पेज बनाओ,
00:09:46एक सोशल मीडिया इंटेलिजेंस प्लेटफॉर्म
00:09:48जो क्रिएटर्स को ट्रेंडिंग टॉपिक्स खोजने में मदद करता है
00:09:49उनके नीश (niche) में, उनके वायरल होने से पहले।
00:09:51वह एक लेआउट है, आप जानते हैं,
00:09:53काफी हद तक जो आपने यहाँ लिखा है उसे प्रतिबिंबित करता है।
00:09:55तो वह उतना ही लचर प्रॉम्प्ट है जितना हम इसे दे सकते हैं।
00:09:58बेसिक SaaS जैसी चीज।
00:10:00तो देखते हैं कि यह क्या लेकर आता है।
00:10:02और यह रहा जो क्लॉड डिज़ाइन लेकर आया,
00:10:03बहुत ही कम प्रॉम्प्ट के साथ और हमारे द्वारा पेज पर
00:10:06सिर्फ लिखने के अलावा कोई बाहरी संदर्भ नहीं।
00:10:08और यह है यह, जो मुझे लगता है कि पहले प्रयास के लिए अच्छा है।
00:10:13उपयोग के संदर्भ में, उपयोग अलर्ट, 4%।
00:10:16इस लैंडिंग पेज को बनाने में हमारे कुल साप्ताहिक उपयोग का 4% लिया।
00:10:18और यह रहा जो क्लॉड कोड ने हमें दिया
00:10:20बिल्कुल उसी प्रॉम्प्ट के साथ,
00:10:21फ्रंट एंड डिज़ाइन स्किल का उपयोग करते हुए।
00:10:22बुरा नहीं है।
00:10:25मेरा मतलब है, कुछ छोटी चीजें हैं जिन्हें हम तुरंत आलोचना कर सकते हैं,
00:10:26जैसे, अरे, टेक्स्ट यहाँ और यहाँ कटा हुआ है।
00:10:28इस एक पर इतनी ज्यादा गलतियां नहीं हैं।
00:10:32टेक्स्ट यहाँ थोड़ा ओवरलैप हो जाता है।
00:10:35यह नीचे 'राइजिंग नाउ' दिखा रहा है,
00:10:39जो भी एक तरह से ओवरलैप होता है, लेकिन काफी करीब है।
00:10:41मेरा मतलब है, ईमानदारी से कहूँ तो,
00:10:45मुझे डिज़ाइन वाला थोड़ा ज्यादा पसंद है,
00:10:46लेकिन मैं देख सकता हूँ कि किसी को यह वाला
00:10:47भी थोड़ा ज्यादा पसंद आ सकता है।
00:10:49तो पहले प्रयास में, कोई बड़ा अंतर नहीं है।
00:10:50तो क्लॉड डिज़ाइन का उपयोग क्यों करें?
00:10:52यह कहां से बेहतर होना शुरू होता है?
00:10:54खैर, यह बेहतर होना शुरू होता है
00:10:55जब हम वेरिएशन (विभिन्नताओं)
00:10:56और इटरेट (सुधार/पुनरावृत्ति) करने में सक्षम होने की बात करते हैं।
00:10:59और आप इसे तुरंत ट्वीक्स (सुधारों) के साथ देखते हैं।
00:11:00तो मेरे लिए ऐसा करने की क्षमता एक बड़ी बात है।
00:11:03मेरे लिए हेडलाइन को बहुत जल्दी बदलना
00:11:07या टिकर देखना।
00:11:10और हम इसे आगे भी बढ़ा सकते हैं।
00:11:13तो मैंने लिखा ट्वीक्स की मात्रा आक्रामक रूप से बढ़ाएं।
00:11:16मैं इसके साथ जितना संभव हो उतना खेलना चाहता हूँ।
00:11:18तो देखते हैं कि यह क्या वापस लाता है।
00:11:20ठीक है, तो अब हम देख सकते हैं कि इसने हमारे लिए
00:11:22मैसेज करने के लिए और भी बहुत सारे ट्वीक्स जोड़े।
00:11:26और उपयोग दर क्या थी?
00:11:27इन सभी ट्वीक्स को जोड़ने से 7% का उपयोग हुआ।
00:11:30तो आप देख सकते हैं कि सिर्फ एक लैंडिंग पेज जोड़ने
00:11:32और लगभग 14 ट्वीक्स करने से, हमने पहले ही इस्तेमाल कर लिया है, वह क्या है?
00:11:36हमारे कुल का लगभग 11%।
00:11:39अब, मुझे लगता है कि ट्वीक्स महत्वपूर्ण हैं।
00:11:40मैंने परिचय में पहले बात की थी,
00:11:43जैसे कि वे कौन सी विशेषताएं हैं जिन पर हम वास्तव में ध्यान केंद्रित करना चाहते हैं
00:11:44जब क्लॉड डिज़ाइन की बात आती है?
00:11:47क्योंकि जब हमने सिर्फ वन-शॉट किया था,
00:11:48यह उससे बहुत अलग नहीं था जो मुझे मिला
00:11:49फ्रंट एंड डिज़ाइन स्किल के साथ।
00:11:51खैर, ये ट्वीक्स और इन सभी चीजों
00:11:52और इन सूक्ष्म परिवर्तनों के साथ जल्दी से खेलने की क्षमता,
00:11:55सही है, यही क्लॉड डिज़ाइन की असली शक्ति है।
00:11:59तो मैं थोड़ा ज़ूम आउट करूँगा
00:12:02ताकि हम ट्वीक्स को थोड़ा बेहतर तरीके से काम करते हुए देख सकें,
00:12:03लेकिन अब मैं पैलेट से लेकर एक्सेंट (एक्सेंट रंग) तक सब कुछ कर सकता हूँ,
00:12:05कॉर्नर रेडियस, बैकग्राउंड ग्रिड, कोई बैकग्राउंड ग्रिड नहीं,
00:12:10फॉन्ट, जोर (emphasis), हेडलाइन में अंतर, लेआउट स्विच, है ना?
00:12:14यही शक्ति है।
00:12:19शक्ति यह नहीं है कि, ओह, यह UI डिज़ाइन को वन-शॉट कर सकता है
00:12:21और UI डिज़ाइन बहुत अच्छा है।
00:12:23नहीं, बात यह है कि मैं वास्तव में बहुत तेजी से इटरेट कर सकता हूँ,
00:12:25बहुत तेजी से, यह, सोचें कि मैं कितनी तेजी से यह कर रहा हूँ
00:12:29और सोचें कि क्लॉड कोड के अंदर
00:12:33यह सब चलाने में कितना समय लगेगा।
00:12:34मेरा मतलब है, हम नीश (niche) को भी बदल सकते हैं
00:12:36कि यह किस तरह की सोशल मीडिया चीज़ देख रहा है
00:12:39AI और टेक से लेकर गेमिंग तक, फाइनेंस तक।
00:12:41भगवान का शुक्र है कि मैं टिकर की गति को समायोजित कर सकता हूँ
00:12:46'क्योंकि यह बहुत तेज़ चल रही थी, लेकिन हाँ, यह अद्भुत है।
00:12:47यह भाग एक है और मुझे लगता है कि दो चीजें हैं।
00:12:52खैर, वास्तव में उससे कुछ अधिक हैं,
00:12:54लेकिन मुझे लगता है कि ट्वीक्स डिज़ाइन से मिलने वाला नंबर एक वैल्यू ऐड है
00:12:56क्योंकि यह सब विजुअल इटेशन (दृश्य पुनरावृत्ति) के बारे में है।
00:12:59और मेरी राय में, क्लॉड डिज़ाइन की दूसरी सबसे प्रभावशाली विशेषता
00:13:01वेब पेजों की भिन्नता (variance) है।
00:13:04तो ट्वीक्स बहुत सूक्ष्म है, है ना?
00:13:07जैसे हम रंगों, एक्सेंट, फॉन्ट की बात कर रहे हैं,
00:13:09लेकिन क्या होगा अगर मुझे पूरी तरह से लैंडिंग पेज
00:13:11की भिन्नताएं चाहिए, जैसे पागलों की तरह।
00:13:14मैं किसी अलग फॉन्ट के बारे में बात नहीं कर रहा हूँ,
00:13:18मैं पूरी तरह से अलग डिज़ाइन के बारे में बात कर रहा हूँ
00:13:19और मैं उन्हें एक के ऊपर एक देखना चाहता हूँ।
00:13:21फिर से, वैसे ही जैसे मैं स्टिच (stitch) के साथ कर सकता हूँ।
00:13:23मैं ऐसा करने में सक्षम होना चाहता हूँ।
00:13:25खैर, हम ऐसा क्लॉड डिज़ाइन के अंदर कर सकते हैं
00:13:26और यह वास्तव में आसान है।
00:13:28हम बस इसे बिल्कुल ऐसा करने के लिए प्रॉम्प्ट करने जा रहे हैं।
00:13:29तो मैंने डिज़ाइन को प्रॉम्प्ट किया और कहा,
00:13:32क्या आप अब इस लैंडिंग पेज के दो और वेरिएंट बना सकते हैं
00:13:33जिनके बीच मैं क्लिक कर सकूँ जो पूरी तरह से अलग शैली के हों,
00:13:36पहले मुझे अलग वेरिएंट शैली सुझाएँ।
00:13:39तो यह मेरे लिए छह अलग-अलग विकल्पों के साथ वापस आया।
00:13:42हम टर्मिनल ब्लूमबर्ग, टर्मिनल शैली,
00:13:44हाइपर-मैक्सिमल एडिटोरियल, ब्रूटलिस्ट, सिंथवेव, सॉफ्ट पेस्टल,
00:13:48या प्रिंट न्यूज़पेपर कर सकते हैं।
00:13:53चलिए, हाँ, एक और दो की तरह।
00:13:56तो मैं कहूँगा, चलिए एक और दो करते हैं
00:13:59और जाहिर है कि वर्तमान लेआउट को भी बनाए रखें।
00:14:03तो क्लॉड डिज़ाइन वेरिएंट के साथ पूरा हो गया।
00:14:08तो यहाँ एडिटोरियल वाला है, जिससे हमने शुरुआत की थी।
00:14:10अब हमारे पास एक टर्मिनल विकल्प है।
00:14:13साथ ही एक एडिटोरियल मैक्सिमल विकल्प,
00:14:18जो काफी दिलचस्प है, कुछ अलग।
00:14:21अब, यदि आप इसे नहीं बताते हैं,
00:14:24तो यह केवल मूल के लिए ट्वीक्स करेगा।
00:14:25तो जब आप ये वेरिएंट करते हैं,
00:14:28मुझे लगता है कि सामान्य वर्कफ़्लो यह होना चाहिए,
00:14:30कि आप पहले वेरिएंट के साथ शुरुआत करें।
00:14:33तो मैक्रो स्तर पर, आप सोच रहे हैं, ठीक है,
00:14:35मैं इस दिशा में जाना चाहता हूँ।
00:14:37और फिर एक बार जब आप इनमें से किसी एक मैक्रो को चुन लेते हैं,
00:14:39मान लीजिए हमने वही रखने का फैसला किया जो हमें पसंद है,
00:14:42तो आप बहुत ही आक्रामक ट्वीक चरण में जाएंगे।
00:14:44ताकि आप सब कुछ देख सकें
00:14:47और जो आप चाहते हैं उस पर ड्रिल डाउन कर सकें।
00:14:49क्योंकि जिस तरह से उपयोग सेट किया गया है,
00:14:51अगर आप मैक्रो जाते हैं और आप कहते हैं,
00:14:54मुझे सिर्फ तीन विकल्प नहीं चाहिए।
00:14:56मुझे चार, पाँच वेरिएंट चाहिए और मुझे उन सभी पर ट्वीक्स चाहिए।
00:14:57आप बस अपने उपयोग को खत्म कर देंगे।
00:15:00क्योंकि इन दो वेरिएंट्स, मैक्सिमल और टर्मिनल को जोड़ने से,
00:15:02यह अतिरिक्त 5% था।
00:15:04तो वह लगभग,
00:15:05मुझे लगता है कि हम अब लैंडिंग पेज के लिए 17% पर हैं,
00:15:07लैंडिंग पेज के दो वेरिएंट और ट्वीक्स।
00:15:11और मुझे पता है कि मैं बार-बार उपयोग के बारे में बात कर रहा हूँ,
00:15:13लेकिन बहुत से लोगों के लिए, यह एक बड़ी बात है
00:15:14और यह होनी भी चाहिए।
00:15:16मुझे लगता है कि भविष्य में,
00:15:17यह शायद पूरी उपयोग की बात को बदल देगा,
00:15:18लेकिन बस इसे ध्यान में रखें।
00:15:19और इसलिए इन दो चीजों के साथ,
00:15:20यह वेरिएंट और ट्वीक्स,
00:15:23यह हमें 80% समाधान, 90% समाधान तक पहुँचने की अनुमति देता है।
00:15:26अब मैं इस पर और भी अधिक हाइपर-फ़ोकस हो सकता हूँ।
00:15:31हम यहाँ ऊपर जा सकते हैं जैसा मैंने आपको शुरुआत में दिखाया था।
00:15:35हम यहाँ ऊपर जा सकते हैं जैसा कि मैंने आपको शुरुआत में दिखाया था।
00:15:37हम संपादन कर सकते हैं।
00:15:39तो मैं इस शीर्ष हेडर पर क्लिक कर सकता हूँ।
00:15:42मैं अस्पष्टता (opacity) बदल सकता हूँ।
00:15:43मैं चौड़ाई, रंग, वह सब कुछ बदल सकता हूँ।
00:15:45तो अगर हम चाहें तो हम बहुत, बहुत विशिष्ट हो सकते हैं,
00:15:47लेकिन असली शक्ति उस 90% समाधान तक पहुँचने से आती है,
00:15:50जैसे, ठीक है, मुझे संपादकीय वाला पहला पसंद है।
00:15:54मुझे पसंद है कि जोर मार्क पर हो,
00:15:55कि वह रिंग भयानक दिख रही है, मार्क होने के नाते।
00:15:59मुझे यह विशिष्ट उपशीर्षक, यह हेडलाइन, जो भी हो, पसंद है।
00:16:04और फिर ऐसा हो, ठीक है, हम उसके साथ जाने वाले हैं।
00:16:05हमें बदलाव पसंद आए।
00:16:06अब लैंडिंग पेज का बाकी हिस्सा पूरा करते हैं,
00:16:09क्योंकि यह सिर्फ हीरो सेक्शन है।
00:16:11और फिर आप क्या करते हैं, आप इसे क्लॉड कोड पर एक्सपोर्ट करते हैं।
00:16:14आप इसे क्लॉड कोड को सौंप देते हैं।
00:16:15जब मैं इस पर क्लिक करता हूँ, तो आपके पास कुछ विकल्प होते हैं।
00:16:17आप ज़िप डाउनलोड कर सकते हैं या आप बस यह कमांड कॉपी कर सकते हैं
00:16:20और आप इसे क्लॉड कोड के अंदर ला सकते हैं।
00:16:22और मुझे लगता है कि इस तरह का वर्कफ़्लो बहुत तेज़ है
00:16:25यहाँ होने की तुलना में, जो क्लॉड कोड ने हमें दिया
00:16:28बिल्कुल उसी प्रॉम्प्ट के साथ।
00:16:29मेरा मतलब है, ठीक है, क्लॉड कोड,
00:16:32अब रंग के साथ थोड़ा बदलाव करते हैं।
00:16:35चलो कुछ विविधताएँ (variations) करते हैं।
00:16:36चलो अब हेडलाइन के साथ थोड़ा बदलाव करते हैं और कुछ विविधताएँ करते हैं।
00:16:39उसमें घंटों लग सकते हैं जबकि इसमें मिनटों लगे।
00:16:44और कम से कम मेरे लिए, मुझे चीज़ें देखने की ज़रूरत है
00:16:47और मुझे बहुत सारे विकल्प देखने की ज़रूरत है
00:16:48इससे पहले कि मैं वास्तव में देखूँ कि मुझे क्या पसंद है।
00:16:50और इससे भी बेहतर, संभावना है कि एक बार जब मैं कुछ देख लेता हूँ,
00:16:53तो मैं इसे बदल सकता हूँ।
00:16:54क्योंकि ईमानदारी से कहूँ तो, अगर वे यह देख रहे हैं,
00:16:54मुझे वह बहुत वर्टिकल वाला पसंद है।
00:16:56शायद हम यहाँ किसी तरह के आइकन या जो भी हो डाल सकते हैं।
00:16:58जैसे मैं बस दोहराना (iterate) चाहता हूँ।
00:17:00मैं बस अलग-अलग चीज़ें देखना चाहता हूँ।
00:17:02तो ये दो सबसे बड़ी सर्वोत्तम प्रथाएं हैं जो मैं आपको दे सकता हूँ
00:17:05जब इसके वेब ऐप हिस्से की बात आती है।
00:17:08मैक्रो, सही है, विविधताएँ (variations) मांगें।
00:17:11और फिर माइक्रो, और बदलाव (tweaks) मांगें।
00:17:13एक चीज़ जो हमने यहाँ नहीं की,
00:17:15और हम इसे स्लाइड डेक जैसी चीज़ों में दिखाएंगे
00:17:18और इस तरह की चीज़ें,
00:17:19वह है इसे अनिवार्य रूप से अपने स्वयं के प्लान मोड के माध्यम से चलाने के लिए कहना।
00:17:22तो हमने इसे प्रॉम्प्ट दिया और तुरंत,
00:17:24इसने इसे हमारे लिए बाहर निकाल दिया।
00:17:25हमने इसके बजाय क्या किया हो सकता है और कहें,
00:17:26अरे, मैं आपके साथ थोड़ा प्लान मोड करना चाहता हूँ।
00:17:28मैं चाहता हूँ कि आप मुझसे बहुत सारे सवाल पूछें।
00:17:30और यह इसके बजाय आपको ले जाएगा
00:17:32काफी सारे सवालों के माध्यम से,
00:17:33जैसे पाँच, आठ, 10 सवाल जैसे,
00:17:35ठीक है, आप यहाँ क्या चाहते हैं?
00:17:36आप वहाँ क्या चाहते हैं?
00:17:37आप वहाँ क्या चाहते हैं?
00:17:38इस तरह आपको इतने सारे पुनरावृत्ति (iterations) नहीं करने होंगे
00:17:40और अंततः यह आपका उपयोग (usage) बचाता है।
00:17:42और मैं उसी तरह के प्रवाह से गुज़रा
00:17:44जब मैं फ्रंट एंड बना रहा था
00:17:46अपने एजेंटिक ओएस डैशबोर्ड के लिए।
00:17:47आप यहाँ ऊपर देख सकते हैं,
00:17:48यही वह है जिससे मैंने मूल रूप से शुरुआत की थी।
00:17:51और फिर मैं एक तरह से जाने में सक्षम था
00:17:52ये सभी अलग-अलग विकल्प।
00:17:53मैं अंततः इस पर उतरा, कॉकपिट वाला,
00:17:56हालाँकि मैंने उस कूल स्प्राइट वाले के साथ करने के बारे में सोचा था।
00:17:58और फिर मैंने बस इस संस्करण को वापस क्लॉड कोड में लाया
00:18:01और फिर मार्जिन पर मामूली समायोजन किया
00:18:03और वास्तव में इसे हुक किया।
00:18:04तो यह एक उचित वेब ऐप था।
00:18:06अब क्लॉड डिज़ाइन और स्लाइड डेक करते हैं।
00:18:08तो हम इसे थोड़ा तेज़ चलाएंगे
00:18:09क्योंकि कई बुनियादी बातें जो हमने देखीं
00:18:13जब वेब ऐप्स की बात आती है तो स्लाइड डेक पर भी लागू होती हैं।
00:18:16तो मैं इन बिंदुओं को ज्यादा नहीं खींचूँगा।
00:18:17और इस बार हम काम करते हुए डिज़ाइन सिस्टम दिखाएंगे।
00:18:21और याद रखें कि वह सिस्टम विज़ुअल्स पर आधारित है
00:18:24हमारे एजेंटिक ऑपरेटिंग सिस्टम से।
00:18:26तो हम आगे बढ़ेंगे और क्रिएट दबाएंगे।
00:18:27और हम क्या देखते हैं?
00:18:28पहले जैसा ही सेटअप।
00:18:30और कुछ आपसे संदर्भ (context) प्रदान करने के लिए कह रहा है,
00:18:32चाहे वह स्क्रीनशॉट, कोड बेस या फिग्मा फाइलें हों।
00:18:35अब, एकमात्र संदर्भ जो हम इसे देने जा रहे हैं
00:18:37वह डिज़ाइन सिस्टम है जो पहले से ही वहाँ है।
00:18:39साथ ही एक प्रॉम्प्ट कहते हुए,
00:18:41हमें एक स्लाइड डेक चाहिए जो मतभेदों के बारे में बात करे
00:18:45क्लॉड डिज़ाइन और गूगल स्टिच के बीच।
00:18:48और मेरे पास क्लॉड कोड के साथ दूसरी विंडो में ओपस 4.7 था,
00:18:53प्रॉम्प्ट के साथ आने के लिए।
00:18:54तो मुझे वेब सर्च करना पड़ा।
00:18:55ठीक है, यहाँ दोनों के बीच के प्रकार के मतभेद हैं।
00:18:57अब अंत में, मैंने लिखा कि कुछ भी बनाने से पहले,
00:19:01मुझसे जो भी सवाल हों पूछें।
00:19:02ताकि हम एक ही पेज पर हों।
00:19:05तो एक तरह से, हम लगभग इसे मजबूर कर रहे हैं
00:19:07प्लान मोड जैसा कुछ करने के लिए।
00:19:08और इसलिए आप इसे यहाँ पॉप्युलेट होते हुए देखते हैं।
00:19:10फिर से, आप इस तरह का मजबूर प्लान मोड रख सकते हैं
00:19:12जब आप वेब ऐप्स करते हैं तो पूरी तरह से होता है।
00:19:14बस सुनिश्चित करें कि आप इसे शुरुआती प्रॉम्प्ट में डालें।
00:19:16तो यह डेक किसके लिए है?
00:19:18मान लीजिए यह सार्वजनिक बातचीत के लिए है।
00:19:20हम कहेंगे, हम इसे छोटा और प्यारा रखेंगे।
00:19:24इसे छह पर रखें, हम पाँच मिनट करेंगे।
00:19:28हम पाँच स्लाइड करेंगे।
00:19:30हम थोड़े विचारशील, शीर्षक शैली, केंद्र टुकड़ा करेंगे।
00:19:34हम केवल दो गुणा दो पोजिशनिंग मैप कहेंगे।
00:19:37कॉल अप प्राइस, हाँ।
00:19:39और फिर हम बाकी के माध्यम से जाएंगे।
00:19:43कोई नोट्स नहीं।
00:19:44और कुल मिलाकर, यह हमसे पूछता है एक, दो, तीन, चार, पाँच,
00:19:47छह, सात, आठ, नौ, 10, 11, 12, 13, 14, 14 सवाल।
00:19:52साथ ही, आप जानते हैं, यहाँ नीचे थोड़ा कैच ऑल,
00:19:56जो मुझे वास्तव में पसंद है।
00:19:58फिर से, क्लॉड कोड का प्लान मोड कभी-कभी करेगा,
00:20:00मुझे लगता है कि सबसे अधिक, आप जानते हैं, कुछ,
00:20:03जैसे चार-चार सवालों के दो पुनरावृत्ति (iterations)।
00:20:05तो यह बहुत अच्छा है।
00:20:06और यहाँ स्लाइड डेक पर एक नज़र है।
00:20:07मैंने इसे पूर्ण स्क्रीन में रखा और संदर्भ के लिए,
00:20:10इसने हमारे उपयोग (usage) का 5% लिया।
00:20:12तो लगभग 1% प्रति स्लाइड।
00:20:15तो हमारे पास शीर्षक पृष्ठ है, डेक के बारे में थोड़ा फुटनोट
00:20:19क्लॉड डिज़ाइन द्वारा उत्पन्न किया जा रहा है।
00:20:22हमारे पास संख्याएँ हैं, आप जानते हैं, वे कहाँ उतरते हैं।
00:20:26खैर, एक ग्राफ मिला है जो दिखाता है कि वे कहाँ उतरते हैं
00:20:30लागत के मामले में।
00:20:31जाहिर है, क्लॉड डिज़ाइन बहुत अधिक महंगा है।
00:20:34फील्ड रिपोर्ट।
00:20:37और फिर हमें एक प्रकार का देता है,
00:20:38अरे, यहाँ एक छोटा चार्ट है जो दिखाता है
00:20:40आपको किस यूज़ केस के लिए क्या उपयोग करना चाहिए।
00:20:43तो मुझे लगता है कि स्लाइड डेक काफी शानदार दिखता है,
00:20:45ईमानदारी से कहूँ तो।
00:20:46लेकिन उससे कहीं ज़्यादा महत्वपूर्ण बात,
00:20:48यह डिज़ाइन सिस्टम के साथ अटका रहा।
00:20:49यह एजेंटिक ओएस जिस पर पूरा डिज़ाइन सिस्टम बनाया गया था
00:20:53निश्चित रूप से डेक में परिलक्षित होता है।
00:20:55ये दो चीजें ऐसी दिखती हैं जैसे वे एक ही जगह से आई हों।
00:20:59और वेब ऐप की तरह ही,
00:21:00हम उसी वर्कफ़्लो के माध्यम से जा सकते हैं।
00:21:03यह मूल था जो इसने हमें दिया था।
00:21:05अब हम मैक्रो वेरिएंट मांग सकते हैं और कह सकते हैं,
00:21:07ठीक है, क्या हम वास्तव में टिकना चाहते हैं, आप जानते हैं,
00:21:09हमारा डिज़ाइन सिस्टम?
00:21:11या हम पूरी तरह से एक अलग दिशा में जाना चाहते हैं?
00:21:13ठीक है, हम देखते हैं, आप जानते हैं, दो, तीन, चार अलग-अलग वेरिएंट।
00:21:16ठीक है, चलो एक पर ध्यान केंद्रित करते हैं।
00:21:17और अब चलो बदलाव (tweaks) लाते हैं
00:21:19और वास्तव में इस चीज़ को ठीक करते हैं।
00:21:20और यह कुछ ऐसा है जिस तरह से मुझे लगता है
00:21:22आपको स्लाइड डेक के पास जाना चाहिए।
00:21:23उसी तरह हम वेब ऐप्स के पास जाते हैं।
00:21:24अब संदर्भ के लिए, यहाँ स्लाइड डेक है
00:21:27जो क्लॉड कोड ने हमारे लिए तैयार किया।
00:21:29मैंने इसे बिल्कुल वही प्रॉम्प्ट दिया
00:21:31और मैंने इसे उसी निर्देशिका से बनाया,
00:21:34एजेंटिक ओएस सिस्टम लाइव।
00:21:36तो इसके पास एक ही डिज़ाइन सिस्टम तक पूर्ण पहुँच थी,
00:21:38तो ऐसा कहने के लिए।
00:21:39इसके अलावा, मैंने इसे मुझसे सवाल पूछने के लिए भी कहा।
00:21:42इसने मुझसे केवल सात पूछे।
00:21:43और सवाल, ईमानदारी से कहूँ तो, उतने अच्छे नहीं थे।
00:21:46वे थोड़े अधिक सतही स्तर के थे
00:21:47जैसे, खैर, स्लाइड की गिनती।
00:21:49और आप पहलू अनुपात (aspect ratio) क्या चाहते हैं
00:21:51बनाम हमने डिज़ाइन में जो देखा।
00:21:52और मुझे लगता है कि यह कुल मिलाकर परिलक्षित होता है,
00:21:55एक बहुत ही फीका आउटपुट।
00:21:57और मुझे थोड़ा आश्चर्य है कि यह करीब नहीं था
00:22:00विज़ुअल शैली के मामले में इसकी तुलना में जो डिज़ाइन ने हमें दिया।
00:22:02मेरा मतलब है, यह बुरा नहीं है।
00:22:05मेरा मतलब है, रंग करीब हैं, टेक्स्ट करीब है,
00:22:07लेकिन मेरा मतलब है, चलो गंभीर हो जाते हैं।
00:22:10यह इसे पूरी तरह से उड़ा देता है
00:22:12अगर हम ईमानदार होने जा रहे हैं।
00:22:13अंत में, मोबाइल ऐप डिज़ाइन के बारे में बात करते हैं।
00:22:15और यहाँ आपके पास दो विकल्प हैं।
00:22:17एक, आप सीधे मोबाइल जा रहे हैं।
00:22:19आप कोई वेब ऐप चीज़ नहीं कर रहे हैं।
00:22:21और यह काफी सरल है।
00:22:22आप बस वही करने जा रहे हैं जो हमने वेब ऐप हिस्से के साथ किया था
00:22:25इस वीडियो की शुरुआत में।
00:22:26और आप बस शुरुआत में कहने जा रहे हैं,
00:22:28यह एक मोबाइल ऐप के लिए है।
00:22:29सुनिश्चित करें कि विज़ुअल्स इसे प्रतिबिंबित करें।
00:22:32लेकिन अगर आप एक वेब ऐप ले रहे हैं
00:22:33और फिर आप इसे मोबाइल प्लेटफॉर्म में अनुवादित करना चाहते हैं,
00:22:35तो यह काफी सरल है।
00:22:36जबकि हम उस प्रॉम्प्ट विंडो में यहाँ रह सकते हैं जहाँ हम हैं,
00:22:40वास्तव में, ठीक है, अब मुझे इसे मोबाइल में दिखाएं।
00:22:42शायद एक अलग प्रोजेक्ट होना अधिक समझ में आता है
00:22:45बिल्कुल उसी चीज़ के साथ जो चल रही है।
00:22:46लेकिन अब हमारे पास एक स्पष्ट सीमा है
00:22:48वेब ऐप पर काम करने बनाम मोबाइल के बीच।
00:22:51और इसलिए ऐसा करने के लिए, आप बस ऊपर दाईं ओर आने वाले हैं
00:22:53जहाँ शेयर लिखा है।
00:22:54और फिर आप डुप्लीकेट प्रोजेक्ट दबाएंगे।
00:22:57एक बार जब आप ऐसा कर लेते हैं, तो यह आपको इस तरह के पेज पर ले जाएगा।
00:23:00लेकिन अगर आप होमपेज पर वापस जाते हैं,
00:23:02तो हम अब देख सकते हैं कि एक सीडी डेमो रीमिक्स है।
00:23:05और वह रीमिक्स डुप्लीकेट प्रोजेक्ट है।
00:23:08और इसलिए अब मैं बस इसे प्रॉम्प्ट करने जा रहा हूँ और कहूँगा,
00:23:10क्या आप मुझे वही डिज़ाइन मोबाइल फॉर्मेट में दिखा सकते हैं?
00:23:13और यहाँ मोबाइल संस्करण हैं जो इसने हमें दिए।
00:23:15यह आगे बढ़ा और तीनों के वेरिएंट बनाए।
00:23:18मैंने उसे निर्दिष्ट नहीं किया था, लेकिन इसने किया।
00:23:19तो इसने हमें अनिवार्य रूप से नौ मॉक-अप दिए
00:23:21और कुल लागत उपयोग का 5% थी।
00:23:25तो हमेशा की तरह वही प्रवाह।
00:23:27इसने हमें मैक्रो यहीं दिया।
00:23:29तो हम चुनेंगे कि हमें कौन सा पसंद है,
00:23:30जाहिर है वही जो आपने अपने वेब ऐप के लिए तय किया था।
00:23:32और फिर वहाँ से, हम कहेंगे,
00:23:34अरे, मुझे संपादकीय वाला पसंद है।
00:23:36अब बहुत सारे बदलाव (tweaks) लाएं ताकि मैं वास्तव में इसे नेल कर सकूँ।
00:23:38लेकिन सच कहूँ तो,
00:23:39यदि आपने वेब ऐप संस्करण पर सब कुछ सेट कर लिया है,
00:23:42तो संभावना है कि आपने पहले ही बदलाव कर लिए हैं।
00:23:44तो बहुत ज़्यादा नहीं होना चाहिए
00:23:47आपको इस बिंदु पर बदलने की आवश्यकता है।
00:23:48लेकिन हमेशा थोड़ा होता है,
00:23:51आप हमेशा समस्याओं में पड़ जाते हैं जब आप मानक वेब ऐप से जाते हैं
00:23:53मोबाइल डिज़ाइन के लिए।
00:23:55लेकिन जैसा कि आप यहाँ देखते हैं, करना बहुत आसान है,
00:23:57सिर्फ एक प्रॉम्प्ट।
00:23:58तो यही वह जगह है जहाँ मैं आज आप लोगों को छोड़ने वाला हूँ।
00:23:59मुझे उम्मीद है कि मैं मतभेदों को खत्म करने में सक्षम था
00:24:02क्लॉड डिज़ाइन और क्लॉड कोड के बीच,
00:24:04विशेष रूप से उन विशेषताओं को उजागर करते हुए
00:24:06जो वास्तव में क्लॉड डिज़ाइन के अंदर हमारा पैसा बनाती हैं,
00:24:09वह बदलाव (tweaks) होना और वह वेरिएंट होना।
00:24:11और वास्तव में यह हमें पुनरावृत्ति गति (iteration speed) खरीदता है।
00:24:15मैं अलग-अलग संस्करणों के माध्यम से जा सकता हूँ
00:24:17जो भी मैं बनाने की कोशिश कर रहा हूँ
00:24:19ताकि मैं अंततः किसी ऐसी चीज़ पर उतर सकूँ जो मुझे पसंद हो।
00:24:21और एक बार जब मैं ऐसा कर लेता हूँ,
00:24:22तो मैं इसे क्लॉड कोड इकोसिस्टम में खींच लेता हूँ।
00:24:25और मुझे उम्मीद है कि मैं उपयोग लागत (usage costs) को बनाने में सक्षम था
00:24:27थोड़ा और स्पष्ट हर पुनरावृत्ति और निर्माण के बाद हमारे द्वारा खोए गए प्रतिशत को कॉल करके।
00:24:31तो हमेशा की तरह, मुझे बताएं कि आपने क्या सोचा।
00:24:33निश्चित रूप से अधिक क्लॉड डिज़ाइन सामग्री के लिए तत्पर रहें
00:24:35क्योंकि मुझे लगता है कि यह एक बहुत ही कूल टूल है।
00:24:38चेस एआई+ को देखना सुनिश्चित करें
00:24:40यदि आप क्लॉड कोड मास्टरक्लास पर अपना हाथ पाना चाहते हैं,
00:24:42और मैं आपको बाद में देखूँगा।
00:24:45धन्यवाद।