🕎 ✌🏼 😄 خمسة عروض WebGL التي تدهش 👨🏽‍🍳 🤷🏿 🧓🏼

متصفح على جهاز كمبيوتر ، متصفح على هاتف أو ساعة ذكية ، أو ربما شخص في إبريق الشاي؟ تحيط بنا تقنيات الويب من جميع الجوانب ، ومع تطور حشوة الحديد ، فإنها تصبح أكثر إثارة ومثالية. قبل بضع سنوات فقط ، تم الحديث عن WebGL على أنها لعبة ممتعة ذات احتمالات غامضة. لكن الكثير قد تغير ويتم استبدال الفلاش الشهير سابقًا بتقنيات HTML5 / WebGL الأكثر تقدمًا.

لقد مر الوقت الذي كانت فيه عروض WebGL بدائية أو حرفية أو عروض توضيحية من مطوري البرامج. تستخدم الآن العديد من العلامات التجارية المعروفة هذه التكنولوجيا للعروض التقديمية والعديد منها تبدو مقنعة للغاية.

بورش 911

لقد سمع الجميع عن بورش. رأى شخص ما للتو ، شخص ما يحبك بقطعة قماش في مرآبه. حسنًا ، تقدم بقية الشركة الألمانية الشهيرة التعرف على الماكينة على موقعها الإلكتروني . وليس مجرد إلقاء نظرة على الصور ، ولكن "فحص" عناصر التحكم ، والتعرف على بعض الميزات التكنولوجية.

أول شيء يذهلك عندما تبدأ عرضًا توضيحيًا هو الجودة. يبدو النموذج مثل سيارة "حية". بتفاصيل صغيرة ومحبة وانعكاسات المشهد وأسطح الكروم. والأكثر إثارة للاهتمام هو عدم وجود فرامل في المتصفح!

التمرير الحر للنموذج ، يسمح لك التحجيم بالنظر في كل شيء حرفيًا وحتى النظر إلى الداخل. بذل المطورون قصارى جهدهم ، مما أدى إلى تحسين المشهد تمامًا وليس على حساب الجمال.

وأولئك الذين سئموا من تحريف النموذج يمكنهم "تحريف" عجلة القيادة. في الواقع ، يوضح الإجراء المقترح قدرات الإضاءة المتكيفة والحزم العالية الديناميكية ، ولكن ليس الصبي فقط سيرغب في "توجيه" سيارة رائعة. تبدو رائعة!

ومع ذلك ، لم يقتصر الألمان المتعقلون على مظهر السيارة وسمحوا بلمحة من الداخل. بالطبع ، تتميز جميع الصور بجودة التصوير الفوتوغرافي ، سواء كانت داخلية للسيارة أو وحدات تعليق تكنولوجي أو محرك متلألئ. كل شيء يدور ، يدور ويقدم الكثير من المعلومات. بعض التفاصيل دقيقة لدرجة أن الشك يتسلل إلى الداخل ، أليست هذه الصور "مشدودة" على إطار البدائيين؟

كتأليه أو مجرد رغبة في "الضغط" على العميل ، في نهاية العرض التقديمي يتم تقديم نوع من المصمم حيث يمكنك اختيار تعديل السيارة أو تغيير العجلات أو اللون. بالطبع ، كل هذا مجرد خطوة تسويقية ناجحة ، ولكن يا لها من تصورات عالية الجودة هنا! بالمناسبة ، العديد من العلامات التجارية المعروفة (ay ، AvtoVAZ!) تستخدم نهجًا مشابهًا لعروض السيارات الجديدة.

المشي على المريخ

إذا تم تقديم العرض التقديمي الأول باستخدام محرك three.js ، فإن البرنامج التالي هو ميزة المبرمجين لدينا. لا ، تم إنشاء التطبيق نفسه في أحشاء وكالة ناسا ، تم استخدام Blend4Web للتنمية المحلية فقط كأساس. لذا ، ما هو مثير للاهتمام هنا ...

في عام 2012 ، تم تسليم جهاز يحمل اسمًا متواضعًا Curiosity إلى سطح المريخ (مترجم من الإنجليزية "Curiosity"). الزحف بهدوء وسلم على سطح الكوكب ، حللت المركبة المتجولة التربة ، وأرسلت العديد من الصور الفوتوغرافية للمناظر الطبيعية المريخية وأثارت الإخوة العلميين مع العديد من الاكتشافات. سيكون كل شيء على ما يرام ، لكن وكالة ناسا قررت تعميم تشغيل الوحدة وإنشاء تطبيق ويب فريدمما يسمح ليس فقط بالإعجاب بميزات تصميم الجهاز ، ولكن أيضًا للبحث في الوقت الحقيقي على كوكب المريخ بعيون "الفضول".

السمة الرئيسية في هذا التطبيق هي المسارات الحقيقية للجهاز على سطح المريخ. علاوة على ذلك ، كل هذا مصحوبًا بفيديو تم تصويره بواسطة العديد من كاميرات المركبة. يمر المسار عبر عدة نقاط رئيسية حيث تم تنفيذ بعض الإجراءات من قبل مشغلي الجهاز. من الجانب ، من الممتع مشاهدة كيف تلوح الوحدة بالمُعالِم ، مع التكيف مع المهمة. في الوقت نفسه ، يتم عرض التعليق الصوتي على ما يحدث ، وفي الوقت نفسه ، يتم عرض الصور المرتبطة بالتضاريس.

وبالنسبة لأولئك الذين سئموا النظر إلى الجهاز ، أعد المطورون مساعدة صغيرة عبر الإنترنت حول تصميمه. بالنقر على التفاصيل التي جذبت الماوس ، يمكنك اكتشاف الكثير من الأشياء المثيرة للاهتمام. بالإضافة إلى ذلك ، يمكن للمستخدمين التآكل بشكل خاص أن يدوروا المتلاعبين المتجولين يدويًا ، بالطبع ، في حدود المتاحة.

أدخل في SkyNet

نهاية العالم بقيادة SkyNet قادمة! وإذا كنت تريد مقابلة أعداء المستقبل - فقد حان الوقت لدخول الشبكة .

الموقع المحدد ليس سوى إغراء ممتاز لمشاهدة فيلم "المنهي: التكوين". بالإضافة إلى الملصقات القياسية والمقطورات التشويقية - خرج صانعو الأفلام بمثل هذا العرض التفاعلي الرائع.

تسليط الضوء على الفكرة هو ربط الرسومات ثلاثية الأبعاد بإطارات حقيقية من الفيلم. يمكن لزائر سكاي نت تعلم تفاصيل مثيرة للاهتمام حول الشخصيات الرئيسية ، سواء الروبوتات أو الممثلين الحيين. على سبيل المثال ، SpIder Tank. أي نوع من الوحوش هو؟ وهكذا ، قام بلف النموذج (بالمناسبة ، صنع نوعيًا) ، وقراءة المعلومات حول العقد الرئيسية ، وحتى شاهد مقطع فيديو يتعلق بقدرات الوحش.

بصراحة ، يبدو هذا العرض للمعلومات حول الفيلم مبتكرًا وجذابًا للغاية. يرفع WebGL / HTML5 الشريط إلى مستوى مختلف تمامًا من الإدراك.

الإنسان الرقمي

وهذا مستوى مختلف تمامًا. إذا تم استخدام تقنية WebGL في الحالات الثلاث الأولى بشكل أكبر لأغراض الترفيه ، فإن المطورين هنا يقدمون أفضل ممارساتهم في سياق التعلم.

يركز هذا المشروع على المنظمات ذات الصلة بالصناعة الطبية. نماذج يتم تنفيذها بشكل نوعي من مختلف الأجهزة ، والتصور الدقيق للعمليات الجارية ، وأنماط المشاهدة الخاصة - كل هذا يسمح لنا بتبسيط عملية التعلم أو إظهار ميزات المرض.

وهنا ليست جودة النماذج بل دقة التنفيذ. على سبيل المثال ، عند إظهار تشغيل مفصل الركبة ، لن تتمكن من ثنيه أكثر من المتوقع.

بالإضافة إلى ذلك ، هناك وضع "X-ray" مثير للاهتمام للغاية ، يتم تنشيطه بواسطة زر خاص في المشغل. في هذه الحالة ، يصبح النموذج شفافًا مع إمكانية النظر في بعض الميزات الداخلية. علاوة على ذلك ، إذا لزم الأمر ، يمكنك تمييز جزء من الكائن على خلفية "صورة الأشعة السينية". لذا ، في لقطة الشاشة أدناه ، يمكنك التفكير بوضوح في تمزق الرباط.

وفقًا للمطورين ، تم إنشاء ما مجموعه 5000 كائن تقريبًا ، وتم تنفيذ العديد من الدروس الكاملة حول تشريح الإنسان. يبدو أن مثل هذا النهج للتعلم سيكون أكثر فعالية بكثير من الأطالس الورقية التقليدية.

مرحبا هالو!

يعتبر Webgl مثاليًا لإنشاء مشاهد تفاعلية وعروض تقديمية وألعاب ، والأهم من ذلك أنه يوحد مستخدمي الأنظمة الأساسية المختلفة في نافذة المتصفح. استفاد مبدعو السلسلة الشهيرة من لعبة Halo من القدرات الفريدة لتقنيات المتصفح الحديثة وأنشأوا غرفة "ضيف" خاصة .

الفكرة بسيطة للعار ، ولكن بفضل WebGL كان من الممكن دمج صورة مرئية غير عادية (تحتاج إلى أن تبدو "مباشرة" ، لأن لقطة الشاشة لا تنقل التأثير) مع بعض لوحات الرسائل الجماعية.

في الواقع ، الجسيمات التي تشكل شكل الخوذة من اللعبة الشهيرة هي رغبات المستخدمين. تركت المئات والمئات من الرسائل على صفحة الموقع ، بشكل تدريجي نموذج متكامل. في البداية ، كانت الخوذة شبكة بسيطة بدائية. يمكنك التحقق من ذلك إذا قمت بتحريك شريط التمرير على المخطط الزمني في أسفل الشاشة. أتساءل كيف ستبدو الخوذة بعد بلوغ عتبة معينة. في هذه الأثناء ، يمكنك أيضًا الانضمام إلى أولئك الذين ينتظرون اللعبة ويكتبون بضعة أسطر على "لوحة الرسائل" غير العادية هذه.

ملاحظة

كما ترى ، تظهر جميع العروض التقديمية المحددة الحاجة وسهولة استخدام تقنية WebGL. أقرب وأقرب هي أجهزة كمبيوتر شخصية مع أنظمة محمولة. سيأتي وقت ستصبح فيه تطبيقات المتصفح عبر الأنظمة الأساسية حقًا.