Google I/O-এর জন্য প্রস্তুতি নেওয়ার সময়, আমরা ওয়েবে অগমেন্টেড রিয়েলিটি (AR) এর উত্তেজনাপূর্ণ সম্ভাবনাগুলি তুলে ধরতে চেয়েছিলাম। Chacmool হল একটি শিক্ষামূলক ওয়েব অভিজ্ঞতার ডেমো যা আমরা দেখিয়েছি যে ওয়েব ভিত্তিক AR কত সহজে ব্যবহারকারীদের AR অভিজ্ঞতার সাথে যুক্ত হতে সাহায্য করতে পারে। ওয়েব AR কে সুবিধাজনক এবং সর্বত্র অ্যাক্সেসযোগ্য করে তোলে।
আমরা এখন Android O বা তার পরবর্তী ARCore-সামঞ্জস্যপূর্ণ Android ডিভাইসে Chrome Canary- এ এই ডেমো চালু করেছি। এছাড়াও আপনাকে ARCore ইনস্টল করতে হবে। এই কাজটি একটি নতুন WebXR প্রস্তাবের ( WebXR হিট টেস্ট API ) উপর নির্ভর করে, তাই এটি একটি পতাকার নিচে এবং ক্যানারিতে থাকার উদ্দেশ্যে আমরা ইমারসিভ ওয়েব কমিউনিটি গ্রুপের অন্যান্য সদস্যদের সাথে নতুন API প্রস্তাবটি পরীক্ষা ও পরিমার্জন করি। আসলে, ডেমো অ্যাক্সেস করতে আপনাকে chrome://flags: #webxr এবং #webxr-hit-test । একবার আপনি উভয়ই সক্ষম হয়ে গেলে এবং ক্যানারি পুনরায় চালু করলে, আপনি Chacmool ডেমো দেখতে পারেন।
Chacmool AR অভিজ্ঞতা শিক্ষার চারপাশে কেন্দ্রীভূত, ব্যবহারকারীদের প্রাচীন Chacmool ভাস্কর্য সম্পর্কে জানতে সাহায্য করার জন্য AR-এর নিমগ্ন এবং ইন্টারেক্টিভ প্রকৃতির ব্যবহার। ব্যবহারকারীরা তাদের বাস্তবতায় একটি লাইফ সাইজের মূর্তি স্থাপন করতে পারে এবং বিভিন্ন কোণ এবং দূরত্ব থেকে ভাস্কর্যটি দেখতে ঘুরে বেড়াতে পারে। AR-এর নিমগ্ন প্রকৃতি ব্যবহারকারীদের অবাধে অন্বেষণ করতে, আবিষ্কার করতে এবং সামগ্রীর সাথে খেলতে দেয়, ঠিক যেমন তারা বাস্তব জগতে পারে। একটি ফ্ল্যাট 2D স্ক্রিনে এটি দেখার বিপরীতে AR-তে একটি বস্তু দেখার সময়, আমরা যা দেখছি তার গভীর উপলব্ধি পেতে সক্ষম কারণ আমরা একটি খুব স্বজ্ঞাত মিথস্ক্রিয়া মডেল ব্যবহার করে এটিকে বিভিন্ন কোণ এবং দূরত্ব থেকে দেখতে পারি: বস্তুর চারপাশে হাঁটা, এবং শারীরিকভাবে কাছাকাছি বা আরও দূরে। এছাড়াও, এই অভিজ্ঞতায়, ভাস্কর্যটিতে সরাসরি স্থাপিত টীকা রয়েছে। এটি ব্যবহারকারীদের সরাসরি সংযুক্ত করতে সক্ষম করে যা পাঠ্যে বর্ণিত আছে এবং সেই বৈশিষ্ট্যগুলি ভাস্কর্যটিতে কোথায় রয়েছে৷
WebXR টিমের প্রথম ওয়েব ভিত্তিক AR ডেমো, WebAR-Article থেকে কিছু উপাদান ব্যবহার করে এই ডেমোটি তৈরি করার জন্য প্রায় এক মাস ধরে তৈরি করা হয়েছিল। ভাস্কর্য সম্পর্কে তথ্য তার Google এর শিল্প ও সংস্কৃতি পৃষ্ঠা থেকে নেওয়া হয়েছিল, এবং 3D মডেলটি Google Arts & Culture-এর অংশীদার CyArk দ্বারা সরবরাহ করা হয়েছিল। ওয়েবের জন্য 3D মডেল প্রস্তুত করতে, মেশল্যাব এবং মেশ মিক্সারের সংমিশ্রণটি মডেলটি মেরামত করতে এবং ফাইলের আকার হ্রাস করার জন্য এর জালটি হ্রাস করতে ব্যবহৃত হয়েছিল। তারপর Draco , 3D জ্যামিতিক মেশ এবং পয়েন্ট ক্লাউডগুলিকে সংকুচিত এবং ডিকম্প্রেস করার জন্য একটি লাইব্রেরি মডেলের ফাইলের আকার 44.3 মেগাবাইট থেকে মাত্র 225 কিলোবাইটে কমাতে ব্যবহৃত হয়েছিল। অবশেষে, একজন ওয়েব কর্মী মডেলটিকে একটি ব্যাকগ্রাউন্ড থ্রেডে লোড করতে ব্যবহার করা হয় যাতে মডেলটি লোড এবং ডিকম্প্রেস করার সময় পৃষ্ঠাটি ইন্টারেক্টিভ থাকে, একটি অপারেশন যা সাধারণত জ্যাঙ্ক সৃষ্টি করে এবং পৃষ্ঠাটিকে স্ক্রোল করা থেকে বাধা দেয়।
আমরা যথেষ্ট জোর দিতে পারি না যে, যেহেতু আমরা ডেস্কটপে ডেভেলপ করছিলাম এবং একটি ফোনে স্থাপন করছিলাম, অভিজ্ঞতা পরিদর্শনে সহায়তা করার জন্য Chrome এর রিমোট ডিবাগিং টুল ব্যবহার করা কোড পরিবর্তনের মধ্যে একটি দুর্দান্ত দ্রুত পুনরাবৃত্তি চক্র তৈরি করে, এবং ডিবাগিংয়ের জন্য Chrome এ আশ্চর্যজনক বিকাশকারী সরঞ্জাম রয়েছে এবং কর্মক্ষমতা পরীক্ষা করা।
AR/VR অভিজ্ঞতার জন্য সেরা অনুশীলন
নেটিভ AR অভিজ্ঞতার জন্য ডিজাইন করার জন্য বেশিরভাগ ডিজাইন এবং ইঞ্জিনিয়ারিং নির্দেশিকা ওয়েব ভিত্তিক AR অভিজ্ঞতা তৈরির জন্য প্রযোজ্য। আপনি যদি সাধারণ সর্বোত্তম অনুশীলন সম্পর্কে আরও জানতে চান, আমরা সম্প্রতি প্রকাশিত AR ডিজাইন নির্দেশিকাগুলি দেখুন।
বিশেষ করে, ওয়েব ভিত্তিক AR অভিজ্ঞতা ডিজাইন করার সময়, AR ব্যবহার করার সময় পুরো স্ক্রীন (অর্থাৎ ভিডিও প্লেয়াররা যেভাবে মোবাইলে ফুলস্ক্রিনে যাচ্ছে তার মতো ফুলস্ক্রিনে যান) ব্যবহার করা ভাল। এটি ব্যবহারকারীদের ভিউ স্ক্রোল করা বা ওয়েব পৃষ্ঠার অন্যান্য উপাদান দ্বারা বিভ্রান্ত হতে বাধা দেয়। AR-তে রূপান্তরটি মসৃণ এবং বিরামহীন হওয়া উচিত, AR অনবোর্ডিংয়ে প্রবেশ করার আগে ক্যামেরার দৃশ্য দেখায় (যেমন একটি জালিকা আঁকা)। ওয়েব ভিত্তিক AR সম্পর্কে যেটা লক্ষ্য করা গুরুত্বপূর্ণ তা হল, নেটিভের মত, ডেভেলপারদের ক্যামেরা ফ্রেম, লাইটিং অনুমান, অ্যাঙ্কর বা প্লেন (এখনও) অ্যাক্সেস নেই, তাই ডিজাইনার এবং ডেভেলপাররা ডিজাইন করার সময় এই সীমাবদ্ধতাগুলি মাথায় রাখবেন। একটি ওয়েব ভিত্তিক এআর অভিজ্ঞতা।
উপরন্তু, ওয়েব অভিজ্ঞতার জন্য ব্যবহৃত বিভিন্ন ডিভাইসের কারণে, এটি গুরুত্বপূর্ণ যে কর্মক্ষমতা সেরা ব্যবহারকারীর অভিজ্ঞতা তৈরি করতে অপ্টিমাইজ করা হয়। তাই: পলি কাউন্ট কম রাখুন, যতটা সম্ভব কম আলো দিয়ে দূরে যাওয়ার চেষ্টা করুন, সম্ভব হলে প্রি-কম্পিউট শ্যাডো এবং ড্র কল কমিয়ে দিন। এআর-এ পাঠ্য প্রদর্শন করার সময়, পাঠ্যটি সমস্ত দূরত্ব এবং কোণ থেকে স্পষ্ট এবং পাঠযোগ্য তা নিশ্চিত করতে আধুনিক (অর্থাৎ স্বাক্ষরিত দূরত্ব ক্ষেত্র ভিত্তিক) পাঠ্য রেন্ডারিং কৌশলগুলি ব্যবহার করুন । টীকা স্থাপন করার সময়, ব্যবহারকারীর দৃষ্টিকে অন্য একটি ইনপুট হিসাবে বিবেচনা করুন এবং কেবলমাত্র টীকাগুলি দেখান যখন সেগুলি প্রাসঙ্গিক হয় (অর্থাৎ প্রক্সিমিটি ভিত্তিক টীকা দেখায় যেগুলি যখন কোনও ব্যবহারকারীর আগ্রহের ক্ষেত্রে ফোকাস করা হয়)৷
সবশেষে, যেহেতু এই বিষয়বস্তুটি ওয়েব ভিত্তিক, তাই ওয়েবের জন্য সাধারণ সর্বোত্তম ডিজাইনের অনুশীলনগুলিও প্রয়োগ করা গুরুত্বপূর্ণ৷ নিশ্চিত করুন যে সাইটটি ডিভাইসগুলি (ডেস্কটপ, ট্যাবলেট, মোবাইল, হেডসেট, ইত্যাদি) জুড়ে একটি ভাল অভিজ্ঞতা প্রদান করে - প্রগতিশীল বর্ধিতকরণকে সমর্থন করার মানে হল অ-এআর-সক্ষম ডিভাইসগুলির জন্য ডিজাইন করা (যেমন অ-এআর ডিভাইসে একটি 3D মডেল ভিউয়ার দেখান)।
আপনি যদি নিজের ওয়েব-ভিত্তিক AR অভিজ্ঞতা তৈরি করতে আগ্রহী হন, তাহলে আমাদের এখানে একটি সহযোগী পোস্ট রয়েছে যা ওয়েবে কীভাবে AR তৈরি করা শুরু করবেন সে সম্পর্কে আরও বিশদ বিবরণ দেবে। (আপনি Chacmool ডেমোর উত্সটিও দেখতে পারেন।) WebXR ডিভাইস API সক্রিয়ভাবে বিকাশে রয়েছে এবং আমরা প্রতিক্রিয়া পছন্দ করব যাতে আমরা নিশ্চিত করতে পারি যে এটি সমস্ত ধরণের অ্যাপ্লিকেশন এবং ব্যবহারের ক্ষেত্রে সক্ষম করে, তাই অনুগ্রহ করে GitHub-এ যান এবং যোগদান করুন কথোপকথোন !