![Rectangle.png](https://static.wixstatic.com/media/99c97e_2e8a757e3b904d0293e78db648105fbe~mv2.png/v1/fill/w_600,h_536,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Rectangle.png)
![Rectangle.png](https://static.wixstatic.com/media/99c97e_58a7909a2e74455aa08514f551931d54~mv2.png/v1/fill/w_600,h_536,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Rectangle.png)
![Rectangle4.png](https://static.wixstatic.com/media/99c97e_a39bac7616d54bd084706f49d2f5136d~mv2.png/v1/fill/w_600,h_534,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Rectangle4.png)
CITIBANK - NEW SUBSCRIPTION FEATURE
Citibank App is one of the most secured online app and I have redesigned app with an extra feature of subscription tracking
PROBLEM STATEMENT
Many people have multiple online subscriptions for various apps and keeping track of them has been very difficult and third party apps are not reliable because of privacy issues.
GOAL
This is an independent self-initiated project to redesign Citibank App by adding Subscription feature on the app.
MY ROLE
UX researcher, UX/UI designer
RESPONSIBILITIES
User research, Interviewing, Wireframing and Prototyping
WHAT DID WE DO?
![Common Template.png](https://static.wixstatic.com/media/99c97e_7a43f139aaaf4c43a7da5bf5deaf45f1~mv2.png/v1/fill/w_1010,h_498,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/Common%20Template.png)
USER RESEARCH : SUMMARY
As many online business models have started adopting subscription based business model, it has become more tidious task to keep track of all the subscriptions.
According to Sensor Tower, a market intelligence firm, revenue from the top 100 earning non-game subscription apps represented about 11.7% of the $111 billion that consumers spent on in-app purchases last year
​
![Screenshot 2022-01-10 043322.png](https://static.wixstatic.com/media/99c97e_50a54eb953ef45c38273e240062b3085~mv2.png/v1/fill/w_902,h_572,al_c,q_90,enc_avif,quality_auto/Screenshot%202022-01-10%20043322.png)
According to India Brand Equity Foundation, the OTT sector in India witnessed a 30% rise in the number of paid subscribers, from 22.2 million to 29 million, between March and July 2020 alone.
​
Since Bank Apps have the best privacy policies for the customers, it is best choie for the customer, not to use third-party apps (including sticky notes, reminder apps, finance budgeting apps) for calculating/tracking monetary transactions
USER INTERVIEWS & SURVEYS
Interviewed 5 potential users to get an understanding of pain points, behavior and motivations in setting goals. The following were the most significant results of the interviews
Third Party Apps require manual inputs of the subscription
Why share personal financial data with other apps
A single Bank App can be the one and only app for all financial needs
Calculating expenses, savings & investments get easier
USER PERSONAS
Following five user surveys, we have created a persona that helps us understand who the users of product are, their needs and expectations, and the purpose for which they would use the product. The result must be plausible people with their own values and experiences
![Screenshot 2022-01-10 053803.png](https://static.wixstatic.com/media/99c97e_83c69fd7686b41a8ac9eb99fb8b1598d~mv2.png/v1/fill/w_928,h_515,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/Screenshot%202022-01-10%20053803.png)
INFORMATION ARCHITECTURE
I was not sure whether to place it like a filter in the transactions category or a separate tab under the bills category. If this feature is not immediately visible not many people will use it so the purpose of designing this feature is lost. Discovering this feature helps to drive engagement from within the product and makes it easier for users to act and adapt.
Spending some time with the BOFA and other financial management apps and understanding how everything is categorized helped me to position this feature as a tab under the bill pay category as shown below :-
![Screenshot 2022-01-10 054608.png](https://static.wixstatic.com/media/99c97e_155b39d4ef0b45fa8eae7e0f49e65248~mv2.png/v1/fill/w_806,h_556,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/Screenshot%202022-01-10%20054608.png)
LOW FIDELITY PROTOTYPE
![Screenshot 2022-01-10 060026.png](https://static.wixstatic.com/media/99c97e_0e1ee1c7676e4700b7ec92f6d549dab3~mv2.png/v1/fill/w_840,h_326,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Screenshot%202022-01-10%20060026.png)
USABILITY STUDY : FINDINGS
I conducted two rounds of usability studies. Findings from the first study helped in guiding the designs from wireframes to mockup. The second study used a high fidelity prototype and revealed what aspects of the mockup needed refining.
![Screenshot 2022-01-10 082730.png](https://static.wixstatic.com/media/99c97e_8c1ba552fad34271920c8840566a73d4~mv2.png/v1/fill/w_1016,h_328,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Screenshot%202022-01-10%20082730.png)
HIGH FIDELITY PROTOTYPE
Through video demonstration we will see how Hema will navigate through the subscription feature of CitiBank App to check various user flows.
![](https://static.wixstatic.com/media/99c97e_c7a409b64e52442d995c63651ffcf6e9f001.jpg/v1/fill/w_350,h_683,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/99c97e_c7a409b64e52442d995c63651ffcf6e9f001.jpg)
User Flow - 1 - Tracking Subscriptions
After logging in, Hema clicks the subscription tab under the bill pay category. She sees the list of subscriptions as well as an option to edit each one of them. In order to view the upcoming bills she opens up the calendar and to check when her audible subscription is due
![](https://static.wixstatic.com/media/99c97e_502ab8035c6747b385c94169729e417af000.jpg/v1/fill/w_364,h_710,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/99c97e_502ab8035c6747b385c94169729e417af000.jpg)
User Flow 2 - Cancel a subscription
Hema wishes to cancel her Netflix subscription and hence she goes to the edit menu. She sees the cancel subscription option and clicks it. An error prevention message is displayed to prevent Hema from accidentally cancelling the subscription.
![](https://static.wixstatic.com/media/99c97e_5be3c928fba24c81b075bd1b8812aa1bf000.jpg/v1/fill/w_364,h_710,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/99c97e_5be3c928fba24c81b075bd1b8812aa1bf000.jpg)
User Flow 3 - Set Reminder Alert
Hema wanted to set alert for a trial subscription so that she can cancel it before her card is charged. She turns on the set alert switch in the edit subscription screen and chooses her alert mode as email.
User Flow 4 - Manually Add a Subscription
Hema wants to add her new Amazon Prime subscription to the list. So she clicks the add subscription button at the top of the page. She enters the details and hits the save button. The new subscription appears in the list.
![](https://static.wixstatic.com/media/99c97e_3f793ca0ed2d4f5ea19467cfe20838a2f000.jpg/v1/fill/w_364,h_710,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/99c97e_3f793ca0ed2d4f5ea19467cfe20838a2f000.jpg)
Click here for the complete Citibank High Fidelity Protype link
REFLECTIONS
Reflecting on the project, I have realized that I still need to discuss with developers in fintech industry regarding features practicality and understand why this feature has note yet been applied implemented yet in banking apps. Although the problem looks simple in the beginning, the problem soon becomes complicated with time.
Research References
​