Manage Brand

Banks can have varied requirements with regards to the theme and for look and feel of the application.

Manage Brand is an administrative maintenance that allows the System AdministratorAdministrator is a set of individuals that administer the applicant/Affiliate entity. For example, Accountants, Authorized Signatories for organizations, Power of Attorney for individuals. to define the theme using brand logo, colors, fonts and font sizes.

System Administrator can configure the style/ theme by selecting brand logo, header colors, background colors, label colors, button colors, font color, header size, font type, font sizes for header texts, menu, buttons etc.

The administrator can define multiple themes with the above mentioned attributes and once defined, the administrator can activate one of the theme from the available list.

At any point in time, the administrator can deactivate a theme and activate another one.

Prerequisites

Transaction access is provided to System Administrator
Approval rule set up for System Administrator to perform the actions

workflow

Features supported in application

View Brand
Create Brand
Edit Brand
Delete Brand
Brand Mapping

You are here How to reach here:

Dashboard > User Experience > Manage Brand

Manage Brand – Summary

Field Description

Field Name	Description
Brand Name	Displays the theme name as defined.
Brand Description	Displays the theme description as defined.
Date Created	Displays the date of theme creation.
Actions	The available action buttons against the theme are displayed. The action button can be: View: Click to view the created theme.

In the Action column, click View to view the already created theme.
OR
Click Create to create a new theme.

Manage Brand - Create

Using this option, System Administrator can create a new theme for retail, corporate and administrator users.

To create a brand:

In the Manage Brand screen, click Create. The Create Brand screen appears.

Field Description

Field Name	Description
Brand Name	Enter a name for the brand being created.
Brand Description	Enter a description for the brand being created.
Customized Brands
Assets	Upload the desired file for assets such as icons, logo etc.
Font	Specify the font details of the application i.e. font URL and font name that is to be used in the brand.
Font Size	Specify the font size details of the various fonts used in the application in 'rem' (length unit) for various level of headings in the brand.
Font Weights	Specify font weight definitions for the brand.
Components	Specify header and footer background and foreground color details.
Base Color	Specify colors of various components (clickable text in the application) for the brand. The list includes: Primary Color Secondary Color Secondary Text Color Secondary Color Dark Success Color Success Color Light Warning Color Warning Color Light Danger Color Danger Color Light Border Default Color Primary Text Color Secondary Text Color Tertiary Text Color Primary Background Color Tertiary Background Color Secondary Background Color Background Disable Color Scroll Track Scroll Thumb Menu Background Color
Base Dimensions	Specify dimensions for the header, footer, docked menu and menu.
Button Colors	Specify the color scheme of the buttons displayed in the application, for the brand. The list includes: Help Background Color Help Color Help Border Color Primary Background Color Primary Border Color Secondary Background Color Secondary Foreground Color Secondary Border Color Tertiary Background Color Tertiary Foreground Color Tertiary Border Color
Button Dimensions	Specify the dimensions (height, width, font size, icon size) of the buttons displayed in the application, for the brand. The list includes: Height Padding Top Bottom Padding Left Right Border Radius Border Width Font Size Icon Size
Navigation Bar	Specify the color scheme of the navigation bar, for the brand. The list includes: Hover Text Color Hover Border Color Hover Background Color Selected Text Color Selected Border Color Selected Background Color Default Text Color Default Border Color Default Border Color
Table	The color scheme (header background, header, and hover) for tables displayed in the application. The list includes: Header Background Color Header Color Row Hover Color
Banner Colors	Specify the color scheme of banners displayed in the application. The list includes: Background Color Primary Color Secondary Color
Banner Dimensions	Specify the dimensions (padding) of banners displayed in the application.
Link Colors	Specify the color scheme (base and hover) for links displayed in the application. The list includes: Base Color Hover Color
Form Colors	Specify form dimensions (line height, border width, border radius, border width, etc.). The list includes: Input Background Color Input Hover Color Input Focus Color Input Disable Color Input Text Color Input Text Hover Color Input Text Focus Color Input Text Disable Color Input Border Color
Form Dimensions	The form dimensions (line height, border width, border radius, border width, etc.) of the brand. The list includes: Form Line Height Form Border Width Form Input Input Border Radius Form Button Height Form Button Border Radius Form Button Border Width Padding Top Bottom Padding Left Right Small Form Padding Top Bottom Small Form Padding Left Right Form Title Margin Top Bottom Form Title Margin Left Right
Form The following section displays a preview of all the components comprising of the brand theme as defined under the Customize Brand section.
Navigation Bar	An example of how the navigation bar will be displayed, based on brand definition.
Section header	An example of how the heading of a section (applicable for screens that have multiple sections) will be displayed, based on brand definition.
Font Color	Text displaying the color of the font, as defined.
Anchor Text Color	The anchor text color (click able text in the application) of the brand.
Label Color	The label color, as defined.
Input Properties	An example of how an input field will be displayed.
Primary Button Properties	An example of how a primary button will be displayed.
Secondary Button Properties	An example of how a secondary button will be displayed.
Tertiary Button Properties	An example of how a tertiary button will be displayed.
Help Button Properties	An example of how a help button will be displayed.
H1 - H6 Size	The font size of the various level of headings as defined for the brand.

In the Brand Name field, enter the name of the theme.
In the Brand Description field, enter the description for the theme.
Under the Customized Brands section:
In the Asset section, click Choose File to browse and upload the logo for brand.
In the Font Size section, define the font size for various components in the application.
In the Font Size section, enter the values for Heading 1, 2, 3.....6.
In the Font Weights section, select the regular, light and bold font weights from the list.
In the Components section, click and select the background and foreground colors of the header and footer.
In the Base Colors section, colors to be assigned to the various button types displayed in the application.
In the Base Dimensions section, select the header, footer, docked menu height, menu width from the list.
In the Button Colors section, select the primary, secondary, and tertiary background, foreground and border color from the list.
In the Button Dimensions section, select the height, width, font size and other properties of a button from the list.
In the Navigation Bar section, colors to be assigned to the various components that form part of the navigation bar.
In the Table section, colors to be assigned to the various components that form part of a tables.
In the Banner Colors section, select the colors to be assigned to the various components that form part of banners.
In the Banner Dimensions section, select the dimension for the banner padding from the list.
In the Link Colors section, click and select the base and hover colors for all links.
In the Form Colors section, select the colors to be assigned to input fields.
In the Form Dimensions sections, select the various properties of a form (line height, border width, border radius and few other properties) from the list.
Click Save to save the details.
OR
Click Cancel to cancel the transaction and to navigate to the 'Dashboard'.
OR
Click Reset to clear the entered values entered in all sections under Customize Brand.
OR
Click Back to navigate to the previous screen.
The Review screen appears. Verify the details, and click Confirm.
OR
Click Edit to make the changes if any.
OR
Click Cancel to cancel the transaction.
The success message appears along with the status of transaction. Click OKto return to the dashboard.

Manage Brand - Edit

If the defined theme does not suit the requirement, then system administrator can edit the defined theme using the Update option.

To edit the brand:

In the Action column, click View against the brand which you want to edit . The Manage Brand - View screen appears.
Click Edit to edit the brand. The Update Brand screen appears.
OR
Click Delete to delete the brand.
OR
Click Back to navigate to the previous screen

Field Description

Field Name	Description
Brand Name	Displays the theme name.
Brand Description	Displays the theme description.
Customized Brands
Assets	This section displays the uploaded brand logo. Click Download to view the brand logo.
Typography	Displays the font details of the application i.e. font URL and font family.
Font Size	Displays the font size details (header, small, large, larger, default, medium) of the various fonts used in the application in 'rem' (length unit). 1px = 1rem.
Font Weights	Displays the font weight definitions.
Components	The header and footer background and foreground color details.
Base Color	The base color (clickable text in the application) of the brand. The list includes: Primary Color Secondary Color Secondary Text Color Secondary Color Dark Success Color Success Color Light Warning Color Warning Color Light Danger Color Danger Color Light Border Default Color Primary Text Color Secondary Text Color Tertiary Text Color Primary Background Color Tertiary Background Color Secondary Background Color Background Disable Color Scroll Track Scroll Thumb Menu Background Color
Form Dimensions	The form dimensions (line height, border width, border radius, border width, etc.) of the brand. The list includes: Form Line Height Form Border Width Form Input Input Border Radius Form Button Height Form Button Border Radius Form Button Border Width Padding Top Bottom Padding Left Right Small Form Padding Top Bottom Small Form Padding Left Right Form Title Margin Top Bottom Form Title Margin Left Right
Base Dimensions	The header, footer and menu height and width.
Button Colors	The color scheme of the buttons defined for the brand. The list includes: Help Background Color Help Color Help Border Color Primary Background Color Primary Border Color Secondary Background Color Secondary Foreground Color Secondary Border Color Tertiary Background Color Tertiary Foreground Color Tertiary Border Color
Button Dimensions	The dimensions (height, width, font size, icon size) of the buttons of the brand. The list includes: Height Padding Top Bottom Padding Left Right Border Radius Border Width Font Size Icon Size
Navigation Bar	The color scheme (selected, default, and hover) of the navigation bar of the brand. The list includes: Hover Text Color Hover Border Color Hover Background Color Selected Text Color Selected Border Color Selected Background Color Default Text Color Default Border Color Default Border Color
Table	The color scheme (header background, header, and hover) of the table of the brand. The list includes: Header Background Color Header Color Row Hover Color
Banner Colors	The color scheme (header background, header, and hover) of the banner of the brand. The list includes: Background Color Primary Color Secondary Color
Banner Dimensions	The dimensions (padding) of the banner of the brand.
Link Colors	The color scheme (base and hover) of the link of the brand. The list includes: Base Color Hover Color
Form Colors	The form color (background, hover, disable, focus, etc.) of the brand. The list includes: Input Background Color Input Hover Color Input Focus Color Input Disable Color Input Text Color Input Text Hover Color Input Text Focus Color Input Text Disable Color Input Border Color
Form Dimensions	The form dimensions (line height, border width, border radius, border width, etc.) of the brand. The list includes: Form Line Height Form Border Width Form Input Input Border Radius Form Button Height Form Button Border Radius Form Button Border Width Padding Top Bottom Padding Left Right Small Form Padding Top Bottom Small Form Padding Left Right Form Title Margin Top Bottom Form Title Margin Left Right
Form The following section displays a preview of all the components comprising of the brand theme. The appearance of each component will change as you edit it under the Customized Brand sections.
Navigation Bar	Text displaying the color of the font, as defined for the brand.
Section header	Text displaying the color of the font, as defined for the brand.
Font Color	Text displaying the color of the font, as defined for the brand.
Anchor Text Color	The anchor text color (clickable text in the application) of the brand.
Label Color	An example of the label color, as defined for the brand.
Input Properties An example of how an input field will be displayed, based on the brand definition
Primary Button Properties	The color of the primary buttons of the brand.
Secondary Button Properties	The color of the secondary buttons of the brand.
Tertiary Button Properties	The color of the tertiary buttons of the brand.
Help Button Properties	The color of the help button of the brand.
H1 - H6 Size	The font size of the various level of headings of the brand.

In the Brand Name field, edit the name of the brand, if required.
In the Brand Description field, edit the description of the theme, if required.
Under the Customized Brands sections, expand any sub section and make changes to any component as required.
Click Update to save the changes.
OR
Click Cancel to cancel the transaction and navigate to the 'Dashboard'.
OR
Click Reset to clear the entered values in the screen.
OR
Click Back to navigate to previous screen.
The Review screen appears. Verify the details, and click Confirm.
OR
Click Edit to make the changes if any.
OR
Click Cancel to cancel the transaction.
The success message appears along with the status of transaction. Click OK to return to the dashboard.

Manage Brand - View

Using this option System Administrator can view the created theme or brand.

To view the brand:

In the Action column , click View against the brand which you want to view . The Manage Brand - View screen appears.

Click Edit to edit the theme. The Manage Brand - Edit screen appears.
OR
Click Delete to delete the brand.
OR
Click Back to navigate to the previous screen.

Manage Brand - Delete

The System Administrator can delete a created brand maintained in the application.

To delete the brand:

In the Action column, click View against the brand which you want to delete. The Manage Brand - View screen appears.

Select and click the required brand which you want to delete. The Manage Brand - View screen appears.
Click Delete . A message appears asking the user to confirm brand deletion. Click Delete to confirm deletion of the brand.
OR
Click Cancel to cancel deletion and to return to the Manage Brand – View screen.

Delete Brand

The success message appears along with the status of the transaction. Click Ok to return to the dashboard.

Brand Mapping

Using this option System Administrator can map the existing brands to the user, party, role or entity.

Brand Mapping Summary

To view the brand mapping summary:

In the Manage Brand screen, click the Brand Mapping tab. The Manage Brand - Brand Mapping screen appears.

Brand Mapping

Field Description

Field Name	Description
Mapping Type	Select a mapping type to map it with brand. The options are: User Party Role Entity

Field Name

Description

Mapping Type

Select a mapping type to map it with brand.

The options are:

User
Party
Role
Entity

From the Mapping Type list, select the option for which you want to view the mapping. The Manage Brand – Brand Mapping Summary screen appears.

Manage Brand - Brand Mapping Summary

Field Description

Field Name	Description
Brand Mapping Summary
Brand Id	The identification number of the mapped theme.
Mapped Value	The value, which is mapped to the brand. The mapped value depends on the selected mapping type. For example, If the mapping type is 'user' the mapping value will be 'user ID', If the mapping type is 'party' the mapping value will be 'party ID', If the mapping type is 'role' the mapping value will be user role, such as 'Corporate' 'Retail' and 'Administrator', If the mapping type is 'entity' the mapping value will be 'entities'.
Mapping Type	The level at which the brand is mapped.
Date Created	The date on which the brand mapping was performed.
Actions	The available actions that can be performed against the brand mapping are displayed. The options can be: Delete

Click Delete against a record to delete the brand mapping.
OR
Click Create Mapping to create a brand mapping

Create Mapping

Using this option System Administrator can create a brand mapping.

To create the brand mapping:

In the Brand Mapping tab, click Create Mapping. The Manage Brand - Create Mapping screen appears.

Manage Brand- Create

Field Description

Field Name	Description
Mapping Type	Select the level at which the brand is to be mapped. The options are: User Party Role Entity
Brand	Select a brand to be mapped at the level selected under Mapping Type.
Mapped Value	Enter a mapping value.

Field Name

Description

Mapping Type

Select the level at which the brand is to be mapped.

The options are:

User
Party
Role
Entity

Brand

Select a brand to be mapped at the level selected under Mapping Type.

Mapped Value

Enter a mapping value.

From the Mapping Type list, select the appropriate option to be mapped.
From the Brand list, select a brand.
In the Mapping Value field, enter the value to be mapped.
Click Save.
OR
Click Cancel to cancel the transaction.
OR
Click Back to return to the previous screen.
The success message along with the status of transaction appears. Click Ok to return to the dashboard.

Delete Mapping

Using this option System Administrator can delete a brand mapping.

To delete a brand mapping:

In the Mapping tab, select the appropriate option from the Mapping Type list. The Brand Mapping Summary screen appears.
Click Delete against a mapping record that you want to delete.
A message appears asking the user to confirm deletion of the brand mapping.

Click Yes to confirm the deletion.
OR
Click No to cancel deletion and to return to the Manage Brand – Mapping screen.
Click OK to return to the dashboard.

Home