Bercerita 3d: panduan penyesuaian

Pengantar

Panduan ini akan memandu Anda melalui berbagai cara menggunakan solusi Penceritaan 3D dapat disesuaikan, sehingga Anda dapat membuat cerita geolokasi yang menarik.

Anda memiliki fleksibilitas untuk mengonfigurasi solusi bercerita mereka melalui dua metode yang nyaman. Pertama, Anda dapat menggunakan UI intuitif yang tersedia di Admin, yang menampilkan panel konfigurasi khusus. Dalam panel ini, pengguna dapat ubah properti utama seperti URL gambar, judul, tanggal, dan lainnya, baik untuk keseluruhan cerita maupun bab tersendiri.

Kedua, Anda dapat menyesuaikan setelan kamera dan opsi fokus untuk setiap kamera menggunakan GUI di aplikasi Admin. Setelah puas dengan konfigurasinya, pengguna memiliki opsi untuk mendownload file JSON yang dihasilkan.

Atau, Anda dapat langsung mengedit file JSON. Anda dapat menyesuaikan struktur JSON, memuat solusi bercerita yang dikonfigurasi, dan mengabaikan panel kontrol Admin. Pendekatan ganda ini menawarkan antarmuka yang mudah digunakan dan manipulasi JSON lanjutan.

Memulai:

Aktifkan

Buat kisah Anda sendiri

Tata letak cerita secara keseluruhan dibagi menjadi cerita awal dan diikuti beberapa bab. Sampul dan bab dapat disesuaikan satu per satu. Lihat
detail tentang bagaimana cerita dapat dibuat dan disesuaikan menggunakan aplikasi Admin serta file konfigurasi.

Halaman sampul

Hal pertama yang perlu dilakukan adalah membuat halaman sampul untuk cerita Anda. Cara ini akan menambahkan ringkasan, foto sampul, dan deskripsi ke story Anda.

Gunakan aplikasi Admin

Anda mulai dengan menambahkan halaman sampul untuk cerita Anda. Anda dapat melakukannya dari aplikasi Admin menggunakan layar berikut:

gambar

Menggunakan config.json

Selain itu, jika Anda memiliki file konfigurasi, Anda dapat langsung menambahkan bagian ini di file tersebut:

  • 1. imageUrl: URL file media utama (gambar, gif, atau video) untuk cerita secara keseluruhan.

Ini dapat berupa URL yang dapat diakses secara publik yang mengarah ke gambar, gif, atau video yang ingin Anda gunakan sebagai media utama untuk keseluruhan cerita.

  • 2. title: Judul seluruh cerita.
  • 3. date: Tanggal atau jangka waktu yang terkait dengan artikel.
  • 4. description: Deskripsi singkat cerita.
  • 5. createdBy: Pembuat atau penulis artikel.
  • 6. imageCredit: Kredit untuk gambar utama.
  • 7. cameraOptions: Setelan kamera awal untuk seluruh cerita.

Segmen

Cerita ini dibagi menjadi beberapa bab, masing-masing dengan serangkaian variabelnya sendiri. Anda dapat membuat segmen sebanyak yang Anda inginkan. Mulai dengan memilih alamat, lalu tambahkan detail berikut ke bab.

Gunakan aplikasi Admin

Penelusuran lokasi: Menggunakan penelusuran Autocomplete Google Maps Platform yang terintegrasi untuk menemukan lokasi yang ingin ditampilkan.

Setelah lokasi ditambahkan, Anda dapat menambahkan detail ke bab dengan mengklik Tombol Edit di samping lokasi:

gambar

Tambahkan detail tentang lokasi:

Setelah Anda puas dengan konfigurasi keseluruhan, unduh file json dan Anda dapat menggunakannya di aplikasi demo.

Mengonfigurasi menggunakan config.json

Anda dapat mengedit variabel berikut secara langsung di file config.json yang didownload untuk menyesuaikan setiap bab:

  • title: Judul bab.
  • id: ID unik untuk segmen.
  • imageUrl: URL gambar segmen.
  • imageCredit: Kredit untuk gambar segmen.
  • content: Konten teks untuk bab.
  • dateTime: Tanggal atau jangka waktu khusus untuk segmen.
  • coords: Koordinat untuk lokasi yang terkait dengan segmen.
    • lat: Lintang.
    • lng: Bujur.
  • address: Alamat yang terkait dengan bab.

Setelan kamera

Aplikasi ini menyediakan berbagai kontrol pada kamera. Bagian ini memandu Anda melalui berbagai setelan kamera dan cara menyesuaikannya.

gambar

(Geser,zoom, miringkan kamera untuk mendapatkan sudut pandang yang sempurna)

Menggunakan aplikasi Admin

Kamera: Menyesuaikan kecepatan gerakan kamera dan jenis orbit untuk membuat pengalaman menonton yang dipilih.

  • Penanda lokasi memungkinkan Anda beralih antara menampilkan pin di lokasi atau menyembunyikannya.

  • Fokus radius membuat bayangan vignette di sekitar area tertentu tanpa menunjukkan lokasi yang spesifik. Cara ini sangat bagus untuk menunjukkan daerah sekitar atau kisaran area.

gambar

Ini menunjukkan cara mengubah fokus kamera untuk menampilkan suatu area, bukan titik tertentu.

Menggunakan config.json

Anda juga dapat menyesuaikan semua parameter kamera secara langsung menggunakan konfigurasi json file:

  • cameraOptions: Setelan kamera untuk segmen. (pelajari lebih lanjut tentang kamera sudut)

    • position: Parameter posisi menentukan koordinat spasial kamera dalam lingkungan 3D. Nilai ini terdiri dari tiga nilai: x, y, dan z. Setiap koordinat merepresentasikan titik dalam sumbu x, y, dan z, yang menentukan lokasi kamera.

    • heading: Parameter arah mengacu pada arah horizontal dalam ke arah kamera. Dalam istilah geografis, hal itu mewakili sudut antara pandangan kamera dan arah utara. Judul 0 menunjukkan kamera menunjuk ke utara.

    • pitch: Parameter pitch menentukan sudut vertikal kamera. Pola ini menandakan kemiringan atau kemiringan pandangan kamera. J pitch positif terlihat ke bawah, sementara pitch negatif mengarah ke atas.

    • roll: Parameter rol menentukan rotasi di sekitar kamera . Efek tersebut mewakili gerakan memutar kamera. Gulungan 0 menunjukkan tidak adanya rotasi, sedangkan nilai positif atau negatif menunjukkan rotasi ke kanan atau ke kiri.

  • focusOptions: Opsi untuk memfokuskan pada titik tertentu.

  • focusRadius: Radius untuk fokus.

  • showFocus: Boolean untuk menampilkan atau menyembunyikan fokus.

  • showLocationMarker: Boolean untuk menampilkan atau menyembunyikan penanda lokasi.

Simpan konfigurasi Anda

Terakhir, klik Simpan posisi kamera untuk menyimpan posisi kamera, lalu klik Keluar dari mode edit untuk menyimpan pekerjaan Anda

gambar

Aplikasi ini menyediakan antarmuka yang mudah digunakan yang memungkinkan Anda menyesuaikan pengalaman 3D. Ini adalah aplikasi Admin.

Config.json akhir

File config.json akhir berisi semua informasi yang diperlukan untuk membuat pengalaman bercerita kustom. Hal ini mencakup detail halaman sampul, bab, dan setelan kamera. Anda dapat menggunakan file ini untuk menyempurnakan artikel dan memastikan tampilan dan nuansa yang sesuai dengan keinginan Anda.

Untuk memulai,download file config.json dari aplikasi Admin atau membuat yang baru dari awal. Kemudian, buka {i>file<i} dalam editor teks dan mulai mengedit nilai. Anda dapat mengubah teks, gambar, dan bahkan kamera setelan untuk menciptakan pengalaman yang unik dan imersif bagi audiens Anda.

File json ringkasan cerita dapat terlihat seperti ini:

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

Dan bab tertentu dapat terlihat seperti ini. Segmen adalah array dan bisa mengambil banyak bab tersendiri di dalam array.

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

Penyesuaian lanjutan

Anda dapat mendalami kode dan melakukan beberapa penyesuaian lainnya:

Memuat file konfigurasi dari lokasi lain

Secara otomatis, solusi memuat konfigurasi penceritaan dari file lokal . Namun, hal ini dapat diubah dengan mudah di config.js:

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

Konfigurasi Kamera

Kamera dapat disesuaikan lebih lanjut dari file /utils/cesium.js. Kode ini menentukan sejumlah variabel penting seperti:

  • RADIUS
  • BASE_PITCH_RADIANS
  • BASE_HEADING_RADIANS
  • BASE_ROLL_RADIANS
  • DEFAULT_HIGHLIGHT_RADIUS

Jangan ragu untuk menyesuaikan variabel ini untuk mendapatkan berbagai kemampuan dan pengalaman kamera.

Kesimpulan

Dalam dokumen ini, kami telah menyediakan panduan untuk menyesuaikan Penceritaan 3D aplikasi. Kita telah mempelajari berbagai opsi yang tersedia di aplikasi Admin dan bagaimana mereka dapat digunakan untuk membuat kisah geolokasi yang imersif dan menarik. Rab juga telah membahas proses pembuatan cerita kustom menggunakan config.json . Langkah Berikutnya

Sekarang setelah Anda mempelajari cara menyesuaikan aplikasi Penceritaan 3D, Anda bisa mulai membuat cerita Anda sendiri. Berikut ini beberapa ide untuk membantu Anda memulai:

  • Buat cerita tentang kota asal Anda atau tempat yang pernah Anda kunjungi.
  • Buat cerita tentang peristiwa bersejarah atau orang yang menginspirasi Anda.
  • Buat cerita tentang dunia fiksi atau mimpi yang Anda miliki.

Kemungkinannya tak terbatas. Jadi, bebaskan imajinasi Anda dan ciptakan dengan sesuatu yang benar-benar istimewa.