إذا كنت تطوِّر برامج للمستخدمين في روسيا، يُرجى استخدام أزرار "الحفظ على الهاتف" لأنّ "محفظة Google" غير متوفّرة في هذه البلدان. يُرجى الاطّلاع على مواد العرض والإرشادات ذات الصلة. إذا كنت تطوِّر برامج لمستخدمين خارج روسيا، يُرجى تعديل زر الإضافة إلى "محفظة Google" من خلال تنزيل مواد العرض أدناه.
هذا القسم من المستندات مصمم لمساعدتك في إنشاء صور وغيرها من عناصر واجهة المستخدم بحيث تبدو رائعة في تطبيق "محفظة Google".
مواد العرض
زر الإضافة إلى "محفظة Google"
يُستخدم زر الإضافة إلى "محفظة Google" عندما توجّه المستخدمين إلى حفظ بطاقة أو بطاقة من تطبيقك أو موقعك الإلكتروني في محفظتهم. يجب أن يستدعي زر الإضافة إلى "محفظة Google" أحد مسارات Google Wallet API. تعرض هذه المسارات تطبيق "محفظة Google" حيث يمكن للمستخدمين اتّباع التعليمات لحفظ البطاقات على جهاز Android وحسابهم على Google. يمكن استخدام هذا الزر في التطبيقات أو المواقع الإلكترونية أو الرسائل الإلكترونية.
تتوفّر أزرار الإضافة إلى "محفظة Google" بتنسيقات XML وSVG وPNG لأجهزة Android.
تنزيل مواد العرض - تنسيق XML على Android تنزيل مواد العرض - SVG تنزيل مواد العرض - PNGزر العرض في "محفظة Google"
يُستخدَم زر العرض في "محفظة Google" في ربط حساب المستخدم بمحفظته لعرض بطاقة أو بطاقة محفوظة في السابق. يمكن استخدام هذا الزر في التطبيقات أو المواقع الإلكترونية أو الرسائل الإلكترونية.
تتوفّر أزرار العرض في "محفظة Google" بتنسيق SVG وPNG.
تنزيل مواد العرض - بتنسيق SVG تنزيل مواد العرض بتنسيق PNGيجب أن تتقيّد جميع الأزرار المعروضة على موقعك الإلكتروني أو تطبيقك أو مراسلاتك عبر البريد الإلكتروني بإرشادات العلامة التجارية الموضّحة في هذه الصفحة. ونذكر من هذه الإرشادات على سبيل المثال لا الحصر ما يلي:
- الحجم مقارنةً بالأزرار أو العناصر المشابهة الأخرى في الصفحة
- يجب عدم تغيير شكل الأزرار ولونها
- المساحة الخالية
الأزرار المترجَمة
يتم توفير أزرار "محفظة Google" المترجَمة لجميع الأسواق التي تتوفّر فيها "محفظة Google". إذا كنت تطوِّر للمستخدمين في هذه الأسواق، استخدِم دائمًا الأزرار المُشار إليها أعلاه. لا تنشئ نسختك الخاصة من الأزرار. إذا لم تتوفّر نسخة مترجَمة من الزر في بلدك، استخدِم النسخة الإنجليزية من الزر.
تتوفّر أزرار الإضافة إلى "محفظة Google" باللغات التالية: الألبانية والإسبانية والعربية والأرمينية والأذربيجانية والبوسنية والبلغارية والكاتالانية والصينية (هونغ كونغ) والصينية (الهند) والنرويجية والتشيكية والدانمركية والهولندية والإنجليزية والهولندية والإنجليزية (الهندية والبرتغال والبولندية وأستراليا وكندا وإسبانيا والبرتغال والترانسية والفرنسية والفيتنامية والفيتنامية والإسبانية والفرنسية والفيتنامية والكورية والهندية والنرويجية والإسبانية والإنجليزية والإندونيسية والإيطالية والبرتغالية والبولندية
الاسم المترجَم
لمزيد من التوضيح، تتم ترجمة اسم منتج "محفظة Google" في أسواق محدّدة. إذا كنت تطوّر تطبيقات للمستخدمين في هذه البلدان، استخدِم دائمًا الاسم المترجم أدناه للويب والرسائل الإلكترونية والطباعة. لا تنشئ نسختك المترجَمة من "محفظة Google". إذا لم تكن السوق مدرَجة أدناه، استخدِم "محفظة Google" باللغة الإنجليزية.
البلد | الاسم |
---|---|
بيلاروس | Google Кошелек |
البرازيل | بطاقة كارتيرا دو Google |
تشيلي | Billetera de Google |
التشيك | عيد ميلاد Google |
اليونان | |
هونغ كونغ | Google 錢包 |
ليتوانيا | Google PiniginKID |
بولندا | بورتفل جوجل |
البرتغال | بطاقة كارتيرا دا Google |
رومانيا | شركة Portofel Google |
سلوفاكيا | بينازينكا Google |
تايوان | Google 錢包 |
تركيا | Google كوزدان |
الإمارات العربية المتحدة | محفظة Google |
أوكرانيا | Google Цаманенجرّب |
الولايات المتحدة (الإسبانية)
*استخدِم هذا الاسم في الولايات المتحدة إذا كانت واجهة المستخدم باللغة الإسبانية |
Billetera de Google |
حجم الملف
اضبط ارتفاع وعرض زر الإضافة إلى "محفظة Google" ليتناسب مع التنسيق. إذا كانت هناك أزرار أخرى على الصفحة، يجب أن يكون حجم زر الإضافة إلى "محفظة Google" مساويًا للحجم أو أكبر. لا تجعل زر الإضافة إلى "محفظة Google" أصغر من الأزرار الأخرى.
النمط
يتوفّر زر الإضافة إلى "محفظة Google" بصيغتين: الأساسية والمكثفة. ويتوفّر زر الإضافة إلى "محفظة Google" باللون الأسود فقط. يتم توفير إصدارات مترجمة من الزر. لا تنشئ أزرارًا باستخدام النص المترجم.
أساسي | مكثف |
---|---|
![]() |
![]() |
استخدِم الزر الأساسي على خلفيات بيضاء وفاتحة. | استخدِم الزر المكثّف إذا لم تكن هناك مساحة كافية لالتقاط الصورة الأساسية أو العرض الكامل. |
المساحة الخالية
يجب دائمًا إبقاء الحد الأدنى من المساحة الخالية 8 وحدات بكسل مستقلة الكثافة على جميع جوانب زر الإضافة إلى "محفظة Google". تأكَّد من أنّ المساحة الخالية غير مقسّمة برسومات أو نصوص.
![يجب أن تحتوي أزرار الإضافة إلى "محفظة Google" على مساحة تبلغ 8 وحدات بكسل مستقلة الكثافة (dp) على جميع الجوانب.](https://developers-dot-devsite-v2-prod.appspot.com/static/wallet/images/branding/add-to-wallet-clear-space.png?authuser=19&hl=ar)
الحد الأدنى للارتفاع
يجب أن يكون ارتفاع كل أزرار الإضافة إلى "محفظة Google" 48 وحدة بكسل مستقلة الكثافة كحدّ أدنى.
![يجب أن يبلغ ارتفاع أزرار "الإضافة إلى محفظة Google" 48 وحدة بكسل مستقلة الكثافة (dp) كحد أدنى.](https://developers-dot-devsite-v2-prod.appspot.com/static/wallet/images/branding/add-to-wallet-min-height.png?authuser=19&hl=ar)
افعل ولا تفعل
الإجراءات المستحسنة | الإجراءات غير المستحسنة |
---|---|
ما يجب فعله: استخدِم فقط أزرار الإضافة إلى "محفظة Google" التي توفّرها Google. | تجنَّب ما يلي: أنشِئ أزرار الإضافة إلى "محفظة Google" الخاصة بك أو غيِّر الخط أو اللون أو نصف قطر الزر أو المساحة المتروكة في الزر بأي طريقة. |
ما يجب فعله: استخدِم نمط الأزرار نفسه في جميع أنحاء موقعك الإلكتروني. | لا تفعل: اجعل أزرار الإضافة إلى "محفظة Google" أصغر من الأزرار الأخرى. |
يجب تنفيذ ما يلي: تأكَّد من أنّ حجم أزرار الإضافة إلى "محفظة Google" يبقى مساويًا لحجم الأزرار الأخرى أو أكبر منها. | ما لا يجب فعله: عدِّل لون الزر. |
ما يجب فعله: يجب إبقاء نسبة الأزرار كما هي عند تغيير حجم زر الإضافة إلى "محفظة Google". | لا تفعل: تغيير المقاس للزر بشكل حر. |
الإجراءات المسموح بها: استخدِم النسخة المترجَمة المتوفرة من الأزرار. | لا تفعل: أنشئ نسختك المترجَمة من الزر. |
أفضل الممارسات لمواضع الأزرار
اعرض زر الإضافة إلى "محفظة Google" على شاشات تطبيقات التأكيد أو صفحات الويب أو الرسائل الإلكترونية. راجِع أفضل الممارسات التالية لتوجيه تصميم واجهة المستخدم.
بطاقات الولاء، وبطاقات الهدايا، والعروض
اعرض زر الإضافة إلى "محفظة Google" على شاشات التأكيد. ويمكنك أيضًا عرض الزر على موقعك الإلكتروني أو تطبيقك، أو تضمينه في الرسائل الإلكترونية ذات الصلة.
![بطاقة هدايا](https://developers-dot-devsite-v2-prod.appspot.com/static/wallet/images/passes/branding/coffee.png?authuser=19&hl=ar)
![بطاقة ولاء لتناول القهوة](https://developers-dot-devsite-v2-prod.appspot.com/static/wallet/images/passes/branding/gift-card.png?authuser=19&hl=ar)
استخدام اسم منتج محفظة Google في النص
يمكنك استخدام نص لإعلام المستخدم بأنّه تم حفظ بطاقة الولاء على جهازه.
كتابة الحرفين "G" و "W" بالأحرف اللاتينية الكبيرة
للإشارة إلى "محفظة Google"، يجب دائمًا استخدام حرف "G" كبير وحرف "W" كبير متبوع بحروف صغيرة. لا تستخدِم الاسم الكامل "محفظة Google" بالأحرف اللاتينية الكبيرة ما لم يكن مطابقًا للنمط الطباعي في واجهة المستخدم.
عدم اختصار "محفظة Google".
اكتب دائمًا الكلمات "Google" و "محفظة".
مطابقة النمط في واجهة المستخدم الخاصة بك
اضبط "محفظة Google" بنفس الخط والنمط الطباعي لبقية النص في واجهة المستخدم. لا تقلِّد النمط الطباعي في Google.
استخدام الإصدار المترجَم من "محفظة Google" دائمًا
اكتب دائمًا "محفظة Google" في النسخة المترجَمة المقدّمة.
التصميم
استخدِم الحقلين height
وsize
في علامة HTML المسماة g:savetoandroidpay
لتعديل طول وعرض أزرار الإضافة إلى "محفظة Google". ويمكنك استخدام مواصفات
textsize=large
لزيادة أحجام النصوص والأزرار بشكل كبير لعمليات التنفيذ على الأجهزة الجوّالة أو الحالات التي تتطلّب متطلبات خاصة لواجهة المستخدم.
استخدِم "theme
" لضبط لون الأزرار. يعرض الجدول التالي كيفية تأثير هذه الإعدادات في زر الإضافة إلى "محفظة Google".
الشعارات
إرشادات صورة الشعار
تحجب "محفظة Google" شعارك في شكل دائري.
في ما يلي قائمة باقتراحات واجهة المستخدم لصور الشعارات:الإرشادات | الوصف |
---|---|
نوع الملف المفضّل | PNG |
الحد الأدنى للحجم | 660 بكسل × 660 بكسل |
نسبة العرض إلى الارتفاع للصورة | 1:1 |
نسبة العرض إلى الارتفاع للعمل الفني | 1:1 |
الحجم الفعلي للبكسل | تغيير الحجم وفقًا لحجم الجهاز |
قناع دائري للشعار |
يتم إخفاء شعارك ليناسب تصميم دائري. تأكَّد من أنّ شعارك يناسب المنطقة الآمنة. لا تحجب شعارك مسبقًا. اترك الشعار على شكل مربّع مع لون خلفية تجاوز الهوامش بشكل كامل. ويجب أن يكون هامش الشعار بنسبة% 15 حتى لا يتم اقتطاعه عند حجبه. ![]() |
تحجب "محفظة Google" شعارك في شكل دائري.
إرشادات حول صورة الشعار العريضة
يمكن استخدام صور الشعار العريضة في تذاكر حضور الفعاليات وبطاقات صعود الطائرة وبطاقات النقل العام التي تحمل رمز الاستجابة السريعة وبطاقات الولاء والعروض وبطاقات الهدايا والبطاقات العامة والبطاقات الخاصة العامة. في ما يلي قائمة باقتراحات واجهة المستخدم لصور الشعار العريضة:
الإرشادات | الوصف |
---|---|
نوع الملف المفضّل |
PNG استخدِم صورة بلون خلفية للحصول على أفضل النتائج (ننصحك باستخدام اللون نفسه المستخدَم لخلفية بطاقتك). |
الحجم المُقترَح | 1280 بكسل × 400 بكسل |
الحد الأدنى للحجم | 400 بكسل للارتفاع، والعرض متناسب (مزيد من الإرشادات في قسم نسبة العرض إلى الارتفاع المقترَحة)
استخدِم صورًا مستطيلة عريضة. |
نسبة العرض إلى الارتفاع التي يُنصح بها |
إذا لم يتم ضبط الصورة على نسبة العرض إلى الارتفاع المقترَحة، سيتم تغيير حجمها لتلائم نسبة العرض إلى الارتفاع في مساحات العنوان المقدّمة. يوضّح المخطّط أدناه كيفية تغيير حجم مادة عرض الصورة استنادًا إلى نسبة العرض إلى الارتفاع. ![]() |
لون خلفية البطاقة
يمكنك ضبط لون الخلفية باستخدام الحقل
hexBackgroundColor
. إذا لم تحدّد القيمة، تحلِّل خوارزمية
الشعار وتعثر على اللون السائد وتستخدمه للون الخلفية.
الصور الرئيسية
يظهر الحقل class.heroImage
كبانر بالعرض الكامل على
النص الأساسي للبطاقة.
إرشادات الصورة الرئيسية
في ما يلي قائمة بتوصيات واجهة المستخدم للصور الرئيسية:
الإرشادات | الوصف |
---|---|
نوع الملف المفضّل | PNG |
الحجم المُقترَح |
1032×336 بكسل استخدِم صورًا مستطيلة عريضة. استخدِم صورة ذات خلفية ملوّنة للحصول على أفضل النتائج. |
نسبة العرض إلى الارتفاع | 3:1 أو أكثر |
حجم شاشة العرض |
تمثّل هذه السمة العرض الكامل للبطاقة والارتفاع التناسبي. ![]() |
صور بالعرض الكامل
وسيظهر الحقل *.imageModulesData.mainImage
في الفئة أو الكائن
كصورة بالعرض الكامل في بطاقة.
إرشادات حول الصور بالعرض الكامل
في ما يلي قائمة باقتراحات واجهة المستخدم للصور ذات العرض الكامل:
الإرشادات | الوصف |
---|---|
نوع الملف المفضّل | PNG |
الحد الأدنى للحجم |
1860 بكسل عرضًا، وارتفاع متغير. استخدِم صورًا مستطيلة عريضة. استخدِم صورة ذات خلفية ملوّنة للحصول على أفضل النتائج. |
نسبة العرض إلى الارتفاع | متغير |
حجم شاشة العرض |
العرض الكامل للنموذج والارتفاع التناسبي. ![]() |
استخدم نفس نظام الألوان الذي تستخدمه لشعارك. |
صور الرمز الشريطي
تسمح بعض القطاعات بالصور فوق الرمز الشريطي وتحته.
صور فوق الرمز الشريطي
في ما يلي قائمة باقتراحات واجهة المستخدم في الصور المعروضة فوق الرمز الشريطي:
الإرشادات | الوصف |
---|---|
نوع الملف المفضّل | PNG |
أقصى ارتفاع |
20 dp (في الحد الأقصى لنسبة العرض إلى الارتفاع) الحجم الذي ننصح به هو 80 بكسل للطول و80-780 بكسل في حال توفُّر صورتَين. هذا يجعلها جنبًا إلى جنب. إذا كانت إحدى الصور مربّعة والأخرى مستطيلة، يجب أن تكون دقة الصورتَين 80×80 بكسل و780×80 بكسل. |
نسبة العرض إلى الارتفاع |
بدون قيود. للحصول على 20 وحدة بكسل مستقلة الكثافة لارتفاع وعرض صورة واحدة، استخدِم نسبة عرض إلى ارتفاع تبلغ 20:1. إذا كنت تريد صورة واحدة فقط فوق الرمز الشريطي، يجب استخدام العرض الكامل (مع استبعاد المساحة المتروكة). يجب أن يكون حجم الصورة 1600x80 بكسل. |
الحد الأقصى لحجم العرض (صورة واحدة) | 20 وحدة بكسل مستقلة الكثافة والعرض 400 بكسل مستقل الكثافة |
صورة أسفل الرمز الشريطي
في ما يلي قائمة باقتراحات واجهة المستخدم للصورة أسفل الرمز الشريطي:
الإرشادات | الوصف |
---|---|
نوع الملف المفضّل | PNG |
أقصى ارتفاع |
20 dp (في الحد الأقصى لنسبة العرض إلى الارتفاع) الحجم المقترَح هو 80 بكسل للطول و80-1600 بكسل للعرض. إذا كان الشكل مربّعًا، أبعاده 80x80 بكسل. أما إذا كانت مستطيلة، فيجب أن تكون بدقة 1600×80 بكسل. |
نسبة العرض إلى الارتفاع غير محدودة للحصول على 20 وحدة بكسل مستقلة الكثافة للعرض والارتفاع، استخدِم نسبة عرض إلى ارتفاع تبلغ 20:1. | إذا أردت صورة بالعرض الكامل (باستثناء المساحة المتروكة)، يجب أن تكون الصورة 1600×80 بكسل. |
الحدّ الأقصى لحجم الشاشة هو 20 وحدة بكسل مستقلة الكثافة والعرض 400 بكسل مستقل الكثافة. |
الوحدات
تمثل الوحدة مجموعة من الحقول في قسم معين من نموذج. يتضمّن الجدول التالي إرشادات حول عدد الوحدات التي يجب تضمينها في الصفوف والكائنات لضمان عرض بطاقاتك بشكل صحيح في تطبيق "محفظة Google".
الإرشادات | الوصف |
---|---|
imageModulesData
|
يمكنك استخدام سمة imageModulesData واحدة فقط في الصف أو في العناصر التي تنشئها.
|
infoModuleData
|
يمكنك استخدام ما يصل إلى سمتَين من النوع
قد يحدّد |
linksModuleData
|
استخدِم ما يصل إلى أربعة
قد يكون لديك معرِّفا الموارد المنتظمين (URI) |
textModulesData
|
استخدِم ما يصل إلى حقلَين
قد يكون لديك معرّف موارد منتظم (URI) |
infoModuleData
يحتوي عنصر InfoModuleData
على معلومات الأعضاء وقابلة للتخصيص
ويظهر في العرض الموسّع. استخدِم هذه الوحدة لتخزين معلومات مثل
تواريخ انتهاء الصلاحية أو أرصدة النقاط الثانية أو أرصدة القيم المخزَّنة.
linksModuleData
تحتوي وحدة الروابط على معرّفات الموارد المنتظمة (URI) لصفحات الويب وأرقام الهواتف وعناوين البريد الإلكتروني. في ما يلي قائمة باقتراحات واجهة المستخدم الخاصة بوحدة الروابط:
الإرشادات | مثال على الإعداد | مثال صورة |
---|---|---|
استخدِم البادئة http: عند تحديد معرّف موارد منتظم (URI) لموقع إلكتروني أو
موقع جغرافي في "خرائط Google". تتيح هذه البادئة للمستهلك لمس الرابط
والانتقال إلى الموقع الإلكتروني أو الاطّلاع على الموقع الجغرافي في "خرائط Google".
تؤدي هذه البادئة أيضًا إلى ظهور رمز لرابط أو خريطة أمام الوصف في بطاقتك.
|
'uri': 'http://maps.google.com/?q=google'
|
![]() |
'uri': 'http://developer.google.com/wallet/'
|
![]() |
|
استخدِم البادئة tel: عند تحديد رقم هاتف. وتتيح هذه البادئة للمستهلك لمس الرابط لطلب الرقم. تؤدي هذه البادئة أيضًا إلى إنشاء رمز هاتف أمام الوصف النصي على البطاقة.
|
'uri': 'tel:6505555555'
|
![]() |
استخدِم البادئة mailto: عند تحديد عنوان بريد إلكتروني.
تتيح هذه البادئة للمستهلك لمس الرابط لإرسال رسالة إلكترونية إلى
العنوان. تؤدي هذه البادئة أيضًا إلى إنشاء رمز لرسالة إلكترونية أمام
وصف النص على البطاقة.
|
'uri': 'mailto:jonsmith@email.com'
|
![]() |
العناوين والتسميات والأسماء
اكتب العناوين والتصنيفات والأسماء بأحرف كبيرة في العنوان، لكي تبدأ كل كلمة.
سياسات المحتوى
يجب أن يتوافق محتوى كل حقل في "البطاقة" مع سياسات محتوى الدفعات. ويجب أيضًا أن يكون محتوى المواقع الإلكترونية التي تشير إليها في الصف متوافقًا مع هذه السياسات.
موضع البيانات في منصّة الشريك
لضمان وصول المستخدمين إلى تطبيقك أو موقعك الإلكتروني الغني بالميزات بشأن
"البطاقة"، احرص على دمج الرابط الخاص بتطبيقك أو موقعك الإلكتروني في سمة linksModuleData.*
ضمن فئة أو عنصر البطاقة. يتيح ذلك للمستخدم الانتقال إلى منصتك من خلال Pass التي تظهر في "محفظة Google". لمعرفة كيفية عرضه، انتقِل إلى أقسام التصميم في
قطاعات البطاقة.