Cards

Capturing intent

Early on in my research, it became clear that components would need to be designed around intents. From here I identified two intents users typically have when interacting with banking services.

Action intents: action intents refer to clear definitive user goals users have, alongside a preference/need to complete these goals in a timely manner.

Exploratory intents: These refer to intents that are centered around discovery, learning and understanding. Here, users' primary goals are to understand products,and not necessarily perform high level actions.

Action cards

Action cards are designed to give users essential data and a maximum of two options which act on the data. They help users complete medium length actions in a much shorter time by pre-filling context and allowing users to reach review and verification processes faster.

Card dsiplaying the due date for a visa card payment, the amount is shown along with the die date and a blue button with the label pay
row of cards. A woman with her arms crossed and below, text with investments, a title and a summary about an investment offer

Information cards

Information cards are designed to create more natural user flows, prevent redirects and retain context. They allow users to explore the website with minimal context changes. The information card is linked to the bottom sheet which reveals the content of the information card.

Expanding information cards

Currently, exploring areas of the standard chartered website can result in redirects, these redirects produce new contexts, which are necessary for some products, however for cross selling which standard chartered and most banks rely on, context switching has the opposite effect on conversions. And this effect cuts across most major banks who typically use redirects. Keeping context and compressing information remains a crucial indicator of sales performance. In order for information cards to be effective, they require one extra component. Bottom sheets. Bottom sheets allow users to browse information while retaining their context.

Bottom sheets

The bottom sheet unlocks new user flows, allowing users to scan entire information blocks without a full context switch, this card plus bottom sheet pattern can provide massive gains in ROI because of its ability to retain users. It also provides a window for advanced customisation and personalised content which can lift CTR by as much as 117%.

bottom sheet showing details about the CIO funds by standard chartered.