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

परिचय

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

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

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

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

शुरू करना:

चालू करें

अपनी कहानी बनाएं

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

कवर पेज

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

Admin app का इस्तेमाल करना

अपनी कहानी के लिए कवर पेज जोड़कर शुरुआत करें. Admin app में, इस स्क्रीन का इस्तेमाल करके कवर पेज जोड़ा जा सकता है:

इमेज

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

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

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

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

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

चैप्टर

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

Admin app का इस्तेमाल करना

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

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

इमेज

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

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

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

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

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

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

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

इमेज

(कैमरे को पैन, ज़ूम, और टिल्ट करके, देखने का सही ऐंगल पाएं)

Admin app का इस्तेमाल करना

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

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

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

इमेज

इससे पता चलता है कि किसी खास पॉइंट के बजाय, किसी इलाके को दिखाने के लिए कैमरे का फ़ोकस कैसे बदला जाता है.

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

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

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

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

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

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

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

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

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

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

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

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

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

इमेज

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

आखिरी config.json

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

शुरू करने के लिए,Admin app से 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 app में उपलब्ध अलग-अलग विकल्पों के बारे में बताया है. साथ ही, यह भी बताया है कि जगह की जानकारी के आधार पर इमर्सिव और दिलचस्प कहानियां बनाने के लिए, इन विकल्पों का इस्तेमाल कैसे किया जा सकता है. हमने config.json फ़ाइल का इस्तेमाल करके, पसंद के मुताबिक कहानी बनाने की प्रोसेस के बारे में भी बताया है. अगले चरण

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

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

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