3D स्टोरीटेलिंग: कस्टमाइज़ेशन गाइड

परिचय

इस गाइड में, 3D स्टोरीटेलिंग के समाधान को पसंद के मुताबिक बनाने के अलग-अलग तरीकों के बारे में बताया गया है. इससे आपको दिलचस्प जगहों की कहानियां बनाने में मदद मिलेगी.

आपके पास, दो आसान तरीकों से, स्टोरीटेलिंग के समाधान को कॉन्फ़िगर करने का विकल्प है. सबसे पहले, Admin ऐप्लिकेशन में उपलब्ध आसान यूज़र इंटरफ़ेस (यूआई) का इस्तेमाल किया जा सकता है. इसमें एक खास कॉन्फ़िगरेशन पैनल होता है. इस पैनल में, उपयोगकर्ता पूरी कहानी और अलग-अलग चैप्टर, दोनों के लिए मुख्य प्रॉपर्टी में बदलाव कर सकते हैं. जैसे, imageUrl, टाइटल, तारीख वगैरह.

दूसरा, Admin ऐप्लिकेशन में मौजूद जीयूआई का इस्तेमाल करके, हर चैप्टर के लिए कैमरे की सेटिंग और फ़ोकस के विकल्पों को बेहतर बनाया जा सकता है. कॉन्फ़िगरेशन से संतुष्ट होने के बाद, उपयोगकर्ताओं के पास जनरेट की गई JSON फ़ाइल डाउनलोड करने का विकल्प होता है.

इसके अलावा, सीधे JSON फ़ाइल में भी बदलाव किया जा सकता है. JSON स्ट्रक्चर में बदलाव किया जा सकता है, कॉन्फ़िगर की गई स्टोरीटेलिंग का समाधान लोड किया जा सकता है, और एडमिन कंट्रोल पैनल को बायपास किया जा सकता है. इस दोहरे तरीके से, उपयोगकर्ता के हिसाब से बनाए गए इंटरफ़ेस और JSON में बदलाव करने की बेहतर सुविधा, दोनों मिलती हैं.

शुरू करने का तरीका:

चालू करें

अपनी कहानी खुद लिखें

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

कवर पेज

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

Admin ऐप्लिकेशन का इस्तेमाल करना

सबसे पहले, अपनी स्टोरी के लिए कवर पेज जोड़ें. इसके लिए, एडमिन ऐप्लिकेशन में जाकर, यहां दी गई स्क्रीन का इस्तेमाल करें:

इमेज

config.json का इस्तेमाल करना

इसके अलावा, अगर आपके पास कॉन्फ़िगरेशन फ़ाइल है, तो इन सेक्शन को सीधे फ़ाइल में जोड़ा जा सकता है:

  • 1. imageUrl: पूरी कहानी के लिए मुख्य मीडिया फ़ाइल (इमेज, GIF या वीडियो) का यूआरएल.

यह सार्वजनिक तौर पर ऐक्सेस किया जा सकने वाला ऐसा यूआरएल हो सकता है जो किसी इमेज, GIF या वीडियो फ़ाइल पर ले जाता हो. इस फ़ाइल का इस्तेमाल, पूरी स्टोरी के मुख्य मीडिया के तौर पर किया जा सकता है.

  • 2. title: पूरी कहानी का टाइटल.
  • 3. date: खबर से जुड़ी तारीख या समयसीमा.
  • 4. description: स्टोरी के बारे में कम शब्दों में जानकारी.
  • 5. createdBy: स्टोरी का क्रिएटर या लेखक.
  • 6. imageCredit: मुख्य इमेज का क्रेडिट.
  • 7. cameraOptions: पूरी स्टोरी के लिए, कैमरे की शुरुआती सेटिंग.

चैप्टर

कहानी को चैप्टर में बांटा गया है. हर चैप्टर में वैरिएबल का अपना सेट होता है. आपके पास, जितने चाहें उतने चैप्टर बनाने का विकल्प है. सबसे पहले कोई पता चुनें. इसके बाद, चैप्टर में यह जानकारी जोड़ें.

Admin ऐप्लिकेशन का इस्तेमाल करना

जगह की जानकारी खोजना: आपको जिस जगह की जानकारी दिखानी है उसे ढूंढने के लिए, Google Maps Platform के ऑटोकंप्लीट की सुविधा वाले खोज बार का इस्तेमाल करें.

जगह जोड़ने के बाद, उस जगह के बगल में मौजूद बदलाव करें बटन पर क्लिक करके, चैप्टर में जानकारी जोड़ी जा सकती है:

इमेज

जगह की जानकारी जोड़ें:

पूरे कॉन्फ़िगरेशन से संतुष्ट होने के बाद, JSON फ़ाइल डाउनलोड करें और उसका इस्तेमाल डेमो ऐप्लिकेशन में करें.

config.json का इस्तेमाल करके कॉन्फ़िगर करना

हर चैप्टर को पसंद के मुताबिक बनाने के लिए, डाउनलोड की गई config.json फ़ाइल में जाकर, इन वैरिएबल में बदलाव किया जा सकता है:

  • title: चैप्टर का टाइटल.
  • id: चैप्टर का यूनीक आइडेंटिफ़ायर.
  • imageUrl: चैप्टर की इमेज का यूआरएल.
  • imageCredit: चैप्टर की इमेज का क्रेडिट.
  • content: चैप्टर का टेक्स्ट कॉन्टेंट.
  • dateTime: चैप्टर की तारीख या समयसीमा.
  • coords: चैप्टर से जुड़ी जगह के कोऑर्डिनेट.
    • lat: अक्षांश.
    • lng: देशांतर.
  • address: चैप्टर से जुड़ा पता.

कैमरे की सेटिंग

यह ऐप्लिकेशन, कैमरे पर कई तरह के कंट्रोल उपलब्ध कराता है. इस सेक्शन में, कैमरे की अलग-अलग सेटिंग और उन्हें पसंद के मुताबिक बनाने का तरीका बताया गया है.

इमेज

(अपना सही व्यू ऐंगल पाने के लिए, कैमरे को पैन करें, ज़ूम करें, और झुकाएं)

Admin ऐप्लिकेशन का इस्तेमाल करना

कैमरा: अपनी पसंद के हिसाब से वीडियो देखने का अनुभव बनाने के लिए, कैमरे की गति और ऑर्बिट टाइप में बदलाव करें.

  • जगह का मार्कर टूल की मदद से, किसी जगह पर पिन दिखाने या उसे छिपाने के बीच टॉगल किया जा सकता है.

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

इमेज

इस वीडियो में, किसी खास जगह के बजाय किसी इलाके को दिखाने के लिए, कैमरे के फ़ोकस को बदलने का तरीका बताया गया है.

config.json का इस्तेमाल करना

सीधे JSON कॉन्फ़िगरेशन फ़ाइल का इस्तेमाल करके, कैमरे के सभी पैरामीटर को पसंद के मुताबिक भी बनाया जा सकता है:

  • cameraOptions: चैप्टर के लिए कैमरे की सेटिंग. (कैमरे के ऐंगल के बारे में ज़्यादा जानें)

    • position: पोज़िशन पैरामीटर से, 3D एनवायरमेंट में कैमरे के स्पेस के निर्देशांक तय होते हैं. इसमें तीन वैल्यू होती हैं: x, y, और z. हर निर्देशांक, x, y, और z ऐक्सिस में एक पॉइंट दिखाता है. इससे कैमरे की जगह की जानकारी मिलती है.

    • heading: हेडिंग पैरामीटर से उस हॉरिज़ॉन्टल दिशा का पता चलता है जिसमें कैमरा फ़ोकस किया गया है. भौगोलिक शब्दों में, यह कैमरे के व्यू और उत्तर दिशा के बीच के ऐंगल को दिखाता है. हेडिंग 0 का मतलब है कि कैमरा उत्तर की ओर है.

    • pitch: पिच पैरामीटर, कैमरे के वर्टिकल ऐंगल का पता लगाता है. यह कैमरे के व्यू के झुकाव या झुकने की स्थिति को दिखाता है. सकारात्मक पिच नीचे की ओर दिखती है, जबकि नकारात्मक पिच ऊपर की ओर दिखती है.

    • roll: रोल पैरामीटर से कैमरे के अक्ष के आस-पास घुमाव की जानकारी मिलती है. यह कैमरे के घूमने की गति को दिखाता है. रोल की वैल्यू 0 होने का मतलब है कि कोई रोटेशन नहीं हुआ है. वहीं, पॉज़िटिव या नेगेटिव वैल्यू, दाईं या बाईं ओर होने वाले रोटेशन को दिखाती हैं.

  • focusOptions: किसी खास पॉइंट पर फ़ोकस करने के विकल्प.

  • focusRadius: फ़ोकस के लिए दायरा.

  • showFocus: फ़ोकस दिखाने या छिपाने के लिए बूलियन.

  • showLocationMarker: जगह की जानकारी वाले मार्कर को दिखाने या छिपाने के लिए बूलियन.

अपना कॉन्फ़िगरेशन सेव करना

आखिर में, कैमरे की पोज़िशन सेव करने के लिए, कैमरे की पोज़िशन सेव करें पर क्लिक करें. इसके बाद, अपने काम को सेव करने के लिए, एडिट मोड से बाहर निकलें पर क्लिक करें

इमेज

यह ऐप्लिकेशन, उपयोगकर्ता के हिसाब से बनाया गया इंटरफ़ेस उपलब्ध कराता है. इसकी मदद से, 3D अनुभव को पसंद के मुताबिक बनाया जा सकता है. यह एडमिन ऐप्लिकेशन है.

फ़ाइनल config.json

आखिरी config.json फ़ाइल में, अपनी पसंद के मुताबिक स्टोरीटेलिंग का अनुभव जनरेट करने के लिए ज़रूरी सारी जानकारी होती है. इसमें कवर पेज की जानकारी, चैप्टर, और कैमरे की सेटिंग शामिल हैं. इस फ़ाइल का इस्तेमाल करके, अपनी स्टोरी को बेहतर बनाया जा सकता है. साथ ही, यह पक्का किया जा सकता है कि वह ठीक वैसी ही दिखे और महसूस करे जैसी आपको चाहिए.

शुरू करने के लिए,Admin ऐप्लिकेशन से config.json फ़ाइल डाउनलोड करें या फिर से एक नई फ़ाइल बनाएं. इसके बाद, फ़ाइल को टेक्स्ट एडिटर में खोलें और वैल्यू में बदलाव करना शुरू करें. दर्शकों को एक यूनीक और बेहतर अनुभव देने के लिए, टेक्स्ट, इमेज, और कैमरे की सेटिंग में बदलाव किया जा सकता है.

स्टोरी की खास जानकारी वाली JSON फ़ाइल इस तरह दिख सकती है:

{
  "properties": {
    "imageUrl": "https://storage.googleapis.com/gmp-3d-tiles-storytelling/assets/images/317-300x160.jpg",
    "title": "Title",
    "date": "1967",
    "description": ""his is where you put descriptions",
    "createdBy": "Add author",
    "imageCredit": "Add image credit",
    "cameraOptions": {
      "position": {
        "x": -2708127.031960028,
        "y": -4260747.583520751,
        "z": 3886346.825328216
      },
      "heading": -1.5708,
      "pitch": -0.785398,
      "roll": 0
    }
  }

और कोई चैप्टर कुछ ऐसा दिख सकता है. चैप्टर एक कलेक्शन होता है और इसमें कई अलग-अलग चैप्टर हो सकते हैं.

"chapters": [
    {
      "title": "The Jimmy Hendrix Experience",
      "id": 4,
      "imageUrl": "https://storage.googleapis.com/gmp-3d-tiles-storytelling/assets/images/401-300x160.jpg",
      "imageCredit": "Hunter",
      "content": "XYZZZ",
      "dateTime": "Aug 10-12 1967",
      "coords": {
        "lat": 37.7749,
        "lng": -122.4194
      },
      "address": "The Filmore | 1805 Geary Blvd",
      "cameraOptions": {
        "position": {
          "x": -2706472.5713478313,
          "y": -4261528.277488908,
          "z": 3885143.750529967
        },
        "heading": 0,
        "pitch": 0,
        "roll": 0
      },
      "focusOptions": {
        "focusRadius": 3000,
        "showFocus": false,
        "showLocationMarker": true
      }
    },

बेहतर कस्टमाइज़ेशन

कोड में बदलाव करके, इसे अपनी पसंद के मुताबिक बनाया जा सकता है:

कॉन्फ़िगरेशन फ़ाइल को किसी दूसरी जगह से लोड करना

यह समाधान, स्टोरीटेलिंग कॉन्फ़िगरेशन को किसी स्थानीय फ़ाइल से लोड करता है . हालांकि, config.js में जाकर इसे आसानी से बदला जा सकता है:

export async function loadConfig(configUrl) {
  try {
    // Fetch the configuration data from the specified URL.
    const configResponse = await fetch(configUrl);

कैमरे के कॉन्फ़िगरेशन

/utils/cesium.js फ़ाइल से कैमरे को और भी पसंद के मुताबिक बनाया जा सकता है. इसमें कई अहम वैरिएबल तय किए जाते हैं, जैसे:

  • RADIUS
  • BASE_PITCH_RADIANS
  • BASE_HEADING_RADIANS
  • BASE_ROLL_RADIANS
  • DEFAULT_HIGHLIGHT_RADIUS

अलग-अलग कैमरा ऐंगल और अनुभव पाने के लिए, इन वैरिएबल में बदलाव करें.

नतीजा

इन दस्तावेज़ों में, हमने 3D स्टोरीटेलिंग ऐप्लिकेशन को पसंद के मुताबिक बनाने के लिए गाइड दी है. हमने Admin ऐप्लिकेशन में उपलब्ध अलग-अलग विकल्पों के बारे में जानकारी दी है. साथ ही, यह भी बताया है कि इन्हें इस्तेमाल करके, दिलचस्प और शानदार जगह की जानकारी वाली कहानियां कैसे बनाई जा सकती हैं. हमने config.json फ़ाइल का इस्तेमाल करके, कस्टम स्टोरी बनाने की प्रोसेस के बारे में भी बताया है. अगले चरण

अब जब आपने 3D स्टोरीटेलिंग ऐप्लिकेशन को पसंद के मुताबिक बनाने का तरीका जान लिया है, तो अपनी स्टोरी बनाना शुरू करें. शुरुआत करने के लिए, यहां कुछ आइडिया दिए गए हैं:

  • अपने होमटाउन या किसी ऐसी जगह के बारे में कहानी बनाएं जहां आपने विज़िट किया है.
  • किसी ऐतिहासिक घटना या ऐसे व्यक्ति के बारे में कहानी बनाएं जिसने आपको प्रेरित किया हो.
  • किसी काल्पनिक दुनिया या अपने किसी सपने के बारे में कहानी बनाएं.

खरीदारी की सुविधा वाले कई तरह के वीडियो बनाए जा सकते हैं! इसलिए, अपनी कल्पना को पंख लगने दें और कुछ ऐसा बनाएं जो सचमुच खास हो.