RESEARCH, WIREFRAMES, VISUAL DESIGN

SWIPE APP

‘Swipe’ enables users to view all available JetPrivilege card with our partner banks.

BACKGROUND

‘Swipe’ enables users to view all available JetPrivilege card with partner banks. Users can get this card and earn JPMiles with every swipe made for payment using this card. Imagine if there was a mobile app for users to choose the suitable JetPrivilege card for them and apply for it online. User should be able to compare, analyse and decide which card is best for them. They should be able to take a well informed decision by understanding all benefits of a card and compare and narrow down the choice using the app.

Target Profile:

  • New members and existing JetPrivilege members
  • 25 - 45 years
  • Intermediate web / app users
  • Salaried and self-employed professionals

OVERVIEW

on existing associations with & role of credit cards as a category.

Geometric rise in aspirations, arithmetic rise in income - More exposure, more demands, however a slowly rising income – delayed gratification!!!

This insights were gathered conducting a small user research with my colleagues and friends.

Impatient consumers - exposed to innumerable products & services carrying the promise of an enhanced (even luxurious) lifestyle - want to covet these at the earliest

  • However, stumped by stringency of their income – therefore limited
  • Furthermore, rate of introduction of new products/services reduces the shelf-life of older ones
  • For example: In the mobile market, the churn-over rate is so fast that by the time the consumer accumulates enough cash to purchase a new model, it has already been superseded by a newer, more sophisticated model – and relatively costlier too!
  • The consumer is therefore constantly playing catch-up – constantly left trying to match their aspirations to their income

" I wanted to buy that mobile phone but then I had to wait for 2 months so that I could manage my finances well. But then, by the time I could buy that, there was a newer and more expensive version in the market.

Today, things are coming at such a fast rate that there is no point in waiting for anything.

Today people are like, if you want it, you want it now. Even I do not like to deny my family anything. "

In such a scenario, the consumer is looking for something that helps them reduce this income-aspiration gap – thereby bringing their dreams closer

Credit cards help bridge this income-aspiration gap (to some extent) - Credit cards, with their credit facility, help bring dreams closer (at least by 45 days)

Most consumers look upon credit cards as the window of opportunity that aids early realization of dreams

  • With their credit facility, credit cards help consumers prepone their purchase and therefore bring the distant future a little closer
  • The 45-day period that allows consumer to avail credit without any ‘additional charges’ gives further impetus to its desirability
  • Furthermore, while paying interest on a credit card is not desirable, it still seems like a acceptable trade-off for a premature desire appeasement

" Like we can purchase the thing before hand also. Suppose I have to purchase the thing 2 months alter then I can purchase it 1 month earlier.

If you time it right, it is an interest-free loan for a period of 45 days. So if I know that I am going to get that much cash in the next one month, then I go ahead and swipe my credit card. Then I don’t need to wait. "

The role of a credit card therefore revolves around making ephemeral dreams
seem like a closer reality

PAIN, PREFERENCES & CONSTRAINTS?

  • Not everyone loves dealing with banks or credit card companies. No one wants to spend a lot of time banking, but they still want the security and convenience.
  • People are lured by flashy bonuses or rewards before considering whether the rewards actually match up with their spending. That means a whole lot of people are walking around with the wrong credit cards in their wallets. (For example: People having Diners Club card never go to Lounges, Golfing or travel International)
  • The above scenario is created when a website/app does not provide a clear communication or when the information is scattered and cluttered.
  • The calculation of reward points and how to redeem points was confusing to the users and they always had to call credit card companies to understand. At certain point users felt hesitant calling card companies.
  • Preference is to meet users mental model and their expectations where it is convenient for them to understand the product as per their needs and the goal which they want to achieve.

APPROACH

Design Thinking: Empathise, Define, Ideate, Prototype and Test. Hence due to the limited timeframe, I am going to be juggling between those.

Empathise:

This was the first stage of the my Design Thinking process to gain an empathic understanding of the problem I am trying to solve. To find out more about the concern areas, I conducted a small usability test with 3 people to understand their experiences, motivations, drives and blocks to have a deeper knowledge about the issues involved.

Define – the problem:

I put together the information gathered during the Empathise stage. Analyzed my observations and synthesized them in order to define the core problems that I have identified up to this point. To illustrate: After conducting usability test, users were experiencing lot of blockages. This insights helped me to identify the pain point of making the journey simpler and seamless by taking well informed decision.

Ideate:

With the solid background of understanding users and their needs in the Empathise stage, I analysed and synthesized my observations in the Define stage, I started generating ideas to identify new solutions to the problem statement I have created, and start to look for alternate ways to look at the problem.

Prototype:

Understanding of above steps, wireframes with solutions were then transformed into visual designs followed by clickable Prototype

Test:

Overall I am happy with the result, though I know that in a weeks time I could have done something much more detailed. But there is always room for improvement and a lot to be done to reach the fullest potential of the application’s design.

USE CASE

CONTENT

Designing with real-life content make the app more lively and helps understand the concept very well. The pages and sections sections got some real stuff in, that I took from cards.jetprivilege.com and other sites like hdfcbank.com.

FIRST SKETCHES

One of my favorite parts of any Design process is sketching.

I had a great couple of chats with my colleagues and friends and got some great feedback on my wireframes.

So being confident with the solution, I am sketching out a rough solution on paper.

VISUAL DESIGN

Due to time constraints, I directly started visual designs based on wireframes and insights which I got from small chats with my colleagues and friends.

HOME SCREEN

Offer Carousel: This section will have personalized targeted offers for user basis their interaction on other sites

Find card – assisted/non-assisted:A step by step guided journey using progressive disclosure

Find card by category:Users can directly find cards basis preferences.

Enroll Now:Persuasive technique used to make users enroll

Calculate free flights:Calculator to calculate free flights

Articles:Users can read articles on how to choose a credit card, what to look while buying a card, etc…

Bottom Navigation:

Home:Current Screen

Book Now:A marketplace to book, flights, hotels, transport at the same place

Saved:User now have a flexibility to save cards to relook for future reference.

Offers:Offers would be based on e-commerce, free flights, additional points, movie tickets, vouchers, discounts, etc…

Redeem:User can now redeem points available with them at various places. Also a booklet would be provided to check all the redeemable items

LISTING SCREEN

When a user selects “ I will find my own card (un-assisted)“, they will reach to this screen where all the cards are listed with an option to filter cards:

User Action:

  • User can clearly identify if the card suits their needs by reading the key highlights shown. They can expand the view by tapping on Read More.
  • To read more about the card in details (Features, Eligibility, Fees & Charges, Documentation and Eligibility calculator), they can click on “Know More”.
  • User also has a flexibility to save the card to re-look at it in future.
  • This screen will also have a Share functionality, where they can share it with friends to get additional advice.
  • Ratings & comments to get others experiences.

COMPARE SCREEN

Users can now select upto 3 cards to compare. Comparison is one of the most critical activities users perform on the web/app/mobile site. Most important thing to consider is to provide consistent information for all comparable products.

User Action:

  • Overview gives them engage in compensatory decision making: they can look at the individual merits of each cards and compare their advantages and disadvantages according to a number of criteria shown below.





TO THE TOP