Dostosowywanie marketingu narracyjnego 3D

Wprowadzenie

Z tego przewodnika dowiesz się, jak dostosować rozwiązanie do opowiadania historii w 3D, aby tworzyć urzekające historie oparte na geolokalizacji.

Możesz skonfigurować rozwiązanie do marketingu narracyjnego na 2 wygodne sposoby. Po pierwsze możesz użyć intuicyjnego interfejsu dostępnego w aplikacji administratora, który zawiera specjalny panel konfiguracji. W tym panelu użytkownicy mogą modyfikować główne właściwości, takie jak imageUrl, tytuł, data i inne, zarówno w przypadku całej historii, jak i poszczególnych rozdziałów.

Po drugie, możesz dostosować ustawienia aparatu i opcje ostrości dla każdego rozdziału, korzystając z interfejsu GUI w aplikacji administratora. Gdy użytkownicy będą zadowoleni z konfiguracji, będą mogli pobrać wygenerowany plik JSON.

Możesz też bezpośrednio edytować plik JSON. Możesz dostosować strukturę JSON, wczytać skonfigurowane rozwiązanie do marketingu narracyjnego i pominąć panel sterowania. To podwójne podejście zapewnia zarówno przyjazny dla użytkownika interfejs, jak i zaawansowane możliwości manipulowania danymi JSON.

Pierwsze kroki

Włącz

Tworzenie własnej historii

Ogólny układ opowiadania jest podzielony na okładkę i rozdziały. Zarówno okładkę, jak i rozdział można dostosować indywidualnie. Sprawdź
, jak można tworzyć i dostosowywać historie za pomocą aplikacji administratora i pliku konfiguracji.

strona tytułowa

Pierwszą rzeczą, którą musisz zrobić, jest utworzenie strony tytułowej dla całej historii. Spowoduje to dodanie do historii podsumowania, zdjęcia głównego i opisu.

Korzystanie z aplikacji administratora

Zacznij od dodania strony tytułowej do swojej historii. Możesz to zrobić w aplikacji administratora na tym ekranie:

obraz

Używanie pliku config.json

Jeśli masz plik konfiguracyjny, możesz też bezpośrednio dodać do niego te sekcje:

  • 1. imageUrl: adres URL głównego pliku multimedialnego (obrazu, GIF-a lub filmu) dla całej relacji.

Może to być dowolny publicznie dostępny adres URL wskazujący obraz, GIF lub plik wideo, którego chcesz użyć jako głównego elementu multimedialnego w całej relacji.

  • 2. title: tytuł całej historii.
  • 3. date: data lub przedział czasowy powiązany z artykułem.
  • 4. description: krótki opis artykułu.
  • 5. createdBy: twórca lub autor artykułu.
  • 6. imageCredit: autor głównego obrazu.
  • 7. cameraOptions: początkowe ustawienia kamery dla całej historii.

Rozdziały

Historia jest podzielona na rozdziały, z których każdy ma własny zestaw zmiennych. Możesz utworzyć dowolną liczbę rozdziałów. Zacznij od wybrania adresu, a następnie dodaj do rozdziału te informacje:

Korzystanie z aplikacji administratora

Wyszukiwanie lokalizacji: użyj zintegrowanego paska wyszukiwania z autouzupełnianiem Google Maps Platform, aby znaleźć lokalizację, którą chcesz wyświetlić.

Po dodaniu lokalizacji możesz dodać szczegóły do rozdziału, klikając przycisk Edytuj obok lokalizacji:

obraz

Dodaj szczegóły lokalizacji:

Gdy konfiguracja będzie gotowa, pobierz plik JSON i użyj go w aplikacji demonstracyjnej.

Konfigurowanie za pomocą pliku config.json

Aby dostosować poszczególne rozdziały, możesz edytować te zmienne bezpośrednio w pobranym pliku config.json:

  • title: tytuł rozdziału.
  • id: unikalny identyfikator rozdziału.
  • imageUrl: URL obrazu rozdziału.
  • imageCredit: informacje o autorze obrazu rozdziału.
  • content: treść tekstowa rozdziału.
  • dateTime: data lub przedział czasu, którego dotyczy rozdział.
  • coords: współrzędne lokalizacji powiązanej z rozdziałem.
    • lat: szerokość geograficzna.
    • lng: długość geograficzna.
  • address: adres powiązany z rozdziałem.

Ustawienia aparatu

Aplikacja udostępnia wiele różnych elementów sterujących aparatem. W tej sekcji dowiesz się, jak dostosować różne ustawienia aparatu.

obraz

(Przesuń, powiększ, pochyl kamerę, aby uzyskać idealny kąt widzenia)

Korzystanie z aplikacji administratora

Kamera: dostosuj szybkość ruchu kamery i typ orbity, aby uzyskać wybrany efekt.

  • Znacznik lokalizacji umożliwia przełączanie między wyświetlaniem pinezki w określonej lokalizacji a jej ukrywaniem.

  • Skupienie na promieniu tworzy cień winiety wokół określonego obszaru bez wskazywania konkretnej lokalizacji. To świetny sposób na pokazanie okolicy lub ogólnego obszaru.

obraz

Pokazuje, jak zmienić ostrość kamery, aby pokazać obszar, a nie konkretny punkt.

Używanie pliku config.json

Możesz też dostosować wszystkie parametry kamery bezpośrednio za pomocą pliku konfiguracji JSON:

  • cameraOptions: ustawienia kamery dla rozdziału. (dowiedz się więcej o kątach kamery)

    • position: parametr pozycji określa współrzędne przestrzenne kamery w środowisku 3D. Składa się z 3 wartości: x, y i z. Każda współrzędna reprezentuje punkt na osiach x, y i z, określając lokalizację kamery.

    • heading: parametr kierunku odnosi się do kierunku poziomego, w którym skierowana jest kamera. W ujęciu geograficznym jest to kąt między widokiem kamery a kierunkiem północnym. Wartość 0 oznacza, że kamera jest skierowana na północ.

    • pitch: parametr pitch określa kąt nachylenia kamery w pionie. Określa nachylenie widoku kamery. Dodatnie nachylenie oznacza patrzenie w dół, a ujemne – w górę.

    • roll: parametr obrotu określa obrót wokół osi kamery. Reprezentuje ruch obrotowy kamery. Wartość 0 oznacza brak obrotu, a wartości dodatnie i ujemne oznaczają obrót odpowiednio w prawo lub w lewo.

  • focusOptions: opcje ustawiania ostrości na konkretnym punkcie.

  • focusRadius: promień ostrości.

  • showFocus: wartość logiczna określająca, czy fokus ma być wyświetlany, czy ukryty.

  • showLocationMarker: wartość logiczna określająca, czy znacznik lokalizacji ma być widoczny.

Zapisywanie konfiguracji

Na koniec kliknij Zapisz pozycję kamery, aby zapisać pozycję kamery, a następnie kliknij Opuść tryb edycji, aby zapisać zmiany.

obraz

Ta aplikacja ma przyjazny dla użytkownika interfejs, który umożliwia dostosowanie widoku 3D. To jest aplikacja administratora.

Ostateczny plik config.json

Ostateczny plik config.json zawiera wszystkie informacje potrzebne do wygenerowania niestandardowego marketingu narracyjnego. Zawiera on informacje o stronie tytułowej, rozdziałach i ustawieniach aparatu. Możesz użyć tego pliku, aby dopracować swoją historię i upewnić się, że wygląda i brzmi dokładnie tak, jak chcesz.

Aby rozpocząć,pobierz plik config.json z aplikacji administratora lub utwórz nowy od podstaw. Następnie otwórz plik w edytorze tekstu i zacznij edytować wartości. Możesz zmieniać tekst, obrazy, a nawet ustawienia kamery, aby tworzyć unikalne i wciągające treści dla odbiorców.

Plik JSON z podsumowaniem opowiadania może wyglądać tak:

{
  "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
    }
  }

A konkretny rozdział może wyglądać tak. Rozdziały to tablica, która może zawierać wiele pojedynczych rozdziałów.

"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
      }
    },

Zaawansowane opcje dostosowywania

Możesz zagłębić się w kod i wprowadzić kilka innych dostosowań:

Wczytywanie pliku konfiguracji z innej lokalizacji

Rozwiązanie od razu wczytuje konfigurację marketingu narracyjnego z pliku lokalnego . Można to jednak łatwo zmienić w pliku config.js:

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

Konfiguracje kamer

Kamerę można dodatkowo dostosować w pliku /utils/cesium.js. Określa on szereg ważnych zmiennych, takich jak:

  • RADIUS
  • BASE_PITCH_RADIANS
  • BASE_HEADING_RADIANS
  • BASE_ROLL_RADIANS
  • DEFAULT_HIGHLIGHT_RADIUS

Możesz dostosować te zmienne, aby uzyskać różne kąty kamery i efekty.

Podsumowanie

W tym dokumencie znajdziesz przewodnik po dostosowywaniu aplikacji do opowiadania historii 3D. Poznaliśmy różne opcje dostępne w aplikacji administratora i sposoby ich wykorzystania do tworzenia wciągających i angażujących historii geolokalizacyjnych. Omówiliśmy też proces tworzenia niestandardowej opowieści za pomocą pliku config.json. Następne kroki

Teraz, gdy wiesz już, jak dostosować aplikację do opowiadania historii w 3D, możesz zacząć tworzyć własne historie. Poniżej znajdziesz kilka pomysłów, które pomogą Ci zacząć.

  • Utwórz historię o swoim rodzinnym mieście lub miejscu, które odwiedziłeś(-aś).
  • Utwórz historię o wydarzeniu historycznym lub osobie, która Cię zainspirowała.
  • Utwórz opowiadanie o fikcyjnym świecie lub o swoim śnie.

Możliwości są nieograniczone. Puść wodze fantazji i stwórz coś naprawdę wyjątkowego.