Products and Categories
There are multiple options for displaying products in the Store: Either as Product Tiles for the Store in the app or as Product Cards on the web, with closed category headers or as open categories that lead to a dedicated page displaying a list of said products.
The advantage of using category headers is that more products can be shown on the Store Overview, enhancing discoverability. In contrast, closed categories offer fewer options, resulting in a more minimalistic overview.
Each local country team can choose between closed or open categories based on their needs. The only consideration is their Core Semantic Color and the subsequent levels of navigation when using open categories.
Core Category Colours
The George Store uses fixed colour rules for the categories that must be universally adhered to. Only George Plugins can be used in the George Brand colour (fallback colour in GEM).
Closed Categories
In this case, all products listed below should belong to the same category and must share the same colour.
Open Categories
Alternatively, each top-level category can be represented as an individual tile or card. In this case, the section title should be omitted.
Open & Closed Categories
Open and closed categories can coexist in the same environment if needed. In the example below, all the finance-oriented products are displayed as open categories, while the partner offers are shown as a closed category with their dedicated header.
Combined Categories
It is possible to combine categories, as shown in this example: ‘Accounts & Cards.’ In this case, the colour of the first category should be applied; for instance, the indigo colour for the Account category is also used for the Card products.
editors
- Mixed category sections should adopt the colour of the first category mentioned.
- Do not mix and match colours within a closed category group.
Character Limit
Similar to the Featured Product Title, the title displayed for a product should also adhere to the 30-character limit. The goal is to maintain the text within a maximum of two lines.
editors
- Even though the subtitle is not utilized when displaying products as tiles in the App version of the overview, the subtitle field is mandatory to ensure the accurate rendering of the description on the Web version.
New Products
New products in the store can be highlighted with a badge.
The new badge is positioned at the top right corner of the icon for both tiles (App) and cards (Web), as well as other items on an Open Category Page, such as Recommended Products.
