شخصی‌سازی کارت‌های اعتباری گوگل والت

گوگل والت ابزارهای قدرتمندی برای سفارشی‌سازی ظاهر و طرح‌بندی هرگونه کارت اعتباری، از بلیط‌های رویداد و کارت‌های ورود گرفته تا کارت‌های وفاداری و هدیه، ارائه می‌دهد. این راهنما، مروری جامع بر چگونگی شخصی‌سازی تجربه کاربری با تعریف ساختار کارت و نمایش اطلاعات پویا و مختص کاربر ارائه می‌دهد.

قبل از شروع، حتماً به مستندات مرجع REST API مخصوص نوع عبور خود مراجعه کنید تا لیست کاملی از فیلدهای موجود را مشاهده کنید.

بنیاد: cardTemplateOverride

ابزار اصلی برای سفارشی‌سازی طرح‌بندی یک گذرگاه، شیء classTemplateInfo.cardTemplateOverride است که شما آن را در منبع Class گذرگاه (مثلاً EventTicketClass ، LoyaltyClass ) تعریف می‌کنید. این شیء به شما امکان می‌دهد تا با تعریف ردیف‌ها و موارد درون آنها، گذرگاه را ساختاردهی کنید و به شما امکان کنترل نحوه ارائه اطلاعات را می‌دهد.

شما می‌توانید داده‌ها را هم از منبع Class (برای اطلاعات مشترک بین همه کاربران) و هم از منبع Object (برای جزئیات خاص کاربر) ارجاع دهید.

۱. سفارشی‌سازی با فیلدهای از پیش تعریف‌شده‌ی کیف پول

فیلدهای از پیش تعریف‌شده، ویژگی‌های استاندارد موجود در API کیف پول گوگل برای یک نوع کارت عبور خاص هستند. این فیلدها نام‌های خاصی دارند و توسط کیف پول به روشی ثابت ارائه می‌شوند. مثال‌ها شامل بارکد، نام رویداد، شماره پرواز یا موجودی کارت هدیه هستند.

با ارجاع به fieldPath این فیلدهای از پیش تعریف شده، می‌توانید آنها را در هر جایی از مسیر خود مرتب کنید.

مثال: نمایش بارکد و جزئیات مربوط به رمز عبور

این مثال عبور دارای یک "ردیف بالا" و 3 فیلد داده در ردیف دوم است. مورد اول مقادیر خاص کاربر را از Object مانند امتیاز یا شماره صندلی مخصوص کاربر نمایش می‌دهد. مورد دوم جزئیات Class مانند نام رویداد یا سطح برنامه وفاداری را نمایش می‌دهد و مورد سوم دوباره مقادیر خاص کاربر را از Object مانند امتیاز ثانویه یا شماره بخش/واگن نمایش می‌دهد.

Predefined Fields

تعریف کلاس:

...
"classTemplateInfo": {
      "cardTemplateOverride": {
        "cardRowTemplateInfos": [
          {
            "threeItems": {
              "startItem": {
                "firstValue": {
                  "fields": [
                    {
                     "fieldPath": "object.loyaltyPoints.label",
                     "fieldPath": "object.loyaltyPoints.balance",
                    }
                  ]
                }
              },
              "middleItem": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "class.rewardsTierLabel",
                      "fieldPath": "class.rewardsTier",
                    }
                  ]
                }
              },
              "endItem": {
                "firstValue": {
                  "fields": [
                    {
                     "fieldPath": "object.secondaryLoyaltyPoints.label",
                     "fieldPath": "object.secondaryLoyaltyPoints.balance",
                    }
                  ]
                }
              }
            }
          },
        ]
      }
    }
...
"rewardsTier": "Gold",
"rewardsTierLabel": "Tier",
...

تعریف شیء

...
"loyaltyPoints": {
    "balance": {
        "string": "1500"
    },
    "label": "Points"
},
"secondaryLoyaltyPoints" : {
    "balance": {
        "money": {
            "micros" : "28250000",
            "currencyCode": "USD",
        }
    },
    "label": "Balance"
}
...

قالب‌بندی فیلدهای تاریخ و زمان

برای هر فیلد تاریخ یا زمان در مسیرهای پشتیبانی‌شده، می‌توانید با استفاده از ویژگی dateFormat ، یک قالب سفارشی تعیین کنید. این به شما امکان می‌دهد نحوه نمایش تاریخ در مسیر را کنترل کنید، مانند نمایش فقط زمان، تاریخ و زمان کامل یا فقط تاریخ. اگر dateFormat مشخص نشده باشد، از قالب پیش‌فرض استفاده خواهد شد.

"fields": [
  {
    "fieldPath": "object.validTimeInterval.start.date",
    "dateFormat": "DATE_ONLY"
  }
]

برای فهرست کاملی از فرمت‌های موجود، به مستندات DateFormat مراجعه کنید.

۲. سفارشی‌سازی با فیلدهای تعریف‌شده توسط توسعه‌دهنده

برای نهایت انعطاف‌پذیری، گوگل والت به شما امکان می‌دهد فیلدهای داده سفارشی خود را با استفاده از textModulesData ایجاد کنید. این برای نمایش اطلاعات منحصر به فردی که در فیلدهای از پیش تعریف شده نمی‌گنجند، مانند یادداشت‌های کوتاه سفارشی، مزایای اعضا یا جزئیات مربوط به مکان، ایده‌آل است.

شما یک آیتم textModulesData با یک id منحصر به فرد در Object یا Class تعریف می‌کنید و سپس آن id را در cardTemplateOverride ارجاع می‌دهید.

ساختار ردیف‌های کارت

شما می‌توانید یک مسیر با یک، دو یا سه آیتم داده در هر مسیر طراحی کنید که به شما امکان می‌دهد اطلاعات را به صورت منطقی سازماندهی کنید. هیچ محدودیت سختی برای تعداد ردیف‌هایی که می‌توانید اضافه کنید وجود ندارد، اما برای یک تجربه کاربری تمیز، در نظر بگیرید که چه چیزی برای نمایش روی کارت مهم‌تر است.

  • بهترین روش: برای اطلاعات تکمیلی، از نمای جزئیات گذر یا سایر ویژگی‌های کیف پول مانند messages ، linksModuleData یا linkedOfferIds استفاده کنید. این کار نمای گذر اصلی را خلوت نگه می‌دارد.

مثال: یک ردیف سه آیتمی با داده‌های سفارشی

برای نمایش جزئیات سفارشی، یک ردیف ایجاد کنید. برای کارت وفاداری، این می‌تواند امتیاز، ردیف و موجودی باشد. برای بلیط رویداد، می‌تواند «بخش»، «ردیف» و «صندلی» باشد.

Custom and Predefined Fields

تعریف کلاس: cardTemplateOverride به سه شناسه منحصر به فرد اشاره می‌کند: detail1 ، detail2 و detail3 .

...
"classTemplateInfo": {
      "cardTemplateOverride": {
        "cardRowTemplateInfos": [
        {
            "oneItem": {
              "item": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "object.accountName",
                    }
                  ]
                }
              }
            }
          },
          {
            "threeItems": {
              "startItem": {
                "firstValue": {
                  "fields": [
                    {
                     "fieldPath": "object.loyaltyPoints.label",
                     "fieldPath": "object.loyaltyPoints.balance",
                    }
                  ]
                }
              },
              "middleItem": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "class.rewardsTierLabel",
                      "fieldPath": "class.rewardsTier",
                    }
                  ]
                }
              },
              "endItem": {
                "firstValue": {
                  "fields": [
                    {
                     "fieldPath": "object.secondaryLoyaltyPoints.label",
                     "fieldPath": "object.secondaryLoyaltyPoints.balance",
                    }
                  ]
                }
              }
            }
          },
          {
            "threeItems": {
              "startItem": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "object.textModulesData['row1left']",
                    }
                  ]
                }
              },
              "middleItem": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "object.textModulesData['row1mid']"
                    }
                  ]
                }
              },
              "endItem": {
                "firstValue": {
                  "fields": [
                    {
                      "fieldPath": "object.textModulesData['row1right']"
                    }
                  ]
                }
              }
            }
          },
          {
            "twoItems": {
              "startItem": {
                "firstValue": {
                  "fields": [
                    {
                     "fieldPath": "object.textModulesData['mem_since']",
                    }
                  ]
                }
              },
              "endItem": {
                "firstValue": {
                  "fields": [
                    {
                     "fieldPath": "object.textModulesData['park']",
                    }
                  ]
                }
              }
            }
          },
        ]
      }
    }
...
"rewardsTier": "Gold",
"rewardsTierLabel": "Tier",

تعریف شیء: Object داده‌ها و شناسه‌های (ID) مربوط به هر فیلد را فراهم می‌کند.

...
"accountName": "Lorenaisabel Aliwarringlen",
"loyaltyPoints": {
    "balance": {
        "string": "1500"
    },
    "label": "Points"
},
"secondaryLoyaltyPoints" : {
    "balance": {
        "money": {
            "micros" : "28250000",
            "currencyCode": "USD",
        }
    },
    "label": "Balance"
},
"textModulesData": [
{
    "header": "Visits",
    "body": "17",
    "id": "row1left"
  },
  {
    "header": "Rides",
    "body": "259",
    "id": "row1mid"
  },
  {
    "header": "Park hours",
    "body": "140",
    "id": "row1right"
  },
  {
    "header": "Member since",
    "body": "Mar 01, 2017",
    "id": "mem_since"
  },
  {
    "header": "Parking",
    "body": "Included (Free)",
    "id": "park"
  }
]
...

داده‌های کلاس در مقابل داده‌های شیء برای انواع مختلف

شما می‌توانید داده‌های سطح کلاس و سطح شیء را برای ایجاد گذرهای پویا و شخصی‌سازی‌شده ترکیب کنید. این برای ایجاد نسخه‌های مختلف از یک گذر مفید است.

  • textModulesData سطح کلاس: از این برای جزئیاتی استفاده کنید که برای گروهی از کاربران یکسان است (مثلاً پیام "به VIP خوش آمدید" برای همه دارندگان بلیط VIP).
  • textModulesData سطح شیء: از این برای جزئیات مختص به یک کاربر استفاده کنید (مثلاً «جین، صندلی شما دارای نمای محدودی است»).

مثال: نمایش مجوزهای مخصوص هر سطح

شما می‌توانید منابع Class مختلفی را برای انواع مختلف بلیط ایجاد کنید، مانند «پذیرش عمومی» در مقابل «وی‌آی‌پی» برای یک رویداد، یا «اقتصادی» در مقابل «تجاری» برای یک پرواز. هر کلاس می‌تواند طراحی منحصر به فرد (تصویر اصلی، رنگ) و متن پیش‌فرض داشته باشد.

عضو در سطح نقره‌ایعضو به طلایی ارتقا یافتعضو در سطح الماس
عضوی که با نقره شروع می‌شود عضو به طلایی ارتقا یافت عضو دیگر در سطح الماس

محتوا در نمای جزئیات مجوز

فیلدهای linksModuleData و imageModulesData هنگام ارجاع در cardTemplateOverride در جلوی کارت نمایش داده نمی‌شوند. این محتوا به طور خودکار در نمای جزئیات کارت ("پشت کارت") نمایش داده می‌شود و به کاربران دسترسی بهتری به لینک‌های خدمات مشتری، تصاویر تبلیغاتی، شرایط و ضوابط و سایر اطلاعات تکمیلی می‌دهد.

۳. فراتر از ظاهر کارت: سایر موارد لغو الگو

شیء classTemplateInfo چیزی بیش از cardTemplateOverride ارائه می‌دهد. شما می‌توانید بخش‌های دیگر تجربه Google Wallet را سفارشی کنید تا نمایش غنی‌تر و کاربرپسندتری از کارت‌های اعتباری خود ارائه دهید.

برای جزئیات کامل در مورد تمام override های موجود، به مستندات مرجع ClassTemplateInfo مراجعه کنید.

  • listTemplateOverride : طرح‌بندی ردیف‌ها را در نمای فهرست اصلی برنامه Google Wallet سفارشی می‌کند و به شما امکان می‌دهد قبل از اینکه کاربر حتی کارت خود را باز کند، مهم‌ترین فیلدها را برجسته کنید.
  • detailsTemplateOverride : ردیف‌ها و طرح‌بندی نمای "جزئیات گذرنامه" (پشت گذرنامه) را ساختار می‌دهد و فضایی انعطاف‌پذیر برای اطلاعات تکمیلی، پیوندها و متن در اختیار شما قرار می‌دهد.
  • cardBarcodeSectionDetails : به شما امکان می‌دهد بخش بارکد روی کارت را سفارشی کنید.