AI युग में, एक निजी वेबसाइट सबसे अच्छा रिज्यूमे है।
कल, मैंने अपनी निजी वेबसाइट का एक डेमो जारी किया, जिसे पूरे नेटवर्क पर लगभग 1,00,000 बार देखा गया। कई दोस्तों ने प्राइवेट मैसेज करके इसके बनाने का तरीका पूछा।
https://x.com/Saccc_c/status/2071508004772475209
सभी के प्यार के लिए धन्यवाद, मैं विस्तार से बताऊँगा कि Codex का उपयोग करके 2 घंटे के भीतर अपनी खुद की शैली की एक निजी वेबसाइट कैसे बनाई जाए।
सामान्य चरण: वेबसाइट कंटेंट डॉक्यूमेंट तैयार करें — Taste Skill का उपयोग करके वेब पेज की रेफरेंस इमेज बनाएं — अलग से मटेरियल इमेज तैयार करें — Frontend App Builder skill का उपयोग करके वेब पेज को रेप्लिकेट करें
(विस्तृत चरण आगे दिए गए हैं)
चरण 1: Codex का उपयोग करके विस्तृत वेबसाइट कंटेंट डॉक्यूमेंट तैयार करें
Codex को अपनी व्यक्तिगत जानकारी और वेबसाइट को व्यक्त करने के लिए आवश्यक सामग्री विस्तार से बताएं, और इसे एक विस्तृत संरचित दस्तावेज़ तैयार करने दें।
मेरे दस्तावेज़ में मोटे तौर पर निम्नलिखित शामिल हैं:
- Sac की व्यक्तिगत जानकारी और IP पोजिशनिंग
- पेजों की संख्या, संरचना और शैली
- समग्र डिज़ाइन दिशा और लेआउट
छोटी सी टिप: आप Codex को अपने सोशल मीडिया को देखने देने के लिए Chrome प्लगइन का उपयोग कर सकते हैं ताकि वह आपको जानकारी पूरी करने में मदद कर सके
चरण 2: टेस्ट स्किल का उपयोग करके उच्च गुणवत्ता वाली वेब पेज रेफरेंस इमेज बनाएं
Taste Skill में imagegen-frontend-web स्किल का उपयोग करें और इसे वेबसाइट कंटेंट डॉक्यूमेंट के साथ जोड़कर प्रत्येक पेज के लिए विस्तृत रेफरेंस इमेज बनाएं।
GitHub पता: https://github.com/Leonxlnx/taste-skill/blob/main/skills/imagegen-frontend-web/SKILL.md
यह मेरा प्रॉम्प्ट है:
परिणामी रेफरेंस इमेज का प्रभाव इस प्रकार है:
नोट: Taste Skill में imagegen-frontend-web स्किल Codex को इमेज बनाते समय अधिक सौंदर्य बोध देता है, और स्क्रीन में अधिक डिज़ाइन फील आएगा।
चरण 3: रेफरेंस इमेज की संरचना का विश्लेषण और विखंडन करें, और प्रमुख सामग्रियों के लिए अलग-अलग इमेज बनाएं
पूरी रेफरेंस इमेज प्राप्त करने के बाद, प्रत्येक वेब पेज के लिए प्रमुख सामग्रियों को अलग-अलग बनाने की आवश्यकता होती है। हम सीधे डायलॉग बॉक्स में इनपुट कर सकते हैं:
1यह मेरे द्वारा अब तक बनाई गई वेब पेज की रेफरेंस इमेज है। कृपया उनकी संरचना का पेज दर पेज विश्लेषण करें और मुझे यह तय करने में मदद करें:21. कौन से भागों को कोड से लागू किया जा सकता है32. किन प्रमुख विज़ुअल तत्वों के लिए अलग से मटेरियल बनाने की आवश्यकता है4अभी कोड लिखना शुरू न करें, पहले मुझे एक मटेरियल विखंडन का सुझाव दें।
फिर प्रमुख सामग्री इमेज बनाने के लिए ImageGen का उपयोग करें, ताकि रेफरेंस इमेज के विवरण के साथ एकरूपता सुनिश्चित हो सके।
उदाहरण के लिए, मेरी निजी वेबसाइट में अवतार सामग्री:
चरण 4: Codex के अंतर्निर्मित Frontend App Builder स्किल का उपयोग करके वेब पेज रेफरेंस इमेज को वास्तविक वेब पेज में बदलें
पहले से तय की गई रेफरेंस इमेज और मटेरियल इमेज को Codex को वेब पेज रेप्लिकेशन के लिए सबमिट करें।
यहाँ Build Web Apps प्लगइन में Frontend App Builder स्किल का उपयोग किया गया है। यह रेफरेंस इमेज को डिज़ाइन ड्राफ्ट मानता है और एक संरचित प्रक्रिया के अनुसार उच्च-गुणवत्ता वाली रीक्रिएशन करता है।
वेब पेज को रेप्लिकेट करने के लिए रेफरेंस प्रॉम्प्ट:
रेप्लिकेशन का प्रभाव इस प्रकार है:
