ভূমিকা
এই গাইড আপনাকে 3D স্টোরিটেলিং সলিউশন কাস্টমাইজ করার বিভিন্ন উপায় সম্পর্কে জানাবে। এর ফলে আপনি আকর্ষণীয় জিওলোকেশন স্টোরি তৈরি করতে পারবেন।
দুটি সুবিধাজনক পদ্ধতির মাধ্যমে তাদের স্টোরিটেলিং সলিউশন কনফিগার করার ব্যাপারে আপনার স্বাধীনতা আছে। প্রথমে, আপনি Admin অ্যাপে উপলভ্য ইনট্যুইটিভ UI ব্যবহার করতে পারেন, যেখানে একটি ডেডিকেটেড কনফিগারেশন প্যানেল রয়েছে। এই প্যানেলের মধ্যে, ব্যবহারকারীরা সামগ্রিক গল্প এবং স্বতন্ত্র অধ্যায়, উভয় ক্ষেত্রেই imageUrl, শিরোনাম, তারিখ এবং আরও অনেক কিছুর মতো মূল প্রপার্টি পরিবর্তন করতে পারবেন।
দ্বিতীয়ত, অ্যাডমিন অ্যাপে GUI ব্যবহার করে প্রতিটি অধ্যায়ের জন্য ক্যামেরা সেটিংস ও ফোকাস বিকল্প ফাইন-টিউন করতে পারবেন। কনফিগারেশন নিয়ে সন্তুষ্ট হলে, ব্যবহারকারীদের কাছে তৈরি হওয়া JSON ফাইল ডাউনলোড করার বিকল্প থাকে।
অথবা, আপনি সরাসরি JSON ফাইল এডিট করতে পারেন। আপনি JSON স্ট্রাকচার অ্যাডজাস্ট করতে, কনফিগার করা স্টোরিটেলিং সমাধান লোড করতে এবং অ্যাডমিন কন্ট্রোল প্যানেল বাইপাস করতে পারবেন। এই দ্বৈত পদ্ধতি ব্যবহার করা সহজ ইন্টারফেস এবং উন্নত JSON ম্যানিপুলেশন, দুটিই অফার করে।
শুরু করা:
চালু করুন
আপনার নিজের গল্প তৈরি করুন
গল্পের সামগ্রিক লেআউটটি একটি কভার স্টোরিতে বিভক্ত এবং তারপরে অধ্যায়গুলি রয়েছে।
কভার ও চ্যাপ্টার, দুটিই আলাদাভাবে কাস্টমাইজ করা যাবে। অ্যাডমিন অ্যাপ ও কনফিগারেশন ফাইল, দুটি ব্যবহার করেই কীভাবে স্টোরি তৈরি ও কাস্টমাইজ করা যায় তার বিবরণ
চেক করে দেখুন।
কভার পৃষ্ঠা
আপনার সামগ্রিক গল্পের জন্য প্রথমে একটি কভার পৃষ্ঠা তৈরি করতে হবে। এটি আপনার স্টোরিতে ওভারভিউ, কভার ফটো ও বিবরণ যোগ করে।
Admin অ্যাপ ব্যবহার করুন
আপনার স্টোরির জন্য কভার পৃষ্ঠা যোগ করার মাধ্যমে শুরু করুন। আপনি Admin অ্যাপ থেকে নিম্নলিখিত স্ক্রিন ব্যবহার করে এটি করতে পারবেন:
config.json ব্যবহার করুন
এছাড়াও, আপনার কাছে কনফিগ ফাইল থাকলে, আপনি সরাসরি এই বিভাগগুলি ফাইলে যোগ করতে পারেন:
- ১.
imageUrl: সম্পূর্ণ স্টোরির জন্য মূল মিডিয়া ফাইলের (ছবি, gif বা ভিডিও) URL।
এটি সর্বজনীনভাবে অ্যাক্সেসযোগ্য যেকোনও URL হতে পারে যা কোনও ছবি, gif বা ভিডিও ফাইলকে নির্দেশ করে যা আপনি পুরো স্টোরির জন্য প্রধান মিডিয়া হিসেবে ব্যবহার করতে চান।
- ২.
title: সম্পূর্ণ গল্পের শীর্ষক। - ৩.
date: স্টোরির সাথে সম্পর্কিত তারিখ বা টাইমফ্রেম। - ৪.
description: গল্পের একটি সংক্ষিপ্ত বিবরণ। - ৫.
createdBy: স্টোরির ক্রিয়েটর বা লেখক। - ৬.
imageCredit: প্রধান ছবির ক্রেডিট। - ৭.
cameraOptions: সম্পূর্ণ স্টোরির জন্য প্রাথমিক ক্যামেরা সেটিংস।
চ্যাপ্টার
গল্পটি বিভিন্ন অধ্যায়ে বিভক্ত, প্রতিটি অধ্যায়ে নিজস্ব ভেরিয়েবল সেট রয়েছে। আপনি যতগুলি চ্যাপ্টার চান তৈরি করতে পারবেন। আপনি কোনও ঠিকানা বেছে নিয়ে শুরু করেন এবং তারপর চ্যাপ্টারে নিম্নলিখিত বিবরণ যোগ করেন।
Admin অ্যাপ ব্যবহার করুন
লোকেশন সার্চ: আপনি যে লোকেশন দেখাতে চান সেটি খুঁজতে ইন্টিগ্রেটেড Google Maps Platform-এর অটোমেটিক সম্পূর্ণ হওয়া সার্চ বার ব্যবহার করুন।
কোনও লোকেশন যোগ করা হয়ে গেলে, আপনি লোকেশনের পাশে থাকা এডিট করুন বোতামে ক্লিক করে অধ্যায়ে বিবরণ যোগ করতে পারবেন:
লোকেশন সম্পর্কে বিবরণ যোগ করুন:
সামগ্রিক কনফিগারেশন নিয়ে আপনি সন্তুষ্ট হলে, json ফাইল ডাউনলোড করুন এবং আপনি এটি ডেমো অ্যাপে ব্যবহার করতে পারবেন।
config.json ব্যবহার করে কনফিগার করুন
প্রতিটি চ্যাপ্টার কাস্টমাইজ করতে, আপনি ডাউনলোড করা config.json ফাইলে সরাসরি নিম্নলিখিত ভেরিয়েবল এডিট করতে পারবেন:
title: চ্যাপ্টারের নাম।id: চ্যাপ্টারের জন্য অনন্য শনাক্তকারী।imageUrl: চ্যাপ্টারের ছবির URL।imageCredit: অধ্যায়ের ছবির জন্য ক্রেডিট।content: চ্যাপ্টারের টেক্সট কন্টেন্ট।dateTime: চ্যাপ্টার-নির্দিষ্ট তারিখ বা সময়সীমা।coords: চ্যাপ্টারের সাথে যুক্ত লোকেশনের কোঅর্ডিনেট।lat: অক্ষাংশ।lng: দ্রাঘিমাংশ।
address: চ্যাপ্টার সম্পর্কিত ঠিকানা।
ক্যামেরা সেটিংস
অ্যাপ্লিকেশনটি ক্যামেরায় অনেক বিভিন্ন কন্ট্রোল প্রদান করে। এই বিভাগটি আপনাকে বিভিন্ন ক্যামেরা সেটিংস এবং কীভাবে সেগুলি কাস্টমাইজ করতে হয় তার মাধ্যমে নিয়ে যায়।
(আপনার নিখুঁত দেখার কোণ পেতে ক্যামেরাটি প্যান,জুম, টিল্ট করুন)
Admin অ্যাপ ব্যবহার করা
ক্যামেরা: বেছে নেওয়া দেখার অভিজ্ঞতা তৈরি করতে ক্যামেরার মুভমেন্ট স্পিড ও অরবিট টাইপ অ্যাডজাস্ট করুন।
লোকেশন মার্কার আপনাকে নির্দিষ্ট লোকেশনে পিন দেখানো বা লুকানোর মধ্যে টগল করতে দেয়।
রেডিয়াস ফোকাস নির্দিষ্ট লোকেশন পিনপয়েন্ট না করে নির্দিষ্ট এলাকার চারপাশে একটি ভিনয়েট শ্যাডো তৈরি করে। এটি কোনও পাড়া বা সাধারণ এলাকা দেখানোর জন্য খুব ভাল।
কোনও নির্দিষ্ট পয়েন্টের পরিবর্তে কোনও এলাকাকে হাইলাইট করার জন্য কীভাবে ক্যামেরার ফোকাস পরিবর্তন করতে হয় তা এতে দেখানো হয়েছে।
config.json ব্যবহার করা
এছাড়াও, আপনি json config ফাইল ব্যবহার করে সরাসরি সব ক্যামেরা প্যারামিটার কাস্টমাইজ করতে পারবেন:
cameraOptions: চ্যাপ্টারের জন্য ক্যামেরা সেটিংস। (ক্যামেরা অ্যাঙ্গেল সম্পর্কে আরও জানুন)position: পজিশন প্যারামিটার 3D এনভায়রনমেন্টে ক্যামেরার স্পেশিয়াল কোঅর্ডিনেট নির্ধারণ করে। এতে তিনটি মান থাকে: x, y ও z. প্রতিটি কোঅর্ডিনেট x, y ও z অক্ষে একটি করে পয়েন্টকে বোঝায়, যা ক্যামেরার লোকেশন নির্ধারণ করে।heading: হেডিং প্যারামিটার বলতে ক্যামেরা যে অনুভূমিক দিকে পয়েন্ট করা আছে সেটিকে বোঝায়। ভৌগোলিক পরিভাষায়, এটি ক্যামেরার ভিউ এবং উত্তর দিকের মধ্যেকার কোণকে বোঝায়। 0 হেডিং ইঙ্গিত করে যে ক্যামেরাটি উত্তর দিকে নির্দেশ করছে।pitch: পিচ প্যারামিটার ক্যামেরার উল্লম্ব কোণ নির্ধারণ করে। এটি ক্যামেরার ভিউয়ের ঢাল বা নতিকে বোঝায়। পজিটিভ পিচ নিচের দিকে এবং নেগেটিভ পিচ উপরের দিকে নির্দেশ করে।roll: রোল প্যারামিটার ক্যামেরার অক্ষের চারপাশে ঘূর্ণন সংজ্ঞায়িত করে। এটি ক্যামেরার মোচড়ানো গতিবিধিকে বোঝায়। ০-এর রোল কোনও রোটেশন নির্দেশ করে না, যেখানে ধনাত্মক বা ঋণাত্মক মান যথাক্রমে ডান বা বাম দিকে রোটেশন নির্দেশ করে।
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 স্টোরিটেলিং অ্যাপ্লিকেশন কাস্টমাইজ করার জন্য একটি নির্দেশিকা প্রদান করেছি। আমরা অ্যাডমিন অ্যাপে উপলভ্য বিভিন্ন বিকল্প এবং কীভাবে সেগুলি ব্যবহার করে ইমারসিভ এবং আকর্ষণীয় জিওলোকেশন স্টোরি তৈরি করা যায় তা এক্সপ্লোর করেছি। এছাড়াও, আমরা config.json ফাইল ব্যবহার করে কাস্টম স্টোরি তৈরি করার প্রসেস নিয়ে আলোচনা করেছি। পরবর্তী ধাপ
আপনি যেহেতু 3D স্টোরিটেলিং অ্যাপ্লিকেশন কাস্টমাইজ করার পদ্ধতি শিখেছেন, তাই এখন নিজের গল্প তৈরি করা শুরু করতে পারেন। শুরু করার জন্য এখানে কয়েকটি আইডিয়া দেওয়া হল:
- আপনার শহর বা আপনি ঘুরে দেখেছেন এমন কোনও জায়গা সম্পর্কে একটি গল্প তৈরি করুন।
- ঐতিহাসিক ঘটনা বা আপনাকে অনুপ্রাণিত করেছে এমন কোনও ব্যক্তির সম্পর্কে একটি গল্প লিখুন।
- একটি কাল্পনিক জগৎ বা আপনার দেখা কোনও স্বপ্ন নিয়ে একটি গল্প লিখুন।
সম্ভাবনা সীমাহীন! তাই আপনার কল্পনাশক্তিকে কাজে লাগান এবং সত্যিই বিশেষ কিছু তৈরি করুন।