مساعدة المطوّرين في إنشاء تطبيقات ويب فعّالة وقابلة للتثبيت

مقدمة

في بداية عام 2020، وضع فريق Chrome للأجهزة الجوّالة وأجهزة الكمبيوتر المكتبي خطة لتحسين قابلية اكتشاف تطبيقات الويب المثبّتة والتفاعل معها. أدّى عملنا إلى زيادة بنسبة تفوق% 100 في تثبيت تطبيقات الويب التقدّمية (PWA) والتفاعل معها. وقد حققنا ذلك من خلال إجراء بحث حول الميزات الحالية وإجراء اختبارات A/B وإجراء مقابلات مع المستخدمين للحصول على معلومات مفيدة حول تصورات المستخدمين وتوقعاتهم. تتناول هذه المقالة كيفية الوصول إلى هناك.

لغة التثبيت الموحّدة

عبارة الحث على اتّخاذ إجراء التي تؤدّي إلى تثبيت تطبيق الويب التقدّمي (PWA) كانت غير متّسقة على مستوى منصة الويب. بالنسبة إلى Chrome على نظام التشغيل Android، استقرنا على خيار الإضافة إلى الشاشة الرئيسية، ولكن في أنظمتنا الأساسية لأجهزة سطح المكتب، ركزنا على التثبيت. جاء السبب المنطقي لهذا التناقض من دراسة أجراها الفريق في عام 2016 قارنت السلاسل المختلفة. وقد توصل الفريق إلى أنّ طريقة إضافة إلى الشاشة الرئيسية تحقّق نتائج أفضل، إن كانت طفيفة فقط، على الأجهزة الجوّالة.

لم تجد دراسة أخرى عن التصنيف في عام 2019 أي فرق، ولذلك قرّر الفريق الذي أراد توحيد تجربة تثبيت PWA، تعديل التصنيف ليصبح Install (تثبيت) على Android. أجريت دراسة أخرى في عام 2021 مقارنة باللغات Install وGet وDownload (تنزيل)، وتبيّن لنا أنّ المستخدمين فهموا عملية Install (التثبيت). شعر المستخدمون أنّ النقر على زر يحمل التصنيف Get (تنزيل) سيؤدي إلى توجيه المستخدم إلى موقع إلكتروني، ومن خلال النقر على Download، افترضوا أنّ الملف سينتهي في مجلد "عمليات التنزيل" أو ما يعادله.

مع وضع كل ذلك في الاعتبار، توصلنا إلى أن تصنيف تثبيت يناسب تطبيقات الويب التقدّمية (PWA) بشكل أفضل. ننصح المطوّرين على منصة الويب باستخدام "التثبيت" كسلسلة مفضّلة من الآن فصاعدًا.

رمز التثبيت على الكمبيوتر المكتبي

على منصاتنا المتوافقة مع أجهزة الكمبيوتر المكتبي، نجد نمطًا خاصًا في متصفّح Chrome عند تحميل تطبيق ويب تقدّمي (PWA)، يعرض Chrome في الجانب الأيسر من المربّع المتعدد الاستخدامات الذي يحتوي على رمز وعلامة Install (تثبيت). بعد ذلك، عندما يزور أحد المستخدمين موقعًا إلكترونيًا، سيظهر الرمز فقط. يؤدي النقر على هذا الزر إلى تثبيت تطبيق الويب التقدّمي (PWA) على الكمبيوتر المكتبي.

كان هذا الرمز في البداية رمز زائد، ويرجع ذلك جزئيًا إلى استعارة Add to Home (إضافة إلى الشاشة الرئيسية) المستخدَمة على الأجهزة الجوّالة. ومع ذلك، كما ذكرنا، كانت اللغة التي استخدمناها هي Install (تثبيت). كانت الملاحظات التي تلقيناها من منتدى المطورين أن هذا الرمز كان مربكًا. علاوة على ذلك، إذا استخدم المستخدم وظيفة التكبير/التصغير لتكبير النص، فإن رمز التكبير/التصغير بدا متشابهًا للغاية، مما يتسبب في إرباك المستخدم أكثر.

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

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

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

بطبيعة الحال، لن يغير رمز واحد العالم، وهو ما يقودنا إلى ميزتنا التالية.

المساعدة داخل المنتج

"المساعدة داخل المنتج" هي تلميح عبارة عن فقاعة زرقاء تدرج المستخدمين في ميزات جديدة قد تهمّهم استنادًا إلى معايير محدّدة. قررنا إطلاق نمط التصميم هذا لإعلام المستخدمين بميزات التثبيت ودعم التصميم الجديد للأيقونة.

عندما يزور أحد المستخدمين موقعًا إلكترونيًا بانتظام، يستخدم Chrome خدمة تُعرف باسم التفاعل مع الموقع. وهذا يوفر معلومات عن مدى تفاعل المستخدم مع الموقع. عند زيارة chrome://site-engagement/، يمكنك الاطّلاع على المواقع الإلكترونية التي تتفاعل معها بانتظام. باستخدام هذه التقييمات، يمكننا تحديد ما إذا كان المستخدم مهتمًا بموقع ويب. إذا كان الموقع عبارة عن تطبيق ويب تقدّمي (PWA) وكان المستخدم متفاعلاً، سنعرض له واجهة المستخدم الخاصة بتثبيت المساعدة داخل المنتج. وهذا يعني أنّنا ركّزنا فقط على المستخدمين المتفاعلين وليس على إزعاج المستخدمين الذين قد يزورون الموقع الإلكتروني مرة واحدة.

من خلال استخدام المساعدة داخل المنتج على أجهزة الكمبيوتر المكتبي، لاحظنا زيادة تفوق %100 في عمليات تثبيت تطبيقات الويب التقدّمية (PWA)، ما يوضّح أنّ التركيز على المستخدمين المتفاعلين أدى إلى تحسين إمكانية تثبيت تطبيقات الويب.

واجهة مستخدم أكثر ثراءً للتثبيت

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

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

أطلقنا في وقت سابق من هذا العام عملية تثبيت مُحسّنة، وهي واجهة مستخدم موسَّعة للتثبيت على متصفِّح Chrome على أجهزة Android تسمح للمطوّرين بإضافة لقطات شاشة إلى بيان التطبيق. ويمكن للمطوّرين أيضًا إضافة وصف وهو إجراء يُنصح به ولكنّه ليس ضروريًا. بسبب واجهة المستخدم الأحدث هذه، لاحظنا زيادة في معدّل تثبيت بعض تطبيقات الويب التقدّمية (PWA)، ما يوضّح أنّ المستخدمين يعززون ثقة المستخدمين في تثبيت تطبيقات الويب عندما نوفّر سياقًا إضافيًا وتجارب أكثر ثراءً. لا يزال إصدار سطح المكتب لواجهة المستخدم هذه قيد التنفيذ.

الخاتمة

أمضى الفريق العامَين الماضيَين في استكشاف وتجربة ميزات أحدث في Chrome، وقد أتاحت هذه الميزات وساعدت مطوّري برامج PWA وساعدت في تعريف المستخدمين بفوائد تجارب الويب. لا يزال هناك الكثير من العمل الذي يمكننا إنجازه، ولكن يمكننا بشكل جماعي تحسين حياة المستخدمين وإثرائها ودعم شبكة الويب المفتوحة.