ARKO SEN
UX
PROFILE
Tap the chat icon to talk to Arko's AI chat agent.
Design philosophy
Functionality,
Inclusivity,
Simplicity,
Beauty
-in that order.
Over a decade of honing my craft in a diverse array of domains has given me an extremely intuitive understanding of Business Interests, User Psychology and Technology Constraints. User Experience is a natural confluence of these.
Core Values
Visual and Verbal Communication that ensures stakeholders, developers, and designers are all on the same page — how to best enable the user.
Streamlining Stakeholder Interests via surveys, discussions and in-depth interviews into coherent actionables that define business needs perfectly.
Map the users' minds with UX research techniques both behavioural and attitudinal, qualitative and quantitative so that we can model them with Personas, maps and Journeys, aiming to realise users' needs before they do.
Leading Cross-functional Teams of varying sizes, from small to enterprise, coordinating with SMEs, collaborating with departments, vendors and clients spread across the globe. Guiding researchers, designers, developers and ensuring quality and timely delivery to stakeholders.
Keeping ahead of the industry by evangelising UX, predicting and adopting trends, giving talks, participating in W3C workgroups, championing accessibility and inclusivity principles.
Career Stats
14+ Years of UX | 20+ Years in the industry | 50+ Projects | 25+ Brands worked with
Domains
Enterprise productivity, Banking, Healthcare, Fintech, News, Media & Entertainment, Advertising, Branding, Power, IPTV, Ecommerce, Government, Tourism, CRM, Analytics, Non-Traditional-Interfaces, Design Systems, DesOps (Design Operations)
Brand showcase
Portfolio - case studies
Design System management
2019 to present. Building and owning a code ready design system, led a team of 12, shipped 3+ major versions, grew adopters from 3 to 12+ delivering over 30% cost savings, reducing bug reports by 90%.
-Expand to learn more
Pictured: a sample component page - with theme switcher - light and dark themes - 2024
Codename: Patronus.
Time: Oct 2019 to present.
Organization: HCL Software.
Customers: 10+ enterprise products and websites with a wide user base.
Platform: Responsive web, desktop and mobile. Design toolkits for Sketch and Figma, code libraries for Vanilla JS, React and Angular.
Personas: Product designers, UI developers, enterprise end users.
Releases: 4+ stable and major releases. Multiple minor and patch releases.
Team: 4 designers, 5 developers, 3 testers, 1 dev manager across multiple locations in India, US and Italy.
Role: Owning the design system, leading the design team, reviewing component designs, designing complex components, creating and maintaining design tokens, creating documentation, meeting regularly with the users, taking feature requests, deciding on how the system evolves.
The challenge
HCL Software had a wide range of sprawling enterprise products which were using a mixed bag of design systems, some none at all. Universally adopting an open source design system was possible but it would dilute the brand identity and custom requests were hard to field. Furthermore, the growth and direction of an open source system was not in the hands of HCL Software. Meanwhile, the products themselves are not mandated to use any specific design system, so they had to be convinced with due evidence to pick up a homegrown one.
What we did, tl;dr
We researched some of the leading design systems at that point, Microsoft Fluent, IBM Carbon and Google Material, and created our own from scratch. It started with 25 basic components with 2 adopters and then grew as per the products' needs. It has grown through 3+ stable versions, to 60+ components, 100+ patterns, supporting 12+ adopting products.
Pictured: The set of components in V2 - 2021
The role and journey
The role and journey
I took ownership of the design system from get go, I had to evangelize hard the power of a design system which grows according to the demands of the products. I had to listen closely to the customers' requests, pre-empt them and cross-reference them wherever possible. Every product synergy we discovered in the way was an extra win for us. Moreover, I needed to deliver stable releases every few months in tune with the dev and release schedules of the products.
I had to manage the feature and bug backlog prioritization, the versioning decisions, the process and workflows, documentation, support for products, design iterations, all the while keeping an eye on the minutiae of the components and guidelines themselves.
It started with only two adopters, a lot of bugs and design conformance issues. But we thrived under the pressure and today it's a major success story, helping products shed up to 30% of their design and dev time per sprint.
Innovations and achievements
Semantic design token systems for theming color, corners, typography, animation and spacing.
Design conformance protocol and conformance checkpoints throughout the dev-test-release cycles.
Reduced conformance issues by over 90% from 20+ bugs per month to less than 2 per month.
Methodical check-ins with customers to understand their usage needs.
Metrics reported upto 30% costs saved via upto 50% increased velocity for design teams.
Contribution model and pattern library for cross-product redundancy reduction.
Participant of W3C DTCG and OpenUI workgroups.
WCAG 2.1 AA accessibility testing for each component and accessibility recommendation documentation.
Presented a talk in UX India 2020 on "Design Systems, take or make?"
Pictured: Sample complex component built using the design system
non-disclosable details have been redacted in portfolio.
For more Design system specific case studies, check out the Design Systems portfolio
Design handoff protocol
A figma handoff example for an OTP flow and the handoff protocol documentation. Reduced post-handoff interventions by 70%.
-Expand to learn more
- hence some old-school layout, framing and components may be present.
The scenario
We had a lot of complaints both from designers and developers on handoff miscommunications, so we decided to create a handoff demo, we chose the OTP pattern being built which was to be used by 2+ product teams, we created a handoff file for the pattern using our components, with a prototype built with reasonable accuracy, comments on each relevant conditional, and annotations on the launch page. We built a set of steps that would convey the full flow and design specs with as less extra work from the designers as possible.
We have been updating and improving it since. This is the 2024 version of the protocol. The handoff protocol is part of our extended conformance protocol which has been successfully employed to reduce design conformance issues by 90%.
The handoff protocol
For designers:
Use components without detaching as much as possible.
If detached, check if changes deviate from default component behaviour, if yes, drop a comment and explain.
Use design tokens through and through, avoid non-tokenised measurements, colors or styles.
If you have to use, drop and comment and justify.
Before creating flow prototype, show key pages to dev and check feasibility.
Create a launch page for the prototype which details out the behaviour of the flow, in as much detail of conditionals as needed.
During prototyping, for each of the conditionals, drop a comment at the relevant element in the relevant screen.
Invite devs and QA, demo the prototype, walk through the comments, explain the conditionals, then share file.
For developers:
Raise any immediate feasibility issues or edge cases in the handoff call itself.
Upon receiving figma file, check for components and tokens thoroughly.
If you find any deviant components or non-tokenised measurements without a comment, check with designer, ask them to rectify or comment.
Begin development, reply to each comment with 'done' as as you incorporate the instructions.
Make sure all comments are replied to.
For QA
Make sure test cases cover all comments by designer.
Check for developers marking the comments done before beginning to test.
Outcomes
Design teams adopting the handoff protocol reported drastically reduced rework and miscommunication.
Post handoff intervention reduced by 70%
Mobile stock market monitor
2019. Classic example of a design thinking whiteboarding session leading to actionable designs for part of a mobile app.
- Expand to read more.
Codename: Stockwatch.
Time: 2 days in Jul 2019.
Organization: Independent Consultant.
Customer: Non-disclosable. One of India's leading banks.
Platform: Mobile app.
Personas: Stock market enthusiasts and casual investors.
Team: 3 stakeholders, 4 sample users - in person in Kolkata.
Role: Design thinking session conductor, UI designer.
The challenge
A reputed bank wanted to provide a comprehensive mobile experience to entry level investors and enthusiasts to monitor the stock market and their own portfolios day to day via their mobile banking app. They were looking for some ideas and a mockup of how those may be implemented.
The solution
A 2 day design thinking workshop. I prepared two personas, one for the enthusiast and one for the casual investor. Then we recruited 4 participants 2 each matching the 2 personas. The stakeholders were 1 representative from the bank and 2 from the IT vendor team who hired me.
The process
Day 1 - empathize, define, ideate.
We started with our sample users opening the mobile apps of competing banks and trying out their stock monitoring interfaces, the casual investors had an active portfolio in some of those apps while the enthusiasts didn't have a portfolio registered. For an hour or so they kept providing inputs which we kept putting in an empathy map.
Empathy map - contents blurred to comply with non-disclosure agreement.
Post the map we had a discussion on the content of the maps and defined the problem as:
Maximizing the availability of stocks of interest to the users in their preferred arrangements.
Bringing the data that they want to the forefront when they want it and keep the rest available but hidden otherwise.
With these problems in mind, we further noted down the learnings from the session.
Learnings
Both personas like to rearrange the stock manually but also want high alert items to jump to the top.
Casual investors like the breakup of their unit count, the unit price and the total value present at one glance.
Casual investors wanted the option to go to buy or sell interfaces right from the stock details.
A simple 10 day EMA graph of the stock was universally understood and appreciated.
Both personas prefer a high data density than a clean, minimalist display.
Dark mode screens felt more exciting than light mode screens!
The ability to set custom alerts in multiple ways is very useful. As is the alerted stock to be highlighted.
Often they would rearrange the list according to a day's focus, but they want to snap back to their standard daily arrangement.
They hated the apps which would make them login just to view their portfolio or watchlist. They acknowledged it's important to authenticate before buying or selling but not to view stock values.
From there we had an ideating session where we generated a lot of ideas and notes, then the 4 sample users were dismissed for the day.
Next, we arranged the ideas into an effort/impact quadrant and then organised them by priority.
Ideas organized by priority - some contents blurred to comply with non-disclosure agreement.
Day 2 - prototype, test, iterate.
We opened the second day with paper prototypes and information architecture sketching sessions with instant feedback from the sample users, and iterated till we had some screens which generally agreed with the users needs.
Paper prototypes and IA sketches - some contents blurred to comply with non-disclosure agreement.
Once we had the paper sketches firmed up, we went into a live medium fidelity wireframing session to beat out some quick details and layout wireframes with some placeholder and some sample numbers. We kept updating the wireframes with live feedback from the stakeholders and users.
Layout wireframes - altered to remove any non-disclosable information.
That concluded the 2 day design thinking workshop, I took 2 more days and some remote feedback iterations to design the final clickable prototypes and delivered them. Colors were chosen to match the bank's branding colors and to a further a11y pass was pending.
Some screens from the clickable prototype - some contents blurred to comply with non-disclosure agreement.
Electric supply app
2017. Research heavy project for the CESC mobile app where the research changed the direction of their data infrastructure.
- Expand to read more.
Codename: CESCapp
Time: Apr to Dec 2017.
Organization: Independent Consultant.
Customer: CESC, the leading power supply company in eastern India.
Platform: Mobile app.
Personas: Homeowners and tenants.
Team: 7 stakeholders, 5 developers - in person in Kolkata.
Role: User researcher, UX analyst.
The challenge
CESC is a century old company providing electricity to millions of households - then undergoing a major digital transformation. They asked us to build a new mobile app because their existing basic app had very few downloads and usage. They had a vision of a new app which would primarily allow consumers to log in to their singular account to make service requests and also pay bills online.
Preliminary research
Thankfully, getting access to users of CESC was not difficult, as almost every household in eastern India is supplied by them. I created a questionnaire based on bill payment and the types of service requests CESC was able to field, so that we could prioritize those services in the app and also some basic questions on the awareness of the apps.
The results were both striking and confusing. Most connection owners were seniors in the family, they were not bothered about the electricity connection because they were not paying the bills and they didn't call CESC when they had a power cut. Quite a few of the connection owners were deceased! Also each household had multiple connections in the name of different people and most also were either absent or unconcerned.
This was a major surprise to the stakeholders, they were vaguely aware of this scenario but never figured it'd be a hindrance to their mobile app adoption. I changed my line of questioning to learning more about who is paying the bills and how, and who makes service requests.
Further research
Armed with the new questionnaire, we went door to door and interviewed more than 20 households, and got actionable learnings:
Most houses had multiple connections not just for multiple apartments but also individual families had multiple connections to avoid higher-slab bills.
In each family, the bill paying and service requests were usually managed by someone younger in the family, who were often aware of online bill payment at the CESC website but not the app.
Most of these users managed multiple connections. Often they resided in other cities or abroad and paid bills for their parents.
CESC identified people with a 15 digit customer id, which no one remembers and has to fetch their electricity bill to figure out. Few people who did download the app deleted it because it asked for that 15 digit number every time they opened the app.
Finally, apart from bill payment, users were interested in tracking their consumption and seeing how they fared against the last year.
They were also eager to have easy way to report a power cut and being updated on the ETA of resumption. The current way was to call up CESC and give them the 15 digit number.
With these learnings. CESC updated their database structure to account for these users (who are often not the same as the connection owners) and I reimagined the app to handle multiple accounts with phone/email login, quick bill payment, consumption history and reporting of power outage as its key features.
Health Insurance Platform
2014. Reimagining health insurance claims and reimbursements like a bank. A healthcare fintech product with the strictest of regulations.
- Expand to read more.
Codename: Acclaim
Time: 2011-2014.
Organization: Acclaris. Currently acquired by Willis Towers Watson.
Customer: Bank of America, Fidelity, Aetna - etc financial giants.
Platform: Mobile friendly desktop web app.
Personas: Employers providing health insurance, employees claiming health insurance.
Team: 3 designers, 12 developers, 4 testers.
The challenge
A peculiar case of a captive but reluctant audience, revamping a vast and archaic US healthcare reimbursement and administration platform with 200+ contextual scenarios and use cases in a mobile-first, responsive, and overall efficient experience while maintaining strict HIPAA, ADA and multiple financial security compliances.
Most American Employees dreaded the repetitive experience of logging and claiming health expenses but they had to do it.
Innovation
This was a case of simplicity first, a number of radical design decisions that uncluttered the whole dashboard yet kept the user's customized favourite actions on single click. A number of these innovations (made in 2013) have slowly permeated in other Banking UI dashboards in recent years.
Roles
UX research and analysis, coordinating with multiple stakeholders globally.
Leading a team of 3 UX designers and reporting to the CTO.
Creating a Design Ethos, guidelines and specifications.
Information Architecture remodeling.
OTT IPTV Platform
2012. Managing the UI of an OTT IPTV solution for content providers and streaming consumers over web, mobile and smart tv platforms.
- Expand to read more.
Codename: JTV
Time: 2012-13.
Organization: JunctionTV / FoundationTV, a startup currently acquired by Cinedigm.
Customers: Hallmark SpiritClips, TVC Mas Latino, etc. Content providers.
Platforms: Web, mobile and smart TV.
Personas: Content providers, content managers, streaming consumers.
Team: 1 designer, 2 developers, 1 stakeholder spread accross
Challenges
Designing from scratch a whole ecosystem for OTT Internet Television and VOD services, from client purchase portals and players in computers, tablets, phones and Smart TVs, to distribution administration and monitoring for channels and producers.
The multiple Smart TV architectures were nascent at the time, yet designs had to be universal, keeping the common denominator of all systems.
There were a lot of complex technologies like geolocation, custom il8n and streaming video management to be implemented in the UI.
Innovation
The UI designs and the systems were made modular and customizable, components could be assembled for a custom IPTV solution for each client.
A big amount of data crunching was offloaded to the frontend client for the admin portal, leaving the server free for streaming intensive tasks.
Roles
Conducting User Research all over the world.
UX, UI, Information Architecture and Interaction design.
Leading multiple UI development and integration teams for separate platforms and devices, keeping UX specifications same throughout.