Kite Mobile App Redesign | By Zerodha | UI-UX Case Study
This article talks about how and why the Kite (by Zerodha) app needs a redesign.
Background
Kite application is an investing and trading app by India’s unicorn startup Zerodha. Zerodha is the largest discount broker in India with Kite as its main investment platform on the consumer side. I have been using the application for more than a year and it is a great application but I believe some design changes in the application could really add value to the user experience and make profitable investment/trading easier. The design changes are just a suggestion and not necessarily the best solution to the problems listed. This is a personal project which took me around 3–4 days.
Heuristic Evaluation of Current Design
To analyze the current version of the application I decided to conduct research and present my finding in the heuristic evaluation using Nielsen’s Heuristic. The below image shows my working and analysis of the app. After analysing the application I decided to validate the problems as the usability evaluation was based only on my experience.
Research
For validating the problems, I decided to talk to users of the application. I got to talk to around 6 users out of those, and the interview was an unstructured interview conducted via phone call. The participants included, 4 users who had been using the application for around 6–7 months, 1 user had been using the application for around an year and 1 had been using the the application for around 2 years. I got some valuable feedback about the application and also got a chance to validate the problems. All the important points have been shared below and along with them I have shared some solution ideas. Apart from that I also looked at critical reviews on the playstore, which were direct consumer pain points and helped me validate some problems. Only critical reviews were looked at, no good are mentioned.
Validated Problems with Potential Solutions
#1 Making Numbers Easy to Read
Being an application of the financial industry, the application is filled with numbers and the users interact with numbers at every step of the application. So I decided to improve this experience, by using a font with helps us to read numbers more easily. As you can see in the figure above that the new font has less curves and more kerning making it more readable. This has been improved after taking inspiration from Frank Rausch( Good Typography). The font used has been finalised after a lot of trial, errors and reiterations, Font Proposed is Kohinoor Bangla.
#2 Easy access to Market Indicators
I believe that the value of the main indices becomes important for the traders in keeping them updated and taking an informed decision. Currently we have to scroll down to check the value from the top or add the indices to one of our watchlist, which is not always user friendly. My belief was validated after some competitive analysis of applications like Upstocks, 5paisa etc. and also from the above mentioned playstore reviews. So I redesigned this experience as shown below to add any index at the top instead of MarketWatch. As we do not want the users be shocked by a sudden design change, hence the design change has been incorporated subtly in the existing design.
#3 Adding stocks to Watchlist
I still remember the first time I had started using the application, I had added only Reliance and MRF on my watchlist as I had no clue about the number and name of stocks in the market, and I knew that this experience has some scope of improvement. During the research I asked people on how they created watchlist and the answers I got were in sync to what I had expected.
I went to MoneyControl to add all the stocks of the Nifty50 on one of the watchlist and the other watchlist were created by me as I learnt investment. — An Experience User
I usually add the stocks which I learn about and the stocks with remain in news — A New User
For redesigning this experience I initially thought of creating an Explore page where the user could explore like on money control, but I realised that this would break the design pattern that kite follows, hence I created some preloaded suggestions on the search page, which could be added easily as shown below.
#4 Accessibility mode for colourblind people
The accessibility mode in the application, disables transitions and simplifies UI, but I believe a lot more is needed in case of accessibility. One of the important accessibility issue that I know can be easily solved is for Colour blindness( or colour vision deficiency). The reason I believe this is necessary is because more than 5% people in India are colour deficit and also because the Red-Green CVD is most common, ie. the ability to differentiate between red and green. The image below represents how different colour deficit people see the Portfolio screen of Kite application.
Solution to this problem proposed is very simple, which aims at removing colours for accessibility mode and emphasising on ‘+’, ‘–’ symbols in the application. The below image shows a simple solution for this problem.
#5 Improved Filters
It would be great to have saving preferences option in the filters in the application as I have to do it every day and every time I enter in the application. — A Kite User
Filters are a great way of focusing attention on what and how you wanna look at your investments. But this experience can be improved by incorporating these features. The first being able to filter the investments in the order of the percent of invested amount, and the second being able to save your sorting preferences as usually people have some commonly used filters to analyse investments. Further in the portfolio section having a filter of the Last Traded Price does not make sense, as LTP is different for all.
#6 Improving Trading and Investment
Trading — During stock trade, brokerage and taxes add up to a significant amount and hence must be kept in a check, so for traders brokerage calculation can be made easy by adding a small section with tells them the amount of brokerage that will be charged if they square of the trade. The image below represents how this amount can be shown to users to make their life easier by having it on the Kite app, instead of going and entering the value in the brokerage calculator.
I have to go to the brokerage calculator to calculate the charges and brokerage on intraday trades so that I don’t end up loosing money.- Personal Experience
Investment — During investment portfolio management is important and portfolio diversity is important. The percentage of investment is important for management of funds and keeping a balance. An indicator of this percentage could really add value to the user’s experience and help them. Below image shows how we can improve the design.
#7 Consistency in Design
The application is connected to the console application at a lot of places like old orders, transactions, PnL, tradebook etc. which does not seem to be a very good experience as the user wants everything on the kite application and it feels cohesive. I know there must be reason for this inconsistency but adding all the features in kite would be definitely use-full.
I make my own tradebook for all the transactions, I don’t use Zerodha’s console because it is not user friendly, if it was on kite it would have been much better. — A Kite User
# Other Issues
There are a number of reported issues regarding the application, but I am sure the people at Zerodha are working towards them constantly to improve. Apart from them some problems which can be easily solved are-
- Notification on National Holidays
- When a share is purchased from SmallCase, and sold on Zerodha, then the Smallcase application keeps showing that as an active investment, which becomes confusing.
- Including an option for paid calls to customer care as sometimes it is really urgent for people to connect, and huge money is at stake.
- Creating widgets to easily keep a track of the stocks on the go.
Summary
This was a small project for personal interest and my love towards Investment and Wealth Management. I plan to show these changes to some users and capture how and what they feel about it. I did face some difficulties in finding users who heavily trade using mobile applications, as experienced people I found traded using desktop version. At last I am happy with this small effort and hope it helps recruiters in understanding how my design thinking work.