Xlera8

AR، VR، اور HTML میں 3D کے لیے ایک ماڈل

میں کہیں نیچے ٹک گیا۔ سفاری ٹیکنالوجی کا پیش نظارہ 161 ریلیز نوٹس ایک نئے HTML عنصر اور انتساب کی حمایت کے بارے میں بظاہر معصوم لائن ہے:

کے لیے سپورٹ شامل کیا گیا۔ <model src> اور عزت <source type> صفات ([ای میل محفوظ])

جب بھی میں کسی ایسے عنصر کا ذکر دیکھتا ہوں جسے میں نہیں پہچانتا ہوں، میرا ذہن سیدھا جاتا ہے۔ ہہ! میرے لیے نئی، لیکن شاید باقی سب کے لیے پرانی خبر. یہ ناقص کرنسی ہے، میں جانتا ہوں، جیسا کہ یہ آسانی سے ہو سکتا ہے:

  • ہمم، کچھ ملکیتی تجربہ لگتا ہے۔
  • واہ، واقعی ایک نئی چیز!

سچ تو یہ ہے کہ یہ تینوں ہی ہیں۔

یہ ایک ارتقائی تصور ہے۔

جیسا کہ، پہلی کسی حد تک سرکاری آواز والی چیز جس پر میں نے پایا <model> W3C اسپیک میں نہیں تھا بلکہ اس میں تھا۔ وضاحت کرنے والوں کے لیے WebKit کا ریپو. README میں جو کچھ ہے وہ 2021 کا ایک بڑا نوٹ ہے کہ "The <model> عنصر immersive Web CG میں منتقل ہو گیا ہے۔" میں چھلانگ لگانے ہی والا تھا لیکن میری آنکھ لگ گئی۔ HistoryAndEvolution.md فائل جس میں ابتدائی سیاق و سباق کا ایک اچھا رن ڈاؤن ہے۔ <model> تصور:

۔ <model> عنصر اگلا قدم اٹھانے اور iOS کے ساتھ سفاری کے انضمام کے تجربے کو بہتر بنانے کی خواہش سے پیدا ہوا تھا۔ اے آر فوری نظر کو نمایاں کریں.

مجھے اے آر کوئیک لک کے لیے ایپل کے اسپلش پیج کو دیکھنا پڑا۔ آپ کو اس نئی خصوصیت کا علم ہے جو کچھ اسٹورز میں موجود ہے جہاں آپ اپنے فون کے کیمرہ کا استعمال کرتے ہوئے اپنے گھر میں کسی پروڈکٹ کی 3D رینڈرنگ منتقل کر سکتے ہیں؟ یہ اس قسم کی چیزیں ہیں جس کے بارے میں ہم بات کر رہے ہیں، اور ایپل میٹروپولیٹن میوزیم آف آرٹ سے ایک عمدہ کیس اسٹڈی کو لنک کرتا ہے۔.

جیسا کہ میں اسے اس محدود سیاق و سباق سے سمجھتا ہوں:

  • گرا a <model> دستاویز میں عنصر.
  • ایک بیرونی سورس فائل شامل کریں، جیسے <model src="assets/example.usdz">.

اصل تجویز ایمرسیو ویب کمیٹی گروپ کی طرف سے ہے۔

وہ ٹیم ہے۔ ورچوئل رئیلٹی (VR) اور Augmented Reality (AR) کو ویب کا حصہ بناتا ہے۔ ایپل نے ان کے ریپو کو جوڑ دیا، لہذا میں نے چھلانگ لگائی اور چلا گیا۔ براہ راست وضاحت کرنے والے کے پاس. یہ قیاس یا کچھ بھی نہیں ہے، بلکہ اصل تجویز ہے۔ عنصر کی ایک بہت بہتر تعریف!

ایچ ٹی ایم ایل عناصر کے ذریعے میڈیا کی بہت سی اقسام کے ڈسپلے کی اجازت دیتا ہے جیسے <img><picture>، یا <video>، لیکن یہ 3D مواد کو براہ راست ڈسپلے کرنے کے لیے اعلانیہ طریقہ فراہم نہیں کرتا ہے۔ صفحہ کے اندر تھری ڈی مواد کو سرایت کرنا نسبتاً بوجھل ہے اور اسکرپٹ پر انحصار کرتا ہے۔ <canvas> عنصر ہمارا ماننا ہے کہ اب وقت آگیا ہے کہ 3D ماڈلز کو دیگر، پہلے سے تعاون یافتہ، میڈیا کی اقسام کے ساتھ برابری کی بنیاد پر رکھا جائے۔

[...]

ایچ ٹی ایم ایل <model> عنصر کا مقصد کسی ویب سائٹ کو انٹرایکٹو 3D ماڈلز کو کسی دوسرے بصری میڈیا کی طرح آسانی سے ایمبیڈ کرنے کی اجازت دینا ہے۔ توقع کی جاتی ہے کہ ماڈلز 3D تصنیف کے ٹولز کے ذریعہ بنائے جائیں گے یا متحرک طور پر بنائے جائیں گے، لیکن سرور کے ذریعہ اسٹینڈ لون وسائل کے طور پر کام کیا جائے گا۔

بنیادی مثال اس کو ایک ساتھ کھینچتی ہے۔ یہ واقعی کی طرح محسوس ہوتا ہے۔ <video> or <picture> عناصر:

<model style="width: 400px; height: 300px"> <source src="assets/example.usdz" type="model/vnd.usdz+zip"> <source src="assets/example.glb" type="model/gltf-binary">
</model>

.usdz? .glb? فائلوں کی قسم نہیں جو عام طور پر میری میز کو پار کرتی ہے۔ لگتا ہے کہ مجھے ان اور کسی بھی دوسری فائل کی قسموں کو برش کرنے کی ضرورت ہوگی۔ <model> حمایت کر سکتے ہیں. ایک بار پھر، یہ سب محض اصل تجویز ہے۔

مسودہ تجویز ابھی تک ختم نہیں ہوا ہے۔

لیکن یہ کرتا ہے ایک اچھا خاکہ فراہم کریں۔ جہاں چیزیں ممکنہ طور پر جا سکتی ہیں:

  • دستاویز میں ماڈل شامل کرنا
  • تعامل کو چالو کرنا
  • متعدد فارمیٹس کو سپورٹ کرنا
  • فال بیک مواد فراہم کرنا
  • اسے قابل رسائی بنانا

پتہ لگانے کے لیے بہت کچھ ہے۔ جو کچھ ہے ان میں سے زیادہ تر دستاویزی مسائل ہیں جن کو حل کرنے کی ضرورت ہے۔ تاہم، اس پر مزید روشنی پڑتی ہے۔ <model> جیسے مجوزہ اوصاف جو اسے یکساں محسوس کرتے ہیں۔ زیادہ کی طرح <video> جیسے autoplay, controls, loop, muted, poster، وغیرہ

یہ اور بھی پیچھے چلا جاتا ہے۔

3D ماڈلنگ کا سب سے قدیم ذکر مجھے ملا کیتھ کلارک کی 2018 کی پوسٹ جس میں وہ ایک حسب ضرورت عنصر کو پروٹو ٹائپ کرتا ہے جسے کہتے ہیں۔ <x-model>. وہ اسے "ایک پلیس ہولڈر جو DOM اور CSSOM تک رسائی فراہم کرتا ہے" کے طور پر بیان کرتا ہے جہاں لوڈنگ اور رینڈرنگ کی جاتی ہے۔ تین. js.

کیتھ کے خیال کی پیروی کی گئی ہے۔ <model-viewer> جزو جو میڈلی نے 2020 میں شیئر کیا۔ (اور اس کے بعد اپ ڈیٹ اس پر)۔ یہاں تک کہ ایک ہے۔ اس کے لیے ہوم پیج اور نیل آرمسٹرانگ کو خلا میں گھسیٹنا مزہ آتا ہے۔

یہ ممکنہ طور پر صرف ایک تجربہ ہے؟

میرا مطلب ہے، مسودہ کی قیاس آرائی نہیں کی گئی ہے۔ ایپل Safari TP 161 کے اعلان کی بدولت گیند کھیلنے پر آمادہ نظر آتا ہے۔ یہ مکمل معنی دیتا ہے۔ ایپل اے آر پر کتنا تیز ہے۔ مجموعی طور پر. (ایپل شیشے، کوئی؟)

ایسا لگتا ہے کہ گوگل کا قدم دروازے میں ہے، اگرچہ ویب اجزاء کی چیزوں کے پہلو پر ہے۔ یہ دیکھنا آسان ہے کہ ایپل اور گوگل ویب پر اے آر سے کیا چاہتے ہیں اس کے درمیان دلچسپی کا ٹکراؤ کیسے ہو سکتا ہے۔


یہ سب کچھ کرنے کی کوشش کرنے سے صرف میرے نوٹ ہیں۔ اس میں اس سے کہیں زیادہ اہمیت ہونی چاہیے جو میں ابھی تک اس کے بارے میں جانتا ہوں۔ مجھے یقین ہے کہ کوئی ہوشیار اس کے ارد گرد صاف کمان باندھ سکتا ہے۔ <model> تبصرے میں. 😉

اور جب ہم سفاری ٹیکنالوجی کے پیش نظارہ پر بات کر رہے ہیں، 162 ابھی دوسرے دن جاری ہوا۔ اور یہ قابل بناتا ہے CSS nesting اور CSS رشتہ دار رنگ نحو.

ہمارے ساتھ بات چیت

ہیلو وہاں! میں آپ کی کیسے مدد کر سکتا ہوں؟