Consent Journey UI Toolkit

iConsent aims to enable accessible and inclusive experiences for the Indian user base while the user is giving consent to access the personal financial information


Teammates:

Adithya Holehonnur - UX Researcher

Pramothini Sekar - Full Stack Engineer

Sowmiya Nagarajan - Full Stack Engineer & Cloud Specialist


My Role:

UI Developer

Product Designer


Deliverables:

A full functional software prototype in 6 different languages, where a custom-made video is generated and showed to the user the permissions he/she is providing to the application.


Time Period:

July - August 2020 [5 Weeks - Part time]

@ Sahamati Account Aggregator Hackathon 2020

 

Vision

By enabling the data transparency between the financial companies and Non-Banking Financial Companies, the customers can get benefited better deals by projecting their previous track records. Through this, even a small pushcart vendor can get small loans from banks without any physical documentation.


Problem Statement

The 3 critical problems that we narrowed down for putting together UX for a typical AA consent journey are:

  1. Lack of interest among users to read consents

  2. Hard to navigate consents

  3. Interfaces not being inclusive

The ultimate benefit that can be driven by solving these problems is the benefit of trust. Thus this problem looms way larger than any other typical UI/UX problem.


Proposed Solution

Our solution is a UX toolkit specifically designed for consent journeys for the very diverse Indian user space. A language component, automated video generation component and accessible visual UX flows are part of this toolkit.


1. Card views & nudge modals

User lands on the Dashboard, where they can see the consents pending approval.


By clicking on View-more on any pending consent, the user is taken into a step-by-step process that educates them on what exactly is getting shared with whom for how much duration.

The other UI components form the flows that subconsciously nudge the user to finish reading the consent details before approval/rejection. Card views, progress bars, nudge modals, no-scroll UX is some of the pluggable components in this toolkit.



The above screenshot depicts the content in the Tamil language.


The language component translates text in UX based on a hybrid config object that combines google translation with manual config for more casual vernacular content.


2. Auto-generated customized video

The video component takes in the consent artifact and spins out a 30-second video in the user’s native language to walk through the specifics of a consent.


Sample auto-generated video in Hindi (8 seconds)

Translation: "Quickbooks wanted to stream your linked bank data between 06 Dec..."


This auto-generated video is highly customized based on every customer and every consent. The video clearly depicts the purpose, date range, and the stakeholders related. All under the 1-minute video with audio.


The video and audio component is also highly accessible as the content can be either read from images in the video or listened to or both.


3. Progressive disclosure & Nudge

To address the users who are not so keen and interested in reading the conditions and the type of data which they are sharing, we've created it like a progressive disclosure - question and answer type through cards which makes it easier for them to glimpse through and get a high-level understanding on the important details.


The questions are framed very short based on the service which they are availing so that it creates a nudge factor for users to look through the answer.


In the end, we show a warning if the user is skipping to read, and when the user approves the request, a small sense of appreciation is conveyed that they have read it and through which we deliver a positive thought about understanding what they've agreed upon.


Also, as this is a responsive progressive web app, it can be accessed either from phone or tablet or web, and all the contents are delivered suitably.


Key-Value Opportunities


We did multiple loops of real user testing and fixes based on the feedback. In some of these tests, we also validated the solutions to specific problems against the involved target group of users. The overall solution has multiple degrees of delivery (audio/video/visual) that can be extended in various other horizontals/verticals. One notable use case is the usage of the audio background of the video in automated phone calls that can reach out to users with the lowest of device/bandwidth provisions. Ultimately, the solution brings in user trust in the overall AA ecosystem.

This is a developer generic, target group-specific toolkit that can be used by the AAs to form a fantastic baseline for their flows and configure it to their own design aesthetic.


Cost & Architecture

Generating and streaming a customized video for every user and every consent may seem quite tedious and costly. While working on the idea for educating users for every approval/denial, the cost factor is considered. The framework is designed such, for generating customized video to million consents the cost would be ~$100 USD using the serverless framework.


Future Scope

The primary use case of this solution is to educate the users and give them confidence and transparency on their data which is getting shared. During the user research, we understood that the low-literate and feature phone users are afraid of using the financial applications through digital devices due to fraudulence and lack of understanding of what is happening.



The individual components developed above can be reused for different use cases in other segments. Like, healthcare data sharing for individual visits or agricultural data sharing for a particular season.


This model is horizontally scalable for other aggregator models and is Vertically scalable with more modular components.


Challenges we ran into

  1. Indic fonts rendering in images was a mammoth task. Existing image generation tools like PIL only render Hindi properly (without breaks between letter parts). We had to put together a custom text renderer to get our video component working for 6 Indian languages (scalable for any higher number)

  2. Understanding i18n international language standardization library to build the site for 6 Indian languages while keeping easily scalable for many more languages.

  3. Video generation is a highly time-intensive process mainly due to system write times. We had to optimize the generation using multi-threading so that the generation times are as minimal as possible. Initially, we started with 40 seconds time for generating a 7 frame video and currently we stand at 8 seconds to generate the same. This can further be reduced to under 5 seconds by using streaming architectures instead of disk writes.

  4. Narrowing down to the most crucial problems while also keeping the audience coverage high was very tricky. This use case has too many possible problems and solutions. We had to talk with many peers, mentors, and some real users to narrow it down even before we started working on the solution. In that aspect, this problem was very unique in its own way!


Complete Prototype Demo (5 Mins)






Team














#FinTech #AccountAggregator #Sahamati #ConsentJourney #TermsAndConditions