تشرف مؤسسة Google لتسويق الأجهزة والخدمات (DSM) على استراتيجيات التسويق لمجموعة واسعة من المنتجات: الهواتف الذكية والساعات وسماعات الأذن والأجهزة اللوحية والأجهزة المنزلية الذكية والاشتراكات ذات الصلة، وكلها متوفرة من خلال Google Store وبائعين خارجيين عالميين. يتعرّف الجمهور على هذه المنتجات على الإنترنت وفي متاجر البيع بالتجزئة.
يتمثل أحد التحديات المستمرة التي تواجه هذا الفريق في تعريف المستهلكين وبائعي التجزئة بحالات الاستخدام ومزايا منظومة Google المتكاملة وتجارب الذكاء الاصطناعي المتقدمة. لمساعدة المستهلكين على فهم المنتجات والوظائف بشكل أفضل، أنشأ فريق DSM مساحة افتراضية ثلاثية الأبعاد مزودة بتكنولوجيا الويب المتقدمة لمعالجة العديد من هذه التحديات. في دراسة الحالة هذه، يمكنك معرفة كيف أنشأ الفريق تجربة أكثر شمولية للعملاء، وأطلقوا هذه التجارب الجديدة بشكل أسرع أربع مرات ونصف تكلفة الأصول الرقمية التقليدية.
التحدي: التعريف بالمنتجات
يعد تعريف شركاء المبيعات والعملاء الجدد على استخدام منتجات أجهزة Google بمزايا ميزات مثل إمكانية التشغيل التفاعلي والذكاء الاصطناعي أمرًا مكلفًا وصعبًا. تعتمد الاستراتيجيات التقليدية للتعريف عن المنتجات على المحتوى الرقمي الذي يتم إنتاجه باستخدام منتجات مادية، ثم تتم استضافته على منصات التعلُّم الرقمي. توفر منصات التعلم هذه المواصفات الفنية للمنتج، والصور والفيديوهات، ولكنها لا يمكنها الوصول إلى المنتجات المادية أو المتصلة.
يكون إنتاج المحتوى التعليمي، مثل الفيديو، مكلفًا ومعقدًا لأقلمة المحتوى في الأسواق العالمية، وبالقرب من المستحيل إعادة استخدامه بين المنتجات. يتطلب إنشاء مواد العرض الأولية ميزانيات مخصصة لتصوير المحتوى، وخزانة الملابس، واستكشاف المواقع الجغرافية، ورسوم الموقع الجغرافي، ورسوم الاستوديو، وفِرق تصوير الأفلام، وأعمال ما بعد الإنتاج. تراعي تكاليف الإنتاج والمخرجات النهائية أيضًا عملية الأقلمة. فإن تعديل الأصول والمواقع والمنتجات والنسخ والمواهب يمثل تحديًا بشكل خاص لإدارة التسويق التقليدي على نطاق واسع. ومع الأخذ في الاعتبار أنّ معظم المنتجات المتوافقة تتضمّن ميزات جديدة كل شهرين، تصبح مواد العرض هذه قديمة عند انتهاء توفّرها.
استكشاف طرق أفضل لمشاركة معلومات المنتجات
في محاولة للعثور على طريقة أفضل لمشاركة معلومات المنتجات، جرّب فريق DSM تجارب الواقع الافتراضي والواقع المعزز في أحد التطبيقات. وكانت النتائج واعدة في تعزيز التفاعل وزيادة حجم السلال في نقاط البيع. ومع ذلك، كانت عمليات تنزيل التطبيقات تمثّل عائقًا كبيرًا في دخول كلّ من شركاء المبيعات والعملاء، كما أنّ حصر تجربة استخدام تطبيق ما يعني أنّه غير قابل للتضمين في مواقع إلكترونية أخرى تابعة لجهة خارجية أو مواقع إلكترونية أخرى، مثل store.google.com.
حلول خفيفة مع "<model-viewer>"
بعد أن لاحظ الفريق نجاح نماذج المنتجات ثلاثية الأبعاد للتعريف بالمنتجات، قرر
استخدام هذا النهج على الويب. يمكنك تحقيق ذلك من خلال استخدام <model-viewer> لإنشاء تجارب ثلاثية الأبعاد مع منتجات فردية.
<model-viewer> هو مكوّن ويب يتيح لك إضافة تصميم ثلاثي الأبعاد إلى صفحة ويب بشكل واضح أثناء استضافة النموذج على موقعك الإلكتروني.
يمكنك رؤية ذلك عمليًا على صفحة
Pixel Fold
على Google Store، حيث يتيح <model-viewer> للمستخدمين رؤية هاتف Pixel Fold من أي زاوية وبمواضع مختلفة مطوية. كان من السهل دمج التصميم الثلاثي الأبعاد في بقية تجربة المستخدم بتنسيق HTML، باستخدام أزرار لسرد قصة من خلال زوايا الكاميرا ومتغيرات الألوان التفاعلية. باستخدام <model-viewer>، يمكنك منح المستخدمين
أي نوع من التجارب التي يمكن أن يحلم بها.
إنشاء نماذج ثلاثية الأبعاد
تتمثل الخطوة الأولى لتطوير تجربة افتراضية ثلاثية الأبعاد في إنشاء نماذج منتجات ثلاثية الأبعاد. أنشأ فريق DSM نماذجهم الثلاثية الأبعاد بتنسيق CAD. ومن خلال العمل عن كثب مع المصممين الذين ينتجون منتج CAD، تمكن فريق DSM من تصدير عروض متعددة الأشكال التي يمكن تحسينها للويب. كانت بعض أفضل الممارسات التي استخدموها لتحقيق ذلك في المجالات التالية.
- الهندسة:
- ركّز على جعل الأشكال الهندسية (الشكل والقياس) دقيقة من جميع الزوايا.
- تجنب استخدام الخرائط العادية لحواف مشطوفة.
- إنشاء ملصقات كأشكال هندسية منفصلة.
- الألوان والمواد:
- الهدف: تمثيل مرئي متسق للخصائص الفيزيائية.
- ننصحك باستخدام عوامل الإضاءة الديناميكية في الوقت الفعلي.
- استخدم مجموعات ومواد زخرفية منفصلة لكل نوع من أنواع الشبكة (غير شفاف أو شفاف أو ملصق).
- التكرار التحسيني للتصميمات مع مصممي CAD الأصليين إذا كانت هناك حاجة إلى مزيد من التعديلات.
- حجم الملف:
- يمكنك تصديره كنموذج poly منخفض بتنسيق GLB بحيث يمكن استخدامه بواسطة
<model-viewer>. - اضغط الشبكات الهندسية يدويًا من خلال مصمم ثلاثي الأبعاد أو مع مورّد أو من خلال برنامج ضغط مثل DRACO (نظام التشغيل).
- يمكنك تصديره كنموذج poly منخفض بتنسيق GLB بحيث يمكن استخدامه بواسطة
نظرًا لاستخدام هذه التصاميم الثلاثية الأبعاد غالبًا على الهواتف الجوّالة، تم تحسينها من خلال ضبط حد أقصى لحجم الملف بزخارف يبلغ 2 ميغابايت، لدعم أجهزة الجيل الأقدم واتصالات الإنترنت الضعيفة.
<model-viewer>
يستخدم فريق DSM مكوّن الويب مفتوح المصدر <model-viewer> من Google لتضمين النماذج الثلاثية الأبعاد التي تم إنشاؤها حديثًا في صفحات الويب الخاصة بهم. لكي تصبح النماذج التي تم إنشاؤها في الخطوة الأولى متوافقة مع <model-viewer>، يجب أن تكون مواد العرض بتنسيق gITF أو GLB (الإضافة .glb). كلا التنسيقين مضغوطين وقابلين للضغط ويتم
تحميلهما بسرعة في وحدة معالجة الرسومات. يتوافق المكوِّن <model-viewer> مع جميع المتصفّحات الرئيسية التي لا يبطُل رواجها.
خلال هذه الخطوة، كان التحدي الأكبر الذي واجهه فريق DSM هو أن لوحة ألوان أجهزة Google لا تُعرض بدقة. اكتشف الفريق في النهاية أن تخطيط نغمات ACES (معيار صناعة الأفلام) كان مسئولاً عن الألوان المفقودة. ولحل هذه المشكلة، أنشأوا أداة أداة جديدة لتخطيط الدرجات اللونية المحايدة PBR في Charonos لمعالجة أوجه القصور هذه وعرض الألوان بدقة على الشاشة، مع تجنُّب العناصر البارزة وتغيّرات تدرجات اللون المرتبطة بتخطيط الدرجات اللونية الخطية.
<model-viewer src="Pixel8Pro_Bay_enUS.glb" ar ar-modes="scene-viewer webxr quick-look"
camera-controls poster="poster.webp"
shadow-intensity="1" tone-mapping="commerce"></model-viewer>
للمزيد من المعلومات حول <model-viewer>، يمكنك الانتقال إلى
modelviewer.dev. لاختبار التصاميم الثلاثية الأبعاد وتنزيل
موقع إلكتروني كامل للمبتدئين، يُرجى استخدام أداة التعديل.
حلول ثقيلة الوزن باستخدام three.js
إنّ السمة <model-viewer> هي طريقة رائعة ومؤثّرة لعرض نموذج واحد ثلاثي الأبعاد والتفاعل معه. مع ذلك، كان فريق DSM بحاجة أحيانًا إلى تجربة ويب أكثر شمولية وترابطًا مقارنةً بـ <model-viewer>. ومن الأمثلة على ذلك
إطلاق جهاز Nest Mini + C. يمكن لـ <model-viewer> السماح للعملاء المحتملين بتجربة منتج ثلاثي الأبعاد على الويب، ولكن لم يكن بالإمكان عرض فائدته عند دمجه مع أجهزة Google الأخرى وميزات الذكاء الاصطناعي، مثل المساعد.
لتنفيذ هذه المهمة، لجأ الفريق إلى المكتبة التي تستند إليها ميزة <model-viewer>،
Three.js. Three.js هو محرّك ألعاب مفتوح المصدر بلغة JavaScript، وتمكّن الفريق من إنشاء إطار عمل يضم مواد عرض قابلة لإعادة الاستخدام لبيئة منزلية افتراضية
تتضمّن كاميرات وأضواء ومكبرات صوت داخلية من Nest. وأعطى هذا الفريق أساسًا لتقديم
ملاحظات في الوقت الفعلي حول كيفية تفاعل الأجهزة مع بعضها
البعض.
Dialogflow
آخر جزء من عملية إنشاء التجربة المترابطة هو إضافة "مساعد Google". وهذا يعني أنّه يمكن للمستخدمين تجربة أوامر وسلاسل إجراءات أصلية من خلال التجربة الافتراضية المترابطة. ومع ذلك، فإنّ إدراج مساعد Google من حساب المستخدم الحالي سيؤدي إلى فتح عدد من المخاوف المتعلقة بالخصوصية. ولإنشاء حل يركّز على الخصوصية، عملت DSM مع خدمة Google Cloud Dialogflow لمحاكاة "مساعد Google" في هذه المساحة. يوضّح المخطّط العالي المستوى التالي كيفية استخدام تطبيق الويب لواجهة برمجة التطبيقات الخاصة بـ Dialogflow (تم تعديلها من أساسيات Dialogflow). لكل منعطفي، استخدم تطبيق الويب تصنيف الأهداف من Dialogflow وعرضت واجهة برمجة التطبيقات تعبيرات مستخدم نهائي محددة مسبقًا تتطابق مع الغرض.
لمزيد من المعلومات حول Dialogflow، يُرجى الاطّلاع على مستندات Google Cloud.
النتيجة النهائية: إطار iframe قابل للتضمين
والنتيجة النهائية هي مكتبة من مواد العرض التي يمكن تضمينها في صفحة ويب باستخدام
<model-viewer> أو استخدامها في بيئة افتراضية كاملة لمساعدة العملاء في معرفة
المزيد من المعلومات عن المنتجات الفردية وكيفية ربط المنتجات. وهذه التجربة أصلية وقابلة للتطوير وفعّالة من حيث التكلفة. تم إطلاق هذه التجربة الافتراضية الأولى في أيار (مايو) 2021، وعلى الرغم من أنّها لم تعُد متاحة على موقع Google Store الإلكتروني، لا يزال بإمكانك تجربتها.
النتائج
منذ إطلاق Nest Mini +C، تمكنت إدارة DSM من إعادة استخدام وتوسيع إطار العمل على مدار العامين الماضيين لإطلاق محفظة Pixel مع زيادة النجاح. من خلال تشغيل التكرار للأصول والتجارب الثلاثية الأبعاد، تمكن الفريق حتى الآن من مضاعفة عدد التجارب التعليمية التفاعلية للمنتجات بمقدار ثلاثة أضعاف عدد المنتجات التي تستفيد من تكنولوجيا الويب هذه.
والمحصلة النهائية هي تعلُّم أصيل للمنتجات التي تحمل العلامة التجارية من أجل التبديل المتنامي بين حالات الاستخدام على نطاق واسع وتكون أكثر استدامة وتماسكًا وتفاعلية من الاستراتيجيات السابقة. وبالنظر إلى المستقبل، يمتلك فريق DSM الآن مجموعة قوية من مكونات التجربة الغامرة التي يمكنهم التكيف بسرعة مع أهداف الأعمال الديناميكية. تسمح هذه التحسينات لفريق DSM بإطلاق محتوى تعليم منتج جديد بشكل أسرع أربع مرات وأقل من نصف التكلفة مقارنة بالعمليات السابقة الأكثر تقليدية.